article aside details figcaption figure footer header hgroup main nav section summary { display: block; } audio canvas video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } [hidden] template { display: none; } html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin: 0; } a { background: transparent; } a:focus { outline: thin dotted; } a:active, a:hover { outline: 0; } h1 { font-size: 2em; margin: .67em 0; } abbr[title] { border-bottom: 1px dotted; } b strong { font-weight: bold; } dfn { font-style: italic; } hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } mark { background: #ff0; color: #000; } code kbd pre samp { font-family: monospace,serif; font-size: 1em; } pre { white-space: pre-wrap; } q { quotes: "\201C" "\201D" "\2018" "\2019"; } small { font-size: 80%; } sub sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: .35em .625em .75em; } legend { border: 0; padding: 0; } button input select textarea { font-family: inherit; font-size: 100%; margin: 0; } button input { line-height: normal; } button select { text-transform: none; } button html input[type="button"], input[type="reset"] input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled] html input[disabled] { cursor: default; } input[type="checkbox"] input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } textarea { overflow: auto; vertical-align: top; } table { border-collapse: collapse; border-spacing: 0; } .autoscale { position: absolute; z-index: -1; top: 50%; left: 50%; } .autoscale-parent { position: relative; overflow: hidden; z-index: 0; } .sticky-top { position: absolute; top: 0; } .sticky-bottom { position: absolute; bottom: 0; } .sticky-centered { position: fixed; top: 0; } .sticky-element { height: 100%; } .scrollmation .scrollmation-slide { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); } .scrollmation .scrollmation-slide.active { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); } .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0; } .clearfix:after { clear: both; } .hide { display: none; } * { position: relative; } * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .bg-black { background-color: #000; } .bg-teal { background-color: #12bf9c; } .bg-blue { background-color: #00a7cf; } .bg-orange { background-color: #f2744d; } .bg-grey { background-color: #eaeaea; } .bg-red { background-color: #ec3f3f; } .bg-dark-grey { background-color: #3a3a3a; } .merriweather { font-family: Merriweather,serif; } .georgia { font-family: Georgia,'Times New Roman',serif; } .josefin-slab { font-family: 'Josefin Slab',serif; } .times-new-roman { font-family: 'Times New Roman',serif; } .playfair-display { font-family: 'Playfair Display',serif; } .arial { font-family: Arial,sans-serif; } .josefin-sans { font-family: 'Josefin Sans',sans-serif; } .open-sans { font-family: Helmet, Freesans, Helvetica, Arial, sans-serif; } .ubuntu { font-family: Ubuntu,sans-serif; } .verdana { font-family: Verdana,sans-serif; } .helvetica { font-family: Helvetica,Arial,sans-serif; } .proxima-nova { font-family: 'proxima-nova',Helvetica,sans-serif; } .futura { font-family: 'futura',Helvetica,sans-serif; } .text-light { font-weight: 300; } .text-strong { font-weight: 700; } html body { font-family: 'proxima-nova',Helvetica,sans-serif; } a { text-decoration: none; color: #00a7cf; } a:hover { text-decoration: underline; } h1 .sub-heading, h2 .sub-heading, h3 .sub-heading { display: block; font-size: 70%; } h1 { } h1 .sub-heading { text-transform: none; } h4 { font-weight: 300; font-size: 20px; } small { font-size: 70%; } .ui-label { font-family: 'proxima-nova',Helvetica,sans-serif; font-weight: bold; } hr { margin: 40px auto; border: none; height: 1px; background-color: #ccc; } textarea { color: inherit; font: inherit; font-family: inherit; } html body { margin: 0; padding: 0; } .story { margin: 0 auto; } .main-column { width: 100%; max-width: 620px; padding: 20px 30px; background: #fff; background: rgba(255,255,255,0.8); font-size: 18px; line-height: 1.333333333; } .main-column img { max-width: 100%; } .main-column { margin: 0 30px; } .secondary-column { padding: 0 30px; } .margin-right { margin-right: 720px; } .margin-left { margin-left: 720px; } .column-left { float: left; } .column-right { float: right; } .small-inline { display: none; } .section { position: relative; } .section .caption { color: #000; font-family: Helmet, Freesans, Helvetica, Arial, sans-serif; } .text-over-media-inner { color: #fff; font-family: Helmet, Freesans, Helvetica, Arial, sans-serif; } .section-navigation { position: fixed; top: 0; z-index: 1100; width: 100%; background-color: #2c2c2c; background-color: rgba(44,44,44,0.9); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#e62c2c2c', endColorstr='#e62c2c2c'); /* IE */ text-align: center; counter-reset: nav-chapters; } .section-navigation:before { content: ''; position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; height: 2px; background-color: #2c2c2c; background-color: rgba(40,40,40,0.9); } .section-navigation.stick { position: fixed; top: 0; } .section-navigation a, .section-navigation a:visited { position: relative; z-index: 2; display: inline-block; padding: 0 30px; line-height: 37px; color: #FFF; text-decoration: none; font-size: 15px; font-weight: 400; border-bottom: 0; -moz-opacity: .5; -khtml-opacity: .5; -webkit-opacity: .5; opacity: .5; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50); filter: alpha(opacity=50); } .section-navigation a:hover, .section-navigation a:visited:hover, .section-navigation a:active, .section-navigation a:visited:active { -moz-opacity: .9; -khtml-opacity: .9; -webkit-opacity: .9; opacity: .9; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90); filter: alpha(opacity=90); } .section-navigation a.active, .section-navigation a:visited.active { -moz-opacity: 1; -khtml-opacity: 1; -webkit-opacity: 1; opacity: 1; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); filter: alpha(opacity=100); } .story .two-column-grid { margin: 0 auto; max-width: 1400px; overflow: hidden; } .scrollmation-background { overflow-x: hidden; } .scrollmation-background .scrollmation-slides { width: 100%; z-index: 1; } .scrollmation-background .scrollmation-slide { position: absolute; top: 50%; left: 50%; overflow: hidden; } .scrollmation-background .scrollmation-text { z-index: 2; } .scrollmation-background .hiding { display: none; } .scrollmation-background .tablet-only { overflow-x: visible; *zoom: 1; } .scrollmation-background .tablet-only:before, .scrollmation-background .tablet-only:after { display: table; content: ""; line-height: 0; } .scrollmation-background .tablet-only:after { clear: both; } .scrollmation-background .tablet-image { top: 0; position: absolute; width: 100%; background-size: cover; } .scrollmation-background .scrollmation-background-image { width: 100%; height: 100%; } .scrollmation-background .scrollomation-background-container { position: absolute; height: 100%; width: 100%; } .scrollmation-background .scrollmation-background-caption { z-index: 2; text-align: left; position: absolute; display: none; width: 400px; margin: auto; padding: 15px 30px; bottom: 0; opacity: .8; visibility: visible; color: white; background-color: black; } .scrollmation-background .scrollmation-background-caption.text-right { left: 30px; } .scrollmation-background .scrollmation-background-caption.text-left { right: 30px; } .scrollmation-background [data-scrollmation-slide].active+.scrollmation-background-caption { display: block; } .scrollmation-two-column { *zoom: 1; } .scrollmation-two-column:before, .scrollmation-two-column:after { display: table; content: ""; line-height: 0; } .scrollmation-two-column:after { clear: both; } .scrollmation-two-column .position-static { position: static; } .scrollmation-two-column .scrollmation-slide { position: absolute; width: 280px; } .scrollmation-two-column .scrollmation-slide img { width: 100%; } .scrollmation-two-column .main-column { width: 100%; } .scrollmation-two-column .main-column .scrollmation-inline { display: none; } .scrollmation-two-column .scrollmation-slide { display: none; } .scrollmation-two-column .active.scrollmation-slide { display: block; } .scrollmation-two-column .scrollmation-slide { width: 100%; padding-top: 60px; padding-bottom: 40px; position: absolute; } .scrollmation-two-column .scrollmation-slides { width: 620px; max-width: 510px; } .scrollmation-two-column .portrait-image { width: 80%; left: 10%; } .section-text { margin: 0 auto; } .section-text-over-media { position: relative; overflow: hidden; background: transparent no-repeat center center; background-size: cover; } .section-text-over-media .text { position: absolute; z-index: 2; width: 80%; margin: 0 auto; } .section-text-over-media .text.center { top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); text-align: center; } .lt-ie9 .section-text-over-media .text.center { position: relative; top: 40%; left: auto; } .section-text-over-media .text.center.top { top: 0; -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -o-transform: translate(-50%,0); -ms-transform: translate(-50%,0); transform: translate(-50%,0); } .lt-ie9 .section-text-over-media .text.center.top { top: 0; } .section-text-over-media .text.center.bottom { top: auto; bottom: 0; -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -o-transform: translate(-50%,0); -ms-transform: translate(-50%,0); transform: translate(-50%,0); } .lt-ie9 .section-text-over-media .text.center.bottom { position: absolute; } .section-text-over-media .text.center.left { left: 0; -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -o-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%); } .lt-ie9 .section-text-over-media .text.center.left { position: absolute; } .section-text-over-media .text.center.right { left: auto; right: 0; -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -o-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%); } .lt-ie9 .section-text-over-media .text.center.right { position: absolute; } .section-text-over-media .text.left { left: 0; text-align: left; } .section-text-over-media .text.right { right: 0; text-align: right; } .section-text-over-media .text.top { top: 0; } .section-text-over-media .text.bottom { bottom: 0; } .section-text-over-media .text p { margin: 0 auto; } .section-text-over-media .text-inner { padding: 5%; } .section-text-over-media .background-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; } .lt-ie9 .section-text-over-media .background-overlay { background-color: transparent; } .section-text-over-media .background-overlay video { display: none; } .section-text-over-media .text-over-media-inner { font-size: 56px; text-align: center; line-height: 1.05em; } .section-text-over-media .text-over-media-caption { z-index: 2; text-align: left; position: absolute; display: block; width: 620px; margin: auto; padding: 15px 30px; bottom: 0; left: 0; right: 0; opacity: .8; visibility: visible; color: white; background-color: black; } .section-text-over-image { background-attachment: fixed; } .section-video { background-color: black; z-index: 1; } .section-video .section-media-details { display: none; } .section-video .vjs-paused .vjs-big-play-button { display: none; } .section-video .vjs-fullscreen-control { display: none; } .section-video .video-player-caption { text-align: left; position: absolute; display: block; width: 620px; margin: auto; padding: 15px 30px; bottom: 30px; left: 0; right: 0; opacity: .8; visibility: visible; -ms-transition: visibility .1s,opacity .1s; -webkit-transition: visibility .1s,opacity .1s; -moz-transition: visibility .1s,opacity .1s; -o-transition: visibility .1s,opacity .1s; transition: visibility .1s,opacity .1s; color: white; background-color: black; } .is-inactive .video-player-caption { visibility: hidden; -ms-transition: visibility 1s,opacity 1s; -webkit-transition: visibility 1s,opacity 1s; -moz-transition: visibility 1s,opacity 1s; -o-transition: visibility 1s,opacity 1s; transition: visibility 1s,opacity 1s; opacity: 0; } .is-not-playing.is-inactive .video-player-caption { visibility: visible; opacity: .8; } .vjs-current-time .vjs-time-divider .vjs-captions-button .vjs-volume-control .vjs-fullscreen-control { display: none; width: 0; height: 0; } body .vjs-default-skin .vjs-duration { position: absolute; right: 3em; } body .vjs-default-skin .vjs-progress-control { top: 13px; left: 15em; right: 25em; } body .vjs-default-skin:hover .vjs-progress-control { font-size: .3em; height: 1em; } body .vjs-default-skin:hover .vjs-slider-handle:before { font-size: 4em; top: -160%; text-shadow: none; color: white; } .vjs-default-skin { color: #ccc; } @font-face { font-family: 'VideoJS'; src: url("../fonts/vjs.X.eot"); src: url("../fonts/vjs.X.eot?#iefix") format('embedded-opentype'),url("../fonts/vjs.X.woff") format('woff'),url("../fonts/vjs.X.ttf") format('truetype'); font-weight: normal; font-style: normal; } .vjs-default-skin .vjs-slider { outline: 0; position: relative; cursor: pointer; padding: 0; background-color: #fff; background-color: rgba(255,255,255,0.2); } .vjs-default-skin .vjs-slider:focus { -webkit-box-shadow: 0 0 2em #fff; -moz-box-shadow: 0 0 2em #fff; box-shadow: 0 0 2em #fff; } .vjs-default-skin .vjs-slider-handle { position: absolute; left: 0; top: 0; } .vjs-default-skin .vjs-slider-handle:before { content: "\e009"; font-family: VideoJS; font-size: 1em; line-height: 1; text-align: center; text-shadow: 0 0 1em #fff; position: absolute; top: 0; left: 0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .vjs-default-skin .vjs-control-bar { position: absolute; bottom: 0; width: 100%; margin: 0 auto; height: 3.0em; background-color: #000; background-color: rgba(0,0,0,0.8); } .vjs-default-skin.vjs-has-started .vjs-control-bar { display: block; visibility: visible; opacity: 1; -ms-transition: visibility .1s,opacity .1s; -webkit-transition: visibility .1s,opacity .1s; -moz-transition: visibility .1s,opacity .1s; -o-transition: visibility .1s,opacity .1s; transition: visibility .1s,opacity .1s; } .vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar { display: block; visibility: hidden; opacity: 0; -ms-transition: visibility 1s,opacity 1s; -webkit-transition: visibility 1s,opacity 1s; -moz-transition: visibility 1s,opacity 1s; -o-transition: visibility 1s,opacity 1s; transition: visibility 1s,opacity 1s; } .vjs-default-skin.vjs-controls-disabled .vjs-control-bar { display: none; } .vjs-default-skin.vjs-using-native-controls .vjs-control-bar { display: none; } .vjs-default-skin .vjs-control { outline: none; position: relative; float: left; text-align: center; margin: 0; padding: 0; height: 3.0em; width: 4em; } .vjs-default-skin .vjs-control:before { font-family: VideoJS; font-size: 1.5em; line-height: 2; position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-align: center; text-shadow: 1px 1px 1px rgba(0,0,0,0.5); } .vjs-default-skin .vjs-control:focus:before, .vjs-default-skin .vjs-control:hover:before { text-shadow: 0 0 1em #fff; } .vjs-default-skin .vjs-control:focus { } .vjs-default-skin .vjs-control-text { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .vjs-default-skin .vjs-play-control { width: 5em; cursor: pointer; } .vjs-default-skin .vjs-play-control:before { content: "\e001"; } .vjs-default-skin.vjs-playing .vjs-play-control:before { content: "\e002"; } .vjs-default-skin .vjs-mute-control, .vjs-default-skin .vjs-volume-menu-button { cursor: pointer; float: right; } .vjs-default-skin .vjs-mute-control:before, .vjs-default-skin .vjs-volume-menu-button:before { content: "\e006"; } .vjs-default-skin .vjs-mute-control.vjs-vol-0:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before { content: "\e003"; } .vjs-default-skin .vjs-mute-control.vjs-vol-1:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before { content: "\e004"; } .vjs-default-skin .vjs-mute-control.vjs-vol-2:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before { content: "\e005"; } .vjs-default-skin .vjs-volume-control { width: 5em; float: right; } .vjs-default-skin .vjs-volume-bar { width: 5em; height: .6em; margin: 1.1em auto 0; } .vjs-default-skin .vjs-volume-menu-button .vjs-menu-content { height: 2.9em; } .vjs-default-skin .vjs-volume-level { position: absolute; top: 0; left: 0; height: .5em; background: rgba(255,255,255,0.4) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat; } .vjs-default-skin .vjs-volume-bar .vjs-volume-handle { width: .5em; height: .5em; } .vjs-default-skin .vjs-volume-handle:before { font-size: .9em; top: -0.2em; left: -0.2em; width: 1em; height: 1em; } .vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content { width: 6em; left: -4em; } .vjs-default-skin .vjs-progress-control { position: absolute; left: 0; right: 0; width: auto; font-size: .3em; height: 1em; top: -1em; -ms-transition: all .4s; -webkit-transition: all .4s; -moz-transition: all .4s; -o-transition: all .4s; transition: all .4s; } .vjs-default-skin:hover .vjs-progress-control { font-size: .9em; -ms-transition: all .2s; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s; } .vjs-default-skin .vjs-progress-holder { height: 100%; } .vjs-default-skin .vjs-progress-holder .vjs-play-progress, .vjs-default-skin .vjs-progress-holder .vjs-load-progress { position: absolute; display: block; height: 100%; margin: 0; padding: 0; left: 0; top: 0; } .vjs-default-skin .vjs-play-progress { background: rgba(255,255,255,0.4) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat; } .vjs-default-skin .vjs-load-progress { background: #646464; background: rgba(255,255,255,0.4); } .vjs-default-skin .vjs-seek-handle { width: 1.5em; height: 100%; } .vjs-default-skin .vjs-seek-handle:before { padding-top: .1em; } .vjs-default-skin .vjs-time-controls { font-size: 1em; line-height: 3em; } .vjs-default-skin .vjs-current-time { float: left; } .vjs-default-skin .vjs-duration { float: left; } .vjs-default-skin .vjs-remaining-time { display: none; float: left; } .vjs-time-divider { float: left; line-height: 3em; } .vjs-default-skin .vjs-fullscreen-control { width: 3.8em; cursor: pointer; float: right; } .vjs-default-skin .vjs-fullscreen-control:before { content: "\e000"; } .vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before { content: "\e00b"; } .vjs-default-skin .vjs-big-play-button { left: .5em; top: .5em; font-size: 3em; display: block; z-index: 2; position: absolute; width: 4em; height: 2.6em; text-align: center; vertical-align: middle; cursor: pointer; opacity: 1; background-color: #000; background-color: rgba(0,0,0,0.8); border: .1em solid #3b4249; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; -webkit-border-radius: .8em; -moz-border-radius: .8em; border-radius: .8em; -webkit-box-shadow: 0 0 1em rgba(255,255,255,0.25); -moz-box-shadow: 0 0 1em rgba(255,255,255,0.25); box-shadow: 0 0 1em rgba(255,255,255,0.25); -ms-transition: all .4s; -webkit-transition: all .4s; -moz-transition: all .4s; -o-transition: all .4s; transition: all .4s; } .vjs-default-skin.vjs-big-play-centered .vjs-big-play-button { left: 50%; margin-left: -2.1em; top: 50%; margin-top: -1.4000000000000001em; } .vjs-default-skin.vjs-controls-disabled .vjs-big-play-button { display: none; } .vjs-default-skin.vjs-has-started .vjs-big-play-button { display: none; } .vjs-default-skin.vjs-using-native-controls .vjs-big-play-button { display: none; } .vjs-default-skin:hover .vjs-big-play-button, .vjs-default-skin .vjs-big-play-button:focus { outline: 0; border-color: #fff; background-color: #505050; background-color: rgba(50,50,50,0.75); -webkit-box-shadow: 0 0 3em #fff; -moz-box-shadow: 0 0 3em #fff; box-shadow: 0 0 3em #fff; -ms-transition: all 0s; -webkit-transition: all 0s; -moz-transition: all 0s; -o-transition: all 0s; transition: all 0s; } .vjs-default-skin .vjs-big-play-button:before { content: "\e001"; font-family: VideoJS; line-height: 2.6em; text-shadow: .05em .05em .1em #000; text-align: center; position: absolute; left: 0; width: 100%; height: 100%; } .vjs-loading-spinner { display: none; position: absolute; top: 50%; left: 50%; font-size: 4em; line-height: 1; width: 1em; height: 1em; margin-left: -0.5em; margin-top: -0.5em; opacity: .75; -ms-animation: spin 1.5s infinite linear; -webkit-animation: spin 1.5s infinite linear; -moz-animation: spin 1.5s infinite linear; -o-animation: spin 1.5s infinite linear; animation: spin 1.5s infinite linear; } .vjs-default-skin .vjs-loading-spinner:before { content: "\e01e"; font-family: VideoJS; position: absolute; top: 0; left: 0; width: 1em; height: 1em; text-align: center; text-shadow: 0 0 .1em #000; } .vjs-default-skin .vjs-menu-button { float: right; cursor: pointer; } .vjs-default-skin .vjs-menu { display: none; position: absolute; bottom: 0; left: 0; width: 0; height: 0; margin-bottom: 3em; border-left: 2em solid transparent; border-right: 2em solid transparent; border-top: 1.55em solid #000; border-top-color: rgba(7,40,50,0.5); } .vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content { display: block; padding: 0; margin: 0; position: absolute; width: 10em; bottom: 1.5em; max-height: 15em; overflow: auto; left: -5em; background-color: #000; background-color: rgba(0,0,0,0.8); -webkit-box-shadow: -0.2em -0.2em .3em rgba(255,255,255,0.2); -moz-box-shadow: -0.2em -0.2em .3em rgba(255,255,255,0.2); box-shadow: -0.2em -0.2em .3em rgba(255,255,255,0.2); } .vjs-default-skin .vjs-menu-button:hover .vjs-menu { display: block; } .vjs-default-skin .vjs-menu-button ul li { list-style: none; margin: 0; padding: .3em 0 .3em 0; line-height: 1.4em; font-size: 1.2em; text-align: center; text-transform: lowercase; } .vjs-default-skin .vjs-menu-button ul li.vjs-selected { background-color: #000; } .vjs-default-skin .vjs-menu-button ul li:focus, .vjs-default-skin .vjs-menu-button ul li:hover, .vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus, .vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover { outline: 0; color: #111; background-color: #fff; background-color: rgba(255,255,255,0.75); -webkit-box-shadow: 0 0 1em #fff; -moz-box-shadow: 0 0 1em #fff; box-shadow: 0 0 1em #fff; } .vjs-default-skin .vjs-menu-button ul li.vjs-menu-title { text-align: center; font-size: 1em; line-height: 2em; padding: 0; margin: 0 0 .3em 0; font-weight: bold; cursor: default; } .vjs-default-skin .vjs-subtitles-button:before { content: "\e00c"; } .vjs-default-skin .vjs-captions-button:before { content: "\e008"; } .vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before, .vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before { -webkit-box-shadow: 0 0 1em #fff; -moz-box-shadow: 0 0 1em #fff; box-shadow: 0 0 1em #fff; } .video-js { background-color: #000; position: relative; padding: 0; font-size: 10px; vertical-align: middle; font-weight: normal; font-style: normal; font-family: Arial,sans-serif; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .video-js .vjs-tech { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .video-js:-moz-full-screen { position: absolute; } body.vjs-full-window { padding: 0; margin: 0; height: 100%; overflow-y: auto; } .video-js.vjs-fullscreen { position: fixed; overflow: hidden; z-index: 1000; left: 0; top: 0; bottom: 0; right: 0; width: 100%!important; height: 100%!important; _position: absolute; } .video-js:-webkit-full-screen { width: 100%!important; height: 100%!important; } .video-js.vjs-fullscreen.vjs-user-inactive { cursor: none; } .vjs-poster { background-repeat: no-repeat; background-position: 50% 50%; background-size: contain; background-color: #000; cursor: pointer; height: 100%; margin: 0; padding: 0; position: relative; width: 100%; } .vjs-poster img { display: block; margin: 0 auto; max-height: 100%; padding: 0; width: 100%; } .video-js.vjs-using-native-controls .vjs-poster { display: none; } .video-js .vjs-text-track-display { text-align: center; position: absolute; bottom: 4em; left: 1em; right: 1em; } .video-js .vjs-text-track { display: none; font-size: 1.4em; text-align: center; margin-bottom: .1em; background-color: #000; background-color: rgba(0,0,0,0.5); } .video-js .vjs-subtitles { color: #fff; } .video-js .vjs-captions { color: #fc6; } .vjs-tt-cue { display: block; } .vjs-default-skin .vjs-hidden { display: none; } .vjs-lock-showing { display: block!important; opacity: 1; visibility: visible; } .section-title h1, .section-title h2, .section-title h3, .section-title h4, .section-title h5, .section-title h6 { margin: 0; padding: 0; font-size: 1em; text-transform: none; } .section-title h2 { font-weight: normal; } .section-title .text.bottom { bottom: 100px!important; } .section-title .default-title { color: #fff; font-family: Helmet, Freesans, Helvetica, Arial, sans-serif; } .section-title .story-title { max-width: 100%; margin-left: 0; margin-right: 0; color: #fff; font-size: 100px; font-weight: bold; line-height: 1.05em; padding: 30px 30px 0; font-family: Merriweather,serif; } .section-title .story-heading { max-width: 100%; margin-left: 0; margin-right: 0; margin: 0; padding: 10px 30px 16px; font-size: 27px; line-height: 1.3em; color: #fff; font-family: Helmet, Freesans, Helvetica, Arial, sans-serif; } .section-title .story-metadata { display: block; position: absolute; right: 30px; bottom: 60px; text-align: right; font-size: 15px; line-height: 1.333333333em; z-index: 3; color: #fff; font-family: Helmet, Freesans, Helvetica, Arial, sans-serif; } .section-title .story-metadata p { margin: 0; } .section-title .background-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; } .lt-ie9 .section-title .background-overlay { background-color: transparent; } .section-title .background-overlay video { display: none; } .section-header { position: relative; width: 100%; margin: 0; padding: 0; border: 0; border-bottom: 1px solid #999; -webkit-box-shadow: inset 1px 1px 1px #999; -moz-box-shadow: inset 1px 1px 1px #999; box-shadow: inset 1px 1px 1px #999; } .header-panel { margin: 0; padding: 0; height: 32px; border: 1px solid transparent; } .header-panel a, .header-panel a:hover, .header-panel a:active, .header-panel a:focus { display: inline-block; height: 22px; margin: 0; padding: 0; background: 0; border: 0; text-shadow: none; box-shadow: none; border-radius: 0; color: transparent; outline: 0; -webkit-transition: background 120ms ease-in-out; -moz-transition: background 120ms ease-in-out; -o-transition: background 120ms ease-in-out; -ms-transition: background 120ms ease-in-out; transition: background 120ms ease-in-out; } .header-panel.header-logo-panel { position: absolute; top: 15px; left: 30px; width: 259px; } .header-panel.header-logo-panel .header-logo { width: auto; height: 30px; } .header-panel.header-social-panel { position: absolute; top: 15px; right: 15px; width: 300px; } .header-panel.header-social-panel ul.header-social-list { position: absolute; right: 15px; margin: 0; list-style: none; } .header-panel.header-social-panel ul.header-social-list li { display: inline-block; margin: 0; padding: 4px 0 4px 12px; } .header-panel.header-social-panel ul.header-social-list li .fb-share-button span { vertical-align: inherit!important; } .header-panel.header-social-panel .header-facebook.active { background: transparent; } .header-panel.header-social-panel .header-facebook.active img { height: 20px; } .header-panel.header-social-panel .header-twitter.active { background: transparent; } .story-footer { color: #3a3a3a; width: 100%; height: 60px; box-shadow: inset 0 3px 0 #d9d9d9; position: relative; float: left; } .story-footer .return-to-top { cursor: pointer; font-size: 15px; width: 30px; padding-top: 7px; margin: 0 auto; } .story-footer .return-to-top .up-arrow { height: 9px; margin: 8px auto; padding: 0 6px; } .story-footer .return-to-top .up a { color: inherit; text-decoration: none; } .story-footer .image-container { position: absolute; right: 30px; top: 0; } .story-footer .image-container a img { width: 122px; top: 4px; height: 56px; } .lt-ie9 .story-footer { border-top: 3px solid #d9d9d9; } .hideMainHeader { height: 0; visibility: hidden; } .bbcTopLogo { float: left; margin: 8px 0 0 8px; line-height: 24px; } .bbcTopLogo img { float: left; } .section-navigation .bbcTopLogo a { padding: 0; line-height: normal; -moz-opacity: 1; -khtml-opacity: 1; -webkit-opacity: 1; opacity: 1; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); filter: alpha(opacity=100); } .hideNav { display: none; } .section-navigation a:hover, .section-navigation a:visited:hover, .section-navigation a:active, .section-navigation a:visited:active { border-bottom: 3px solid #CC0101; } .story-scroll-text { color: #fff; font-size: 15px; font-family: Helmet, Freesans, Helvetica, Arial, sans-serif; margin: 2em auto 0 auto!important; } .story-scroll-icon { margin: 8px auto 0 auto; } /* MediaQueries */ @media(max-width:1100px) { .main-column { font-size: 16px; } .hide-small { display: none; } } @media(max-width:755px) { .main-column { width: 100%; font-size: 16px; padding-left: 0; padding-right: 0; } .column-left { float: none; margin: 0; } .column-right { float: none; margin: 0; } } @media(max-width:580px) { .section-navigator { display: none !important; } } @media(min-width:755px) and (max-width:1100px) { .section-navigation a { line-height: 42px; border-bottom: 3px solid transparent; } .section-navigation a.active { border-bottom-color: rgba(255,255,255,0.9); } } @media(max-width:1100px) { .main-column { font-size: 16px; } .hide-small { display: none; } .story .two-column-grid { padding: 0 15px; min-width: initial; } .section-scrollmation .main-column { float: none; margin: 0 auto; } .section-scrollmation .main-column .scrollmation-slide { width: 100%; } .section-scrollmation .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation .main-column .scrollmation-inline .inline-image { width: 100%; } } @media(max-width:1100px) { .main-column { font-size: 16px; } .hide-small { display: none; } .story .two-column-grid { padding: 0 15px; min-width: initial; } .section-scrollmation .main-column { float: none; margin: 0 auto; } .section-scrollmation .main-column .scrollmation-slide { width: 100%; } .section-scrollmation .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation .main-column .scrollmation-inline .inline-image { width: 100%; } .scrollmation-background .scrollomation-background-container [data-scrollmation-slide].active+.scrollmation-background-caption { display: none; } } @media(max-width:755px) { .main-column { width: 100%; font-size: 16px; padding-left: 0; padding-right: 0; } .column-left { float: none; margin: 0; } .column-right { float: none; margin: 0; } .scrollmation-background .scrollmation-slides { display: none; } } @media(max-width:1100px) { .main-column { font-size: 16px; } .hide-small { display: none; } .story .two-column-grid { padding: 0 15px; min-width: initial; } .section-scrollmation .main-column { float: none; margin: 0 auto; } .section-scrollmation .main-column .scrollmation-slide { width: 100%; } .section-scrollmation .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation .main-column .scrollmation-inline .inline-image { width: 100%; } .scrollmation-background .scrollomation-background-container [data-scrollmation-slide].active+.scrollmation-background-caption { display: none; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline .inline-image { width: 100%; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline.portrait-image { width: 60%; left: 20%; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline.hide-small { display: none; } .section-scrollmation.scrollmation-two-column .secondary-column { display: none; } .small-inline { display: block; } } @media(max-width:755px) { .main-column { width: 100%; font-size: 16px; padding-left: 0; padding-right: 0; } .column-left { float: none; margin: 0; } .column-right { float: none; margin: 0; } .scrollmation-background .scrollmation-slides { display: none; } .section-scrollmation.scrollmation-two-column { margin: 0; } } @media(min-width:1400px) { .scrollmation-two-column .secondary-column.margin-left { margin-left: 720px; } } @media(min-width:1900px) { .scrollmation-two-column .scrollmation-slides { max-width: 620px; } } @media(max-width:1100px) { .main-column { font-size: 16px; } .hide-small { display: none; } .story .two-column-grid { padding: 0 15px; min-width: initial; } .section-scrollmation .main-column { float: none; margin: 0 auto; } .section-scrollmation .main-column .scrollmation-slide { width: 100%; } .section-scrollmation .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation .main-column .scrollmation-inline .inline-image { width: 100%; } .scrollmation-background .scrollomation-background-container [data-scrollmation-slide].active+.scrollmation-background-caption { display: none; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline .inline-image { width: 100%; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline.portrait-image { width: 60%; left: 20%; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline.hide-small { display: none; } .section-scrollmation.scrollmation-two-column .secondary-column { display: none; } .small-inline { display: block; } .section-text { padding: 0 15px; } } @media(max-width:1100px) and (min-height:700px) { .section-text-over-media .text-over-media-inner { font-size: 56px; } } @media(max-width:755px) { .main-column { width: 100%; font-size: 16px; padding-left: 0; padding-right: 0; } .column-left { float: none; margin: 0; } .column-right { float: none; margin: 0; } .scrollmation-background .scrollmation-slides { display: none; } .section-scrollmation.scrollmation-two-column { margin: 0; } .section-text-over-media { min-height: 268px; } .section-text-over-media .text-over-media-inner { width: 96%; font-size: 40px; } .section-text-over-media .text-over-media-caption { width: 320px; padding: 15px 15px; } } @media(min-width:1400px) { .scrollmation-two-column .secondary-column.margin-left { margin-left: 720px; } .section-text-over-media { min-height: 600px; } .section-text-over-media .text-over-media-inner { font-size: 72px; } } @media(min-width:1900px) { .scrollmation-two-column .scrollmation-slides { max-width: 620px; } .section-text-over-media .text-over-media-inner { font-size: 96px; } } @media(max-width:755px) { .main-column { width: 100%; font-size: 16px; padding-left: 0; padding-right: 0; } .column-left { float: none; margin: 0; } .column-right { float: none; margin: 0; } .scrollmation-background .scrollmation-slides { display: none; } .section-scrollmation.scrollmation-two-column { margin: 0; } .section-text-over-media { min-height: 268px; } .section-text-over-media .text-over-media-inner { width: 96%; font-size: 40px; } .section-text-over-media .text-over-media-caption { width: 320px; padding: 15px 15px; } .section-video .video-player-caption { width: 320px; padding: 15px 15px; bottom: 35px; } } @media\0screen { .vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar:before { content: ""; } } @media(max-width:1100px) { .main-column { font-size: 16px; } .hide-small { display: none; } .story .two-column-grid { padding: 0 15px; min-width: initial; } .section-scrollmation .main-column { float: none; margin: 0 auto; } .section-scrollmation .main-column .scrollmation-slide { width: 100%; } .section-scrollmation .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation .main-column .scrollmation-inline .inline-image { width: 100%; } .scrollmation-background .scrollomation-background-container [data-scrollmation-slide].active+.scrollmation-background-caption { display: none; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline .inline-image { width: 100%; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline.portrait-image { width: 60%; left: 20%; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline.hide-small { display: none; } .section-scrollmation.scrollmation-two-column .secondary-column { display: none; } .small-inline { display: block; } .section-text { padding: 0 15px; } .section-title .text.bottom { bottom: 70px!important; } .section-title .story-title { font-size: 60px; } .section-title .story-heading { font-size: 20px; } .section-title .story-metadata { font-size: 12px; line-height: 1.333333333em; } } @media(max-width:755px) { .main-column { width: 100%; font-size: 16px; padding-left: 0; padding-right: 0; } .column-left { float: none; margin: 0; } .column-right { float: none; margin: 0; } .scrollmation-background .scrollmation-slides { display: none; } .section-scrollmation.scrollmation-two-column { margin: 0; } .section-text-over-media { min-height: 268px; } .section-text-over-media .text-over-media-inner { width: 96%; font-size: 40px; } .section-text-over-media .text-over-media-caption { width: 320px; padding: 15px 15px; } .section-video .video-player-caption { width: 320px; padding: 15px 15px; bottom: 35px; } .section-title .text.bottom { bottom: 40px!important; } .section-title .story-title { font-size: 40px; padding-right: 15px; padding-left: 15px; } .section-title .story-heading { font-size: 16px; padding-right: 15px; padding-left: 15px; } .section-title .story-metadata { font-size: 12px; right: 15px; bottom: 15px; } } @media(min-width:1400px) { .scrollmation-two-column .secondary-column.margin-left { margin-left: 720px; } .section-text-over-media { min-height: 600px; } .section-text-over-media .text-over-media-inner { font-size: 72px; } .section-title .text.bottom { bottom: 150px!important; } .section-title .story-title { font-size: 96px; } .section-title .story-heading { margin-top: 10px; font-size: 40px; } } @media(max-width:755px) { .main-column { width: 100%; font-size: 16px; padding-left: 0; padding-right: 0; } .column-left { float: none; margin: 0; } .column-right { float: none; margin: 0; } .scrollmation-background .scrollmation-slides { display: none; } .section-scrollmation.scrollmation-two-column { margin: 0; } .section-text-over-media { min-height: 268px; } .section-text-over-media .text-over-media-inner { width: 96%; font-size: 40px; } .section-text-over-media .text-over-media-caption { width: 320px; padding: 15px 15px; } .section-video .video-player-caption { width: 320px; padding: 15px 15px; bottom: 35px; } .section-title .text.bottom { bottom: 40px!important; } .section-title .story-title { font-size: 40px; padding-right: 15px; padding-left: 15px; } .section-title .story-heading { font-size: 16px; padding-right: 15px; padding-left: 15px; } .section-title .story-metadata { font-size: 12px; right: 15px; bottom: 15px; } .section-header { display: none; } } @media(max-width:755px) { .main-column { width: 100%; font-size: 16px; padding-left: 0; padding-right: 0; } .column-left { float: none; margin: 0; } .column-right { float: none; margin: 0; } .scrollmation-background .scrollmation-slides { display: none; } .section-scrollmation.scrollmation-two-column { margin: 0; } .section-text-over-media { min-height: 268px; } .section-text-over-media .text-over-media-inner { width: 96%; font-size: 40px; } .section-text-over-media .text-over-media-caption { width: 320px; padding: 15px 15px; } .section-video .video-player-caption { width: 320px; padding: 15px 15px; bottom: 35px; } .section-title .text.bottom { bottom: 40px!important; } .section-title .story-title { font-size: 40px; padding-right: 15px; padding-left: 15px; } .section-title .story-heading { font-size: 16px; padding-right: 15px; padding-left: 15px; } .section-title .story-metadata { font-size: 12px; right: 15px; bottom: 15px; } .section-header { display: none; } .story-footer { height: 90px; } .story-footer .return-to-top { padding-top: 0; width: 80px; margin-left: 15px; margin-top: 35px; } .story-footer .return-to-top .up-arrow { display: inline-block; vertical-align: top; margin: 0; padding: 0; } .story-footer .return-to-top .up { font-size: 20px; display: inline-block; } .story-footer .image-container { right: 15px; } .story-footer .image-container a img { top: 8px; width: 162px; height: 75px; } } @media(max-width:1100px) { .main-column { font-size: 16px; } .hide-small { display: none; } .story .two-column-grid { padding: 0 15px; min-width: initial; } .section-scrollmation .main-column { float: none; margin: 0 auto; } .section-scrollmation .main-column .scrollmation-slide { width: 100%; } .section-scrollmation .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation .main-column .scrollmation-inline .inline-image { width: 100%; } .scrollmation-background .scrollomation-background-container [data-scrollmation-slide].active+.scrollmation-background-caption { display: none; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline { display: block; padding: 30px 0; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline .inline-image { width: 100%; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline.portrait-image { width: 60%; left: 20%; } .section-scrollmation.scrollmation-two-column .main-column .scrollmation-inline.hide-small { display: none; } .section-scrollmation.scrollmation-two-column .secondary-column { display: none; } .small-inline { display: block; } .section-text { padding: 0 15px; } .section-title .text.bottom { bottom: 70px!important; } .section-title .story-heading { font-size: 20px; } .section-title .story-metadata { font-size: 12px; line-height: 1.333333333em; } .large-nav { display: none !important; } } @media(max-width:1100px) and (min-width:756px) { .section-title .story-title { font-size: 60px; } } @media(min-width:1101px) { .small-nav { display: none !important; } } .lt-ie9 .small-nav { display: none; } .lt-ie9 .section-title-327 { /*.ie8*/ background-image: url(../../media/responsiveimgs/topimage_desktoplandscape.jpg); } .lt-ie9 .section-text-over-media-528 { /*.ie8*/ background-image: url(../../media/responsiveimgs/ch1_1_desktoplandscape.jpg); } .lt-ie9 .section-text-over-media-539 { /*.ie8*/ background-image: url(../../media/responsiveimgs/ch2_1_desktoplandscape.jpg); } .lt-ie9 .section-text-over-media-506 { /*.ie8*/ background-image: url(../../media/responsiveimgs/ch2_2_desktoplandscape.jpg); } .lt-ie9 .section-text-over-media-529 { /*.ie8*/ background-image: url(../../media/responsiveimgs/ch3_1_desktoplandscape.jpg); } .lt-ie9 .section-text-over-media-509 { /*.ie8*/ background-image: url(../../media/responsiveimgs/ch3_2_tabletlandscape.jpg); } .lt-ie9 .section-text-over-media-510 { /*.ie8*/ background-image: url(../../media/responsiveimgs/ch3_3_tabletlandscape.jpg); } .lt-ie9 .section-text-over-media-524 { /*.ie8*/ background-image: url(../../media/responsiveimgs/ch4_1_desktoplandscape.jpg); } .lt-ie9 .section-text-over-media-526 { /*.ie8*/ background-image: url(../../media/responsiveimgs/endimage_desktoplandscape.jpg); } @media(min-width:1900px) and (max-height:1900px) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_largedesktoplandscape.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_largedesktoplandscape.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_largedesktoplandscape.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_largedesktoplandscape.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_largedesktoplandscape.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_largedesktoplandscape.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_largedesktoplandscape.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_largedesktoplandscape.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_largedesktoplandscape.jpg); } } @media(min-width:1500px) and (max-width:1899px) and (orientation:landscape) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_desktoplandscape.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_desktoplandscape.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_desktoplandscape.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_desktoplandscape.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_desktoplandscape.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_desktoplandscape.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_desktoplandscape.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_desktoplandscape.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_desktoplandscape.jpg); } } @media(min-width:1000px) and (max-width:1499px) and (orientation:landscape) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_tabletlandscape.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_tabletlandscape.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_tabletlandscape.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_tabletlandscape.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_tabletlandscape.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_tabletlandscape.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_tabletlandscape.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_tabletlandscape.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_tabletlandscape.jpg); } } @media(min-width:666px) and (max-width:999px) and (orientation:landscape) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_smalltabletlandscape.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_smalltabletlandscape.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_smalltabletlandscape.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_smalltabletlandscape.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_smalltabletlandscape.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_smalltabletlandscape.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_smalltabletlandscape.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_smalltabletlandscape.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_smalltabletlandscape.jpg); } } @media(min-width:321px) and (max-width:665px) and (orientation:landscape) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_phonelandscape.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_phonelandscape.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_phonelandscape.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_phonelandscape.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_phonelandscape.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_phonelandscape.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_phonelandscape.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_phonelandscape.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_phonelandscape.jpg); } } @media(max-width:320px) and (orientation:landscape) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_smallphonelandscape.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_smallphonelandscape.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_smallphonelandscape.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_smallphonelandscape.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_smallphonelandscape.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_smallphonelandscape.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_smallphonelandscape.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_smallphonelandscape.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_smallphonelandscape.jpg); } } @media(min-width:1201px) and (min-height:1201px) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_largedesktopportrait.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_largedesktopportrait.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_largedesktopportrait.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_largedesktopportrait.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_largedesktopportrait.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_largedesktopportrait.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_largedesktopportrait.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_largedesktopportrait.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_largedesktopportrait.jpg); } } @media(min-width:901px) and (max-width:1200px) and (orientation:portrait) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_desktopportrait.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_desktopportrait.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_desktopportrait.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_desktopportrait.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_desktopportrait.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_desktopportrait.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_desktopportrait.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_desktopportrait.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_desktopportrait.jpg); } } @media(min-width:756px) and (max-width:900px) and (orientation:portrait) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_tabletportrait.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_tabletportrait.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_tabletportrait.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_tabletportrait.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_tabletportrait.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_tabletportrait.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_tabletportrait.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_tabletportrait.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_tabletportrait.jpg); } } @media(min-width:534px) and (max-width:755px) and (orientation:portrait) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_smalltabletportrait.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_smalltabletportrait.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_smalltabletportrait.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_smalltabletportrait.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_smalltabletportrait.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_smalltabletportrait.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_smalltabletportrait.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_smalltabletportrait.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_smalltabletportrait.jpg); } } @media(min-width:321px) and (max-width:533px) and (orientation:portrait) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_phoneportrait.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_phoneportrait.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_phoneportrait.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_phoneportrait.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_phoneportrait.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_phoneportrait.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_phoneportrait.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_phoneportrait.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_phoneportrait.jpg); } } @media(max-width:320px) and (orientation:portrait) { .section-title-327 { background-image: url(../../media/responsiveimgs/topimage_smallphoneportrait.jpg); } .section-text-over-media-528 { background-image: url(../../media/responsiveimgs/ch1_1_smallphoneportrait.jpg); } .section-text-over-media-539 { background-image: url(../../media/responsiveimgs/ch2_1_smallphoneportrait.jpg); } .section-text-over-media-506 { background-image: url(../../media/responsiveimgs/ch2_2_smallphoneportrait.jpg); } .section-text-over-media-529 { background-image: url(../../media/responsiveimgs/ch3_1_smallphoneportrait.jpg); } .section-text-over-media-509 { background-image: url(../../media/responsiveimgs/ch3_2_smallphoneportrait.jpg); } .section-text-over-media-510 { background-image: url(../../media/responsiveimgs/ch3_3_smallphoneportrait.jpg); } .section-text-over-media-524 { background-image: url(../../media/responsiveimgs/ch4_1_smallphoneportrait.jpg); } .section-text-over-media-526 { background-image: url(../../media/responsiveimgs/endimage_smallphoneportrait.jpg); } }