body { background: #fff; color: #aeaeae; font: 1em/130% 'Lato', sans-serif; }
html { font-size: 100%; }

.container {  position: relative; margin: 0 auto; max-width: 1200px; }

.wdc_mask, .wdc_video, .wdc_information, .wdc_image { position: absolute; top: 0; left: 0; width: 100%; height: auto; z-index: 3; }
.wdc_video, .wdc_image { z-index: 2; }
.wdc_information { padding: 49% 0 0 0; }
.wdc_information h1, .wdc_information p { margin: 0; padding: 0 20px 20px 30px; }
.wdc_mask { border-bottom: 50px solid #fff; }

.video_holder { position: relative; /*** padding-bottom: 56.25%; ***/ /* 16:9 */ /* padding-bottom: 75%; /* 4:3 */   padding-bottom: 63%; padding-top: 25px; height: 0; }
.video_holder iframe, .video_holder video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.wdc_image { /** display: none;  **/ z-index: 1; }
@media screen and (min-width: 0px) and (max-width: 768px) {
	.wdc_video { display: none; }
	.wdc_image { /** display: block; **/ }
}

a { color: #aeaeae; text-decoration: none;  transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
a:hover { color: #666; }
h1 { font-size: 1.4em; }