div.CustomPage {margin:20px}

[data-list-work-links] > * {margin-bottom:8vw; height:auto}

@media screen and (min-width:600px) {
	[data-list-work-links] { display: flex; flex-wrap: wrap; justify-content: space-between; }
		[data-list-work-links] > * { width: calc(50% - 4px); margin-bottom: 4vw; }
}


.WorkLink {display:flex;}
.WorkLink > * {flex:1; flex-shrink:0}
.WorkLink > *:first-child {margin-right:4px; }

.WorkLink > * {min-height:28vw}

@media screen and (min-width:600px)
{
	.WorkLink > * {min-height:14vw}
	.WorkLink > *:first-child {margin-right:8px; }
}

.WorkLink div.image {background-position:center center; background-size:cover}


.WorkLink div.summary {background-color:rgb(180,178,178); color:white;}

.WorkLink div.summary > * {display:block; padding-right:5px}
.WorkLink div.summary > *:first-child {margin-top:10px}
.WorkLink div.summary > *:last-child {margin-bottom:10px}


.WorkLink div.summary .subtitle {margin-top:15px; font-size:11px}
@media screen and (min-width:600px) {
	.WorkLink div.summary .subtitle { margin-top: 20px; }
}

.WorkLink div.summary .title {text-transform:uppercase;}




/* Mark Design - 30/10/2017 */
.WorkLink .title, .WorkLink .year, .WorkLink .film {font-size:3.6vw}

@media screen and (min-width:600px) {
	.WorkLink .title, .WorkLink .year, .WorkLink .film { font-size: calc(7px + 0.8vw); }
}




.WorkLink div.summary > * {padding-left:15%; padding-right:6.7%}
.WorkLink div.summary > *:first-child {margin-top:calc(1vw + 3px);/*16px*/}
.WorkLink div.summary > *:last-child {margin-bottom:5px}

@media screen and (min-width:415px)
{
	.WorkLink div.summary > * {padding-left:27.7%}
}



/* Images */
div.image[style*='/images/36'] {background-position:center bottom; background-size:106% auto}