@charset "UTF-8"; /* ========================================================================== Base styles: opinionated defaults ========================================================================== */ html, button, input, select, textarea { font-family: 'PT Sans', sans-serif; /*-webkit-appearance: none;*/ } body { font-family: 'PT Sans', sans-serif; background: #e8e6e7; } /* * Remove text-shadow in selection highlight: h5bp.com/i * These selection declarations have to be separate. * Customize the background color to match your design. */ ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; } /* * A better looking default horizontal rule */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #e2e0e1; margin: 1em 0; padding: 0; } p { font-size: 14px; } /* * Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */ img { vertical-align: middle; } /* * Remove default fieldset styles. */ fieldset { border: 0; margin: 0; padding: 0; } /* * Allow only vertical resizing of textareas. */ textarea { resize: vertical; } h1,h2,h3,h4 { font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; margin: 0; padding: 0; } a {text-decoration: none; color: #4d90bd;} a:hover {text-decoration: underline; color: #4480bc;} .btn_orange {background: #4d90bd; color: #fff; border: none; border-radius: 3px; padding: 5px;} .btn_orange:hover {background: #4480bc; color: #FFF; text-decoration: none;} .btn_grey {background: #0f5763; border: none; border-radius: 3px; padding: 5px;} .btn_grey:hover {background: #0b4650; text-decoration: none;} .btn_block { display: block; padding: 0.5em; text-align: center; text-transform: uppercase; font-weight: 700; } .site_tint { background: #333; /*opacity: 0.7; filter:alpha(opacity=70);*/ width: 100%; position: absolute; top: 0; left: 0; z-index: 10; display: none; } a img {transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease;} /* ========================================================================== Chrome Frame prompt ========================================================================== */ .chromeframe { margin: 0.2em 0; background: #e2e0e1; color: #000; padding: 0.2em 0; } /* ========================================================================== Helper classes ========================================================================== */ /* * Hide from both screenreaders and browsers: h5bp.com/u */ .hidden { display: none !important; visibility: hidden; } /* * Hide only visually, but have it available for screenreaders: h5bp.com/v */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* * Extends the .visuallyhidden class to allow the element to be focusable * when navigated to via the keyboard: h5bp.com/p */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* * Hide visually and from screenreaders, but maintain layout */ .invisible { visibility: hidden; } /* * Clearfix: contain floats * * For modern browsers * 1. The space content is one way to avoid an Opera bug when the * `contenteditable` attribute is included anywhere else in the document. * Otherwise it causes space to appear at the top and bottom of elements * that receive the `clearfix` class. * 2. The use of `table` rather than `block` is only necessary if using * `:before` to contain the top-margins of child elements. */ .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } /* * For IE 6/7 only * Include this rule to trigger hasLayout and contain floats. */ .clearfix { *zoom: 1; } .icon-new { display: inline-block; text-indent: -9999px; } .icon--icon--search-new { background: url('../../global/images/search-icon.png') top left no-repeat; width: 24px; height: 24px; } .form__input--select--fancy { z-index: 15; } .form__input--select--fancy:hover + .customSelect .customSelectInner, .form__input--select--fancy:active + .customSelect .customSelectInner, .form__input--select--fancy:focus + .customSelect .customSelectInner { background: #FFF; } .form__input--select--fancy + .customSelect .customSelectInner { position: relative; padding: 0 70px 0 30px; display: block !important; width: auto !important; text-transform: uppercase; line-height: 40px; border: 1px solid #C3C3C3; background: #F0EEEF; border-radius: 4px; } .form__input--select--fancy + .customSelect .customSelectInner:after { position: absolute; top: 0px; right: 0px; display: block; content: ''; width: 40px; height: 100%; border-left: 1px solid #C3C3C3; z-index: 10; background: url(../images/customselect-droparrow.png) 50% 50% no-repeat; } .form__input--select--fancy[disabled] + .customSelect .customSelectInner { color: #999999; } .form__input--select--fancy[disabled] + .customSelect .customSelectInner:hover { cursor: not-allowed; } .form__input--select--block { display: block !important; margin-bottom: 10px; } .form__input--select--block + .customSelect .customSelectInner { width: 100% !important; } .customSelect .customSelectInner:hover, .customSelect .customSelectInner:active, .customSelect .customSelectInner:focus { background: #FFF; } .wrapper { margin: 0 auto; position: relative; width: 100%; min-width: 768px;} [role="contentinfo"] {} [role="main"] { width: 100%;} /* =============================================================================== */ /* HEADER */ [role="banner"] {height: 70px; background: #000 url("../images/bg-nav.jpg") no-repeat; position: relative; } [role="banner"] > .header-wrapper {height: 110px; margin: 0 auto; width: 100%; position: relative;} a.logo {z-index: 11; display: block; position: absolute; top: 20px; left: 20px; width: 104px; height: 200px; background: url("../images/logo-2016.png") no-repeat; background-size: 100% auto;} a.logo span {display: none;} .homepage a.logo {z-index: 11; display: block; position: absolute; top: 5px; left: 20px; width: 144px; height: 257px; background: url("../images/logo-2016.png") no-repeat;} /* =============================================================================== */ /* PREVIEW NOTICE */ .preview_notice {padding: 12px 0; position: fixed; top: 0; left: 0; width: 100%; z-index: 101; background: #FFF; box-shadow: 0 3px 8px 0 rgba(50, 50, 50, 0.7);} .preview_notice__text {padding: 0 12px; margin: 0; font-weight: bold; text-align: center; color: #DA252C;} .wrapper.with-preview_notice {margin-top: 42px;} /* ==================================================================================================== */ /* NAVIGATION */ .burgernav, .loctitle {display:none;} [role="navigation"] { text-transform: uppercase; font-size: 14px; position: absolute; top: 17px; left: 150px; right: 10px; z-index: 11; padding-left: 25px;} [role="navigation"] > ul {margin: 0; padding: 0; list-style: none;} [role="navigation"] > ul > li {float: left; padding: 5px 15px; margin: 0 0 0 10px; position: relative; transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease;} [role="navigation"] > ul > li > a {letter-spacing: 1px; } [role="navigation"] > ul > li > a {color: #fff;} [role="navigation"] > ul > li a:hover {text-decoration: none;} [role="navigation"] > ul > li > a span {display: none;} /*[role="navigation"] > ul > li.utility {padding: 5px 5px; margin: 0 0 0 80px; }*/ [role="navigation"] > ul > li.profile {float: right;} [role="navigation"] > ul > li.utility {padding: 5px; /*margin: 0 0 0 110px;*/ float: right;} [role="navigation"] > ul > li.search {padding: 5px 15px; margin: 0 0 0 1px; float: right;} [role="navigation"] > ul > li.search a {position: relative; display: inline-block; background: url('../images/sprite.png') no-repeat -656px -1143px; padding: 0 10px 0 25px; margin: 0; text-indent: -9999px;} [role="navigation"] > ul > li.search a:hover {color: #fff; background-position: -656px -1144px;} [role="navigation"] > ul > li a.language {margin: 0 10px; font-size: 14px; padding-left: 30px; background: url('../images/sprite.png') no-repeat -7px -1143px; } [role="navigation"] > ul > li a.location {margin: 0 10px; font-size: 14px; padding-left: 20px; background: url('../images/sprite.png') no-repeat -230px -1142px; } [role="navigation"] > ul > li.profile {float: right; padding: 0 10px;} [role="navigation"] > ul > li.profile > div {padding: 5px 0;} [role="navigation"] > ul > li.profile > .is-logged-in {padding: 0;} [role="navigation"] > ul > li a.profile {margin: 0 10px; position: relative; top: 2px; display:inline-block; background: url('../images/sprite.png') no-repeat -441px -930px; width: 16px; height: 15px; text-indent: -9999px;} [role="navigation"] > ul > li .is-logged-in a.profile {width: 25px; height: 26px; text-indent: 0; overflow: hidden;} [role="navigation"] > ul > li a.language:hover {color: #fff; background-position: -7px -1143px;} [role="navigation"] > ul > li a.location:hover {color: #fff; background-position: -230px -1142px;} [role="navigation"] > ul > li a.profile:hover {color: #fff; background-position: -441px -1145px;} [role="navigation"] > ul > li.drop > a span {margin: 7px 1px 0 8px;display: block; float: right; background: url('../images/sprite.png') no-repeat 0 -1361px; width: 11px; height: 9px; } [role="navigation"] > ul > li.drop > a:hover span {background-position: -311px -1361px; } [role="navigation"] > ul > li.active, [role="navigation"] > ul > li:hover, .diverpage [role="navigation"] > ul > li.athletes, .diverspage [role="navigation"] > ul > li.athletes, .eventpage [role="navigation"] > ul > li.events, .stopspage [role="navigation"] > ul > li.events, .registrationpage [role="navigation"] > ul > li.registration, .mediapage [role="navigation"] > ul > li.gallery, .resultspage [role="navigation"] > ul > li.results {border-radius: 3px;background: #0c162f;} [role="navigation"] > ul > li.drop.active, [role="navigation"] > ul > li.drop:hover, [role="navigation"] > ul > li.utility:hover {border-radius: 0; border-top-left-radius: 3px; border-top-right-radius: 3px;} .pt [role="navigation"] > ul > li, .es [role="navigation"] > ul > li, .pt [role="navigation"] > ul > li.search, .es [role="navigation"] > ul > li.search { padding: 5px; } .profile_nav {width: 250px; padding: 20px; right: 0; left: auto; border-radius: 3px; border-top-right-radius: 0px;} .profile_nav h2 {margin: 0 10px; padding-left: 23px; width: 130px; background: url('../images/sprite.png') no-repeat -435px -2358px;} .profile-w, .profile-logout {display: none;} .profile-thumb {float: left; margin: 0 6px 6px 0;} .profile-logout {position: absolute; top: 5px; right: 20px;} .profile-w span {display: block; font-size: 16px; font-weight: 700;} #profile-login-form {clear: both;} /* ==================================================================================================== */ /* MEGA DROPDOWN */ .megadropdown {display: none; text-transform: none; position: absolute; top: 28px; left: 0px; z-index: 999; color: #a0a0a0; background: #0c162f; width: 730px; border-radius: 3px; border-top-left-radius: 0; -webkit-box-shadow: 0 2px 15px #111;-moz-box-shadow: 0 2px 15px #111;box-shadow: 0 2px 15px #111;} .megadropdown.active {display: block;} /* TOUR STOP BAR */ .event_nav {border-top: 1px solid #283861; clear: both; height: 75px;} .event_nav:first-child {border: none;} .event_nav:hover, .event_nav.active {background: #17274E; color: #fff;} .event_nav .datetime {line-height: 1.3em; font-size: 12px; float: left; width: 100px; text-align: center;} .event_nav .datetime span {font-size: 35px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .event_nav .datetime div {padding: 28px 0 0 0; } .event_nav .title {width: 230px; float: left; font-size: 13px; line-height: 1.3em;} .event_nav .title span {font-size: 15px;} .event_nav .title div {padding: 20px 0 0 0;} .event_nav .title a {color: #fff; display: block;} .event_info {display: none; height: 100%;border-radius: 3px;} .event_info figure { width: 330px; } .event_nav.active .event_info, .event_nav:hover .event_info {color: #fff; display: block; position: absolute; top: 0; right: 0; background: #17274E; z-index: 1; width: 330px; padding: 0 20px;} .event_nav .event_info img {margin-top: 20px;} .event_nav .event_info h2 {font-size: 25px; line-height: 1.2em; padding: 20px 0 0 0;} .event_nav .event_info p {font-size: 13px;} .event_nav .event_info > div {padding-top: 20px;} .event_nav .event_info a {padding: 10px 20px 7px 20px; font-family: 'ClanWebNarrowBlack', sans-serif; color: #fff; font-weight: 400; font-size: 21px;} .event_nav .event_info a:first-child {margin-right: 20px;} /* RIDER NAV */ .athlete_nav {padding: 20px 10px; width: 700px;} .athlete_nav_column:first-child {border: none;} .athlete_nav_column {float: left; width: 33%; border-left: 1px solid #283861;} .athlete_nav ul {margin: 0; padding: 0;} .athlete_nav li {margin: 0; padding: 0; font-size: 15px;} .athlete_nav a {display: block; padding: 5px 10px 5px 20px; } .athlete_nav a:hover {background: #17274E; } .athlete_nav a span {color: #a0a0a0;} .athlete_nav a:hover span {color: #fff;} .athlete_nav figure { width: 33px; height: 33px; display: inline; } .athlete_nav img {border-radius: 16.5px; margin-right: 20px; width: 33px; height: 33px; } .athlete_nav img { filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 10+, Firefox on Android */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */ } .athlete_nav li:hover img { filter: url("data:image/svg+xml;utf8,#grayscale"); -webkit-filter: grayscale(0%); } /* MORE NAV */ /*.more_nav {padding: 0; width: 190px;} .more_nav ul {margin: 0; padding: 0;} .more_nav li {margin: 0; padding: 0; font-size: 13px; border-top: 1px solid #283861;} .more_nav li:first-child {border: none;} .more_nav li a {display: block; padding: 10px 20px; color: #a0a0a0; } .more_nav li a:hover {background: #17274E; color: #fff; }*/ /*TM RBP-95 styles from RBAR*/ /* MORE & DOTCOM NAV */ /*[role="navigation"] > ul > li.dotcom > a { color: #aa1b49; }*/ .more_nav, .dotcom_nav {padding: 0; width: 190px;} .more_nav ul, .dotcom_nav ul {margin: 0; padding: 0;} .more_nav li, .dotcom_nav li {margin: 0; padding: 0; font-size: 13px; border-top: 1px solid #283861;} .more_nav li:first-child, .dotcom_nav li:first-child {border: none;} .more_nav li a, .dotcom_nav li a {display: block; padding: 10px 20px; color: #a0a0a0; } .more_nav li a:hover {background: #17274E; color: #fff;} .dotcom_nav li a:hover {background: #1C244D; color: #fff;} .dotcom.active {background: #091A45;} .dotcom_nav.megadropdown {top: 0; left: 190px; background: #0c162f;} [role="navigation"] li.dotcom > a { text-transform: uppercase; font-weight: 700; color: #aa1b49; } /*END TM RBP-95 styles from RBAR*/ /* CONTROL NAV */ .control_nav {padding: 0; width: 540px; padding: 20px 0; right: 0; left: auto; border-radius: 3px; border-top-right-radius: 0px;} .control_nav ul {margin: 0; padding: 0;} .control_nav li {margin: 0; padding: 0; font-size: 13px; border-top: 1px solid #283861;} .control_nav li a {display: block; padding: 10px; color: #a0a0a0; } .control_nav li a:hover {background: #17274E; color: #fff; } .control_nav li a img {margin-right: 10px;} .control_nav h2 {color: #fff; font-size: 20px; width: 130px; padding: 0 0 20px 0; margin: 0; position: relative; left: -10px;} .language_col h2 {margin: 0 10px; padding-left: 30px; background: url('../images/sprite.png') no-repeat -7px -928px; } .location_col h2 {margin: 0 10px; padding-left: 23px; background: url('../images/sprite.png') no-repeat -222px -2357px; width: 75%; } .profile_col h2 {margin: 0 10px; padding-left: 23px; background: url('../images/sprite.png') no-repeat -435px -2358px;} .profile_col p {font-size: 16px; margin: 0; padding: 0 0 20px} .profile_col a {margin: 0 0 15px 0; display: block;} .language_col {float: left; width: 230px; padding: 0 20px; } .location_col {float: left; width: 229px; padding: 0 20px; border-left: 1px solid #4b4b4b;} .profile_col {float: left; width: 240px; padding: 0 20px;} .location_col form {margin: 0 0 10px 0;} .location_col legend {display: none;} .location_col input {border: 1px solid #393939; border-radius: 4px; padding: 5px 10px; color: #a0a0a0; background: #2e2e2e url('../images/sprite.png') no-repeat -485px -922px; width: 175px;} .profile_nav {width: 250px; padding: 20px; right: 0; left: auto; border-radius: 3px; border-top-right-radius: 0px;} .profile_nav h2 {margin: 0 10px; padding-left: 23px; width: 130px; background: url('../images/sprite.png') no-repeat -435px -2357px;} .profile-w, .profile-logout {display: none;} .profile-thumb {float: left; margin: 0 6px 6px 0;} .profile-logout {position: absolute; top: 5px; right: 20px;} .profile-w span {display: block; font-size: 16px; font-weight: 700;} #profile-login-form {clear: both;} .scroll-pane {width: 230px;height: 250px;overflow: auto;} .jspContainer{overflow: hidden; position: relative;} .jspPane{position: absolute;} .jspVerticalBar{position: absolute;top: 0;right: 0;width: 16px;height: 100%;background: red;} .jspVerticalBar *{margin: 0;padding: 0;} .jspCap{display: none;} .jspTrack{background: #323232;position: relative;} .jspDrag{background: #414141;position: relative;top: 0;left: 0;cursor: pointer;} .jspArrow{background: #282828;text-indent: -20000px;display: block;cursor: pointer;} .jspArrow.jspDisabled{cursor: default;background: #282828;} .jspVerticalBar .jspArrow{height: 16px;} .jspVerticalBar .jspArrow:focus{outline: none;} .jspCorner{background: #eeeef4;float: left;height: 100%;} .jspVerticalBar .jspArrowUp {background: #282828 url('../images/sprite.png') no-repeat -208px -2569px;} .jspVerticalBar .jspArrowDown { background: #282828 url('../images/sprite.png') no-repeat 2px -2569px;} /* SEARCH */ .search_nav { border-top-left-radius: 3px; border-top-right-radius: 0; right: 0; left: auto; width: 240px; padding: 20px;} .search_nav form {font-size: 21px;} .search_nav fieldset {} .search_nav legend, .search_nav label {display: none;} .search_nav ul {margin: 0; padding: 0;} .search_nav input[type="text"] {color: #a0a0a0; background: none; padding: 10px 47px 10px 10px; width: 180px; margin-right: 10px; border: 1px solid #4b4b4b; float: left;} .search_nav input[type="text"]:focus {background: #17274E;} .search_nav input[type="submit"] {position: relative; z-index: 1; display: inline-block; width: 27px; height: 47px; background: url('../images/sprite.png') no-repeat -651px -1127px; margin: 0 0 0 -38px; padding: 0; border: none; text-indent: -9999px;} /* ==================================================================================================== */ /* SPONSOR BLOCK */ #sponsors {z-index: 10;position: absolute; bottom: -60px; left: 0; background: url('../images/bg-sponsors.png') no-repeat bottom right; width: 340px; height: 60px;} .homepage #sponsors {background: url('../images/bg-sponsors.png') no-repeat; width: 395px;} #sponsors div {float: left; position: relative; top: 10px; left: 133px; width: 110px; height: 40px; background: url(../images/lifeproof-sponsor-logo.png) no-repeat; } #sponsors a { display: block; width: 110px; height: 40px; text-indent: -9999px; } .homepage #sponsors div { left: 180px; } /* =============================================================================== */ /* PROMO BLOCKS */ .promo {width: 100%; margin-bottom: 40px;} .promo img {width: 100%;} /* =============================================================================== */ /* SOCIAL WIDGET */ .socialWidget {width: 100%; padding: 0 0 20px 0; margin: 0 0 40px 0; background: url('../images/hp-bg-social.jpg') no-repeat; background-size: cover;} .socialWidget h2 {padding: 20px 0; text-align: center;} .socialWidget .socialWrapper {margin-top: 20px;} .twitter_box {width: 58px; height: 34px; left: 8px; position: relative;background: #fff;border: 1px solid #bbb;-webkit-border-radius: 3px;-moz-border-radius: 3px;-ms-border-radius: 3px;-o-border-radius: 3px;border-radius: 3px;margin-bottom: 6px;} .twitter_box:after, .twitter_box:before {width: 0; height: 0;position: absolute;top: 100%;border: solid transparent;pointer-events: none;content: " ";} .twitter_box:after {left: 50%;border-top-color: #fff;border-width: 3px;margin-left: -3px;} .twitter_box:before {left: 50%;border-top-color: #aaa;border-width: 4px;margin-left: -4px;} .twitter_box #followers {width: 100%; height: auto;position: absolute;top: 0px; left: 0px;font-family: "Helvetica Neue", helvetica, arial, sans-serif;font-size: 14px; line-height: 32px;letter-spacing: 0;white-space: nowrap;color: #333;text-align: center;-webkit-font-smoothing: subpixel-antialiased;} .socialWrapper {text-align: center; width: 100%; padding: 0;} #fb-channel {height: 75px; margin: 0 auto; margin-top: 10px; padding-left: 15px;} #twitter-channel {height: 75px; margin: 0 auto; margin-top: 10px;} #plusone-channel {height: 75px; margin: 0 auto; margin-top: 10px;} #in-channel {height: 75px; margin: 0 auto; text-align: center; margin-top: 10px;} #in-channel a {margin-left: 10px; background: url('../images/btn-instagram-follow.jpg') no-repeat; display: block; width: 56px; height: 19px; text-indent: -9999px} #in-channel .in-bubble {margin: 0 0 3px 14px; background: url('../images/social-instabubble.png') no-repeat; width: 48px; height: 38px;} #in-channel .in-bubble span {padding-top: 5px; display: block;} .socialBlock {width: 49%; float: left; margin-bottom: 20px;} .socialBlock > div {border-radius: 5px; overflow: hidden; margin: 0 auto; background: #fff; width: 76px;} .socialBlock > div > span, .socialBlock > div > a > span {display: block; height: 53px; background: url('../images/sprite-socialtabs.png') no-repeat;} .socialBlock.fb > div > span, .socialBlock.fb > div > a > span {background-position: 50% 0;} .socialBlock.tw > div > span, .socialBlock.tw > div > a > span {background-position: 50% -55px;} .socialBlock.gp > div > span, .socialBlock.gp > div > a > span {background-position: 50% -110px;} .socialBlock.in > div > span, .socialBlock.in > div > a > span {background-position: 50% -165px;} .socialBlock.tw, .socialBlock.in {border-left: 1px solid #ededed;} .socialBlock.in {clear: left; margin-bottom: 0;} @media screen and (min-width: 900px) { .socialBlock {width: 32%; margin-bottom: 0;} .socialBlock.in {clear: none;} } /* ==================================================================================================== */ /* FOOTER */ .backtotop { display: none; width: 40px; height: 40px; background: #aaa url('../../global/images/icons/icon-up.png') 7px 9px no-repeat; position: fixed; top: 50px; right: 20px; } .backtotop:hover {background-color: #4480bc;} .backtotop span {display: none;} #footer {clear: both;background: #18202d;color: white; padding: 30px 0 50px;} #footer a {color: #fff;} #footer a:hover {color: #CC1C4A; text-decoration: none; } .footer-main-nav {max-width: 1300px; margin: 0 auto;} .legacy-com {float: left; padding: 0; } .global-social {float: right; width: 450px;} .global-social h5 {margin: 0; padding: 7px 0 20px 0; font-size: 20px; font-weight: normal; float: left; font-family: "Kremlin", sans-serif;} .global-social ul {margin: 0; padding: 0; list-style: none;float: right;} .global-social li {margin: 0 10px 0 0; padding: 0; float: left; position: relative;} .global-social a { display: block; float: left; width: 40px; height: 40px; border-radius: 50%; box-shadow: 0.125em 0.125em 0.25em 0 rgba(0, 0, 0, 0.8); } .global-social a:before, .global-social a:after { content:""; border-radius: 50%; width: 40px; height: 40px; position: absolute; top: 0; left: 0; display: inline-block; } .global-social .facebook:before { background: rgb(107,129,205); background: -moz-linear-gradient(top, rgba(107,129,205,1) 0%, rgba(64,84,160,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(107,129,205,1)), color-stop(100%,rgba(64,84,160,1))); background: -webkit-linear-gradient(top, rgba(107,129,205,1) 0%,rgba(64,84,160,1) 100%); background: -o-linear-gradient(top, rgba(107,129,205,1) 0%,rgba(64,84,160,1) 100%); background: -ms-linear-gradient(top, rgba(107,129,205,1) 0%,rgba(64,84,160,1) 100%); background: linear-gradient(to bottom, rgba(107,129,205,1) 0%,rgba(64,84,160,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6b81cd', endColorstr='#4054a0',GradientType=0 ); } .global-social .facebook:after { background: url("../images/red-bull-icon-sprite.png") no-repeat scroll 0 -760px; } .global-social .twitter:before { background: rgb(55,170,220); background: -moz-linear-gradient(top, rgba(55,170,220,1) 0%, rgba(46,147,190,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(55,170,220,1)), color-stop(100%,rgba(46,147,190,1))); background: -webkit-linear-gradient(top, rgba(55,170,220,1) 0%,rgba(46,147,190,1) 100%); background: -o-linear-gradient(top, rgba(55,170,220,1) 0%,rgba(46,147,190,1) 100%); background: -ms-linear-gradient(top, rgba(55,170,220,1) 0%,rgba(46,147,190,1) 100%); background: linear-gradient(to bottom, rgba(55,170,220,1) 0%,rgba(46,147,190,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#37aadc', endColorstr='#2e93be',GradientType=0 ); } .global-social .twitter:after { background: url("../images/red-bull-icon-sprite.png") no-repeat scroll 0 -410px; } .global-social .google:before { background: rgb(206,77,52); background: -moz-linear-gradient(top, rgba(206,77,52,1) 0%, rgba(158,46,37,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(206,77,52,1)), color-stop(100%,rgba(158,46,37,1))); background: -webkit-linear-gradient(top, rgba(206,77,52,1) 0%,rgba(158,46,37,1) 100%); background: -o-linear-gradient(top, rgba(206,77,52,1) 0%,rgba(158,46,37,1) 100%); background: -ms-linear-gradient(top, rgba(206,77,52,1) 0%,rgba(158,46,37,1) 100%); background: linear-gradient(to bottom, rgba(206,77,52,1) 0%,rgba(158,46,37,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ce4d34', endColorstr='#9e2e25',GradientType=0 ); } .global-social .google:after { background: url("../images/red-bull-icon-sprite.png") no-repeat scroll 0 -150px; } .global-social .instagram:before { background: rgb(6,54,95); background: -moz-linear-gradient(top, rgba(6,54,95,1) 0%, rgba(30,74,111,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(6,54,95,1)), color-stop(100%,rgba(30,74,111,1))); background: -webkit-linear-gradient(top, rgba(6,54,95,1) 0%,rgba(30,74,111,1) 100%); background: -o-linear-gradient(top, rgba(6,54,95,1) 0%,rgba(30,74,111,1) 100%); background: -ms-linear-gradient(top, rgba(6,54,95,1) 0%,rgba(30,74,111,1) 100%); background: linear-gradient(to bottom, rgba(6,54,95,1) 0%,rgba(30,74,111,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#06365f', endColorstr='#446887',GradientType=0 ); } .global-social .instagram:after { background: url("../images/red-bull-icon-sprite.png") no-repeat scroll 0px -220px; } .global-social .youtube:before { background: rgb(202,50,44); /* Old browsers */ background: -moz-linear-gradient(top, rgba(202,50,44,1) 0%, rgba(107,14,20,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(202,50,44,1)), color-stop(100%,rgba(107,14,20,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(202,50,44,1) 0%,rgba(107,14,20,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(202,50,44,1) 0%,rgba(107,14,20,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(202,50,44,1) 0%,rgba(107,14,20,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(202,50,44,1) 0%,rgba(107,14,20,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ca322c', endColorstr='#6b0e14',GradientType=0 ); /* IE6-9 */ } .global-social .youtube:after { background: url("../images/red-bull-icon-sprite.png") no-repeat 0 -291px; } .global-social .pinterest:before { background: rgb(228,70,72); /* Old browsers */ background: -moz-linear-gradient(top, rgba(228,70,72,1) 0%, rgba(169,23,25,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(228,70,72,1)), color-stop(100%,rgba(169,23,25,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(228,70,72,1) 0%,rgba(169,23,25,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(228,70,72,1) 0%,rgba(169,23,25,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(228,70,72,1) 0%,rgba(169,23,25,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(228,70,72,1) 0%,rgba(169,23,25,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e44648', endColorstr='#a91719',GradientType=0 ); /* IE6-9 */ } .global-social .pinterest:after { background: url("../images/red-bull-icon-sprite.png") no-repeat -1px -1548px; } .global-social .rss:before { background: rgb(243,162,5); /* Old browsers */ background: -moz-linear-gradient(top, rgba(243,162,5,1) 0%, rgba(249,112,0,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(243,162,5,1)), color-stop(100%,rgba(249,112,0,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(243,162,5,1) 0%,rgba(249,112,0,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(243,162,5,1) 0%,rgba(249,112,0,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(243,162,5,1) 0%,rgba(249,112,0,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(243,162,5,1) 0%,rgba(249,112,0,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F3A205', endColorstr='#F97000',GradientType=0 ); /* IE6-9 */ } .global-social .rss:after { background: url("../images/red-bull-icon-sprite.png") no-repeat -4px -1591px; } .global-social li:hover .facebook:before { background: rgb(134,152,214); background: -moz-linear-gradient(top, rgba(134,152,214,1) 0%, rgba(76,99,183,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(134,152,214,1)), color-stop(100%,rgba(76,99,183,1))); background: -webkit-linear-gradient(top, rgba(134,152,214,1) 0%,rgba(76,99,183,1) 100%); background: -o-linear-gradient(top, rgba(134,152,214,1) 0%,rgba(76,99,183,1) 100%); background: -ms-linear-gradient(top, rgba(134,152,214,1) 0%,rgba(76,99,183,1) 100%); background: linear-gradient(to bottom, rgba(134,152,214,1) 0%,rgba(76,99,183,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8698d6', endColorstr='#4c63b7',GradientType=0 ); } .global-social li:hover .twitter:before { background: rgb(79,189,232); background: -moz-linear-gradient(top, rgba(79,189,232,1) 0%, rgba(51,159,206,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(79,189,232,1)), color-stop(100%,rgba(51,159,206,1))); background: -webkit-linear-gradient(top, rgba(79,189,232,1) 0%,rgba(51,159,206,1) 100%); background: -o-linear-gradient(top, rgba(79,189,232,1) 0%,rgba(51,159,206,1) 100%); background: -ms-linear-gradient(top, rgba(79,189,232,1) 0%,rgba(51,159,206,1) 100%); background: linear-gradient(to bottom, rgba(79,189,232,1) 0%,rgba(51,159,206,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4fbde8', endColorstr='#339fce',GradientType=0 ); } .global-social li:hover .google:before { background: rgb(216,113,93); background: -moz-linear-gradient(top, rgba(216,113,93,1) 0%, rgba(199,58,47,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(216,113,93,1)), color-stop(100%,rgba(199,58,47,1))); background: -webkit-linear-gradient(top, rgba(216,113,93,1) 0%,rgba(199,58,47,1) 100%); background: -o-linear-gradient(top, rgba(216,113,93,1) 0%,rgba(199,58,47,1) 100%); background: -ms-linear-gradient(top, rgba(216,113,93,1) 0%,rgba(199,58,47,1) 100%); background: linear-gradient(to bottom, rgba(216,113,93,1) 0%,rgba(199,58,47,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d8715d', endColorstr='#c73a2f',GradientType=0 ); } .global-social li:hover .instagram:before { background: rgb(36,78,114); background: -moz-linear-gradient(top, rgba(36,78,114,1) 0%, rgba(43,84,119,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(36,78,114,1)), color-stop(100%,rgba(43,84,119,1))); background: -webkit-linear-gradient(top, rgba(36,78,114,1) 0%,rgba(43,84,119,1) 100%); background: -o-linear-gradient(top, rgba(36,78,114,1) 0%,rgba(43,84,119,1) 100%); background: -ms-linear-gradient(top, rgba(36,78,114,1) 0%,rgba(43,84,119,1) 100%); background: linear-gradient(to bottom, rgba(36,78,114,1) 0%,rgba(43,84,119,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#50728f', endColorstr='#7691a7',GradientType=0 ); } .global-social li:hover .youtube:before { background: rgb(213,65,59); /* Old browsers */ background: -moz-linear-gradient(top, rgba(213,65,59,1) 0%, rgba(141,19,27,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(213,65,59,1)), color-stop(100%,rgba(141,19,27,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(213,65,59,1) 0%,rgba(141,19,27,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(213,65,59,1) 0%,rgba(141,19,27,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(213,65,59,1) 0%,rgba(141,19,27,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(213,65,59,1) 0%,rgba(141,19,27,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d5413b', endColorstr='#8d131b',GradientType=0 ); /* IE6-9 */ } .global-social li:hover .pinterest:before { background: rgb(231,89,92); /* Old browsers */ background: -moz-linear-gradient(top, rgba(231,89,92,1) 0%, rgba(197,27,30,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(231,89,92,1)), color-stop(100%,rgba(197,27,30,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(231,89,92,1) 0%,rgba(197,27,30,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(231,89,92,1) 0%,rgba(197,27,30,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(231,89,92,1) 0%,rgba(197,27,30,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(231,89,92,1) 0%,rgba(197,27,30,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e7595c', endColorstr='#c51b1e',GradientType=0 ); /* IE6-9 */ } .global-social li:hover .rss:before { background: rgb(238,181,73); /* Old browsers */ background: -moz-linear-gradient(top, rgba(238,181,73,1) 0%, rgba(239,147,70,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,181,73,1)), color-stop(100%,rgba(239,147,70,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(238,181,73,1) 0%,rgba(239,147,70,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(238,181,73,1) 0%,rgba(239,147,70,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(238,181,73,1) 0%,rgba(239,147,70,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(238,181,73,1) 0%,rgba(239,147,70,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EEB549', endColorstr='#EF9346',GradientType=0 ); /* IE6-9 */ } .footer-meta-nav {font-size: 12px; color:#e2e0e1; clear:both; border-top: 1px solid #444; text-align: right;max-width:1226px; margin: 0 auto;} .footer-meta-nav a {font-weight: 400; color: #fff; margin: 0 0 0 20px; } .footer-meta-nav .meta-info {padding: 25px 0 10px;} .footer-meta-nav ul {float: right; margin: 0; padding: 0; list-style: none;} .footer-meta-nav li {display: inline;} @media screen and (max-width : 768px) { .global-social { float:none; clear: both; padding: 20px 0 0; } .footer-meta-nav ul { float: none; text-align: left;margin: 0 } .footer-meta-nav li { display: block; margin: 10px 0;} .footer-meta-nav .meta-info { text-align: left; } .footer-meta-nav a { margin: 0; } } /* ============================================================================================= */ /* MAIN FEATURE - HP */ #hp_feature {width: 100%; padding-bottom: 36%; overflow: hidden; position: relative; background-color: #000; } #hp_feature.results { padding-bottom: 10px; } #hp_feature > ul {list-style: none; margin: 0; padding: 220px 0 0 0; position: absolute; z-index: 2;} #hp_feature > ul li {margin: 0 0 15px 0; padding: 0;} #hp_feature > ul li a {transition:font-size 0.1s ease; -webkit-transition:font-size 0.1s ease; -moz-transition:font-size 0.1s ease; -o-transition:font-size 0.1s ease; font-size: 25px; color: #000; background: #fff; padding: 8px 10px 3px 10px;font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; outline: none;} #hp_feature > ul li a:hover {text-decoration: none; font-size: 46px;} #hp_feature > ul li a.active {font-size: 35px; color: #fff; background: #4d90bd;} #hp_feature > ul li a.active:hover {font-size: 40px;} #hp_feature > ul li a:not(.active):hover {font-size: 30px;} #hp_feature > ul li a.lead-tourstops {color: #fff; background: #225b6a;} #hp_feature > article {display:none; height: 100%; width: 100%; float: left; background-size: cover; position: absolute; top: 0; left: 0; z-index: 1;} #hp_feature > article.active {display: block;} #hp_feature > article > div {width: 80%; margin: 0 0 0 10%; position: absolute; bottom: 0;} #hp_feature > article h1 { color: #fff; font-size: 48px; -moz-transition: all .25s linear;-webkit-transition: all .25s linear;transition: all .25s linear; line-height: 1.3em;} #hp_feature > article h1 a {color: #fff;} #hp_feature > article h1 span {background: #4d90bd; padding: 12px 12px 8px 12px; } #hp_feature > article p {font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 28px; max-width: 800px; line-height: 1em; display: inline-block; background: #000; color: #fff; padding: 8px 10px; margin-top: 10px;-moz-transition: all .25s linear;-webkit-transition: all .25s linear;transition: all .25s linear;} #hp_feature > article p a {color: #fff;} #hp_feature > article a:hover {text-decoration: none;} #hp_feature > figure { left: 0; position: absolute; top: 0; width: 100%; z-index:0; } #hp_feature > figure > img { width: 100%; } /* ============================================================================================= */ /* HP COUNTDOWN */ .countdown-toggle {font-size: 26px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; color: #fff; background: #000 url('../images/sprite.png') no-repeat -197px -662px; right: -11px; top: 50%; margin-top: -52px; position: absolute; z-index: 9; padding: 0 0 0 50px; } .countdown-toggle span {display: block; padding: 20px 20px 20px 0; background: #000;} .countdown-toggle span span { font-size: 18px; display: block; padding: 0px; } .countdown-toggle:hover {background-color: #222; color: #fff; outline: none !important; text-decoration: none;} .countdown-toggle:hover span {background: #222;} .it .countdown-toggle, .fr .countdown-toggle {font-size: 18px; background-position: -197px -678px;} .homepage #hp-event-countdown {position: absolute; top: 0; right: -1200px; width: 30%; height: 100%; float: right; background: #000; opacity: 0.99; background-size: cover; color: #fff; text-align: center; z-index: 10; } .homepage #hp-event-countdown.active .countdown-toggle {height: 44px; width: 58px; padding: 20px 0; background: #000 url('../images/sprite.png') no-repeat -194px -667px; display: block; position: absolute; right: auto; left: -58px;} .countdown-data {display:none;} .homepage #hp-event-countdown > div { border-left: 2px solid #efefef; height: 100%;} .homepage #hp-event-countdown h2 {font-size: 54px; padding-top: 40px; margin: 0 auto; overflow: hidden; white-space: nowrap;text-overflow: ellipsis; width: 90%;} .homepage #hp-event-countdown h2 a {color: #8ec3e3;} .homepage #hp-event-countdown h3 {font-size: 24px; font-family: 'PT Sans', sans-serif; text-transform: uppercase; padding-bottom: 20px;} .homepage .countdown-shell {border-top: 1px solid #474747; border-bottom: 1px solid #474747; width: 80%; margin: 0 auto;} .homepage .countdown-shell div {color: #fff; float: left; width: 33%; padding: 25px 0 14px 0; text-transform: uppercase;font-size: 18px;} .homepage .countdown-shell div#days {border-right: 1px solid #474747;} .homepage .countdown-shell div#minutes {border-left: 1px solid #474747;} .homepage .countdown-shell div span {color: #8ec3e3; display: block; line-height: 0.7em; font-size: 52px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .homepage .countdown-shell { -webkit-perspective: 400px; -moz-perspective: 400px; perspective: 400px; -webkit-transition: all .03s linear; -moz-transition: all .03s linear; transition: all .03s linear; } .homepage .countdown-shell div { -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -ms-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out; -moz-transform: translateZ(-25px) rotateX(90deg); -webkit-transform: translateZ(-25px) rotateX(90deg); -o-transform: translateZ(-25px) rotateX(90deg); transform: translateZ(-25px) rotateX(90deg); -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; -o-transform-style: preserve-3d; transform-style: preserve-3d; } .homepage .active .countdown-shell div { -webkit-transform: translatez(-25px); -moz-transform: translatez(-25px); -o-transform: translatez(-25px); transform: translatez(-25px); } .homepage .calendar_upsell_wrap { position: absolute; bottom: 0; width: 100%; } .homepage .calendar_upsell_wrap .calendar {background: url('../images/calendar-grad.gif') repeat-x;} .homepage .no-ticket .calendar_upsell_wrap { bottom: 0px; } .hp-event-upsell { text-align: center; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; margin: 40px auto; width: 80%; } .hp-event-upsell p { color: #4d90bd; font-size: 17px; } .hp-event-upsell a { color: #5093be; font-size: 24px; width: 160px; display: block; margin: 20px auto 0 auto;} .it .hp-event-upsell a {font-size: 19px;} .hp-event-upsell a span { position: relative; top: -2px; left: 5px; padding: 4px 7px; border-radius: 3px; background: rgba(255,255,255,0.3) url('../images/sprite.png') no-repeat 7px -121px; width: 12px; height: 17px; display: block; float: right; } .sponsors { width: 90%; padding: 40px 0px; overflow: hidden; margin: 0 auto;} .sponsors a {color: #fff; padding: 5px 7% 15px 7%; width: 35%; display: block; float: left;} .sponsors a.tot_1 { float: none; margin: 0 auto; padding: 0; } .sponsors a.tot_2 { width: 35%; padding: 5px 7.5% 15px 7.5%;} .sponsors a.tot_3 { width: 24%; padding: 5px 4.15% 15px 4.15%;} .sponsors a.tot_4 { width: 21%; padding: 5px 1.5% 15px 1.5%;} .sponsors a.tot_5 { width: 15%; padding: 5px 2% 15px 2%; } .sponsors a img {width: 100%; background: #fff; padding: 2px;} .calendar {height: 55px; } .calendar div {margin: 0 auto; width: 80%; position: relative; padding: 15px 0 0 15px;} .calendar a {display: block; margin: 0 15px; float: left;} .calendar span {display: block; margin: 0 15px 0 0; font-weight: bold; float: left; position: relative; top: -7px;} .cal-google {background: url('../images/sprite.png') no-repeat -449px -4px; width: 18px; height: 28px;} .cal-apple {background: url('../images/sprite.png') no-repeat -567px 0; width: 24px; height: 29px; position: relative; top: -3px;} .cal-facebook {background: url('../images/sprite.png') no-repeat -691px -6px; width: 12px; height: 23px; position: relative; top: 1px;} .cal-google:hover {background-position: -449px -233px;} .cal-apple:hover {background-position: -567px -229px;} .cal-facebook:hover {background-position: -691px -235px;} .homepage .calendar div {width: 240px} @media screen and (max-width : 1780px) { .homepage #hp-event-countdown h2 { font-size: 42px; padding-top: 30px; } .homepage #hp-event-countdown h3 { font-size: 18px;} .homepage .countdown-shell div { font-size: 18px;} .homepage .countdown-shell div span { line-height: 0.7em; font-size: 48px; } .homepage .hp-event-upsell p { font-size: 14px; } .homepage .hp-event-upsell a { font-size: 24px; margin: 0 auto; } .it .hp-event-upsell a {font-size: 19px;} .sponsors { width: 100%; padding: 0px 0px; } .no-ticket .sponsors { padding: 20px 10px; } } @media screen and (max-width : 1570px) { .hp-event-upsell { margin: 20px auto; } } @media screen and (max-width : 1390px) { .homepage #hp-event-countdown h2 { font-size: 32px; padding-top: 20px; } .homepage #hp-event-countdown h3 { font-size: 18px;} .homepage .countdown-shell div { font-size: 18px;padding: 18px 0 10px 0;} .homepage .countdown-shell div span { line-height: 0.7em; font-size: 38px; } .homepage .hp-event-upsell p { font-size: 14px; } .homepage .hp-event-upsell a { font-size: 24px; margin: 0 auto; } .it .hp-event-upsell a {font-size: 19px;} .sponsors { width: 100%; padding: 0px 0px; } .no-ticket .sponsors { padding: 20px 10px; } } @media screen and (max-width : 1200px) { .homepage #hp-event-countdown h2 { font-size: 28px;} .homepage .hp-event-upsell p { font-size: 15px; } .homepage .hp-event-upsell a { font-size: 22px; margin: 0 auto; } .it .hp-event-upsell a {font-size: 19px;} .homepage .countdown-shell div { font-size: 13px; width: 32%; padding: 15px 0 7px 0;} } @media screen and (max-width : 1100px) { .homepage .hp-event-upsell p { font-size: 14px; padding-bottom:0; } .homepage .countdown-shell div span { font-size: 38px; } } @media screen and (max-width : 1024px) { .hp-event-upsell { margin: 40px auto; } } @media screen and (max-width : 930px) { .hp-event-upsell { margin: 10px auto; } } /* ============================================================================================= */ /* ARTICLES */ .icon {display: block; position: absolute; top: 35px; right: 0; z-index: 2; width: 35px; height: 35px; border-bottom-left-radius: 2px;} .module--event-highlights .icon, .feed--news .icon { position: inherit; } .narrow .icon {top: 0;} .col3 .icon {top: 0;} .wide .icon {top: 0;} .wide article.locale .icon {top: 5px;} .icon.video {background: #515e64 url('../images/sprite.png') no-repeat -157px -115px; } .icon.article {background: #515e64 url('../images/sprite.png') no-repeat -375px -116px;} .icon.gallery {background: #515e64 url('../images/sprite.png') no-repeat -593px -117px;} .newsfeed .narrow article .icon {top: 0; right: 0;} .newsfeed article.locale .icon {top: 5px; right: 0;} .hp-feed {background: #e8e6e6; padding: 20px 0 40px 0; /* overflow: hidden; DB */ } .hp-extra-feed {background: #e8e6e6; padding: 40px 0;} .hp-feed > div, .hp-extra-feed > div {max-width: 1300px; margin: 0 auto;} .newsfeed {float: left; width: 69%;} .social {width: 30%; float: right;} .hp-extra-feed .newsfeed {width: 100%;} .newsfeed .wide {width: 62%; float: left;} .newsfeed .narrow {width: 37%; float: left;} .newsfeed .col3 {width: 33%; float: left;} .newsfeed article {position: relative; padding: 20px 0 20px 0; border-right: 1px solid #e2e0e1; border-bottom: 1px solid #e2e0e1;} .newsfeed article header h2 {font-size: 26px;} .newsfeed article header h2 a {color: #000;} .newsfeed article header span {font-size: 12px; color: #8d8d8d} .newsfeed article .exerpt {border-top: 1px solid #e2e0e1; border-bottom: 1px solid #e2e0e1;} .newsfeed article .exerpt p {font-size: 14px;} .newsfeed article .extra {display: none;} .newsfeed article footer {margin: 5px 0px; font-size: 13px;} .newsfeed article footer div.share {display: block; float: right; cursor:pointer; background: url('../images/sprite.png') no-repeat -930px -410px; width: 24px; height: 17px;} .newsfeed article footer a.comments {color: #000; background: url('../images/sprite.png') no-repeat -660px -410px; padding: 0 0 0 25px;} .newsfeed article > div > a.imglink {position: relative; display: block; overflow: hidden;} .newsfeed article > div > a.imglink img {height: auto; width: 100%; transition:all 2s ease; -webkit-transition:all 2s ease; -moz-transition:all 2s ease; -o-transition:all 2s ease;} .newsfeed article > div > a.imglink span {display: block; opacity: 0.1; filter:alpha(opacity=10); width: 100%; height: 100%; background: #000; z-index: 1; position: absolute; top: 0; left: 0;} .newsfeed article > div:hover > a.imglink span {display: none;} .newsfeed .wide article {padding: 20px 0;} .newsfeed .wide article:first-child, .newsfeed .col3 article:first-child {padding: 0px 0 20px 0;} .newsfeed .wide article > div {background: #fff; margin: 0 20px 0 0; padding: 0; position: relative;} .newsfeed .col3 article > div {background: #fff; margin: 0 20px; padding: 0; position: relative;} .newsfeed .wide article header, .newsfeed .col3 article header {padding: 20px 20px 10px 20px;} .newsfeed .wide article .exerpt, .newsfeed .col3 article .exerpt {margin: 0 20px;} .newsfeed .wide article footer, .newsfeed .col3 article footer {margin: 10px 10px 0px 20px; padding: 0 0 10px 0; height: 15px;} .newsfeed .col3 article > div {background: #d2d6d9; margin: 0 10px; padding: 0px 0px 0 0px; position: relative;} .newsfeed .wide article > div:hover {background: #d4d4d4;} .newsfeed .col3 article > div:hover {background: #d4d4d4;} .newsfeed .col3 article header {padding: 20px 20px 10px 20px;} .newsfeed .col3 article header h2 a {color: #000;} .newsfeed .col3 article .exerpt {margin: 0px 20px; border: none;} .newsfeed .col3 article .exerpt p {padding: 0; margin: 3px 0;} .newsfeed .col3 article footer {margin: 10px 0 0 0;} .newsfeed .col3 article:last-child {padding-bottom: 0;border-bottom: none;} .newsfeed .col3 article {border-right: none;} .newsfeed .first article > div {margin: 0 20px 0 0;} .newsfeed .last article > div {margin: 0 0 0 10px;} .newsfeed .first {border-right: 1px solid #e2e0e1;} .newsfeed .last {border-left: 1px solid #e2e0e1;} .newsfeed#content .wide article:first-child, .newsfeed#content .col3 article:first-child {padding: 20px 0; border-top: 1px solid #e2e0e1;} .newsfeed .col3 article:last-child {border-bottom: 1px solid #e2e0e1; padding-bottom: 10px;} .newsfeed .narrow article:first-child {padding-top: 0; margin-top: 0;} .newsfeed .narrow article > div {background: #d2d6d9; margin: 0 20px; padding: 0 0 10px 0; position: relative;} .newsfeed .narrow article > div:hover {background: #dbdada;} .newsfeed .narrow article header {padding: 15px 20px 10px 20px;} .newsfeed .narrow article header h2 {font-size: 20px; padding-bottom: 5px;} .newsfeed .narrow article header h2 a {color: #000;} .newsfeed .narrow article header span {font-size: 12px;} .newsfeed .narrow article .exerpt {margin: 0 20px 0 20px; border: none;} .newsfeed .narrow article .exerpt p {padding: 0; margin: 0;} .newsfeed .narrow article footer {margin: 30px 0 0 0;} .newsfeed .narrow article footer .share {position: absolute; bottom: 10px; right: 10px;} .newsfeed .wide article.promo > div {padding: 0;} .newsfeed .col3 article.special > div {background: #fff;} .shareStatus {color: #fff;} .newsfeed .col3 article footer div.share {margin-right:10px;} /* ACTIVE OVERLAY ARTICLE */ .newsfeed article.special.active > div {background: #000; color: #fff; overflow: hidden;} .newsfeed article.special.active > div .content {overflow: hidden; position: relative; background: rgba(0,0,0,0.7);} .lt-ie9 .newsfeed article.special.active > div .content {background: #000;} .newsfeed article.special.active > div header {color: #fff;} .newsfeed article.active > div header h2 a {color: #fff;} .newsfeed article.special.active > div header span {display: block;} .newsfeed article.special.active > div .exerpt {border-top: 1px solid #444; border-bottom: none; margin-top: 10px; padding: 0px 0;} .newsfeed article.active .extra {display: block; text-align: center; border-bottom: 1px solid #444; padding: 20px 0 30px 0; margin: 0 20px;} .newsfeed article.active .extra a {padding: 15px 18px 10px 18px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 21px;} .newsfeed article.active .extra a:hover {text-decoration: none; color: #fff;} .newsfeed article.active .extra .exerpt {text-align: left;} .newsfeed article.special.active footer .share {position: absolute; bottom: 10px; right: 0px;} .newsfeed .wide article.special.active footer .share {right: 20px;} .newsfeed article.special.active footer div.share { background: url('../images/sprite.png') no-repeat -930px -525px; width: 24px; height: 17px; } .newsfeed article.special.active footer a.comments {color: #fff; position: absolute; bottom: 10px; left: 20px; background-position: -660px -528px; padding: 0 0 0 25px;} /*special for narrow */ .newsfeed .narrow article.active > div header span {display: block;} .newsfeed .narrow article.active > div .exerpt {border-top: 1px solid #444; border-bottom: none; margin: 10px 20px; padding: 10px 0;} .newsfeed .narrow article.active .extra {padding: 10px 0 30px 0; margin: 0 20px;} .newsfeed .narrow article.active footer .share {position: absolute; bottom: 10px; right: 10px;} .newsfeed .narrow article.active footer a.comments {bottom: 10px; left: 10px;} .articlepage .inline, .videopage .inline { max-width: 100%; } /* ============================================================================================== */ /* LANGUAGE BAR */ .languagebar {background: #4d90bd; display: none; color: #fff;} .languagebar > div {margin: 0 auto; max-width: 1300px; padding: 15px 0 12px 0;} .languagebar p {margin: 0; padding: 0;font-size: 18px;} .languagebar p > span {background: url('../images/sprite.png') no-repeat -600px -686px; width: 17px; height: 27px; float: left; position: relative; top: -2px; margin-right: 10px;} .languagebar a {float: right; background: url('../images/sprite.png') no-repeat -800px -686px; width: 17px; height: 17px; position: relative; top: 4px;} .languagebar a span {display: none;} div.localeicon {text-align: center; border-top: 5px solid #4d90bd; position: absolute; top: 0; left: 0; z-index: 12; width: 100%;} div.localeicon span {font-weight: bold; color: #fff; position: absolute; top: 0; left: 0; background: #4d90bd url('../images/sprite.png') no-repeat -394px -682px; padding: 38px 16px 4px 16px } .narrow div.localeicon span {font-size: 12px; background: #4d90bd url('../images/sprite.png') no-repeat -591px -684px; padding: 30px 16px 4px 16px} .newsfeed .narrow article .bl-adtech {padding: 0;} .newsfeed .narrow article .bl-adtech:hover {background: #e8e6e6;} .newsfeed .narrow article .bl-adtech img {width: 100%; height: auto;} /* ==================================================================================================== */ /* ARTICLE SOCIAL TOOL TIP */ .share-social {width: 270px; display: none; position: absolute; bottom: 0; right: 0px; z-index: 10;} .share-social a {display: block; float: left; margin: 0; position: relative;} .share-social .twitter {background: url('../images/social/buttons.png') no-repeat -103px 0; width: 81px; height: 30px; margin-right: 10px; } .share-social .facebook { background: url('../images/social/buttons.png') no-repeat 0 0; width: 100px; height: 30px; margin-right: 10px; } .share-social .cog {opacity: 0.8; filter:alpha(opacity=80); background: url('../images/social/icon-cog.png') no-repeat 0 0; width: 16px; height: 16px; position: relative; top: 7px; float: right; } .share-social .twitter:hover {background-position: -103px -33px; } .share-social .facebook:hover {background-position: 0 -33px; } .share-social .cog:hover {opacity: 1; filter:alpha(opacity=100);} .share-social > div {margin-right: 3px; margin: 10px; padding: 15px 10px 25px 10px; background: #3c3c3c;} .share-social > span {display: block; position: absolute; left: 210px; bottom: -3px; background: url('../images/social/arrow-down.png') no-repeat; width: 25px; height: 13px; } .share-social .article_info {padding-bottom: 10px; border-bottom: 1px solid #323232; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .share-social .article_info img {float: left; margin-right: 10px;} .share-social .article_info span {color: #fff; font-size: 16px;} .share-social form {clear:both; padding: 15px 0; border-top: 1px solid #4b4b4b;} .share-social form textarea {width: 96%; border: 1px solid #e2e0e1; border-radius: 3px; padding: 2%;} .share-social form input[type="button"] {width: 101%;font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 18px; margin-top: 10px;} .narrow .share-social {bottom: 32px; right: -7px;} .col3 .share-social {bottom: 32px; right: -24px;} .wide .share-social {bottom: 32px; right: -15px;} article.special .share-social {left: auto; bottom: 32px; right:3px;} article.black .share-social {left: auto; bottom: 22px; right:-7px;} article.white .share-social {left: auto; bottom: 22px; right:-7px;} .col3 .share-social {left: auto; bottom: 32px; right:-7px;} article.video .share-social {left: auto; bottom: 22px; right:-9px;} .special .share-social > span, .black .share-social > span, .white .share-social > span, .video .share-social > span {left: 226px;} .newsfeed article.special.active footer .share .share-social {right: -17px; bottom: 22px;} .newsfeed article.black.active footer .share .share-social {right: -7px; bottom: 22px;} /* ==================================================================================================== */ /* SIGN UP FORM */ .newsfeed article.signup > div {padding: 0; margin: 0 20px 10px 20px;} .signup > div form {color: #fff; padding: 10px 0; width: 100%; background: url("../images/Home/bg-signup.jpg") no-repeat 100%; background-size: cover; -ms-behavior: url(/assets/js/backgroundsize.min.htc);} .signup > div h3 { font-size: 34px; padding: 10px 20px 10px 20px;} .signup > div p {padding: 0 20px 15px 20px; margin: 0;} .signup > div label {margin: 10px 20px; display: block;} .signup > div input[type="text"], .signup > div input[type="email"]{width: 95%; background: #fff; background: rgba(255,255,255,0.8); border: none; border-radius: 5px; padding: 5px;} .signup > div input[type="submit"] {font-size: 18px; width: 99%; padding-top: 8px; font-family: 'ClanWebNarrowBlack', sans-serif;} /* ==================================================================================================== */ /* THE BUZZ */ #thebuzz {background: #0b1c2a url("../images/bg-buzz.jpg") no-repeat; padding-bottom: 0px;margin-bottom: 40px;} #thebuzz header {position: relative; height: 53px; width: 100%;} #thebuzz header h2 {color: #fff; padding: 17px 0 0 20px;} #thebuzz header ul {height: 48px; width: 139px; margin: 0; padding: 0; list-style: none;background: url('../images/sprite.png') no-repeat -51px -434px; position: absolute; bottom: 0; right: 5px;} #thebuzz header ul li {float:left; } #thebuzz header ul li a {outline: none; transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; display: block; top: 5px; position: relative; width: 41px; height: 43px; background: url('../images/sprite.png') no-repeat -4px -284px;} #thebuzz header ul li a.feed-facebook-link {left: 5px; background-position: -56px -284px;} #thebuzz header ul li a.feed-instagram-link {left: 16px; background-position: -108px -284px;} #thebuzz header ul li a.active, #thebuzz header ul li a:hover {height: 53px; top: 0;} #thebuzz header ul li a span {display: none;} #thebuzz > a {text-align: center; color: #fff; background: #525151; display: block; width: 120px; margin: 0 auto; border-radius: 5px; font-size: 18px; padding: 4px 10px;} #thebuzz > a:hover {background: #225c6a; background: #5d5d5d; text-decoration:none;} #thebuzz > section {padding: 20px; display: none; clear:both; color: #fff;} #thebuzz > section.active {display: block;} #thebuzz > section article {clear:both; border-bottom: 1px solid #555; margin: 0;} #thebuzz > section article > div.avatar {float: left; width: 50px; } #thebuzz > section article > div.avatar a {display:block; margin: 15px auto 0 auto;} #thebuzz > section article > div.avatar img {max-width: 100%;} #thebuzz > section article > section { min-height: 75px; margin-left: 60px; border-left: 1px solid #555; } #thebuzz > section article > section a { -ms-word-break: break-all; word-break: break-all; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; word-wrap: break-word; overflow-wrap: break-word; } #thebuzz > section article > section p {font-size: 14px; margin: 0; padding: 10px 20px 0 10px;} #thebuzz > section article > section aside {margin: 0; padding: 5px 10px 10px 10px; font-size: 12px;} #thebuzz > section article > section aside a {color: #fff;} #thebuzz #feed-instagram ul {margin: 0 auto; display: block; padding: 0; list-style: none;} #thebuzz #feed-instagram li {margin: 3px 1%; padding: 0; background: #000; width: 31%; float: left;} #thebuzz #feed-instagram a img {width: 100%; opacity: 0.9; filter:alpha(opacity=90)} #thebuzz #feed-instagram a:hover img {opacity: 1; filter:alpha(opacity=100)} #thebuzz #feed-facebook > div {width: 95%; text-align: center; background: #fff; padding: 10px;} #thebuzz #feed-facebook .fb-full {margin: 10px 0; background: #333; width: 100%; border: none; color:#e2e0e1; font-style: italic;} #thebuzz #feed-facebook article > section {min-height: 75px; border-left: 1px solid #555; } #thebuzz form {padding: 20px 0;} #thebuzz label {} #thebuzz label textarea {font-size: 13px; margin: 0 0 20px 0; border-radius: 3px; border: none; background: #e2e0e1; width: 96%; padding: 2%;} #thebuzz label span {display: none;} #thebuzz input[type="button"] {font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 18px; color: #fff; width: 100%; padding: 10px 0 8px 0;} /* ==================================================================================================== */ /* CALENDAR */ #tour-calendar {margin-bottom: 40px;} #tour-calendar header {background: #0f5763; position: relative; z-index: 8; height: 53px; width: 100%;} #tour-calendar header h2 {background: url('../images/sprite.png') no-repeat 14px -380px; color: #fff; padding: 17px 0 17px 50px;} #tour-calendar article {} #tour-calendar article section { color: #123a44; border-bottom: 1px solid #e2e0e1; position: relative; z-index: 1; clear: both; background: #7fb0b7; height: 70px;} #tour-calendar .datetime {line-height: 1.1em; font-size: 16px; border-right: 1px solid #e2e0e1; float: left; width: 25%; height: 70px; text-align: center; color: #fff;} #tour-calendar .datetime span {font-size: 36px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; color: #123e47;} #tour-calendar .datetime div {padding: 23px 0 0 0; } #tour-calendar .title {width:74%;float: left; height: 70px; overflow: hidden; line-height: 1.1em;} #tour-calendar .title span {font-size: 18px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} #tour-calendar .title div {padding: 20px 0 0 20px; width: 90%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} #tour-calendar .title a {position: absolute; bottom: 10px; right: 10px; display: block; background: url('../images/sprite.png') no-repeat -930px -410px; width: 24px; height: 17px; } #tour-calendar .calendar { height: 70px; margin: 0; display: none; position: absolute; top: 0; left: 0; background: #0f5763; width: 100%;} #tour-calendar .calendar .cal_options {color: #fff; width: 60%; position: relative; padding: 24px 0 0 0; float: right;} #tour-calendar .calendar .view_event {width: 32%; float: left; margin: 0 0 0 10px; padding: 20px 0 0 0;} #tour-calendar .calendar .view_event a {margin: 0; font-family: 'ClanWebNarrowBlack', sans-serif; width: 90%; text-align: center; padding-top: 8px;} #tour-calendar .calendar .view_event a:hover {color: #fff;} #tour-calendar .calendar .cal_options a {margin: 0 12px;} .calendar span {display: block; width: 115px; margin: 0 15px 0 0; font-weight: bold; float: left; top: 0;} .fr .calendar span, .it .calendar span {top: -10px;} #tour-calendar .calendar span {position: relative; top: -5px; line-height: 1em; display: block; width: 80px; margin: 0 5px 0 0; font-weight: bold; float: left;} /* ==================================================================================================== */ /* Standings */ #latest-standings {margin-bottom: 0px; padding-bottom: 20px; border-right: 1px solid #e2e0e1; border-bottom: 1px solid #e2e0e1;} #latest-standings header {margin: 0 20px; background: #000; position: relative; z-index: 8; height: 53px;} #latest-standings header h2 {background: url('../images/sprite.png') no-repeat -646px -4120px; color: #fff; padding: 17px 0 0 40px;} #latest-standings nav { background: url("../images/Home/bg-tour.jpg") repeat-x; margin: 0 20px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; } #latest-standings nav ul { list-style: none; margin: 0; padding: 10px; overflow: hidden; } #latest-standings nav li { width: 50%; float: left; } #latest-standings nav a { display: block; background: rgba(255,255,255,0.6); margin: 0 5px 0 0; text-align: center; padding: 12px 10px 10px; border-radius: 4px; color: #000; } #latest-standings nav a:hover { background: #FFF; text-decoration: none; } #latest-standings nav a.active { background: #4d90bd; color: #FFF; } #latest-standings nav li:last-child a { margin: 0 0 0 5px; } #latest-standings p.error { text-align: center; } #latest-standings article {padding: 0 20px; border: none;} #latest-standings article > div {background: none; margin: 0; padding: 0; position: relative;} #latest-standings article section {color: #2d2d2d; position: relative; z-index: 1; clear: both; background: url("../images/Home/bg-tour.jpg") repeat-x; height: 70px;} .rider_details {float: left; width: 75%; color: #4e4c4d;} .rider_img { left: 0; position: absolute; top: 0; width: 70px; } .rider_img img {border-radius: 50%; position: relative; top: 18px; left: 20px; width: 40px; } .rider_img span {border-radius: 50%; background: #d0d0d0; display: block; width: 24px; height: 20px; padding: 5px 0 0 1px; text-align: center; position: absolute; top: 16px; left: 5px; z-index: 1; font-family: 'ClanWebNarrowBlack', sans-serif;} .rider_img figure { width: 33px; height: 33px; } .rider_name { left: 67px; position: absolute; top: 23px; word-wrap: break-word; width: 44%;} .rider_name span.name { font-family: 'ClanWebNarrowBlack',sans-serif; font-size: 14px; } .rider_name span {font-size: 12px;font-family: 'PT Sans', sans-serif; display: block;} .rider_points {height: 60px; line-height: 1; padding: 10px 0 0 0;border-left: 1px solid #e2e0e1; float: right; font-size: 16px; width: 24%; text-align: center; color: #757575} .rider_points span {font-size: 28px;} #latest-standings .action { z-index: 2; display: none; position: absolute; top: 0; left: 0; background: #000; height: 70px; width: 100%; text-align: center;} #latest-standings .action a {position: relative; top: 25px; font-family: 'ClanWebNarrowBlack', sans-serif; width: 90%; text-align: center; padding-top: 8px;} #latest-standings .action a:hover {color: #fff;} #latest-standings .viewall {background: #E0DFDD url("../../desktop/images/Home/bg-tour.jpg") 0 100% repeat-x; height: 70px; text-align: center; margin: 0 20px;} #latest-standings .viewall a {font-size: 19px; display: block; position: relative; top: 24px; font-family: 'ClanWebNarrowBlack', sans-serif; width: 70%; text-align: center; padding: 8px auto 6px auto; margin: 0 auto;} #latest-standings .viewall a:hover {color: #fff;} /* ==================================================================================================== */ /* Red Bull TV */ .module--banner--rbtv {min-height:330px;} .module--banner--rbtv > div {background: url(../images/bg-rbtv.jpg) scroll center center no-repeat transparent!important;} .module--banner--rbtv > div .icon--logo--rbtv {background:url(../images/logo-rbtv.png) scroll center center no-repeat transparent;font: 0/0 a;text-shadow: none;color: transparent;width:170px;height:100px;top:0px;left:50%;margin-left:-85px;position:relative;} .module--banner--rbtv > div a:hover {text-decoration: none;} .module--banner--rbtv .module--banner__content {padding:20px;text-align: center;color:#fff;font-size:18px;} .module--banner--rbtv .module--banner__content .module--banner__content__strap {font-size:18px;margin-bottom:30px;} /* ==================================================================================================== */ /* Landing Pages */ #landing-page iframe { width: 100%; height: 1200px; display: block; margin: 0; padding: 0; border: none; } /* ==================================================================================================== */ /* 3D HOVER EVENT */ .csstransforms3d.preserve3d #tour-calendar article section, .csstransforms3d.preserve3d #latest-standings article section{ -webkit-perspective: 400px; -moz-perspective: 400px; perspective: 400px; -webkit-transition: all .03s linear; -moz-transition: all .03s linear; transition: all .03s linear; position: relative; background: none; border-bottom: none; } .csstransforms3d.preserve3d #tour-calendar article .three-d-box, .csstransforms3d.preserve3d #latest-standings article .three-d-box { -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; -o-transition: all .3s ease-out; transition: all .3s ease-out; -webkit-transform: translatez(-25px); -moz-transform: translatez(-25px); -o-transform: translatez(-25px); transform: translatez(-25px); -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; -o-transform-style: preserve-3d; transform-style: preserve-3d; pointer-events: none; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; } .csstransforms3d.preserve3d #tour-calendar article section.active .three-d-box, .csstransforms3d.preserve3d #latest-standings article section.active .three-d-box { -moz-transform: translateZ(-25px) rotateX(90deg); -webkit-transform: translateZ(-25px) rotateX(90deg); -o-transform: translateZ(-25px) rotateX(90deg); transform: translateZ(-25px) rotateX(90deg); } .csstransforms3d.preserve3d #tour-calendar article .front, .csstransforms3d.preserve3d #latest-standings article .front { -webkit-transform: rotatex(0deg) translatez(25px); -moz-transform: rotatex(0deg) translatez(25px); -o-transform: rotatex(0deg) translatez(25px); transform: rotatex(0deg) translatez(25px); display: block; border-bottom: 1px solid #e2e0e1; background-size: cover; } .csstransforms3d.preserve3d #tour-calendar article .back, .csstransforms3d.preserve3d #latest-standings article .back { -webkit-transform: rotatex(-90deg) translatez(25px); -moz-transform: rotatex(-90deg) translatez(25px); -o-transform: rotatex(-90deg) translatez(25px); transform: rotatex(-90deg) translatez(25px); background: #0f5763; display: none; } .csstransforms3d.preserve3d #tour-calendar article section.active .back, .csstransforms3d.preserve3d #tour-calendar article section.active .calendar, .csstransforms3d.preserve3d #latest-standings article section.active .back, .csstransforms3d.preserve3d #latest-standings article section.active .action {display: block;} #tour-calendar article section:hover {cursor: pointer;} #tour-calendar article .front {background: #7fb0b7; width: 100%;height: 100%;position: absolute;top: 0;left: 0;padding: 0;pointer-events: auto;-moz-box-sizing: border-box;box-sizing: border-box;} #tour-calendar article .back {width: 100%;height: 100%;position: absolute;top: 0;left: 0;padding: 0;pointer-events: auto;-moz-box-sizing: border-box;box-sizing: border-box;} #tour-calendar article .altitem .front {background: #579BA6;} #latest-standings article .front {background: url("../images/Home/bg-tour.jpg") repeat-x; width: 100%;height: 100%;position: absolute;top: 0;left: 0;padding: 0;pointer-events: auto;-moz-box-sizing: border-box;box-sizing: border-box;} #latest-standings article .back {width: 100%;height: 100%;position: absolute;top: 0;left: 0;padding: 0;pointer-events: auto;-moz-box-sizing: border-box;box-sizing: border-box;} #tour-calendar article section.active .back, #tour-calendar article section.active .calendar, #latest-standings article section.active .back, #latest-standings article section.active .action {display: block;} .no-csstransforms3d #tour-calendar article .back, .no-csstransforms3d #latest-standings article .back, .no-csstransforms3d #tour-calendar article .front, .no-csstransforms3d #latest-standings article .front, .no-preserve3d #tour-calendar article .back, .no-preserve3d #latest-standings article .back, .no-preserve3d #tour-calendar article .front, .no-preserve3d #latest-standings article .front { -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } /* ==================================================================================================== */ #photostories {text-align: center; margin: 0; padding: 20px 5%; background: url("../images/bg-photoseries.jpg") repeat-x; color: #e2e0e1; clear:both; position: relative; } #photostories h2 {color: #fff; font-size: 24px; padding: 5px 0 15px 0;} #photostories > div {text-align: left; width: 90%; margin: 0 auto; } .lt-ie9 #photostories > div { width: 900px; } #photostories .photostories-slider {margin: 0 auto; list-style: none; padding: 0;} #photostories .photostories-slider li {margin: 0; padding: 0;} #photostories .photostories-slider a {position: relative; color: #e2e0e1; font-style: italic; font-size: 16px; padding: 0px 0; display: block; overflow: hidden; max-width: 220px;} #photostories .photostories-slider a img {height: auto; transition:all 2s ease;-webkit-transition:all 2s ease;-moz-transition:all 2s ease;-o-transition:all 2s ease;} #photostories .photostories-slider a span {display: block; opacity: 0.1; filter:alpha(opacity=10); width: 100%; height: 100%; background: #000; z-index: 1; position: absolute; top: 0; left: 0;} #photostories .photostories-slider a:hover span {display: none;} #photostories .photostories-slider a div {padding: 5px 0 0 0;} #photostories #photostories-prev {position: absolute; left: 0px; top: 50%; display: block; background: #6dbaca url('../images/sprite.png') no-repeat 6px -677px; width: 16px; height: 43px; margin-top: -32px; padding: 10px;} #photostories #photostories-next {position: absolute; right: 0px; top: 50%; display: block; background: #6dbaca url('../images/sprite.png') no-repeat -205px -677px; width: 17px; height: 43px; margin-top: -32px; padding: 10px;} .riderpage #photostories .photostories-slider a {padding: 1px 0;} .riderpage #photostories #photostories-prev {position: absolute; z-index: 999; left: 0px; top: 50%; display: block; background: url('../images/sprite.png') no-repeat -189px -2779px; width: 49px; height: 158px; margin-top: -79px; padding: 0 10px;} .riderpage #photostories #photostories-next {position: absolute; z-index: 999; right: 0px; top: 50%; display: block; background: url('../images/sprite.png') no-repeat -278px -2779px; width: 49px; height: 158px; margin-top: -79px; padding: 0 10px;} /* ==================================================================================================== */ /* PAGINATION */ .newspage .wrapper_item > section { max-width: 1170px; } .newspage .wrapper { min-width: 768px; } .newspage .itemintronoimg { margin: 70px 0 0; } .lead--with-pagination { position: relative; } .pagination { float: right; margin: 0 0 20px; text-align: center; } .lead--with-pagination .pagination { position: absolute; bottom: 0; right: 0; } .pagination-wrapper { clear: both; padding: 10px 0 0; border-top: 1px solid #666; color: #21211f; text-transform: uppercase; } .pagination-wrapper .pagination { border-top: none; clear: none; } @media screen and (min-width: 500px) { .pagination-wrapper .pagination { float: right; } } .pagination-meta { margin: 0; } @media screen and (min-width: 500px) { .pagination-meta { float: left; } } @media screen and (max-width: 1340px) { .newspage .itemintronoimg { margin: 70px 20px 0 120px; } .lead--with-pagination .pagination { right: 20px; } } a.pagination__link { padding: 8px 7px 6px; border: 1px solid transparent; border-radius: 3px; color: #000; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 18px; line-height: 28px; background: none; } a.pagination__link:hover, a.pagination__link:active, a.pagination__link:focus { color: #4D90BD; text-decoration: none; border-color: #4D90BD; background: none; } .pagination__link--operator { padding: 0 7px 4px; color: #001d46; font-size: 24px; font-weight: 700; line-height: 28px; vertical-align: baseline; } .pagination__link:active, a.pagination__link--page--active { background: #4D90BD; color: #fff; } a.pagination__link--page--active:hover, a.pagination__link--page--active:active, a.pagination__link--page--active:focus { background: #4D90BD; color: #fff; } /* ==================================================================================================== */ /* PAGINATION JS PLUGIN */ @media screen and (min-width: 500px) { .pagination { margin: -20px 0 20px; padding: 0; } .searchpage .pagination { margin: -10px 0 0; } } .pagination a, .pagination span { display: inline-block; padding: 9px; border-radius: 3px; background: transparent; color: #4D90BD; font-weight: bold; font-size: 18px; line-height: 1; vertical-align: top; } @media screen and (min-width: 500px) { .pagination a, .pagination span { border-top-left-radius: 0; border-top-right-radius: 0; } } .pagination a:hover, .pagination a:active, .pagination a:focus, .pagination span:hover, .pagination span:active, .pagination span:focus { color: #CE0543; text-decoration: none; } .pagination .prev, .pagination .next { padding: 4px 7px; color: #4D90BD; font-size: 24px; font-weight: 700; line-height: 28px; vertical-align: baseline; } .pagination .current, .pagination .current:hover, .pagination .current:active, .pagination .current:focus { background: #4D90BD; color: #FFF; } .pagination .current.prev, .pagination .current.next { background: transparent; color: #4D90BD; } /* ==================================================================================================== */ /* FEEDS */ .feed--module, .feed--module *, .feed--module:before, .feed--module *:before, .feed--module:before, .feed--module *:before, .module, .module * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .feed--module, .feed--news { position: relative; max-width: 1300px; margin: 20px auto; } .feed--module__sizer { display: none; } .feed--module__sizer, .feed--module .module--span-1, .feed--module .module--span-2 { position: relative; } .feed--module__sizer, .feed--module .module--span-1 { width: 33.2%; } .feed--module .module--span-1 { max-width: 389px; } .feed--module .module--span-2 { width: 66.3%; max-width: 778px; } .feed--module .module { float: left; padding: 20px; border-right: 1px solid #d7d5d6; border-bottom: 1px solid #d7d5d6; } .feed--module .module--stamp { /* position: static !important; /* Overrides Masonry element styling */ left: auto; top: auto; right: 0; } .module__header__heading { font-size: 25px; margin: 0; padding: 0; } @media screen and (min-width: 1170px) { .feed--module__sizer, .feed--module .module--span-1 { width: 389px; } .feed--module .module--span-2 { width: 778px; } } /* ==================================================================================================== */ /* CONTENT MODULE */ .module--content { -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; transition: all 0.15s ease; } .module--content__figure, .module--content__text-wrap { max-width: 349px; } .module--span-2 .module--content__figure, .module--span-2 .module--content__text-wrap { max-width: 739px; } .module--span-2 .module--content__figure { max-height: 455px; } .module--content__figure { max-height: 210px; overflow: hidden; background: #000 url(../images/progress.gif) no-repeat 50% 50%; } .module--content__figure a, .module--content__figure img { display: block; } .module--content__figure img { width: 100%; height: auto; } .module--content__video-container { position: relative; padding: 0 0 56.25%; } .module--content__video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .module--content__text-wrap { padding: 20px; background: #FFF; } .module--content__pub-date { margin: 0 0 20px; font-size: 12px; font-weight: 700; color: #4e4c4c; } .module--content__header__heading { font-size: 20px; font-weight: 700; } .module--content__header__heading a { color: #4D90BD; } .module--content__header, .module--content__excerpt { margin-bottom: 20px; } .module--content__excerpt { font-size: 14px; } .module--content__controls .button--content-cta { float: left; } .module--content__controls .content-share { float: right; } .feed--module .module--content:hover .module--content__text-wrap { background: #001d46; } .feed--module .module--content:hover .module--content__pub-date, .feed--module .module--content:hover .module--content__header__heading, .feed--module .module--content:hover .module--content__header__heading a, .feed--module .module--content:hover .module--content__header__sub-heading, .feed--module .module--content:hover .module--content__header__sub-heading a, .feed--module .module--content:hover .module--content__excerpt { color: #FFF; } .feed--module .module--content:hover .button--primary { background: #FFF; color: #001d46; } .feed--module .module--content:hover .icon--icon--share { background-position: 0 -1375px; } .feed--module .module--content__text-wrap { height: 246px; } .feed--module .module--content__controls { position: absolute; left: 0; bottom: 30px; width: 100%; padding: 0 40px; max-width: 390px; } @media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3 / 2), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { .feed--module .module--content:hover .icon--icon--share { background-position: 0 -1490.5px; } } @media screen and (max-width: 1000px) { .feed--module .module--content__text-wrap { height: 258px; } } @media screen and (max-width: 950px) { .feed--module .module--content__text-wrap { height: 268px; } } @media screen and (max-width: 850px) { .feed--module .module--content__text-wrap { height: 288px; } } /* =============================================================================== */ /* BUTTONS */ .button { display: inline-block; padding: 9px; border-radius: 3px; border-width: 0; font-weight: 700; text-decoration: none; background: #E2E0E1; color: #0C162F; -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; transition: all 0.15s ease; } .button:hover, .button:active, .button:focus { text-decoration: none; cursor: pointer; background: #9fbcc1; outline: none; } .button--primary { padding: 9px 24px; background: #9fbcc1; text-transform: uppercase; } .button--primary:hover, .button--primary:active, .button--primary:focus { background: #FFF; } .button--cta { padding: 5px 15px; background: #263D68; color: #FFF; text-transform: uppercase; } .button--cta:hover, .button--cta:active, .button--cta:focus { background: #FFF; color: #263D68; } .button--subtle { background: transparent; color: #939598; font-size: 15px; text-align: center; text-transform: uppercase; border: 1px solid #939598; } .button--subtle:hover, .button--subtle:active, .button--subtle:focus { background: #939598; color: #2A2A2A; } .button--subtle-dark { background: #2A2A2A; color: #939598; font-size: 15px; text-align: center; text-transform: uppercase; border: 1px solid #939598; } .button--subtle-dark:hover, .button--subtle-dark:active, .button--subtle-dark:focus { background: #939598; color: #2A2A2A; } .button--subtle-blue { background: #0C162F; color: #939598; font-size: 15px; text-align: center; text-transform: uppercase; border: 1px solid #939598; } .button--subtle-blue:hover, .button--subtle-blue:active, .button--subtle-blue:focus { background: #939598; color: #0C162F; } .button--share { padding: 0.5em; color: #FFF; border-radius: 2px; text-decoration: none; } .button--share:hover, .button--share:active, .button--share:focus { color: #FFF; text-decoration: none; } .button--share--facebook { box-shadow: 1px 1px 0 rgba(0,0,0,0.52), inset 1px 1px 0 #4868ab; background: #435596; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQzNTU5NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzODQ4ODEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #435596 0%, #384881 99%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#435596), color-stop(99%,#384881)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #435596 0%,#384881 99%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #435596 0%,#384881 99%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #435596 0%,#384881 99%); /* IE10+ */ background: linear-gradient(to bottom, #435596 0%,#384881 99%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#435596', endColorstr='#384881',GradientType=0 ); /* IE6-8 */ } .button--share--facebook:hover, .button--share--facebook:focus { background: #375490; } .button--share--facebook:active { box-shadow: 1px 1px 0 #484848, inset 1px 1px 3px rgba(1,1,1,0.25); background: #000; } .button--share--twitter { box-shadow: 1px 1px 0 rgba(0,0,0,0.52), inset 1px 1px 0 #1a91c1; background: #29719c; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzI5NzE5YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyMzYyOGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #29719c 0%, #23628a 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#29719c), color-stop(100%,#23628a)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #29719c 0%,#23628a 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #29719c 0%,#23628a 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #29719c 0%,#23628a 100%); /* IE10+ */ background: linear-gradient(to bottom, #29719c 0%,#23628a 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29719c', endColorstr='#23628a',GradientType=0 ); /* IE6-8 */ } .button--share--twitter:hover, .button--share--twitter:focus { background: #006d97; } .button--share--twitter:active { box-shadow: 1px 1px 0 #484848, inset 6px 6px 2px rgba(1,1,1,0.25); background: #000; } .button--share--pinterest { box-shadow: 1px 1px 0 rgba(0,0,0,0.52), inset 1px 1px 0 #f03a42; background: #d71d35; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Q3MWQzNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhMzBmMjQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #d71d35 0%, #a30f24 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d71d35), color-stop(100%,#a30f24)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #d71d35 0%,#a30f24 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #d71d35 0%,#a30f24 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #d71d35 0%,#a30f24 100%); /* IE10+ */ background: linear-gradient(to bottom, #d71d35 0%,#a30f24 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d71d35', endColorstr='#a30f24',GradientType=0 ); /* IE6-8 */ } .button--share--pinterest:hover, .button--share--pinterest:focus { background: #d02129; } .button--share--pinterest:active { box-shadow: 1px 1px 0 #484848, inset 1px 1px 3px rgba(1,1,1,0.25); background: #252525; } .ie9 .button--share { filter: none; } .button--close { float: right; font-size: 18px; padding: 3px 8px 4px; } .button--download { display: inline-block; margin-top: 12px; text-decoration: none !important; } .button--vid-play { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; border: none; text-align: center; vertical-align: baseline; background: rgba(0, 0, 0, 0.4); -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .button--vid-play:hover, .button--vid-play:active, .button--vid-play:focus { background: rgba(0, 0, 0, 0.2); } .button--vid-play__label { position: absolute; bottom: 5px; left: 0; width: 100%; padding: 0 5px; font-size: 0.9em; color: #FFF; text-decoration: none; } .button--vid-play--large .button--vid-play__label { bottom: 20px; font-size: 1.2em; } .button--vid-play:hover .button--vid-play__label, .button--vid-play:active .button--vid-play__label, .button--vid-play:focus .button--vid-play__label { text-decoration: none; } .button--vid-play .icon--icon--play { background: url('../images/icon-play.png'); position: absolute; top: 50%; left: 50%; width: 25px; height: 25px; margin: -12.5px 0 0 -12.5px; } .button--vid-play .icon--icon--play--large { background: url('../images/icon-play-large.png'); position: absolute; top: 50%; left: 50%; width: 50px; height: 50px; margin: -25px 0 0 -25px; } .button--vid-play--with-label .icon--icon--play { top: 30px; margin-top: 0; } .button--vid-play--with-label .icon--icon--play--large { top: 20%; margin-top: 0; } .button--vid-play--buffer, #playVideo.button--vid-play--buffer { background: #000 url(../images/progress.gif) no-repeat 50% 50%; } .button--vid-play--buffer i, .button--vid-play--buffer span { display: none; } /* ==================================================================================================== */ /* CONTENT MODULE - NEWS FEED MODIFIER */ .feed--news { padding: 0 20px; } .feed--news .module--content { position: relative; margin: 20px 0; padding: 0 0 20px; border-bottom: 1px solid #D6D5D6; } .feed--news .module--content:last-of-type { margin: 20px 0 0; border-bottom: none; } .feed--news .module--content__header__heading { padding: 0; margin: 0 0 10px; background: none; } .feed--news .module--content__figure { float: left; margin: 0 20px 0 0; width: 350px; max-width: none; } .feed--news .module--content__text-wrap { max-width: none; width: auto; background: transparent; margin: 0 60px 0 350px; padding: 10px 20px 0; } .feed--news .module--content__text-wrap :last-child { margin-bottom: 0; } .feed--news .module--content__header, .feed--news .module--content__excerpt { margin-bottom: 10px; } .news-footer { margin: 0 auto; max-width: 1170px; } .feed--news .content-share > .button--share:hover, .feed--news .content-share > .button--share:focus, .feed--news .content-share > .button--share:active { background: #4D90BD; } .feed--news .button--share:hover .icon--icon--share, .feed--news .button--share:focus .icon--icon--share, .feed--news .button--share:active .icon--icon--share { background-position: 0 -1375px; } @media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3 / 2), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { .feed--news .button--share:hover .icon--icon--share, .feed--news .button--share:focus .icon--icon--share, .feed--news .button--share:active .icon--icon--share { background-position: 0 -1490.5px; } } .feed--news .content-share { position: absolute; bottom: 20px; right: 0; } /* ==================================================================================================== */ /* CONTENT SHARE CALLOUT */ .content-share { position: relative; } .content-share .button--share { margin: 6px 0; display: block; } .content-share__callout { opacity: 0; /* Activated by button as above */ z-index: -1; /* Needs opacity and z-index reset to show */ min-width: 350px; padding: 10px; position: absolute; bottom: 50px; right: -20px; background: #3C3C3C; border: 3px solid #bcbcbc; border: 3px solid rgba(188,188,188,0.8); border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding-box; background-clip: padding-box; -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -ms-transition: all 0.15s ease; transition: all 0.15s ease; } .content-share__callout--active { opacity: 1; z-index: 2; } .content-share__callout:after { content: ""; position: absolute; bottom: -15px; right: 20px; width: 25px; height: 25px; z-index: -1; background: #3C3C3C; border: 3px solid rgba(188,188,188,0.8); border-top-color: transparent; border-left-color: transparent; border-bottom-right-radius: 3px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .no-csstransforms .content-share__callout:after { bottom: -15px; right: 20px; width: 0; height: 0; border-top: 15px solid #3C3C3C; border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 0; } .content-share__callout--hang-right { right: auto; left: -20px; } .content-share__callout--hang-right:after { right: auto; left: 20px; } .content-share__callout__thumb { display: table-cell; padding: 0 20px 0 0; vertical-align: middle; } .content-share__callout__heading { display: table-cell; vertical-align: middle; color: #FFF; font-size: 18px; } .content-share__callout__buttons { clear: left; margin: 20px 0 0; } .content-share__callout__buttons .button--share { float: left; margin: 0 4px 0 0; } /* ==================================================================================================== */ /* ARTICLE - 2COL PAGE */ .wrapper_2col {max-width: 1300px; margin: 0 auto;} .wrapper_2col .comments {float: right; position: relative; top: 7px; font-size: 12px; background: url('../images/sprite.png') no-repeat -660px -413px; padding: 1px 0 2px 23px} .whoisin, .relatedmedia, .relatedcontent, .careerhighlights {margin-bottom: 40px;} .main_column {float: left; width: 69%; margin: 80px 0 30px 0;} .aside_column {float: right; width: 29%; margin-top: 80px;} article.article {background: #fff; padding: 20px;} article.article.news {padding-top: 0;} article.article h1 { font-size: 42px; margin: 0; padding-top: 30px; padding-bottom: 20px;} article.article header {} article.article header div.article-info {height: 30px; color: #999; border-top: 1px solid #000; padding: 0; margin-bottom: 40px;} article.article header div.article-info div.share { width: 400px; } article.article header div.date{background: url("../images/sprite.png") no-repeat -222px -3479px; border-left: 1px solid #000; width: 92px; height:28px; float: left; font-size: 12px; padding-left:33px; padding-top:12px; color:#000; font-weight: 700; margin-right: 10px;} article.article header div.article-info div.share .fb-like { padding-top: 3px; } .fb_iframe_widget { display: block!important; } @media (max-width: 1000px) { article.article header div.date{ float: none; border-left:0px; } article.article header div.article-info div.share { float: none; width: 100%; padding-bottom: 10px; border-left: 0px; border-right: 0px; } article.article header div.article-info { height: 90px; margin-bottom: 20px; border-right: 1px solid #000; border-left: 1px solid #000; } } article.article header div.tags{/*background: url("../images/sprite.png") no-repeat -337px -3479px;*/ border-left: 1px solid #000; height: 40px; float: left; padding-left: 0px;} article.article header div.tags ul { list-style-type: none; overflow: hidden; margin: 12px 0 0 0; padding: 0 0 0 34px; font-size: 12px; } article.article header div.tags ul li { float: left; margin-right: 3px; } article.article header div.tags ul li:after {content: ", "} article.article header div.tags ul li:last-child:after { content: "" } article.article header div.share{border-left: 1px solid #000; border-right: 1px solid #000; float: right; padding: 8px 10px 0 10px; height: 30px;} article.article header div.share span {color: #606060; font-weight: 400; font-family: ClanWebNarrowBlack, sans-serif; font-size: 13px; float: left; padding: 0px 10px 0 0; line-height: 28px;} article.article header div.share a{float: left; width:25px; height:25px; margin: 0 0 0 5px;} article.article header div.share a.twitter{background: url("../images/sprite.png") no-repeat -233px -4059px;} article.article header div.share a.facebook{background: url("../images/sprite.png") no-repeat -195px -4059px;} article.article ul, article.article ol {font-size: 14px;} article.article h3 {font-size: 16px; margin: 10px 0 0 0;} article.article header div span {color: #9f9f9f; padding-right: 5px;} article.article .mainimg {width: 100%;} article.article blockquote {width: 70%; margin: 50px auto; padding: 0 20px 0 100px; line-height: 1.4em; font-size: 30px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; background: url('../images/article/quote.png') no-repeat 0 40%;} article.article .socialbar {border-top: 1px solid #000; border-bottom: 1px solid #000; padding: 10px 0; margin: 20px 0;font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; color: #4a4a4a; height: 15px;} article.article .socialbar > span {float:left; margin-right: 15px;} .gigya-sharebar {float:left;} .gigya-sharebar {position: relative;} .whoisin h2 {background: #4d90bd; padding: 20px 10px 15px 20px; margin: 0; font-size: 24px; color: #fff; } .whoisin img {border: 5px transparent solid; height: 50px; border-radius: 50%; margin-right: 20px;} .whoisin ul, .whoisin li {margin: 0; padding: 0; list-style: none; } .whoisin li a, .whoisin div {display: block;background: #fcfcfc url('../images/article/bg_whoisin.png') repeat-x 100%; margin: 0; padding: 5px 20px;border-bottom: 1px solid #efefef; font-size: 16px; color: #000; font-family: 'ClanWebNarrowBlack', sans-serif;} .whoisin li a:hover {text-decoration: none; background: #d3d7da;} .whoisin li a:hover img {border-color: #efefef;} .whoisin .moreatheletes, .whoisin .showmore {display: none;} .whoisin figure { display: inline; width: 50px; } .whoisin div {padding: 30px 0; text-align: center;} .whoisin div a {font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 18px; color: #fff; width: 100%; padding: 10px 20px 8px 20px;} .whoisin_full {margin-bottom: 40px;} .whoisin_full h2 {background: #4d8498; padding: 15px 10px 10px 20px; margin: 0; font-size: 21px; color: #fff; } .whoisin_full img {border: 5px transparent solid; height: 50px; border-radius: 50%; margin-right: 20px;} .whoisin_full ul {margin: 0; padding: 0; list-style: none; width: 100%;} .whoisin_full li {float: left; width: 33%} .whoisin_full li figure {display: inline-block;} .whoisin_full li a {display: block;background: #fcfcfc url('../images/article/bg_whoisin.png') repeat-x 100%; margin: 0; padding: 5px 20px; border-right: 1px solid #efefef; border-bottom: 1px solid #efefef; font-size: 16px; color: #000; font-family: 'ClanWebNarrowBlack', sans-serif;} .whoisin_full li a:hover {text-decoration: none; background: #d4d4d4;} .whoisin_full li a:hover img {border-color: #efefef;} .whoisin_full li.last {width: 34%; } .whoisin_full li.last a {border-right: none;} .relatedmedia h2 {background: #252525; padding: 20px 10px 15px 20px; margin: 0; font-size: 24px; color: #fff; } .relatedmedia ul {margin: 0; padding: 0;} .relatedmedia li, .relatedmedia > div {background: #dbdad8; margin: 0; padding: 10px 20px; list-style: none; border-top: 1px solid #e2e0e1;} .relatedmedia li:hover {background: #efefef;} .relatedmedia a {font-size: 18px;color: #000;} .relatedmedia a:hover {text-decoration: none;} .relatedmedia a div {float: right; width: 55%; font-weight: bold; font-size: 16px;} .relatedmedia a span {color: #8e8d8d; font-size: 12px; font-weight: 400;} .relatedmedia figure { display: inline-block; width: 40%; background: #000; } .relatedmedia img { width: 100%; } .relatedmedia .MoreRelatedContent {display: none;} .relatedmedia > div {padding: 30px 0; text-align: center;} .relatedmedia > div a {font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 18px; color: #fff; width: 100%; padding: 10px 20px 8px 20px;} .relatedcontent h2 {background: #4d8498; padding: 15px 10px 10px 20px; margin: 0; font-size: 21px; color: #fff; } .relatedcontent h3 {} .relatedcontent h3 a {color: #000;} .relatedcontent h3 span {font-size: 12px; color: #8e8d8d;} .relatedcontent ul {margin: 0; padding: 0;} .relatedcontent li article > a {float: left; width: 25%; margin-right: 2%;} .relatedcontent li article > a figure {background: #000; width: 100%;} .relatedcontent li article > a img {width: 100%;} .relatedcontent li .content {float: right; width: 70%;} .relatedcontent li {clear:both; background: none; margin: 0; padding: 10px 0; list-style: none; border-top: 1px solid #e2e0e1;} .relatedcontent li article {padding: 10px;} .relatedcontent li:hover article {background: #dbdada;} .relatedcontent li .comments {top: 0; float: left; font-size: 13px; color: #454545; font-weight: bold; background-position: -660px -410px;} .relatedcontent > a {font-family: 'ClanWebNarrowBlack', sans-serif; color: #fff; padding: 8px 40px 5px 40px; margin: 0 auto;} .relatedcontent > div {padding: 20px; text-align: center;} .relatedcontent > div a {color: #fff; padding: 8px 40px 5px 40px;font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .whentowatch h2 {background: #1a4f61 url('../images/sprite.png') no-repeat -389px -2768px; padding: 15px 10px 10px 60px; margin: 0; font-size: 21px; color: #fff;} .careerhighlights h2 {background: #1a4f61 url('../images/sprite.png') no-repeat 10px -383px; padding: 15px 10px 10px 45px; margin: 0; font-size: 21px; color: #fff; } .whentowatch ul, .careerhighlights ul {margin: 0; padding: 0;} .careerhighlights li {background: #fcfcfc url('../images/article/bg_whoisin.png') repeat-x 100%; margin: 0; padding: 10px 10px 0 0; list-style: none; border-bottom: 1px solid #efefef;} .careerhighlights li h3{float: left; width: 25%; margin: 0; font-size: 21px; padding: 14px 0 0 0; color: #777; text-align: center;} .careerhighlights p strong {margin: 0; display: block; font-size: 21px; padding: 0; color: #777; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .careerhighlights li .info {float: left; width: 74%; padding-bottom: 20px;} .careerhighlights a {font-size: 18px;color: #000; font-family: 'ClanWebNarrowBlack', sans-serif;} .careerhighlights a:hover {text-decoration: none;} .careerhighlights a span {} .careerhighlights p {margin: 0; padding: 2px 0;} .careerhighlights p:first-child {border-top: none;} .careerhighlights > div {padding: 20px;background: #fff;} .careerhighlights > div a {font-size: 16px; color: #fff; padding: 8px 40px 5px 40px;} .whentowatch li {background: #fcfcfc url('../images/article/bg_whoisin.png') repeat-x 100%; margin: 0; padding: 0 10px; list-style: none;} .whentowatch li h3 {border-bottom: 1px solid #ededed; margin: 0 0 10px 0; font-size: 14px; text-transform: uppercase; padding: 14px 0 5px 0;} .whentowatch li .info {padding-bottom: 20px;} .whentowatch a {font-size: 18px;color: #000; font-family: 'ClanWebNarrowBlack', sans-serif;} .whentowatch a:hover {text-decoration: none;} .whentowatch img {float: left; width: 30%; margin: 0 5% 20px 0;} .whentowatch p {float: left; margin: 0; width: 64%; padding: 0 0 10px 0} .article_video {position: relative; width: 100%; padding: 0 0 56.25% 0; background: #000; overflow: hidden; clear: both;} .article_video #videoOverlay {position: absolute; top: 0; left: 0; z-index: 1; width: 100%;} #videoOverlay img { width: 100%; } .article_video iframe, .article_video object, .article_video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #playVideo {display: none; width: 100%; height: 100%; position: absolute; z-index: 2; top: 0; left: 0; padding: 0; border: none; background: none;} #playVideo span {position: absolute; z-index: 2; top: 50%; left: 50%; margin: -50px 0 0 -45px; background: url('../images/sprite.png') no-repeat -200px -3890px; width: 91px; height: 100px; } #playVideo:hover span {background-position: -390px -3890px;} .article_img {position: relative;} .article_img .copyright {} /* ==================================================================================================== */ /* ARTICLE COMMENTS */ .article-comments { margin-top: 20px; padding-top: 16px; background: #FFF; border-top: 1px solid #444; } .article-comments-status { display: none; margin-bottom: 16px; font-family: "Kremlin", sans-serif; font-size: 16px; } /*article.article .article-comments .article-comments__header { margin-bottom: 1em; }*/ .comments-button { display: inline-block; color: #fff; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 18px; padding: 10px 10px 7px 10px; margin: 0 0 16px; } .comments-button:hover, .comments-button:active, .comments-button:focus { color: #FFF; background: #7FB0B7; } /* ==================================================================================================== */ /* SLIDING NAV (includes Slick styles) */ /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-loading .slick-list { background: #fff url("../images/ajax-loader.gif") center center no-repeat; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } /* Icons */ @font-face { font-family: "slick"; src: url("../fonts/slick.eot"); src: url("../fonts/slick.eot?#iefix") format("embedded-opentype"), url("../fonts/slick.woff") format("woff"), url("../fonts/slick.ttf") format("truetype"), url("../fonts/slick.svg#slick") format("svg"); font-weight: normal; font-style: normal; } /* Arrows */ .slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0; font-size: 0; cursor: pointer; background: transparent; color: transparent; top: 50%; margin-top: -10px; padding: 0; border: none; outline: none; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { outline: none; background: transparent; color: transparent; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; } .slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; color: white; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-prev { left: -25px; } [dir="rtl"] .slick-prev { left: auto; right: -25px; } .slick-prev:before { content: "←"; } [dir="rtl"] .slick-prev:before { content: "→"; } .slick-next { right: -25px; } [dir="rtl"] .slick-next { left: -25px; right: auto; } .slick-next:before { content: "→"; } [dir="rtl"] .slick-next:before { content: "←"; } /* Dots */ .slick-slider { margin-bottom: 30px; } .slick-dots { position: absolute; bottom: -45px; list-style: none; display: block; text-align: center; padding: 0; width: 100%; } .slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0; font-size: 0; color: transparent; padding: 5px; cursor: pointer; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } .slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; } .slick-dots li button:before { position: absolute; top: 0; left: 0; content: "•"; width: 20px; height: 20px; font-family: "slick"; font-size: 6px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-dots li.slick-active button:before { color: black; opacity: 0.75; } .nav--slider { padding: 0 36px; margin: 0; } .nav--slider .slick-prev, .nav--slider .slick-next { top: 0; height: 32px; width: 32px; margin-top: 0; } .nav--slider .slick-prev { left: 0; } .nav--slider .slick-prev:before, .nav--slider .slick-next:before { padding: 0.5em; font-family: 'ClanWebNarrowBlack', sans-serif; } .nav--slider .slick-prev:before { content: "<"; } .nav--slider .slick-next { right: 0; } .nav--slider .slick-next:before { content: ">"; } .nav--slider .slick-prev, .nav--slider .slick-next, .nav--slider__item { display: block; padding: 0.5em; background: #A6A6A6; color: #FFF; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; } .nav--slider__item--future { background: #ccc; color: #999; } .nav--slider__item { margin: 0 2px 10px; } .nav--slider__item:hover, .nav--slider__item:active, .nav--slider__item:focus .nav--slider .slick-prev:hover, .nav--slider .slick-prev:active, .nav--slider .slick-prev:focus, .nav--slider .slick-next:hover, .nav--slider .slick-next:active, .nav--slider .slick-next:focus { color: #FFF; background: #779AB2; text-decoration: none; } .slick-active.slick-center .nav--slider__item { /*.nav--slider__item.active {*/ position: relative; background: #4D90BD; color: #FFF; } .slick-active.slick-center .nav--slider__item:after { /*.nav--slider__item.active:after {*/ top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(77, 144, 189, 0); border-top-color: #4D90BD; border-width: 7px 12px; margin-left: -12px; } /* ==================================================================================================== */ /* EVENT HIGHLIGHTS MODULE */ .module--event-highlights__content { margin-bottom: 20px; } .module--event-highlights__content__item__thumb__button { cursor: pointer; } .module--event-highlights__content__item__thumb img { width: 100%; } .module--event-highlights__content__item__vid-wrap { position: relative; } .module--event-highlights__content__item__video--lead, .module--event-highlights__content__item__video--empty { float: none; width: 100%; } .module--event-highlights__content__item__video--current { display: none; } .module--event-highlights__content__item__video--empty { padding: 50px 0; } .module--event-highlights__content__item__video--empty p { font-size: 1.2em; text-align: center; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; color: #A6A6A6; } .textshadow .module--event-highlights__content__item__video--empty p { color: #b7b1b1; text-shadow: 0px 1px 1px #efefef; } .module--event-highlights__content__item .rsTabs { float: none; clear: both; padding-top: 1%; } .module--event-highlights__content__item .rsTab { position: relative; float: left; width: 49.5%; margin: 0 0.5% 1%; opacity: 1; -webkit-transition: opacity 0.2s ease-out; -o-transition: opacity 0.2s ease-out; transition: opacity 0.2s ease-out; } .module--event-highlights__content__item .rsTab:nth-of-type(even) { margin-left: 0; } .module--event-highlights__content__item .rsTab:nth-of-type(odd) { margin-right: 0; } .module--event-highlights__content__item .rsTab.rsNavSelected { width: 0; height: 0; margin: 0; opacity: 0; z-index: -1; } .module--event-highlights__content__item img.rsImg { max-width: 100%; } .module--event-highlights__content__item__description { position: absolute; bottom: 20px; left: 0; width: 100%; padding: 0 5px; margin: 0; z-index: 2; font-size: 1.2em; color: #FFF; text-decoration: none; text-align: center; } @media screen and (max-width: 1100px) { .module--event-highlights__content__item__description { bottom: 10px; } .module--event-highlights__content__item__thumb__button .icon { display: none; } /*.module--event-highlights__content__item__thumb__button .button--vid-play__label { bottom: auto; top: 5px; }*/ } /* ==================================================================================================== */ /* RIDER/EVENT - 2COL PAGE */ /*.more {display: none;} .more p {padding-top: 0; margin-top: 0;}*/ .wrapper_item {position: relative; height: auto; background: #000; overflow: hidden; width: 100%; padding-bottom: 36%;} .copyright {position: absolute; bottom: 0; right: 0; color: #e2e0e1; font-size: 12px; padding: 0 10px 5px 0; text-shadow:1px 1px 0px #000;} .lt-ie9 .wrapper_item { height: 470px !important; padding-bottom: 0;} .wrapper_item > section { height: 100%; position: absolute; top: 0; z-index: 1; color: #fff; width: 90%; left: 50%; margin: 0 0 0 -45%; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .wrapper_item > figure {position: absolute; width: 100%; z-index: 0;} .wrapper_item > figure > img { width: 100%; height: auto; } .newspage .wrapper_item, .mediapage .wrapper_item, .historypage .wrapper_item, .resultspage .wrapper_item, .riderspage .wrapper_item, .registrationpage .wrapper_item, .registrationformpage .wrapper_item, .diverspage .wrapper_item, .stopspage .wrapper_item, .profilepage .wrapper_item, .logoutpage .wrapper_item, .ticketspage .wrapper_item {background: none; padding: 0; overflow: visible; margin: 0 auto; max-width: 1300px;} .newspage .wrapper_item > section, .mediapage .wrapper_item > section, .historypage .wrapper_item > section, .resultspage .wrapper_item > section, .riderspage .wrapper_item > section, .diverspage .wrapper_item > section, .stopspage .wrapper_item > section, .ticketspage .wrapper_item > section, .profilepage .wrapper_item > section, .logoutpage .wrapper_item > section, .registrationformpage .wrapper_item > section { height: auto; position: static; margin: 0; } .itemintro {position: absolute; bottom: 30px; left: 0;} .itemintro h1 {font-size: 48px; margin: 0 0 20px 0;-moz-transition: all .25s linear;-webkit-transition: all .25s linear;transition: all .25s linear; position: relative;} .itemintro a {color: #fff; } .itemintro a:hover {text-decoration: none; } .itemintro h1 > span {background: #4d90bd; padding: 12px 300px 8px 12px; position: relative; display: inline-block;} .itemintro blockquote {background: #000; width: auto; display: inline; margin: 0; padding: 10px 14px; font-size: 26px; line-height: 1.3em;} .itemintro div.share {position: absolute; right: 20px; top: 13px; padding-top: 8px; padding-left: 13px; font-size: 24px; float: right;} .itemintro div.share span {float: left; position: relative; top: 2px;} .itemintro div.share a {width:27px; height:27px; display: block; float: left; margin-left: 10px;} .itemintro div.share a.twitter {background: url("../images/sprite.png") no-repeat -45px -4060px;} .itemintro div.share a.facebook {background: url("../images/sprite.png") no-repeat 0 -4060px;} .itemintro div.share a.twitter:hover {background-position: -45px -4107px;} .itemintro div.share a.facebook:hover {background-position: 0 -4107px;} .itemintronoimg {position: static !important; border-bottom: 1px solid #000; margin-top: 70px;} .itemintronoimg h1 {color: #000; font-size: 48px; margin: 0 0 0px 0;-moz-transition: all .25s linear;-webkit-transition: all .25s linear;transition: all .25s linear; position: relative;} .itemintronoimg a {color: #000; } .itemintronoimg a:hover {text-decoration: none; } .itemintronoimg h1 > span {background: #none; padding: 12px 0px 8px 0px; position: relative; display: inline-block;} .itemintronoimg blockquote {background: #000; width: auto; display: inline; margin: 0; padding: 10px 14px; font-size: 26px; line-height: 1.3em;} .itemintronoimg div.share {position: absolute; right: 20px; top: 13px; padding-top: 8px; padding-left: 13px; font-size: 24px; float: right;} .itemintronoimg div.share span {float: left; position: relative; top: 2px;} .itemintronoimg div.share a {width:27px; height:27px; display: block; float: left; margin-left: 10px;} .itemintronoimg div.share a.twitter {background: url("../images/sprite.png") no-repeat -45px -4060px;} .itemintronoimg div.share a.facebook {background: url("../images/sprite.png") no-repeat 0 -4060px;} .itemintronoimg div.share a.twitter:hover {background-position: -45px -4107px;} .itemintronoimg div.share a.facebook:hover {background-position: 0 -4107px;} .post-event .itemintro {bottom:auto; top:120px; left:0px; right:0px; text-align:center;} .post-event .itemintro h1 > span {background:transparent; padding-right:130px; text-shadow:1px 1px 2px #000;} .post-event .itemintro h1 > span .share span {display:none;} .eventpage .itemintro blockquote {width: 60%; font-size: 21px;} .eventpage .post-event .itemintro blockquote { background:transparent; text-shadow: 1px 1px 2px #000; font-family: 'PT Sans', sans-serif; text-transform: uppercase; font-size:30px; line-height:10px;} .athletebio {font-size: 14px; float: left; width: 63%;} .athletebio h2 {font-size: 21px; padding: 15px 0 3px 0; border-bottom: 1px solid #000;} .athleteinfo {float: right; width: 30%; padding: 15px 2%; background: #d7e1e3;} .athleteinfo h2 {font-size: 21px; margin: 0 0 10px 0; padding: 0 0 3px 0; border-bottom: 1px solid #000;} .athleteinfo dl {font-size: 13px; margin: 0 0 20px 0; padding: 0;} .athleteinfo dt {color: #666; float: left; width: 40%; margin: 0; padding: 5px 0;} .athleteinfo dd {border-bottom: 1px solid #ccc; margin: 0; padding: 5px 0;} .it .athleteinfo dt, .fr .athleteinfo dt {width: auto; float: left; padding-right: 5px;} .article_sponsors img {width: 45%;} .tabs { position: relative; padding: 0 0 40px 0; } .tabs dl { margin: 0; padding: 0; position: relative; } .tabs dt { } .tabs dt a { outline: none; background: #e2e0e1; color: #666; display: block; padding: 9px 30px 8px 30px; position: relative; z-index: 1; margin-right: 5px; } .tabs dd { position: absolute; z-index: 0; top: 39px; left: 0; display: none; margin: 0; width: 100%; } .lt-ie9 .tabs dd { top: 38px; } .tabs dt.active a { background: #fff; color: #000; padding-bottom: 9px; } .tabs dd.active { display: block; } .tabs .article section {float: left; width: 55%; margin-right: 1%; } .tabs .article aside {float: right; width: 40%; padding-left: 2%; border-left: 1px solid #ededed; } .ticketstab figure { width: 100%; height: 50px; } .ticketstab img {margin-right: 20px;} /* Changes to the tabs structure to include unordered lists as tab nav */ .tabs ul.tabs-nav {list-style-type: none;overflow:hidden;margin:0px;padding:0px;} .tabs ul.tabs-nav li {list-style-type: none; float: left; margin: 0; text-transform: uppercase; font-size: 16px; text-align: center;} .tabs ul.tabs-nav li a {outline: none; background: #e2e0e1; color: #666; display: block; padding: 9px 30px 8px 30px; position: relative; z-index: 1; margin-right: 5px;} .tabs ul.tabs-nav li.active a {background: #fff; color: #000; padding-bottom: 9px; } .tab-content > div {display:none;} .tab-content > div.active {display:block;} /* ============================================================================================= */ /* EVENT COUNTDOWN */ #event-countdown {margin-bottom: 40px; background: #086075 url("../images/bg-counter.jpg") no-repeat; background-size: cover; color: #fff; text-align: center; } .countdown-data {display:none;} #event-countdown > div {} #event-countdown h2 {font-size: 24px; padding: 20px 0 15px 0; background: rgba(255,255,255,0.3); margin-bottom: 15px;} .countdown-shell {border-top: 1px solid #347882; border-bottom: 1px solid #347882; width: 80%; margin: 0 auto;} .countdown-shell div {color: #fff; float: left; width: 33%; padding: 25px 0 14px 0; text-transform: uppercase;font-size: 13px;} .countdown-shell div#days {border-right: 1px solid #347882;} .countdown-shell div#minutes {border-left: 1px solid #347882;} .countdown-shell div span {display: block; line-height: 0.7em; font-size: 42px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .countdown-info {border-bottom: 1px solid #347882; padding: 0; margin: 0 0 15px 0; } .countdown-info p {line-height: 1.2em; padding: 0; margin: 15px 0; font-size: 20px; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .event-upsell {text-align: center; width: 80%; margin: 20px auto 0 auto;} .event-upsell h3 {font-size: 18px; clear:both;} .event-upsell h3 span {color: #4d90bd;} .event-upsell p {color: #fff; font-size: 13px; } .event-upsell a {float: left; width: 40%; margin: 10px 5% 25px; } .event-upsell a img {height: auto; width: 100%;} #event-countdown .calendar {margin: 20px 0;background: none;} .shareto {padding: 10px 0 30px 0; clear:both; text-align: center; position: relative; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400;} .shareto a {position: relative; padding-left: 36px; margin-left: 5%; color: #fff;} .fr .shareto a {font-size: 14px;} .shareto a span {width:27px; height:27px; display: block; position: absolute; top: -5px; left: 0;} .shareto a:hover {text-decoration: none;color: #000;} .shareto a.twitter span {background: url("../images/sprite.png") no-repeat -45px -4060px;} .shareto a.facebook span {background: url("../images/sprite.png") no-repeat 0 -4060px;} .shareto a.twitter:hover span {background-position: -45px -4107px;} .shareto a.facebook:hover span {background-position: 0 -4107px;} #event-countdown .calendar span { width: 145px;} #event-countdown .calendar { clear: both;} /* ============================================================================================= */ /* RIDERS PAGE */ .riderspage .itemintro a {color: #fff;} .riderspage .itemintro a:hover {text-decoration: none; color: #000;} .athleteslist {max-width: 1300px; margin: 20px auto; } .athleteslist ul {padding: 0; margin: 0; list-style: none;} .athleteslist ul li {background: #000; float: left; width: 23%; margin: 1%;} .athleteslist ul li a {font-size: 20px; position: relative; display: block;font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; } .athleteslist ul li a > div {opacity: 0.8; filter:alpha(opacity=80);} .athleteslist ul li a h3 {position: absolute; width: 75%; bottom: 20px; left: 0; background: #fff; color: #000; padding: 10px 0 7px 45px; line-height: 1em; vertical-align: middle;} .athleteslist ul li a h3 span {display: block; position: absolute; left: 0; top: 50%; margin-top: -20px; width: 40px; height: 40px; text-indent: -9999px; background: url("../images/flags-40x40-sprite.jpg") no-repeat; } .athleteslist ul li a img {width: 100%;} .athleteslist ul li a:hover div {opacity: 1; filter:alpha(opacity=100);} .flag.sw {background-position: 0px -40px;} .flag.ca {background-position: 0px -1120px;} .flag.pl {background-position: 0px -1080px;} .flag.au {background-position: 0px -1040px;} .flag.au {background-position: 0px -1000px;} .flag.nz {background-position: 0px -960px;} .flag.cz {background-position: 0px -920px;} .flag.ch {background-position: 0px -880px;} .flag.ae {background-position: 0px -840px;} .flag.jp {background-position: 0px -800px;} .flag.po {background-position: 0px -760px;} .flag.su {background-position: 0px -720px;} .flag.it {background-position: 0px -680px;} .flag.fr {background-position: 0px -640px;} .flag.be {background-position: 0px -600px;} .flag.fr {background-position: 0px -560px;} .flag.br {background-position: 0px -520px;} .flag.de {background-position: 0px -480px;} .flag.bu {background-position: 0px -440px;} .flag.es {background-position: 0px -400px;} .flag.us {background-position: 0px -360px;} .flag.gb {background-position: 0px -320px;} .flag.uk {background-position: 0px -280px;} .flag.sa {background-position: 0px -240px;} .flag.no {background-position: 0px -200px;} .flag.ic {background-position: 0px -160px;} .flag.fi {background-position: 0px -120px;} .flag.dk {background-position: 0px -80px;} .flag.mx {background-position: 0px -1160px;} .flag.co {background-position: 0px -1200px;} .flag.ua {background-position: 0px -1280px;} .flag.ru {background-position: 0px -1240px;} .flag.by {background-position: 0px -1320px;} /* ============================================================================================= */ /* TICKETS/TOUR STOPS PAGE */ h3.events-title {font-size: 32px; border-bottom: 1px solid; padding-bottom: 12px;} .events-title--noevents {padding: 36px 0;} .wrapper_tickets {background: #e8e6e6 url('../images/game/bg-screenshots.jpg') repeat-x 0 100%;} .wrapper_tickets > div {max-width: 1300px; margin: 20px auto 0 auto;} .wrapper_tickets article {width: 49%; float: left;background: #fff; margin: 20px 0 30px 0;} .wrapper_tickets article.next {margin-right: 2%;} .wrapper_tickets article header {position: relative; text-align: center; } .wrapper_tickets article header h3 {margin: 0; padding: 0; color: #666; position: absolute; font-size: 32px; top: 0; left: 40px; background: #e8e6e6; padding: 10px 18px;} .wrapper_tickets article header h3 span {font-size: 18px; display: block;} .wrapper_tickets article header img {width: 100%;} .wrapper_tickets article header a {display: block;} .wrapper_tickets article section {padding: 20px; height: 140px;} .wrapper_tickets article section h2 {font-size: 28px;} .wrapper_tickets article section p {padding: 0 0 10px 0;} .wrapper_tickets article section span, .wrapper_tickets article section a {color: #fff; font-family: 'ClanWebNarrowBlack', sans-serif; font-weight: 400; font-size: 18px; padding: 10px 10px 7px 10px;} .wrapper_tickets article section a:hover {color: #fff;} .wrapper_tickets article section span {background: #000; color: #fff; border-radius: 3px; } .wrapper_tickets article.article3 {width: 32%; float: left;background: #fff; margin: 20px 2% 30px 0;} .wrapper_tickets article.ticketitem {width: 48%; margin: 20px 2% 30px 0;} .wrapper_tickets article.last {margin-right: 0;} .stopspage .wrapper_tickets {background: #e8e6e6;} .wrapper_tickets article.previousEvent {background: #efefef; color: #434343;} .wrapper_tickets article.previousEvent:hover {color: #000;} .past_events {max-width: 1300px; margin: 20px auto;} .past_events > h2 {background: #4d90bd; color: #fff; padding: 10px 20px 7px 20px; font-size: 26px;} .past_events nav li {margin: 30px 10px 40px 0;} .past_events > div {clear:both; display: none;border-top: 1px solid #e2e0e1;} .past_events > div.active {display: block;} .past_events article:first-child {margin-right: 0;} .past_events article {border-bottom: 1px solid #e2e0e1; border-right: 1px solid #e2e0e1; padding: 0; margin: 0; width: 49.9%; background: none;} .past_events article.last {border-right:none;} .past_events article > div {padding: 10px; margin: 1%;} .past_events article > div:hover {background: #dbdada;} .past_events article header {float: left; width: 40%;} .past_events article header h3 {font-size: 24px; left: 10px; background: #e8e6e6; padding: 10px 18px;} .past_events article header h3 span {font-size: 14px;} .past_events article header img {} .past_events article section {padding: 0 20px; height: auto; margin: 0; float: left; width: 50%;} .past_events article:hover header h3 {background: #dbdada;} /* ============================================================================================== */ /* RESULTS PAGE */ .wrapper_1col {max-width: 1300px; margin: 20px auto;} .wrapper_1col h2 {font-size: 30px; background: #323232; color: #fff; padding: 14px 20px 7px 20px; margin: 30px 0 0 0;} .wrapper_1col table {background: #fff; width: 100%; margin-bottom: 40px;} .wrapper_1col thead {background: #000; border: 10px solid #000; border-bottom:none; color: #999; text-transform: uppercase; text-align: left;} .wrapper_1col thead tr {} .wrapper_1col thead th {padding:0 10px 10px 10px;} .wrapper_1col tbody {border: 10px solid #fff; font-size: 14px;} .wrapper_1col tbody tr {} .wrapper_1col tbody td {padding: 5px 10px;} .wrapper_1col tbody tr:nth-child(odd) {background: #efefef} .wrapper_1col tbody tr:hover {background: #FFF0DA;} .wrapper_1col tbody tr img {border-radius: 50%; margin-right: 5px; opacity: 0.8; filter:alpha(opacity=80);} .wrapper_1col tbody tr:hover img {opacity: 1; filter:alpha(opacity=100);} .results-container {} .btn_download { font-family: 'ClanWebNarrowBlack', sans-serif; position: relative; background: #4d90bd; padding: 12px 30px 10px 30px; color: #FFF; border-radius: 3px; } .btn_download:hover { text-decoration: none; color: #FFF; background-color: #000; } /* ============================================================================================== */ /* TWITTER STRIP */ #tweet-strip { float: left; width: 96%; padding: 2%; margin: 0 0 20px 0; background: #2a2a2a; background-image: url("../images/rider/bg-stats-tile.png"); background-repeat: repeat-x; background-position: 0 0;} #tweet-strip header { float: left; width: 100%; margin-bottom: 10px;} #tweet-strip header h2.ts-h2 { color: #fff; line-height: 30px;} #tweet-strip header h2.ts-h2:before { content: ""; float: left; display: inline; width: 30px; height: 30px; margin-right: 10px; background: url('../images/sprite.png') -805px -235px no-repeat} #tweet-strip .ts-container { float: left; width: 100%; clear: both;} #tweet-strip .ts-left { float: left; position: relative; width: 67%; margin-right: 3%;} #tweet-strip .ts-right { float: left; width: 30%;} #tweet-strip form .ts-label { display: none;} #tweet-strip form input { float: left; width: 98%; resize: vertical; border-radius: 5px; background: #fff; border: none; padding: 2%; font-family: 'Helvetica', Arial, sans-serif; font-size: 16px; color: #666; outline: none; /* Shadow */ -moz-box-shadow: inset 0 0 10px rgba(000,000,000,0.5); -webkit-box-shadow: inset 0 0 10px rgba(000,000,000,0.5); box-shadow: inset 0 0 10px rgba(000,000,000,0.5); /* Transition */ -webkit-transition: -webkit-box-shadow 0.5s ease-in-out; -moz-transition: -moz-box-shadow 0.5s ease-in-out; -o-transition: box-shadow 0.5s ease-in-out; transition: box-shadow 0.5s ease-in-out;} #tweet-strip form input:focus { /* Shadow */ -moz-box-shadow: inset 0 0 10px rgba(000,000,000,0.5), 0 0 10px rgba(000,160,250,0.8); -webkit-box-shadow: inset 0 0 10px rgba(000,000,000,0.5), 0 0 10px rgba(000,160,250,0.8); box-shadow: inset 0 0 10px rgba(000,000,000,0.5), 0 0 10px rgba(000,160,250,0.8); /* Transition */ -webkit-transition: -webkit-box-shadow 0.5s ease-in-out; -moz-transition: -moz-box-shadow 0.5s ease-in-out; -o-transition: box-shadow 0.5s ease-in-out; transition: box-shadow 0.5s ease-in-out;} #tweet-strip form button { border: none; float: left; width: 100%; background: #4d90bd; color: #fff; text-align: center; font-family: "ClanWebNarrowBlack", sans-serif; font-size: 21px; padding: 9px 0; margin: 0; /* Border Radius */ -webkit-border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px;} #tweet-strip #ts-chars { position: absolute; top: -25px; right: 0; width: 20px; height: 20px; display: block; color: #4d90bd; font-family: "ClanWebNarrowBlack", sans-serif;} .results-summary-table {background: #fff; width: 96%; margin: 20px auto;} .results-summary-table thead {background: #000; border: 10px solid #000; border-bottom:none; color: #999; text-transform: uppercase; text-align: left;} .results-summary-table thead tr {} .results-summary-table thead th {padding:0 10px 10px 10px;} .results-summary-table tbody {border: 10px solid #fff; font-size: 14px;} .results-summary-table tbody tr {} .results-summary-table tbody td {padding: 5px 10px;} .results-summary-table tbody tr:nth-child(odd) {background: #efefef} .results-summary-table a {background: none; color: #000;} .results-summary-table a:hover {background: none; color: #4d90bd} .results-summary-table tbody tr img {border-radius: 50%; margin-right: 5px; opacity: 0.8; filter:alpha(opacity=80);} .results-summary-table tbody tr:hover img {opacity: 1; filter:alpha(opacity=100);} .results-summary-table tbody td.pos, .results-summary-table tbody td.imgs {width: 50px;} /* ============================================================================================== */ /* REGISTRATION PAGE */ .registrationpage .itemintronoimg { border-bottom: none; padding-bottom: 20px; } .registrationpage .itemintronoimg .terms, .registrationpage .itemintronoimg .form { border-top: 1px solid #000; margin: 20px 0 0; padding: 20px 0 0; } .registrationpage .itemintronoimg .terms > h2, .registrationformpage .itemintronoimg .terms > h2 { padding-bottom: 10px; } .registrationpage .accept-button { text-align: center; } .registrationpage .itemintronoimg .form { display: none; margin: 20px 0; overflow: hidden; } .registrationpage .itemintronoimg .form iframe { width: 100%; } /* ============================================================================================== */ /* MEDIA PAGE */ .mediashell nav, .tabbed_nav, .tabNav {font-family: 'ClanWebNarrowBlack', sans-serif;} .mediashell nav ul, .tabbed_nav ul, .tabNav ul {margin: 0; padding: 0;} .mediashell nav li, .tabbed_nav li, .tabNav li {margin: 20px 10px 20px 0; padding: 0; float: left;} .mediashell nav li a, .tabbed_nav li a, .tabNav li a {position: relative; background: #fff; padding: 12px 30px 10px 30px; color: #000; border-radius: 3px;} .mediashell nav li a:hover, .tabbed_nav li a:hover, .tabNav li a:hover {text-decoration: none;} .mediashell nav li.active a, .tabbed_nav li.active a, .tabNav a.active {background: #000; color: #fff;} .mediashell nav li.active a span, .tabbed_nav li.active a span, .tabNav a.active span {position: absolute; bottom: -15px; left: 50%; margin-left: -15px; display: block; background: url('../images/sprite.png') no-repeat -460px -3046px; width: 30px; height: 15px; } .mediashell nav {height: 80px;} .jamsrelated {height: 80px; margin-top: 20px;} #mediafeed {clear:both;} #mediafeed > div {clear:both; padding: 10px 0} #mediafeed article {float: left; width: 24.9%; height: 275px; position: relative; overflow: hidden;} #mediafeed article.video {width: 49.9%;} #mediafeed article a {margin: 0 10px 10px 0; display: block; position: relative; height: 265px; overflow: hidden;} #mediafeed article img {width: 100%; position: absolute; top: 0; left: 0;} #mediafeed article section {position: absolute; bottom: 0; left: 0; background: #000; background: rgba(0,0,0,0.8); width: 100%; height: 80px} #mediafeed article section h3 {color: #fff; padding: 15px 10px 5px 10px; white-space: nowrap; width: 85%; overflow: hidden; text-overflow: ellipsis;} #mediafeed article section .location {color: #fff; float: left; padding: 0 5px 0 20px; margin: 10px; background: url('../images/sprite.png') no-repeat -401px -2571px;} #mediafeed article section .date {color: #fff; float: right; padding: 0 5px 0 23px; margin: 10px; background: url('../images/sprite.png') no-repeat -601px -2572px;} #mediafeed article.video span {display: block; position: absolute; z-index: 20; top: 45px; left: 50%; margin-left: -45px; background: url('../images/sprite.png') no-repeat -200px -3890px; width: 91px; height: 100px; } #mediafeed article.video:hover span {background-position: -295px -3890px; } #mediafeed article:hover section h3, #mediafeed article:hover section .date, #mediafeed article:hover section .location {color: #4d90bd} .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; } .isotope, .isotope .isotope-item { /* change duration value to whatever you like */ -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; } .isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; } /**** disabling Isotope CSS3 transitions ****/ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } /* ============================================================================================== */ /* GALLERY PAGE */ #photostories-gallery { /*max-width:1300px;*/ width:100%; margin:20px auto;} /* ============================================================================================== */ /* Gallery */ #gallery-container { margin: 0 auto; max-width: 1300px; padding: 20px;} #gallery { margin-top: 30px; position: relative; } #gallery-wrapper { float: left; position: relative; width: 85%; } #gallery-nav-wrapper { float: right; position: relative; width: 10%; } #gallery article { margin: 0 0 30px; position: relative;} #gallery article header { position: relative; background-color: #3A3A3A; color: #FFF; padding: 10px; } #gallery article img { width: 100%; } #gallery > header > .gallery-details { border-top: 1px #000 solid; border-bottom: 1px #000 solid; padding: 8px; margin-bottom: 30px; } #gallery .full-screen {background: url('../images/sprite.png') -778px -4053px no-repeat rgba(0,0,0,0.5); position: absolute; top:0; right: 0; width: 30px; height: 30px; cursor: pointer; } #gallery article {cursor: pointer;} #gallery article:hover .full-screen { background-position: -778px -4089px } #full-screen-gallery { display: none;} .fullscreen-quicklink {color: #4d90bd; padding: 4px 0 2px 27px; float: right;font-family: 'ClanWebNarrowBlack', sans-serif;} [role="gallery-navigation"] { position: fixed; top: 292px; width: 50px; text-align: center; } [role="gallery-navigation"] a:hover { text-decoration: none; } [role="gallery-navigation"] > ul#controls { margin: 0; padding: 0; } [role="gallery-navigation"] > ul#controls li { display: block; margin-bottom: 5px; } [role="gallery-navigation"] > ul#controls li:last-child { margin-bottom: 0; } [role="gallery-navigation"] > ul#controls li a { outline: 0; width: 50px; height: 50px; display: inline-block; text-indent: -9999px; } [role="gallery-navigation"] > ul#controls li a:hover { opacity: 0.8; } [role="gallery-navigation"] > ul#controls li.gal_up a { background: #3A3A3A url('../images/sprite.png') no-repeat -699px -3897px; } [role="gallery-navigation"] > ul#controls li.gal_down a { background: #3A3A3A url('../images/sprite.png') no-repeat -614px -3895px; } [role="gallery-navigation"] > ul#indicators { margin: 15px 0 0; padding: 15px 0 00; border: 1px #C4C4C4 solid; overflow: hidden;} [role="gallery-navigation"] > ul#indicators li { margin: 0 0 10px; } [role="gallery-navigation"] > ul#indicators li a { background-color: #C4C4C4; width: 15px; height: 15px; display: inline-block; } [role="gallery-navigation"] > ul#indicators li.active a { background-color: #3A3A3A;} #gallery-container #gallery .comments { float:none; top: 2px; padding-left: 30px; color: #000; background: transparent url('../images/sprite.png') no-repeat -656px -412px; } #gallery-container #gallery .share { position: absolute; bottom: 20px; right: 20px; width: 24px; height: 17px; background: #3A3A3A url('../images/sprite.png') no-repeat -930px -525px; } #photo-gallery-fs { width: 400px; } .gallerypage #gallery-container {padding: 0; max-width: none; margin: 0;} .gallerypage #gallery {margin-top: 0;} .gallerypage #gallery-wrapper {float: none; position: static; width: auto;} .accordion h2 {font-size: 16px; background: #9fbcc1; margin: 5px 0; cursor: pointer; padding: 8px 10px 6px 10px;} .accordion h2.open {background: #0f5763; color: #fff;} .accordion h2 span { background: url('../images/sprite.png') no-repeat -626px -3911px; width: 26px; height: 17px; display: block; position: relative; float: right;} .accordion h2.open span { background: url('../images/sprite.png') no-repeat -711px -3911px;} .wrapper_1cola {max-width: 1300px; margin: 20px auto;} /* ============================================================================================= */ /* SEARCH RESULTS */ .searchpage, .searchpage * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .wrapper--content { max-width: 1270px; margin: 20px auto; } @media screen and (max-width: 1340px) { .wrapper--content { padding: 0 20px; margin: 20px 0; } } .search-results { overflow: hidden; padding: 60px 0 0; background-color: #e3e4e6; } .gcs__header { margin: 0 300px 20px 0; } @media screen and (min-width: 1000px) { .gcs__header { margin-bottom: 0; float: left; } } @media screen and (max-width: 1450px) { .gcs__header { margin-left: 60px; margin-right: 20px; } } @media screen and (max-width: 1340px) { .gcs__header { margin-left: 100px; margin-right: 20px; } } .gcs__header__title, .gcs__header__subtitle { color: #000; margin: 0 0 10px; } .gcs__header__subtitle { display: none; } .gcs__header__subtitle.active { display: block; } .gcs__form { margin-left: 100px; width: 300px; position: relative; } @media screen and (min-width: 1000px) { .gcs__form { float: right; } } .search-results form label { display: none; } .gcs__input { -webkit-appearance: none; display: block; width: 100%; padding: 10px 52px 10px 10px; border: none; font-size: 18px; background-color: #FFF; border: 1px solid #999999; border-radius: 3px; outline: none; } .gcs__input[type="search"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; } .gcs__input:focus { border-color: #4D90BD; } .gcs__button { position: absolute; top: 1px; right: 1px; display: inline-block; background-color: #FFF; border: none; width: 41px; height: 41px; border-left: none; margin: 0; padding: 10px; border-radius: 3px; outline: none; } .gcs__button:focus { border-color: #4D90BD; } .gcs__filters__header, .gcs__sort__header { float: left; margin-right: 20px; padding: 10px 0; color: #525252; font-size: 20px; } .gcs__filters__item { display: block; float: left; position: relative; margin: 0 5px; padding: 0.5em 1em; border-radius: 4px; background: #4D90BD; color: #FFF; font-weight: bold; text-transform: uppercase; } .gcs__filters__item:hover, .gcs__filters__item:active, .gcs__filters__item:focus { background: #001D46; color: #FFF; cursor: pointer; text-decoration: none; } .gcs__filters__item--active { background: #001D46; color: #FFF; } .gcs__filters__item--active:after { position: absolute; bottom: -8px; left: 50%; display: block; width: 0; margin: 0 0 0 -10px; z-index: 1; content: ''; border-style: solid; border-width: 8px 12px 0; border-color: #001D46 transparent; } .gcs__filters__item--active:hover, .gcs__filters__item--active:active, .gcs__filters__item--active:focus { background: #001D46; cursor: default; } .gcs__sort { margin: 0 0 20px; } @media screen and (min-width: 1060px) { .gcs__sort { float: right; margin: 0; } } .gcs__highlight { font-weight: bold; color: #001D46; } .search-results-listing-inner, .search-results-empty { display: none; } .search-results-listing-inner.active, .search-results-empty.active { display: block; } .search-results-listing { background-color: #cccccc; padding: 20px; } .search-results-listing .wrapper { margin: 0 auto; } @media screen and (max-width: 1310px) { .search-results-listing { padding: 20px 0; } } .search-results-flex { clear: both; margin: 40px 0 0; } .search-results-empty { padding: 28px 0 20px; color: #525252; position: relative; } .search-results-empty h4 { color: #525252; } .gcs__results__meta { *zoom: 1; } .gcs__results__meta:before, .gcs__results__meta:after { content: " "; display: table; } .gcs__results__meta:after { clear: both; } .gcs__results__item { position: relative; display: none; float: left; width: 47.5%; margin: 0 5% 5% 0; background: #FFF; } .gcs__results__item:nth-of-type(2n) { margin: 0 0 5%; } @media screen and (min-width: 920px) { .gcs__results__item { width: 30.8333%; } .gcs__results__item, .gcs__results__item:nth-of-type(2n) { margin: 0 3.75% 3% 0; } .gcs__results__item:nth-of-type(3n) { margin: 0 0 3%; } } @media screen and (min-width: 1100px) { .gcs__results__item { width: 22.5%; } .gcs__results__item, .gcs__results__item:nth-of-type(2n), .gcs__results__item:nth-of-type(3n) { margin: 0 3.333% 3% 0; } .gcs__results__item:nth-of-type(4n) { margin: 0 0 3%; } } .search-results-flex .gcs__results__item { display: block; } .gcs__results__item__figure { position: relative; min-height: 0; max-height: none; max-width: none; padding: 0 0 56.25%; } .gcs__results__item__figure__item { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: transparent; background-size: cover; background-repeat: no-repeat; } .gcs__results__item__figure__item--fallback { background-image: url(../../global/images/logo-background.jpg); } .gcs__results__item__text { padding: 20px 20px 35px; } .gcs__results__item__type { margin: 0 0 1em; color: #8A898E; text-transform: uppercase; } .gcs__results__item__title { line-height: 1.2; margin-bottom: 0.727272727em; } .gcs__results__item__title, .gcs__results__item__title a { color: #4D90BD; } .gcs__results__item__title a:hover, .gcs__results__item__title a:active, .gcs__results__item__title a:focus { color: #202C55; text-decoration: none; } .gcs__results__item__summary { color: #8A898E; } .gcs__results__item__title b, .gcs__results__item__title a b, .gcs__results__item__summary b, .gcs__results__item__summary a b { font-weight: bold; color: #001D46; } .gcs__results__item__cta { position: absolute; bottom: 20px; left: 20px; margin-bottom: 0; font-size: 1.125em; line-height: 1.11111111; font-weight: bold; } .gcs__results__item__cta, .gcs__results__item__cta a { color: #4D90BD; } .gcs__results__item__cta a:hover, .gcs__results__item__cta a:active, .gcs__results__item__cta a:focus { color: #202C55; text-decoration: none; } .gcs__results__item__cta i { vertical-align: middle; } /* ============================================================================================== */ /* ERROR PAGES */ .wrapper_error { position: relative; max-width: none; } .wrapper_error .splash { width: 100%; z-index: 1; } .wrapper_error .splash img { width: 100%; height: auto; } .wrapper_error header { position: absolute; left: 0; top: 20%; z-index: 2; } .wrapper_error h1 { padding: 20px 0; color: #FFF; font-size: 64px; text-transform: none; } .wrapper_error h1 span { float: left; clear: both; padding: 0 0.25em 0 20px; background: #3D90C0; } .wrapper_error h1 span:first-of-type { padding: 0.25em 0.25em 0 20px; } .wrapper_error h1 span:last-of-type { padding: 0 0.25em 0.25em 20px; } .wrapper_error h2 { clear: both; padding: 40px 20px 20px; text-transform: uppercase; } .wrapper_error h2 a { color: #FFF; } /* ============================================================================================== */ /* OVERLAYS */ .overlay--image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* ============================================================================================== */ /* MEDIA QUERIES */ @media screen and (min-width : 1300px) { .wrapper_item > section {width: 1300px; left: 50%; margin: 0 0 0 -650px;} } @media screen and (max-width : 1510px) { .itemintronoimg {margin-left: 120px;} #gallery > header {margin-left: 80px;} } @media screen and (max-width : 1450px) { .gallerypage #column1 {padding: 0 20px;} .hp-feed, .hp-extra-feed, .wrapper_2col, .wrapper_white {padding: 20px;} .wrapper_rider section, .wrapper_1col, .languagebar > div {margin-left: 20px; margin-right: 20px;} .wrapper_tickets {padding-left: 20px; padding-right: 20px;} #hp_feature > article h1 {font-size: 48px;} #hp_feature > article p {font-size: 22px; } #tourstops ul li {margin: 0 14px 0 0; padding: 0 0 4px 40px;} /*[role="navigation"] { padding-left: 25px;} .fr [role="navigation"] {left: 175px;}*/ [role="navigation"] > ul > li { padding: 5px 15px; margin: 0 0 0 5px;} .fr [role="navigation"] > ul > li {padding: 5px 10px;} /*[role="navigation"] > ul > li.utility { margin: 0 0 0 80px;}*/ } @media screen and (max-width : 1370px) { [role="navigation"] > ul > li {margin: 0 0 0 5px;} [role="navigation"] > ul > li.utility {margin: 0;} #hp_feature > article > div {margin: 0 0 0 2%; bottom: 0px;} #tour-calendar .calendar .cal_options a {margin: 0 10px;} .wrapper_item > section {width: 100%; left: 20px; margin: 0;} .wrapper_1cola {margin-left: 20px; margin-right: 20px;} #hp_feature { padding-bottom: 40%; } } /*@media screen and (max-width : 1340px) { .itemintronoimg {margin-left: 120px; margin-right: 20px;} }*/ @media screen and (max-width : 1300px) { .itemintronoimg {margin: 70px 20px 0 120px;} #latest-standings header h2 {font-size: 18px;} .footer-main-nav, .footer-meta-nav {padding: 0 20px;} } @media screen and (max-width : 1270px) { [role="navigation"] > ul > li {margin: 0;} #hp_feature > article p {font-size: 18px; } .whoisin_full img {margin-right: 5px;} a.logo, .homepage a.logo {top: 20px; width: 104px; height: 200px; background-size: 100% auto;} #hp_feature > ul {padding: 180px 0 0 0;} #sponsors, .homepage #sponsors {background: url('../images/bg-sponsors.png') no-repeat bottom right; width: 340px; } #sponsors a, .homepage #sponsors a {top: 20px; left: 133px;} .homepage #sponsors div { left: 133px; } #latest-standings header h2 {font-size: 20px} } @media screen and (max-width : 1200px) { .whoisin_full li a {padding: 5px 5px; font-size: 15px;} .athlete_nav {width: 620px;} .athlete_nav_column li {font-size: 13px;} [role="navigation"] > ul > li.language, [role="navigation"] > ul > li.location, [role="navigation"] > ul > li.profile, [role="navigation"] > ul > li.search {padding: 5px; margin: 0; } #thebuzz > section article > section {width: 77%; margin-left: 20%;} #tourstops ul li {margin: 0 12px 0 0; padding: 0 0 4px 28px;} #tour-calendar .calendar .cal_options a {margin: 0 10px;} /*[role="navigation"] { left: 225px; padding-left: 15px;}*/ [role="navigation"] { font-size: 14px; left: 105px;} .countdown-info p {font-size: 18px;} .fr .countdown-info p {font-size: 16px;} .rbtvdemandBlock > div {padding: 130px 0 20px 0;} /* TOUR STOP */ #event-countdown .calendar span {left: 0px; padding: 0; width: auto; margin: 0; top: 0px;} #event-countdown .calendar {width: 90%; margin: 0 auto;} #event-countdown .calendar > div {width: 100%;} #event-countdown .calendar a {display: block; margin: 0 14px;} } @media screen and (max-width : 1150px) { .whoisin_full li a {padding: 5px 10px; font-size: 14px;} #hp_feature > article h1 {font-size: 38px;} #hp_feature > article p {max-width: 540px; font-size: 16px;} #hp_feature > ul {padding: 148px 0 0 0;} #thebuzz header h2 {font-size: 18px; padding-top: 20px;} .newsfeed article header h3 {padding-bottom: 10px;} .newsfeed article header h2 {font-size: 18px;} .newsfeed article.active .extra {padding: 10px 0 20px 0;} .newsfeed article.active .extra a {padding: 10px; font-size: 16px;} .wrapper_tickets article.article3 {height: 420px;} #tourstops ul li {margin: 0 14px 0 0; padding: 0 0 4px 40px;} #tour-calendar .calendar .cal_options a {margin: 0 7px;} #tour-calendar .calendar span {font-size: 12px; width: 55px; position: relative; top: 2px; } #tour-calendar .calendar .view_event a {font-size: 13px; width: 90%; padding-top: 8px; position: relative; top: 3px;} [role="navigation"] { font-size: 14px;} .fr [role="navigation"] {left: 115px; font-size: 13px;} [role="navigation"] > ul > li {padding: 5px 10px;} [role="navigation"] > ul > li a.language {margin-right: 0px;} #latest-standings header h2 {font-size: 20px} .countdown-info p {margin: 15px 0; font-size: 14px;} .shareto span {display: none;} .shareto a {position: relative; padding-left: 33px; font-size: 12px; margin-left: 3%; color: #fff;} .fr .shareto a {font-size: 12px;} .shareto a span {width:27px; height:27px; display: block; position: absolute; top: -8px; left: 0;} #thebuzz header h2 {font-size: 18px; padding-left: 10px;} #tourstops ul li {margin: 0; padding: 0 0 4px 26px;} } @media screen and (max-width: 1080px) { .athleteinfo dt {float: none; width: 100%; padding: 5px 0 0;} } @media screen and (max-width : 1110px) { .whoisin_full img {width: 40px; height: 40px;} .whoisin_full li a {padding: 5px; font-size: 13px;} .socialWrapper {padding: 0;} .newsfeed {float: left; width: 69%;} .social {width: 30%; float: right;} .newsfeed .narrow, .newsfeed .wide {width: 49%;} .global-nav {display:none;} /* ================================================================================================================================================ */ /* BURGER > IPAD CONTROLS */ .burgernav { width: 300px; float: right; position: relative; top: 10px; color: #fff; padding: 12px 0; margin-right: 20px; font-family: "ClanWebNarrowBlack", sans-serif; display: block; } .burgernav > div { float: right; } .burgernav > div > a { color: #fff; padding: 2px 40px 0 0; display: block; margin-right: 10px; text-decoration: none; line-height: 18px; } .burgernav > div > a:hover, .burgernav > div > a:active, .burgernav > div > a:focus { text-decoration: none; } .burgernav > div > a:before { text-decoration: none; display: block; position: absolute; right: 10px; top: 12px; background: url('../images/sprite.png') no-repeat -942px -4062px; display: inline-block; height: 30px; width: 30px; content: ""; } .megadropdown {position: static; color: #a0a0a0; background: #0c162f;} [role="navigation"] { -moz-box-shadow: 0px 5px 8px #000000; -webkit-box-shadow: 0px 5px 8px #000000; box-shadow: 0px 5px 8px #000000; display:none; width: 300px; background: #0c162f; text-transform: uppercase; font-size: 14px; position: absolute; top: 70px; left: auto; right: 20px; z-index: 11; padding: 0;} [role="navigation"] > ul {margin: 0; padding: 0; list-style: none;} [role="navigation"] > ul > li, [role="navigation"] > ul > li.utility, [role="navigation"] > ul > li.profile {float: none; padding: 12px 15px; margin: 0; position: relative; border-top: 1px solid #fff; font-size: 16px;} [role="navigation"] > ul > li.search a {text-indent: 0;} [role="navigation"] > ul > li.drop a span, [role="navigation"] > ul > li a.loctitle span {float: right; display: block; margin: 7px 1px 0 8px; background: url('../images/sprite.png') no-repeat; background-position: -945px -4215px; width: 16px; height: 27px; position: relative; top: -7px;} [role="navigation"] > ul > li.profile > a {text-indent: 0; width: auto; margin: 0 10px 0 0; padding: 0 0 0 24px;} [role="navigation"] > ul > li.events a span, [role="navigation"] > ul > li.athletes a span {background: none;} [role="navigation"] > ul > li.drop a:hover span, [role="navigation"] > ul > li a.loctitle:hover span {background-position: -974px -4215px;} [role="navigation"] > ul > li > a {letter-spacing: 1px; display: block; color: #fff; background: url('../images/sprite.png') no-repeat -692px -4162px;} [role="navigation"] > ul > li.drop > a, [role="navigation"] > ul > li a.loctitle {background: none;} [role="navigation"] > ul > li.events > a, [role="navigation"] > ul > li.athletes > a {background: url('../images/sprite.png') no-repeat -692px -4162px;} [role="navigation"] > ul > li.dotcom > a {color: #aa1b49;} .search_nav, .more_nav, .dotcom_nav {margin: 0; padding: 5px 0 0 0;background: none; width: 100%; box-shadow: none} .more_nav ul, .dotcom_nav ul {margin: 0; padding: 0;background: none;} .more_nav ul li, .dotcom_nav ul li {margin: 0; padding: 0;background: none;border-top: 1px solid #333;} .more_nav ul li a, .dotcom_nav ul li a {font-size: 15px; margin: 0; padding: 5px 0; background: none;} .more_nav ul li a:hover, .dotcom_nav ul li a:hover {background: none;} .control_nav, .dotcom_nav {width: 100%; padding: 20px 0 0 0;} .control_nav ul, .dotcom_nav ul {border-bottom: none;} .control_nav li a, .dotcom_nav li a {font-size: 14px;display: block; padding: 5px 0; color: #a0a0a0; } .control_nav li a:hover, .dotcom_nav li a:hover {color: #fff; } .control_nav li a img {margin-right: 10px;} .language_col, .location_col {float: none; width: 270px; padding: 0 10px 0 0; border-left: none; margin-bottom: 10px;} .language_col h2, .location_col h2 {font-size: 14px; width: 160px; padding: 0 0 5px 0; background: none;} .utility a.language, .utility a.location {display:none;} .search_nav input[type="text"] { width: 100%; } /*TM RBP-95 styles from RBAR*/ [role="navigation"] > ul > li.search, [role="navigation"] > ul > li.utility { float: none; padding: 12px 15px; margin: 0; position: relative; border-top: 1px solid #fff; font-size: 16px; } .dotcom_nav.megadropdown { padding: 0; margin: 5px -15px 0; width: auto; } .dotcom_nav ul li { margin: 0 15px; } /*END TM RBP-95 styles from RBAR*/ .profile-logout { top: 35px; } /* ================================================================================================================================================ */ #hp_feature {width: 100%; padding-bottom: 50%; } .wrapper_item {padding-bottom: 46%;} #hp_feature > article > div {margin: 0 0 0 2%; bottom: 0px;} #hp_feature > article h1 {font-size: 28px; line-height: 1.4em;} #thebuzz header h2 {display: none;} #thebuzz header ul {right: 10px;} #thebuzz > section {padding: 10px;} #thebuzz > section.active {display: block;} #thebuzz > section article > div.avatar {min-width: 20px; width: 20%; } #thebuzz > section article > div.avatar img {width: 90%;} #thebuzz > section article > section p {font-size: 12px; padding: 10px 5px 10px 10px;} #tour-calendar h2 {font-size: 21px;} .fr #tour-calendar h2, .it #tour-calendar h2 {font-size: 18px; padding-bottom: 20px;} #tour-calendar .datetime {font-size: 12px; } #tour-calendar .datetime span {font-size: 28px;} #tour-calendar .title {font-size: 13px;} #tour-calendar .title span {font-size: 16px;} #tour-calendar .title div {padding: 20px 0 0 10px;} #tour-calendar .calendar .cal_options span {float: none; width: 100%; position: relative; left: 10px; top: -14px; display: none;} #tour-calendar .calendar .cal_options a {margin: 0 12px;} #photostories h2 { font-size: 18px;} #photostories .photostories-slider a {font-size: 13px;} /* TOUR STOP */ .countdown-shell div {width: 32%; padding: 15px 0 10px 0; font-size: 11px;} .countdown-shell div span {font-size: 28px; } .countdown-info { margin: 0 0 5px 0; } #event-countdown .calendar span {left: 0px; top: -5px; width: 30%; padding: 0; margin: 0; } #event-countdown .calendar { clear: both;} #event-countdown .calendar a {display: block; margin: 0 8%;} .countdown-info p {margin: 15px 0; font-size: 14px;} .shareto {padding-top: 20px;} .shareto span {display: none;} .shareto a {position: relative; padding-left: 30px; font-size: 12px; margin-left: 3%; color: #fff;} .shareto a span {width:27px; height:27px; display: block; position: absolute; top: -8px; left: 0;} /* RIDER */ .athleteslist ul li a h3 {font-size: 16px; width: 70%; min-height: 23px;} .riderstats {padding: 0 10px; width: 250px;} .riderstats h2 {padding-top: 10px;} .riderstats nav {margin: 5px 0 0 0; padding: 10px 0;} .riderstats nav ul li { margin: 0 3px 0 0; font-size: 12px;} .riderstats nav ul li a {padding: 5px;} .riderstats > section footer {font-size: 12px; } .riderstats > section footer a, .riderstats > section footer span {font-size: 12px; margin: 0 2px;} .itemintro {position: absolute; bottom: 30px; left: 0;} .itemintro h1 {font-size: 28px; margin: 0 0 20px 0;} .itemintro h1 > span {padding: 12px 270px 8px 12px; } .itemintro blockquote {font-size: 18px; width: 450px;} .itemintro div.share {font-size: 18px; top: 2px;} .itemintro div.share span {float: left; position: relative; top: 5px;} #tweet-strip header h2.ts-h2 {font-size: 18px;} #tweet-strip #ts-chars { top: -33px; right: -150px;} .table {float: left; width: 99%; margin: 1%; background: #fff; } /* article */ .whoisin h2 { font-size: 18px; } .whoisin li a {padding: 5px;} .whoisin a {font-size: 15px} .whoisin img {height: 40px; border-radius: 40px; margin-right: 0px;} article.article h1 { font-size: 34px;} .socialWidget {padding: 0 0 20px 0;} .socialWidget .socialWrapper {margin-top: 20px;} .socialWidget > div {width: 100%; padding: 0 0 1% 0;} .socialWidget h2 {font-size: 18px; padding: 10px 0;} .socialWidget #share-channel {border: none; margin-top: 5%; padding: 0} .socialWidget #share-channel a {margin: 0 2%;} .socialWidget #share-channel a img {width: 40px !important; height: auto !important;} } @media screen and (max-width : 960px) { #latest-standings header h2 {padding: 17px 0 17px 40px; font-size: 16px;} .rider_points {padding: 16px 0 0;} .rider_points span {font-size: 20px;} } @media screen and (max-width : 915px) { #facebook-channel { display: none; } } @media screen and (max-width : 890px) { #tour-calendar h2 {font-size: 18px;} .fr #tour-calendar h2, .it #tour-calendar h2 {font-size: 16px} #tour-calendar .calendar .view_event a.btn_orange {padding: 5px 0; position: relative; top: -3px;} #tour-calendar .calendar .cal_options a {margin: 0 15px;} .tabs .article section {float: none; width: 100%; margin-right: 1%; } .tabs .article aside {float: none; width: 100%; padding-left: 0; border-left: none; } .tabs .article aside.maparea h2 { margin: 20px 0; } } .show-more-wrapper{border-top: 1px solid #4D90BD; width: 100%; text-align: center;margin: 30px 0 40px;} #more{ display: block; margin: 0 auto; width: 225px; position: relative; padding: 5px 0; background: #4D90BD; font-size: 20px; font-family: 'PT Sans', sans-serif; font-weight: 700; text-decoration: none; color: #fff; text-align: center; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; z-index: 100; } #more:hover{color: #4D90BD; background: #FFF;} #more .spinner{background: #fff url("../images/progress2.gif") 50% no-repeat;padding: 20px 30px; width: 32px; height: 32px; left: 50%;top: 50%;position: fixed;margin-top: -28px;margin-left: -38px; box-shadow: 0px 0px 10px #222; border-radius: 10px; opacity: 0.9; } /*---------------------Items List----------------------------------------------------------------*/ .items_list_container .items_list_more { display: none; } .pollRemoved { border: 1px solid black; padding: 10px; } .itunes-container { width: 220px; /*position: absolute;*/ top: 30px; left: 50%; margin-right: 30px; float: right; } .itunes-footer-promotion h3 { font-family: "Kremlin",sans-serif; font-size: 20px; font-weight: normal; margin-top: 5px; } .itunes-footer-promotion a { background-image: none; box-shadow: none; } .itunes-footer-promotion .icon-box { padding-left: 10px; height: 41px; width: 85px; float: left; } .itunes-footer-promotion__title { display: block; float: left; } @media only screen and (max-width: 930px) { .itunes-container { clear:right; margin-right: 0; } } @media only screen and (max-width: 768px) { .itunes-container { clear:both; position: static!important; display: block; float: none; margin-left: 0; } } .eventpage .lead_section .video-outer, .eventpage #content_section .video-wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; margin-bottom:20px; } .eventpage .lead_section .video-outer iframe, .eventpage .lead_section .video-outer object, .eventpage .lead_section .video-outer embed, .eventpage #content_section .video-wrapper iframe, .eventpage #content_section .video-wrapper object, .eventpage #content_section .video-wrapper embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .eventcomplete .eventpage .main_column { width: 100%; float: none; } .eventcomplete .tabs .active article .article-inner { margin-left:-10px; margin-right:-10px; } .eventcomplete .tabs .active article .article-inner .full { width:100%; padding-left: 10px; padding-right:10px; box-sizing:border-box; position: relative; min-height: 1px; float:left; } .eventcomplete .tabs .active article .article-inner .one-third { width:40%; padding-left: 10px; padding-right:10px; box-sizing:border-box; position: relative; min-height: 1px; float:left; } .eventcomplete .tabs .active article .article-inner .two-thirds { width:60%; padding-left: 10px; padding-right:10px; box-sizing:border-box; position: relative; min-height: 1px; float:left; } .eventcomplete .tabs .active article .video-wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; margin-bottom:20px; overflow:hidden; } .eventcomplete .tabs .active article .video-wrapper iframe, .eventcomplete .tabs .active article .video-wrapper object, .eventcomplete .tabs .active article .video-wrapper embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .eventcomplete .tabs .active article .live-stream { box-sizing:border-box; position: relative; padding-bottom: 247%; padding-top: 25px; height: 0; margin-bottom:20px; overflow-y: hidden; -ms-overflow-style: none; } .eventcomplete .tabs .active article .live-stream iframe.responsive, .eventcomplete .tabs .active article .live-stream object.responsive, .eventcomplete .tabs .active article .live-stream embed.responsive { position: absolute; top:0px; left:0px; bottom:0px; right:0px; width: 100%; height: 100%; border:none; overflow:hidden; } .touchevents.eventcomplete .tabs .active article .live-stream { overflow: auto; -webkit-overflow-scrolling: touch; } .eventcomplete .tabs .active article .live-social { box-sizing:border-box; position: relative; padding-bottom: 97%; /* 16:9 */ padding-top: 25px; height: 0; max-height:600px; margin-bottom:20px; overflow-y: hidden; -ms-overflow-style: none; } .eventcomplete .tabs .active article .live-social iframe, .eventcomplete .tabs .active article .live-social object, .eventcomplete .tabs .active article .live-social embed { position: absolute; top:0px; left:0px; bottom:0px; right:0px; width: 100%; height: 100%; border:none; overflow:hidden; } .touchevents.eventcomplete .tabs .active article .live-social { overflow: auto; -webkit-overflow-scrolling: touch; } .eventcooldown .video-overlay, .eventwarmup .video-overlay, .event .video-overlay { display:block; position:absolute; width:100%; height:100%; background:rgba(0,0,0,.8); z-index: 8; top:0px; left:0px; } .eventcooldown .lead-image__webcast-wrapper, .eventwarmup .lead-image__webcast-wrapper, .event .lead-image__webcast-wrapper { position:relative; z-index: 10; top:50px; left:0px; right:0px; bottom:0px; padding:0px 20px 0px 20px; } .eventcooldown .lead-image__webcast-live, .eventwarmup .lead-image__webcast-live, .event .lead-image__webcast-live { margin: 40px auto; max-width:897px; position:relative; } .eventcooldown .lead-image__webcast-live h2, .eventwarmup .lead-image__webcast-live h2, .event .lead-image__webcast-live h2 { color: #fff; margin-bottom:20px; } .eventcooldown .lead-image__webcast-live #btn-results, .eventwarmup .lead-image__webcast-live #btn-results, .event .lead-image__webcast-live #btn-results { position:absolute; right:0px; top:0px; } .eventcooldown .lead-image__webcast-live__video, .eventwarmup .lead-image__webcast-live__video, .event .lead-image__webcast-live__video { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; margin-bottom:20px; } .eventcooldown .lead-image__webcast-live__video iframe, .eventwarmup .lead-image__webcast-live__video iframe, .event .lead-image__webcast-live__video iframe, .eventcooldown .lead-image__webcast-live__video object, .eventwarmup .lead-image__webcast-live__video object, .event .lead-image__webcast-live__video object, .eventcooldown .lead-image__webcast-live__video embed, .eventwarmup .lead-image__webcast-live__video embed, .event .lead-image__webcast-live__video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* remove some stuff from the lead image */ .eventcooldown #hp_feature, .eventwarmup #hp_feature, .event #hp_feature { padding-bottom:30px; } .eventcooldown .countdown-toggle, .eventwarmup .countdown-toggle, .event .countdown-toggle, .eventcooldown #hp_feature > ul, .eventwarmup #hp_feature > ul, .event #hp_feature > ul, .eventcooldown #hp_feature > article > div, .eventwarmup #hp_feature > article > div, .event #hp_feature > article > div { display:none; } .eventcomplete .video-overlay { display:none; position:absolute; width:100%; height:100%; background:rgba(0,0,0,.8); z-index: 8; } .eventcomplete .video-close { position:absolute; right:30px; top:30px; height:30px; width:30px; z-index: 9; cursor:pointer; color: transparent; border: 0px none; background-color: transparent; text-shadow: none; font: 0px/0 a; background: url('../images/sprite.png') transparent no-repeat -938px -4110px; display:none; } .eventcomplete .video-close:hover { background-position: -967px -4110px; } .eventcomplete .video-outer { display:none; position:relative; margin: 40px auto; max-width:897px; padding:20px; z-index: 9; } .eventcomplete .video-outer .video-wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; margin-bottom:20px; } .eventcomplete .video-outer .video-wrapper iframe, .eventcomplete .video-outer .video-wrapper object, .eventcomplete .video-outer .video-wrapper embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .eventcomplete #playhighlight { position:absolute; display:block; left:50%; top:40%; z-index: 8; border:none; border-radius: 3px; background: #fff; text-transform: uppercase; padding:5px 15px; margin-left: -106px; line-height: 30px; } .eventcomplete #playhighlight.post-event { top:270px; } .eventcomplete #playhighlight:hover { background-color: #e0e0e0; } .eventcomplete #playhighlight:before { content: ''; display: inline-block; height: 20px; width: 20px; background: url('../images/sprite.png') transparent no-repeat 0px -1905px; margin-top: 5px; margin-left: 0px; vertical-align: top; } .eventcomplete .highlight-open .wrapper_item { padding-bottom:0px; }