@import url("//fonts.googleapis.com/css?family=Fjalla+One|Permanent+Marker|Roboto:300,300i,400,400i,700&display=swap"); /*Variables*/ /*Colors*/ /*Social Media Brand Colors*/ /*Fonts*/ /*Mixins*/ /*Utility Classes*/ .reset-list { list-style: none; margin: 0; padding: 0; } .accessible-hide { position: absolute; left: -99999px; top: -99999px; display: block !important; } .h-white { color: white; } .h-gold { color: #ffc425; } /*Style*/ a.sidearm-skip-link { position: absolute; left: -99999px; top: 0; background-color: #00467f; color: #ffc425; } a.sidearm-skip-link:link, a.sidearm-skip-link:visited { color: #ffc425; } a.sidearm-skip-link:focus { position: fixed; left: 0; z-index: 9999999; } body { font: 16px/1.875 'Roboto', sans-serif; color: black; margin: 0; padding: 0; background: url('../images/responsive/bg.jpg') no-repeat top center #00467f; } .showcase-play-button { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); overflow: visible; outline: 0; padding: 0; font-size: 0; border: 0; background-color: transparent; background-image: url("../images/play-full.png"); background-size: contain; height: 70px; width: 70px; z-index: 100; } html:after { position: fixed; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; content: ''; background: url('../images/responsive/bg.jpg') no-repeat top center #00467f; } html body { padding-top: 65px; } @media all and (min-width: 768px) { html body { padding-top: 81px; } } html.wide:not(.custom) .main-content-placeholder { max-width: 1152px; padding: 24px; margin: 0 auto; background-color: white; } .row { width: 100%; max-width: 1152px; margin: 0 auto; } figure { display: table; } figcaption { display: table-caption; caption-side: bottom; text-align: center; background-color: #c5c5c5; font-size: 14px; line-height: 20px; padding: 8px; margin-top: -1px; } /**** SLICK UI ****/ button.showcase-play-button, .showcase-play-button { -webkit-appearance: none; border: none; background: none; margin: 0; padding: 0; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; border: none; outline: none; background: none; margin: 0; padding: 0; border-radius: 0px; } button.showcase-play-button::-ms-expand, .showcase-play-button::-ms-expand { display: none; } button.showcase-play-button, .showcase-play-button { position: absolute; top: 50%; left: 50%; font-size: 0; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; width: 82px; height: 80px; z-index: 100; background-size: contain; background-image: url("../images/responsive/playbutton.png"); color: transparent; overflow: hidden; opacity: 1; } @media all and (min-width: 768px) { button.showcase-play-button, .showcase-play-button { opacity: 0.7; } } button.showcase-play-button:hover, .showcase-play-button:hover { opacity: 1; } .slick-slider { position: relative; } .slick-slider button { -webkit-appearance: none; border: none; background: none; margin: 0; padding: 0; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; border: none; outline: none; background: none; margin: 0; padding: 0; border-radius: 0px; } .slick-slider button::-ms-expand { display: none; } .slick-slider button.showcase-play-button, .slick-slider .showcase-play-button { position: absolute; top: 50%; left: 50%; font-size: 0; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; width: 82px; height: 80px; z-index: 100; background-size: contain; background-image: url("../images/responsive/playbutton.png"); color: transparent; overflow: hidden; opacity: 0.7; } .slick-slider button.showcase-play-button:hover, .slick-slider .showcase-play-button:hover { opacity: 1; } .slick-slider .slick-prev, .slick-slider .slick-next { position: absolute; top: 50%; left: 12px; width: 60px; height: 60px; font-size: 0; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); overflow: hidden; } @media all and (min-width: 768px) { .slick-slider .slick-prev, .slick-slider .slick-next { left: 48px; } } @media all and (min-width: 1024px) { .slick-slider .slick-prev, .slick-slider .slick-next { left: 96px; } } .slick-slider .slick-prev:after, .slick-slider .slick-next:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: '\e833'; opacity: 1; color: white; background: #ffc425; font-family: sidearm_font; font-size: 36px; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; justify-content: center; -webkit-justify-content: center; } .slick-slider .slick-prev:hover:after, .slick-slider .slick-next:hover:after { background: #00467f; color: white; } .slick-slider .slick-next { right: 12px; left: auto; top: 50%; } @media all and (min-width: 768px) { .slick-slider .slick-next { right: 48px; } } @media all and (min-width: 1024px) { .slick-slider .slick-next { right: 96px; } } .slick-slider .slick-next:after { content: '\e832'; opacity: 1; } .slick-slider .slick-disabled { opacity: 0; } .slick-slider .slick-dots { text-align: center; margin: 0; padding: 6px 0; } .slick-slider .slick-dots li { display: inline; } .slick-slider .slick-dots button { width: 16px; height: 16px; margin: 0 8px; background: rgba(255, 255, 255, 0); color: transparent; border-radius: 50%; border: solid 3px white; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .slick-slider .slick-dots button:hover { background: white; } .slick-slider .slick-dots .slick-active button { background: white; } /**** HEADER ****/ .main-header { position: fixed; top: 0; left: 0; width: 100%; height: 65px; background: #00467f; border-bottom: solid 5px #4380c2; z-index: 700; -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); } @media all and (min-width: 768px) { .main-header { height: 81px; } } .main-header__row { width: 100%; max-width: 1152px; margin: 0 auto; position: relative; justify-content: space-between; -webkit-justify-content: space-between; } @media all and (min-width: 1128px) { .main-header__row { justify-content: center; -webkit-justify-content: center; } } .main-header__logos { position: absolute; top: 0; left: 50%; transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); z-index: 799; width: 55px; } @media all and (min-width: 768px) { .main-header__logos { width: auto; max-width: 152px; } } .main-header__logos.small .main-header__logo--big { display: none; } .main-header__logos.small .main-header__logo--small { display: block; } .main-header__logo { display: block; } .main-header__logo--big { padding-top: 10px; display: none; } @media all and (min-width: 768px) { .main-header__logo--big { display: block; } } .main-header__logo--small { padding-top: 5px; display: block; } @media all and (min-width: 768px) { .main-header__logo--small { display: none; padding-top: 9px; } } .main-header__search { position: absolute; bottom: 0; right: 12px; } @media all and (min-width: 1152px) { .main-header__search { right: 0; } } .main-header__search .b-search__container { display: none; } .main-header__search.opened { z-index: 900; } @media all and (min-width: 768px) { .main-header__search.opened { z-index: 500; } } .main-header__search.opened .main-header__search-button i:before { content: '\e83a'; } .main-header__search.opened .b-search__container { display: flex; display: -webkit-flex; } /*Headroom*/ .main-header.headroom--not-top .main-header__logo--big { display: none; } .main-header.headroom--not-top .main-header__logo--small { display: block; } /*Search*/ .b-search__container { position: absolute; top: 0; right: 0px; width: 310px; height: 70px; border: solid 5px #00467f; } .b-search__input-text { -webkit-appearance: none; border: none; background: none; margin: 0; padding: 0; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; border: none; outline: none; background: none; margin: 0; padding: 0; border-radius: 0px; height: 60px; width: 210px; background: white; padding: 0 12px; } .b-search__input-text::-ms-expand { display: none; } @media all and (min-width: 768px) { .b-search__input-text { width: 240px; } } .b-search__input-submit { -webkit-appearance: none; border: none; background: none; margin: 0; padding: 0; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; border: none; outline: none; background: none; margin: 0; padding: 0; border-radius: 0px; width: 60px; height: 60px; background: #ffc425; color: #00467f; font-family: 'Fjalla One', sans-serif; font-size: 22px; font-weight: 400; font-style: normal; text-transform: uppercase; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .b-search__input-submit::-ms-expand { display: none; } .b-search__input-submit:hover { background: #4380c2; color: white; } /**** NAVIGATION ****/ .c-navigation ul { list-style: none; margin: 0; padding: 0; } .c-navigation__url { color: inherit; display: block; text-decoration: none; } .c-navigation--main { z-index: 400; padding-right: 132px; } @media all and (min-width: 1336px) { .c-navigation--main { padding-right: 162px; } } .c-navigation--main .c-navigation__item--level-1:hover .c-navigation__url--level-1 { background: #4380c2; } .c-navigation--main .c-navigation__item--level-1:hover .c-navigation__url--level-1:after { background: #00467f; } .c-navigation--main .c-navigation__item--level-1:hover .c-navigation__level-2 { left: 0; opacity: 1; transition: opacity .25s; } .c-navigation--main .c-navigation__item--level-1:nth-child(4) { margin-left: 152px; } .c-navigation--main .c-navigation__item--level-1:nth-child(3) .c-navigation__url--level-1:after { background: #00467f; } .c-navigation--main .c-navigation__url--level-1 { line-height: 73px; font-family: 'Fjalla One', sans-serif; font-size: 20px; font-weight: 400; font-style: normal; color: white; text-decoration: none; text-transform: uppercase; cursor: default; padding: 3px 11px 0 12px; position: relative; } .c-navigation--main .c-navigation__url--level-1[href] { cursor: pointer; } .c-navigation--main .c-navigation__url--level-1:after { display: none; position: absolute; width: 1px; height: 30px; right: -1px; top: 25px; content: ''; background: black; } @media all and (min-width: 1128px) { .c-navigation--main .c-navigation__url--level-1:after { display: block; } } @media all and (min-width: 1336px) { .c-navigation--main .c-navigation__url--level-1 { padding: 3px 11px 0 12px; font-family: 'Fjalla One', sans-serif; font-size: 24px; font-weight: 400; font-style: normal; } } .c-navigation--main .c-navigation__level-2 { position: absolute; left: -99999px; top: 100%; opacity: 0; width: 100%; background-color: #4380c2; border-bottom: solid 5px #ffc425; overflow: auto; max-height: calc(100vh - 140px); } .c-navigation--main .c-navigation__level-2-inner { max-width: 906px; margin: 0 auto; padding: 33px 0 74px; } .c-navigation--main .c-navigation__column { padding: 0 20px; flex: 1 0 auto; -webkit-flex: 1 0 auto; min-width: 1px; min-height: 1px; } .c-navigation--main .c-navigation__item--level-2 { min-height: 51px; border-bottom: solid 1px #00467f; padding: 0 20px; } .c-navigation--main .c-navigation__item--level-2:hover { background: #2f6eae; } .c-navigation--main .c-navigation__item--level-2:hover .c-navigation__url--level-2 { color: #ffc425; } .c-navigation--main .c-navigation__separator { font-family: 'Fjalla One', sans-serif; font-size: 28px; font-weight: 400; font-style: normal; color: #ffc425; text-transform: uppercase; border-bottom: #4380c2; line-height: 1; min-height: auto; padding-bottom: 14px; padding-top: 13px; } .c-navigation--main .c-navigation__separator:hover { background: none; } .c-navigation--main .c-navigation__url--level-2 { font-family: 'Fjalla One', sans-serif; font-size: 24px; font-weight: 400; font-style: normal; line-height: 50px; color: white; display: inline-block; } .c-navigation--main .c-navigation__url--level-2:first-child { width: 100%; } .c-navigation--main .c-navigation__url--level-2:first-child:not(:last-child) { width: initial; margin-right: auto; } .c-navigation--main .c-navigation__schedule-roster-news { margin-left: 15px; font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: normal; line-height: 43px; padding-top: 7px; } .c-navigation--main .c-navigation__social { width: 30px; height: 100%; overflow: hidden; white-space: nowrap; } .c-navigation--main .c-navigation__social:before { font-family: sidearm_font; margin-right: 30px; } .c-navigation--main .c-navigation__social.facebook:before { content: '\e805'; } .c-navigation--main .c-navigation__social.twitter:before { content: '\e825'; } .c-navigation--main .c-navigation__social.instagram:before { content: '\e811'; } .c-navigation--main .c-navigation__social.tickets:before { content: '\e888'; } .c-nav-offcanvas { width: 100%; } .c-nav-offcanvas .c-nav__mobile-menu { color: white; font-family: 'Fjalla One', sans-serif; font-size: 20px; font-weight: 400; font-style: normal; text-transform: uppercase; line-height: 57px; padding: 3px 12px 0; background: none; cursor: pointer; position: relative; } @media all and (min-width: 768px) { .c-nav-offcanvas .c-nav__mobile-menu { line-height: 73px; padding: 3px 12px 0; } .c-nav-offcanvas .c-nav__mobile-menu i { display: inline-block; transform: translate(2px, -2px); -webkit-transform: translate(2px, -2px); transform: translate(2px, -2px); } } .c-nav-offcanvas .c-nav__mobile-menu:hover { background: #4380c2; } .c-nav-offcanvas .c-nav__mobile-menu:hover:after { background: #00467f; } .c-nav-offcanvas .c-nav__mobile-menu:after { display: none; position: absolute; width: 1px; height: 30px; right: -1px; top: 25px; content: ''; background: black; } @media all and (min-width: 1024px) { .c-nav-offcanvas .c-nav__mobile-menu:after { display: block; } } .c-nav-offcanvas .c-nav__off-canvas-menu-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); z-index: 9990; transform: translate(100%, 0); -webkit-transform: translate(100%, 0); transform: translate(100%, 0); opacity: 0; } .c-nav-offcanvas .c-nav__off-canvas-menu-overlay.open { transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; transition: opacity 0.35s; -webkit-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .c-nav-offcanvas ul { list-style: none; margin: 0; padding: 0; } .c-nav-offcanvas .c-nav__off-canvas-menu { transition: 0.2s; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; transform: translate(100%, 0); -webkit-transform: translate(100%, 0); transform: translate(100%, 0); position: fixed; right: 0; top: 0; z-index: 9999; width: 300px; height: calc(100vh); font-size: 16px; background-color: #00467f; padding-bottom: 70px; padding-top: 50px; } .c-nav-offcanvas .c-nav__off-canvas-menu .close-menu { cursor: pointer; position: absolute; top: 0; right: 0; line-height: 50px; color: white; font-family: 'Fjalla One', sans-serif; font-size: 18px; font-weight: 400; font-style: normal; width: 100%; text-align: right; border-bottom: solid 1px black; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__off-canvas-menu-level-1 { flex: 1; -webkit-flex: 1; min-width: 1px; min-height: 1px; display: block; list-style: none; margin: 0; padding: 0; overflow: auto; position: relative; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__item--level-1 { border-bottom: 1px solid black; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__url--level-1 { display: block; position: relative; font-family: 'Fjalla One', sans-serif; font-size: 20px; font-weight: 400; font-style: normal; text-transform: uppercase; color: white; padding: 10px 20px; text-decoration: none; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__url--level-1:after { content: '\e832'; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); position: absolute; right: 10px; top: 50%; color: white; font-family: sidearm_font; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__url--level-1:hover { background-color: #4380c2; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__url--level-1--back:before { content: '\e833'; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); position: absolute; left: 10px; top: 50%; font-family: sidearm_font; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__url--level-1--back:after { display: none; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__url--level-1--has-link:after { display: none; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__off-canvas-menu-level-2 { transition: 0.25s; -webkit-transition: 0.25s ease-in-out; transition: 0.25s ease-in-out; transform: translate(100%, 0); -webkit-transform: translate(100%, 0); transform: translate(100%, 0); position: fixed; top: 50px; right: 0; width: 300px; height: calc(100%); margin: 0; padding: 0; z-index: 99999; overflow-y: auto; list-style: none; background-color: #4380c2; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__off-canvas-menu-level-2.open { transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); padding: 0 0 126px 0; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__item--level-2.c-nav__separator { padding: 0 20px; font-family: 'Fjalla One', sans-serif; font-size: 20px; font-weight: 400; font-style: normal; color: #ffc425; text-transform: uppercase; } .c-nav-offcanvas .c-nav__off-canvas-menu .c-nav__url--level-2 { display: block; padding: 10px 20px; border-bottom: 1px solid #00467f; font-family: 'Fjalla One', sans-serif; font-size: 18px; font-weight: 400; font-style: normal; text-decoration: none; color: white; } .c-nav-offcanvas .c-nav__off-canvas-menu.open { transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); } .sport-navigation { background: white; border-bottom: solid 1px #eeeeee; } @media all and (min-width: 1024px) { .sport-navigation__row { padding: 0 12px; } } .c-nav-sport { background-color: white; width: 100%; } .c-nav-sport--truncated { width: auto; } .c-nav-sport ul { list-style: none; margin: 0; padding: 0; } .c-nav-sport .c-nav__sport-menu { position: relative; width: 100%; } .c-nav-sport .c-nav__sport-menu .c-nav__level-1 { align-items: flex-start; -webkit-align-items: flex-start; justify-content: flex-start; -webkit-justify-content: flex-start; margin: 0; padding: 0; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1 { transition: 0.2s; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; position: relative; line-height: 59px; padding: 0 3px; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1:after { content: '/'; display: inline-block; padding-left: 6px; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1:first-child:after, .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1:last-child:after { display: none; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1.sport-home { padding-left: 0; margin-left: 0; margin-right: auto; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1.sport-home a { color: #00467f; font-family: 'Fjalla One', sans-serif; font-size: 28px; font-weight: 400; font-style: normal; text-transform: uppercase; text-decoration: none; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1:hover:not(.sport-home) .c-nav__url--level-1 { color: #4380c2; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1:hover:not(.sport-home) .c-nav__level-2 { left: auto; right: 0; opacity: 1; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1.additional-links { padding-right: 0; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1.additional-links .c-nav__url--level-1 { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 700; font-style: normal; color: #00467f; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-1.additional-links i:before { margin: 0; } .c-nav-sport .c-nav__sport-menu .c-nav__url--level-1 { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: normal; color: #333333; text-decoration: none; } .c-nav-sport .c-nav__sport-menu .c-nav__level-2 { position: absolute; top: 100%; left: -9999px; z-index: 900; opacity: 0; width: 300px; max-height: 350px; overflow-y: auto; background: white; padding: 12px; margin: 0; text-align: left; border-bottom: 3px solid #00467f; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-2 { position: relative; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-2.c-nav__separator { text-transform: none; margin: 12px 0; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-2:hover { background-color: #2f6eae; } .c-nav-sport .c-nav__sport-menu .c-nav__item--level-2:hover .c-nav__url--level-2 { color: white; } .c-nav-sport .c-nav__sport-menu .c-nav__url--level-2 { display: block; font-size: 16px; color: #00467f; line-height: 36px; text-transform: none; padding: 0 12px; text-decoration: none; } .c-nav-sport .c-nav__sport-menu--mobile { width: 100%; height: 59px; position: relative; } .c-nav-sport .c-nav__sport-menu--mobile a { text-decoration: none; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav-sport--truncated .c-nav__url--level-1:after { content: '/'; display: inline-block; padding-left: 4px; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--top-level { display: flex; display: -webkit-flex; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--top-level li { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: normal; color: #333333; height: 59px; line-height: 59px; margin: 0 4px; text-decoration: none; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--top-level li a { color: black; text-decoration: none; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--top-level li.more { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 700; font-style: normal; color: #00467f; } .c-nav-sport .c-nav__sport-menu--mobile.open .c-nav__sport-menu--top-level li.more i:before { transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--sport-home { position: relative; margin-right: auto; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--sport-home a { font-family: 'Fjalla One', sans-serif; font-size: 28px; font-weight: 400; font-style: normal; color: #2f6eae; text-transform: uppercase; line-height: 59px; text-decoration: none; padding-left: 8px; } @media all and (min-width: 768px) { .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--sport-home a { padding-left: 12px; } } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu { transition: 0.3s; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; position: absolute; top: 100%; left: 0; z-index: 699; width: 100%; max-height: 0; margin: 0; padding: 0; overflow: hidden; -moz-transition-timing-function: cubic-bezier(0, 1, 0.5, 1); -webkit-transition-timing-function: cubic-bezier(0, 1, 0.5, 1); -o-transition-timing-function: cubic-bezier(0, 1, 0.5, 1); transition-timing-function: cubic-bezier(0, 1, 0.5, 1); } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu.opened { transition: 0.3s; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; -moz-transition-timing-function: ease-in; -webkit-transition-timing-function: ease-in; -o-transition-timing-function: ease-in; transition-timing-function: ease-in; max-height: calc(100vh - 190px); overflow: auto; display: inherit!important; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .icn { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; justify-content: center; -webkit-justify-content: center; position: absolute; top: 0; right: 0; width: 56px; height: 50px; font-size: 20px; color: white; background: #00467f; border-left: solid 1px #cccccc; border-bottom: solid 1px #cccccc; text-align: center; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .icn:before { display: block; color: white; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .icn.opened { display: flex !important; -webkit-display: flex !important; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__flyout-menu-level-1 { width: 100%; border-top: solid 1px #cccccc; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__item--level-1 { position: relative; color: black; background: white; border-bottom: solid 1px #cccccc; cursor: pointer; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__item--level-1:first-child, .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__item--level-1:nth-child(2) { display: list-item; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__item--level-1:last-child { border-bottom: none; } @media all and (min-width: 900px) { .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__item--level-1:first-child, .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__item--level-1:nth-child(2) { display: none; } } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__url--level-1 { display: inline-block; width: 100%; padding: 11px 12px 9px 15px; color: black; font-size: 16px; text-decoration: none; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__flyout-menu-level-2 { transition: 0.3s; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; list-style: none; margin: 0; padding: 0; max-height: 0; overflow: hidden; -moz-transition-timing-function: cubic-bezier(0, 1, 0.5, 1); -webkit-transition-timing-function: cubic-bezier(0, 1, 0.5, 1); -o-transition-timing-function: cubic-bezier(0, 1, 0.5, 1); transition-timing-function: cubic-bezier(0, 1, 0.5, 1); } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__flyout-menu-level-2.opened { transition: 0.3s; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; -moz-transition-timing-function: ease-in; -webkit-transition-timing-function: ease-in; -o-transition-timing-function: ease-in; transition-timing-function: ease-in; max-height: 1000px; overflow: hidden; display: inherit!important; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__item--level-2 { position: relative; background: whitesmoke; border-top: solid 1px #cccccc; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__url--level-2 { display: inline-block; width: 100%; padding: 9px 12px 7px 24px; color: black; font-size: 14px; text-decoration: none; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__separator { color: white; background: black; text-transform: uppercase; } .c-nav-sport .c-nav__sport-menu--mobile .c-nav__sport-menu--flyout-menu .c-nav__separator .c-nav__url--level-2 { color: white; padding: 9px 12px 7px 15px; font-size: 14px; } /**** STORIES ****/ .s-stories { position: relative; width: 100%; display: block; overflow: hidden; background: rgba(0, 0, 0, 0.45); } @media all and (min-width: 768px) { .s-stories { background: none; } } .s-stories .c-stories--fader-main { margin: 0 auto; width: 100%; z-index: 100; max-width: 1344px; } @media all and (min-width: 768px) { .s-stories .c-stories--fader-main { padding: 0 48px; } } @media all and (min-width: 1024px) { .s-stories .c-stories--fader-main { padding: 0 96px; } } .s-stories .c-stories--fader-main .slick-list { overflow: visible; } .s-stories .c-stories--fader-main .showcase-video-player { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 900; } .s-stories .c-stories--fader-main .c-stories__item { position: relative; opacity: 0; } .s-stories .c-stories--fader-main .c-stories__item.slick-active { opacity: 1; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .s-stories .c-stories--fader-main .c-stories__item.slick-active .c-stories__details-inner { transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; -moz-transition: transform 0.4s 0.4s, opacity 0.2s 0.6s; -o-transition: transform 0.4s 0.4s, opacity 0.2s 0.6s; -webkit-transition: transform 0.4s 0.4s, opacity 0.2s 0.6s; transition: transform 0.4s 0.4s, opacity 0.2s 0.6s; } .s-stories .c-stories--fader-main .c-stories__media { position: relative; padding-bottom: 56.25%; } .s-stories .c-stories--fader-main .c-stories__media picture img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .s-stories .c-stories--fader-main .c-stories__title a { font-family: 'Fjalla One', sans-serif; font-size: 40px; font-weight: 400; font-style: normal; text-decoration: none; color: white; text-transform: uppercase; line-height: 1; display: inline-block; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } @media all and (min-width: 1024px) { .s-stories .c-stories--fader-main .c-stories__title a { font-family: 'Fjalla One', sans-serif; font-size: 48px; font-weight: 400; font-style: normal; } } @media all and (min-width: 1152px) { .s-stories .c-stories--fader-main .c-stories__title a { font-family: 'Fjalla One', sans-serif; font-size: 70px; font-weight: 400; font-style: normal; } } .s-stories .c-stories--fader-main .c-stories__title a:hover { color: #ffc425; } .s-stories .c-stories--fader-main .c-stories__details { position: absolute; bottom: 0; left: 0; overflow: hidden; width: 100%; height: 100%; background: url('../images/responsive/mainstory_gradient.png') bottom left repeat-x; display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; align-items: flex-start; -webkit-align-items: flex-start; justify-content: flex-end; -webkit-justify-content: flex-end; padding: 56px 68px 85px; } @media all and (min-width: 1336px) { .s-stories .c-stories--fader-main .c-stories__details { padding: 56px 56px 85px; } } .s-stories .c-stories--fader-main .c-stories__details-inner { transform: translate(0, 200%); -webkit-transform: translate(0, 200%); transform: translate(0, 200%); transition: 0.2s 1s; -webkit-transition: 0.2s 1s ease-in-out; transition: 0.2s 1s ease-in-out; opacity: 0; } .s-stories .c-stories--fader-main .c-stories__info { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 700; font-style: normal; color: #ffc425; padding-bottom: 5px; } .s-stories .c-stories--fader-main .c-stories__info-link { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: normal; } .s-stories .c-stories--fader-main .c-stories__info-link a { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: normal; color: #ffc425; text-decoration: none; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .s-stories .c-stories--fader-main .c-stories__info-link a:hover { color: white; } .s-stories .c-stories--fader-main .c-stories__info span:before { content: '/'; display: inline-block; margin-right: 4px; } .s-stories .c-stories--fader-main .c-stories__info span:first-child:before { display: none; } .s-stories .c-stories--fader-main .c-stories__headline { margin: 0; } .s-stories .c-stories--fader-main .c-stories__url { text-decoration: none; } .s-stories .c-stories--fader-main .slick-dots { position: absolute; bottom: 32px; left: 0; width: 100%; } .s-stories .c-stories--fader-bg { position: absolute; top: calc(50% - 45px); left: 50%; width: 100%; max-width: 1344px; padding: 0 48px; z-index: 2; transform: translate(-50%, -50%); } @media all and (min-width: 1024px) { .s-stories .c-stories--fader-bg { padding: 0 96px; } } .s-stories .c-stories--fader-bg .slick-list { overflow: visible; } .s-stories .c-stories--fader-bg .c-stories__item { position: relative; background: #4380c2; } .s-stories .c-stories--fader-bg .c-stories__item:after { position: absolute; bottom: 0; left: 0; background: url(../images/responsive/mainstory_gradient.png) bottom left repeat-x; width: 100%; height: 100%; content: ''; } .s-stories .c-stories--fader-bg .c-stories__media { position: relative; padding-bottom: 56.25%; } .s-stories .c-stories--fader-bg .c-stories__media picture img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-filter: grayscale(1); filter: grayscale(1); opacity: 0.45; } .s-stories .c-stories--fader-bg .c-stories__details { position: absolute; bottom: 0; left: 0; } .s-stories .c-stories--fader-bg .c-stories__headline { margin: 0; } .s-stories .c-stories--fader-bg .c-stories__url { text-decoration: none; } .s-stories .c-stories--mobile .showcase-video-player { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 900; } .s-stories .c-stories--mobile .c-stories__media { position: relative; padding-bottom: 56.25%; } .s-stories .c-stories--mobile .c-stories__media picture img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .s-stories .c-stories--mobile .c-stories__details { padding: 24px; } .s-stories .c-stories--mobile .c-stories__title a { font-family: 'Fjalla One', sans-serif; font-size: 30px; font-weight: 400; font-style: normal; text-decoration: none; color: white; text-transform: uppercase; line-height: 36px; display: inline-block; } @media all and (min-width: 540px) { .s-stories .c-stories--mobile .c-stories__title a { font-family: 'Fjalla One', sans-serif; font-size: 36px; font-weight: 400; font-style: normal; line-height: 48px; } } .s-stories .c-stories--mobile .c-stories__title a:hover { color: #ffc425; } .s-stories .c-stories--mobile .c-stories__info { font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 700; font-style: normal; color: #ffc425; padding-bottom: 5px; } @media all and (min-width: 540px) { .s-stories .c-stories--mobile .c-stories__info { font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 700; font-style: normal; } } .s-stories .c-stories--mobile .c-stories__info-link { font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 300; font-style: normal; } @media all and (min-width: 540px) { .s-stories .c-stories--mobile .c-stories__info-link { font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 300; font-style: normal; } } .s-stories .c-stories--mobile .c-stories__info-link a { font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 300; font-style: normal; color: #ffc425; text-decoration: none; } @media all and (min-width: 540px) { .s-stories .c-stories--mobile .c-stories__info-link a { font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 300; font-style: normal; } } .s-stories .c-stories--mobile .c-stories__info span:before { content: '/'; display: inline-block; margin-right: 4px; } .s-stories .c-stories--mobile .c-stories__info span:first-child:before { display: none; } /**** EVENTS ****/ .c-events p { margin: 0; } .c-events .c-events__item { position: relative; } .c-events__none { font-family: 'Fjalla One', sans-serif; font-size: 32px; font-weight: 400; font-style: normal; color: white; padding: 24px; text-align: center; } @media all and (min-width: 768px) { .c-events__none { min-height: 500px; } } .c-events--cards-boxy .slick-track { display: flex; display: -webkit-flex; } .c-events--cards-boxy .slick-track .slick-slide { height: auto; } .c-events--cards-boxy .slick-dots { margin-top: 16px; } .c-events--cards-boxy .c-events__item { margin: 0 12px; background: white; padding-bottom: 59px; padding-top: 59px; position: relative; border-bottom: solid 1px #d7d7d7; position: relative; } .c-events--cards-boxy .c-events__item:after, .c-events--cards-boxy .c-events__item:before { position: absolute; top: 0; left: 0; width: 1px; height: 100%; content: ''; background: #d7d7d7; z-index: 10; } .c-events--cards-boxy .c-events__item:after { left: auto; right: 0; } .c-events--cards-boxy .c-events__date { color: white; font-family: 'Fjalla One', sans-serif; font-size: 24px; font-weight: 400; font-style: normal; } .c-events--cards-boxy .c-events__logos-team { margin-top: 24px; width: 95px; height: 95px; text-align: center; } .c-events--cards-boxy .c-events__logos-team img { margin: 0 auto; max-height: 100%; } .c-events--cards-boxy .c-events__logos-team img.no-logo { -webkit-filter: grayscale(1); filter: grayscale(1); opacity: 0.5; } .c-events--cards-boxy .c-events__sport { font-family: 'Fjalla One', sans-serif; font-size: 24px; font-weight: 400; font-style: normal; color: #00467f; line-height: 1.2; padding-top: 45px; padding-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; } .c-events--cards-boxy .c-events__opponent { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: normal; color: #333333; line-height: 1.2; } .c-events--cards-boxy .c-events__time { font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 400; font-style: italic; color: #333333; line-height: 1.2; padding-bottom: 32px; margin-top: auto; } .c-events--cards-boxy .c-events--cards-boxy__header { background-color: #4380c2; color: white; height: 60px; position: absolute; top: 0; left: 0; width: 100%; z-index: 20; } .c-events--cards-boxy .c-events--cards-boxy__body { padding: 8px; min-height: 313px; } .c-events--cards-boxy .c-events__logo img { display: block; margin: 0 auto; } .c-events--cards-boxy .c-events--cards-boxy__ctas { background-color: #e1e1e1; color: #bbbbbb; position: absolute; border-top: solid 1px #d7d7d7; bottom: 0; left: 0; width: 100%; height: 59px; } .c-events--cards-boxy .c-events--cards-boxy__ctas a { color: #bbbbbb; font-size: 20px; margin: 0 4px; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .c-events--cards-boxy .c-events--cards-boxy__ctas a:hover { color: #00467f; } /**** AWARDS ****/ .b-score-awards { padding-top: 36px; position: relative; overflow: hidden; } @media all and (min-width: 768px) { .b-score-awards { margin-top: -45px; padding-top: 145px; } } .b-score-awards__row { flex-wrap: wrap; -webkit-flex-wrap: wrap; } @media all and (min-width: 768px) { .b-score-awards__row { flex-wrap: nowrap; -webkit-flex-wrap: nowrap; padding-bottom: 72px; } } .b-score-awards:before, .b-score-awards:after { content: ''; position: absolute; top: 0; left: 0; width: 50%; height: 5px; background: #4380c2; display: none; } @media all and (min-width: 768px) { .b-score-awards:before, .b-score-awards:after { display: block; } } .b-score-awards:after { left: 50%; background: #ffc425; } .b-score-awards__column { padding-bottom: 140px; } .b-score-awards__score { width: 100%; position: relative; margin-bottom: 98px; } @media all and (min-width: 768px) { .b-score-awards__score { margin-bottom: 0; flex: 1 1 auto; -webkit-flex: 1 1 auto; min-width: 1px; min-height: 1px; } } .b-score-awards__award { width: 100%; position: relative; margin-bottom: 98px; } @media all and (min-width: 768px) { .b-score-awards__award { margin-bottom: 0; flex: 1 0 480px; -webkit-flex: 1 0 480px; min-width: 1px; min-height: 1px; } } .b-score-awards a.b-score-awards__more { color: white; font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 300; font-style: italic; text-decoration: none; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .b-score-awards a.b-score-awards__more:hover { color: #ffc425; } .b-score-awards__more { position: absolute; bottom: -84px; right: 50%; transform: translate(50%, 0); -webkit-transform: translate(50%, 0); transform: translate(50%, 0); } .b-score-awards__more--events { bottom: -22px; } @media all and (min-width: 540px) { .b-score-awards__more { bottom: -46px; } .b-score-awards__more--events { bottom: -22px; } } @media all and (min-width: 768px) { .b-score-awards__more { bottom: -22px; } .b-score-awards__more--events { bottom: -22px; } } @media all and (min-width: 1024px) { .b-score-awards__more { bottom: 15px; right: 12px; transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); } } .s-awards { padding: 0 12px; } .s-awards__header { background: #ffc425; height: 115px; padding-left: 105px; } @media all and (min-width: 400px) { .s-awards__header { padding-left: 148px; } } @media all and (min-width: 768px) { .s-awards__header { padding-right: 45px; padding-left: 0; } } .s-awards__header-inner { position: relative; } .s-awards__header-image { position: absolute; top: 36px; left: 9px; z-index: 40; transform: translate(-100%, -50%); -webkit-transform: translate(-100%, -50%); transform: translate(-100%, -50%); width: 115px; } @media all and (min-width: 400px) { .s-awards__header-image { width: 154px; } } @media all and (min-width: 768px) { .s-awards__header-image { left: 0; } } .s-awards__heading { color: #00467f; padding: 0; margin: 0; text-transform: uppercase; line-height: 32px; font-family: 'Permanent Marker', cursive; font-size: 32px; font-weight: 400; font-style: normal; } @media all and (min-width: 400px) { .s-awards__heading { font-family: 'Permanent Marker', cursive; font-size: 38px; font-weight: 400; font-style: normal; } } .s-awards__heading small { font-family: 'Permanent Marker', cursive; font-size: 24px; font-weight: 400; font-style: normal; line-height: 26px; display: block; } @media all and (min-width: 400px) { .s-awards__heading small { font-family: 'Permanent Marker', cursive; font-size: 28px; font-weight: 400; font-style: normal; } } .c-awards { background: white; padding: 32px 42px 27px; border-top: solid 5px #00467f; border-bottom: solid 5px #ffc425; } .c-awards--slider .slick-dots { position: absolute; bottom: -64px; left: 50%; transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); } .c-awards--slider .c-awards__item { margin: 0 6px; position: relative; } .c-awards--slider .c-awards__media { margin: 0 auto; } .c-awards--slider .c-awards__text { font-size: 16px; line-height: 25px; color: white; text-align: center; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: flex-end; -webkit-align-items: flex-end; padding: 0 8px 17px; background: rgba(0, 0, 0, 0); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 69%, rgba(0, 0, 0, 0.73) 93%, rgba(0, 0, 0, 0.8) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(69%, rgba(0, 0, 0, 0)), color-stop(93%, rgba(0, 0, 0, 0.73)), color-stop(100%, rgba(0, 0, 0, 0.8))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 69%, rgba(0, 0, 0, 0.73) 93%, rgba(0, 0, 0, 0.8) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 69%, rgba(0, 0, 0, 0.73) 93%, rgba(0, 0, 0, 0.8) 100%); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 69%, rgba(0, 0, 0, 0.73) 93%, rgba(0, 0, 0, 0.8) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 69%, rgba(0, 0, 0, 0.73) 93%, rgba(0, 0, 0, 0.8) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0); } .c-awards--slider .c-awards__text a { color: white; font-family: 'Fjalla One', sans-serif; font-size: 24px; font-weight: 400; font-style: normal; line-height: 32px; display: block; text-align: center; text-decoration: none; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .c-awards--slider .c-awards__text a:hover { color: #ffc425; } .c-awards--slider .c-awards__text a span { display: block; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /**** SOCIAL ****/ .b-social__links { position: absolute; bottom: -16px; right: 50%; transform: translate(50%, 0); -webkit-transform: translate(50%, 0); transform: translate(50%, 0); display: flex; display: -webkit-flex; } @media all and (min-width: 768px) { .b-social__links { transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); bottom: auto; top: -65px; right: 12px; } } .b-social__links a { color: white; text-decoration: none; font-size: 18px; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .b-social__links a:hover { color: #00467f; background: #ffc425; } .b-social__link { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; justify-content: center; -webkit-justify-content: center; width: 40px; height: 40px; background: #55acee; color: white; } .b-social__link--instagram { background: #e1306c; } .b-social__link--facebook { background: #3b5998; } .b-horsepower { background: rgba(0, 0, 0, 0.45); padding-bottom: 40px; padding-top: 48px; } @media all and (min-width: 540px) { .b-horsepower { padding-top: 94px; } } .b-horsepower__heading { font-family: 'Permanent Marker', cursive; font-size: 40px; font-weight: 400; font-style: normal; text-align: center; padding: 0; margin: 0; color: #ffc425; line-height: 1; padding-bottom: 55px; } @media all and (min-width: 540px) { .b-horsepower__heading { font-family: 'Permanent Marker', cursive; font-size: 54px; font-weight: 400; font-style: normal; } } @media all and (min-width: 768px) { .b-horsepower__heading { font-family: 'Permanent Marker', cursive; font-size: 70px; font-weight: 400; font-style: normal; } } .b-horsepower__row { flex-wrap: wrap; -webkit-flex-wrap: wrap; } @media all and (min-width: 1260px) { .b-horsepower__row { flex-wrap: nowrap; -webkit-flex-wrap: nowrap; } } .b-horsepower__column { padding: 0 12px 48px; width: 33.33333%; position: relative; } .b-horsepower__column--twitter { padding: 0 0 48px; flex: 1 0 100%; -webkit-flex: 1 0 100%; min-width: 1px; min-height: 1px; } @media all and (min-width: 540px) { .b-horsepower__column--twitter { padding: 0 0 24px; } } @media all and (min-width: 1260px) { .b-horsepower__column--twitter { flex: 1 0 33.33333%; -webkit-flex: 1 0 33.33333%; min-width: 1px; min-height: 1px; } } .b-horsepower__column--instagram { flex: 1 0 100%; -webkit-flex: 1 0 100%; min-width: 1px; min-height: 1px; } @media all and (min-width: 540px) { .b-horsepower__column--instagram { flex: 1 0 50%; -webkit-flex: 1 0 50%; min-width: 1px; min-height: 1px; } } @media all and (min-width: 1260px) { .b-horsepower__column--instagram { flex: 1 0 33.33333%; -webkit-flex: 1 0 33.33333%; min-width: 1px; min-height: 1px; } } .b-horsepower__column--facebook { flex: 1 0 100%; -webkit-flex: 1 0 100%; min-width: 1px; min-height: 1px; } @media all and (min-width: 540px) { .b-horsepower__column--facebook { flex: 1 0 50%; -webkit-flex: 1 0 50%; min-width: 1px; min-height: 1px; } } @media all and (min-width: 1260px) { .b-horsepower__column--facebook { flex: 1 0 33.33333%; -webkit-flex: 1 0 33.33333%; min-width: 1px; min-height: 1px; } } /**** TWITTER ****/ .c-twitter__item { position: relative; padding: 0 12px; } .c-twitter__user { height: 80px; padding: 0 18px; border-bottom: solid 1px #e5e5e5; } @media all and (min-width: 768px) { .c-twitter__user { height: 120px; padding: 0 38px; } } .c-twitter__body { padding: 18px; font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: 32px; } @media all and (min-width: 768px) { .c-twitter__body { padding: 38px; } } .c-twitter__user-avatar { height: 48px; width: 48px; border: solid 3px #e5e5e5; border-radius: 50%; overflow: hidden; } .c-twitter__user-info { margin-left: 18px; } @media all and (min-width: 540px) { .c-twitter__user-info { margin-left: 12px; } } @media all and (min-width: 768px) { .c-twitter__user-info { margin-left: 24px; } } .c-twitter__user-info a { text-decoration: none; font-family: 'Fjalla One', sans-serif; font-size: 24px; font-weight: 400; font-style: normal; line-height: 1; color: #00467f; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; white-space: nowrap; } .c-twitter__user-info a:hover { color: #ffc425; } .c-twitter__body-content a { color: #00467f; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .c-twitter__body-content a:hover { color: #ffc425; } .c-twitter__item-inner { position: relative; top: 0; left: 0; width: 100%; height: 100%; background: white; } @media all and (min-width: 880px) { .c-twitter__item-inner { height: 0; padding-bottom: 100%; } } .c-twitter__item-inner:after { position: absolute; bottom: 0; left: 0; width: 100%; height: 5px; content: ''; background: #ffc425; } .c-twitter__time { font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 400; font-style: italic; color: #333333; position: absolute; bottom: 30px; right: 38px; } .c-twitter__actions { padding-top: 20px; font-size: 24px; } .c-twitter__actions-item { padding: 0 2px; } .c-twitter__actions-item a { color: #00467f; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .c-twitter__actions-item a:hover { color: #ffc425; } .c-twitter__media { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; justify-content: center; -webkit-justify-content: center; display: none; z-index: 12; } .c-twitter__media img { max-width: 100%; max-height: 100%; } .c-twitter__media-close { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; line-height: 40px; text-align: center; background: #00467f; border-radius: 50%; cursor: pointer; } .c-twitter__media-close:before { content: '\e84c'; color: white; font-size: 40px; font-family: 'sidearm_font'; } .c-twitter__media-link { cursor: pointer; color: #2f6eae; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .c-twitter__media-link:hover { color: #ffc425; } .c-twitter .open .c-twitter__media { display: flex; display: -webkit-flex; } .c-twitter .c-twitter__actions-favorite { font-size: 20px; } .c-twitter .c-twitter__photo { position: relative; width: 100%; height: 200px; background-size: cover; } .c-twitter .slick-track { display: flex; display: -webkit-flex; } .c-twitter .slick-slide { height: auto; } .c-twitter .slick-dots { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; padding: 0; padding-top: 22px; } /**** INSTAGRAM ****/ .c-instagram { position: relative; } .c-instagram__item { position: relative; } .c-instagram__item-inner { position: relative; top: 0; left: 0; width: 100%; height: 0; padding-bottom: 100%; } .c-instagram .c-instagram__image { width: 100%; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .c-instagram__overlay { position: absolute; top: 36px; right: 36px; line-height: 1; color: #ffc425; } .c-instagram .c-instagram__likes { font-family: 'Fjalla One', sans-serif; font-size: 16px; font-weight: 400; font-style: normal; } .c-instagram .slick-dots { display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; padding: 0; padding-top: 22px; } /**** FACEBOOK ****/ .b-facebook-buttons { position: absolute; top: 22px; left: 112px; z-index: 20; padding-right: 12px; } /*facebook*/ .c-facebook { position: relative; width: 100%; height: 0; padding-bottom: 115%; background: white; } @media all and (min-width: 540px) { .c-facebook { padding-bottom: 100%; } } .c-facebook__inner { position: absolute; width: 100%; height: calc(100% - 105px); bottom: 0; left: 0; overflow: hidden; } .c-facebook__item { padding: 0; } .c-facebook__item-inner { padding: 24px; padding-top: 0; } .c-facebook__media { padding-bottom: 8px; } .c-facebook__body { line-height: 32px; font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: normal; color: #333333; } .c-facebook__body a { color: #ffc425; text-decoration: none; } .c-facebook__header { position: absolute; top: 0; left: 0; width: 100%; border-bottom: solid 1px #e5e5e5; background: white; } .c-facebook__header a.c-facebook__social-overlay { flex: 0 0 auto; -webkit-flex: 0 0 auto; min-width: 1px; min-height: 1px; width: 80px; height: 80px; background: #3b5998; text-align: center; line-height: 80px; color: white; font-size: 40px; } .c-facebook__header a.c-facebook__screen-name { text-decoration: none; color: #2f6eae; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; font-family: 'Roboto', sans-serif; font-size: 20px; font-weight: 400; font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; } .c-facebook__header a.c-facebook__screen-name:hover { color: #ffc425; } .c-facebook__item-user { margin-right: auto; padding-left: 24px; line-height: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .c-facebook__user { font-family: 'Roboto', sans-serif; font-size: 20px; font-weight: 400; font-style: normal; color: #2f6eae; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; } .c-facebook__avatar { height: 80px; width: 80px; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; flex: 0 0 auto; -webkit-flex: 0 0 auto; min-width: 1px; min-height: 1px; border-right: solid 1px #e5e5e5; } /**** FOOTER ****/ .main-footer { background: #00467f; border-top: solid 1px black; } .main-footer__row { flex-wrap: wrap; -webkit-flex-wrap: wrap; } @media all and (min-width: 1024px) { .main-footer__row { flex-wrap: nowrap; -webkit-flex-wrap: nowrap; } } .main-footer__contact { padding: 20px 0; flex: 1 0 100%; -webkit-flex: 1 0 100%; min-width: 1px; min-height: 1px; order: 1; -webkit-order: 1; } @media all and (min-width: 540px) { .main-footer__contact { padding: 60px 0; } } @media all and (min-width: 1024px) { .main-footer__contact { padding-left: 12px; border-right: solid 1px #003159; flex: 0 1 535px; -webkit-flex: 0 1 535px; min-width: 1px; min-height: 1px; order: 0; -webkit-order: 0; } } .main-footer__contact-logo { margin: 20px 0; flex: 0 3 auto; -webkit-flex: 0 3 auto; min-width: 1px; min-height: 1px; padding-left: 12px; } @media all and (min-width: 540px) { .main-footer__contact-logo { padding-left: 0; } } .main-footer__contact-text { flex: 0 0 auto; -webkit-flex: 0 0 auto; min-width: 1px; min-height: 1px; color: white; margin: 20px 0 20px 12px; padding: 0 12px 0 14px; line-height: 1.2; font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 700; font-style: normal; position: relative; } @media all and (min-width: 540px) { .main-footer__contact-text { margin: 20px 0 20px 26px; padding: 0 12px 0 28px; font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 700; font-style: normal; } } @media all and (min-width: 1024px) { .main-footer__contact-text { margin: 20px 0 20px 12px; padding: 0 12px 0 14px; } } @media all and (min-width: 1260px) { .main-footer__contact-text { margin: 20px 0 20px 26px; padding: 0 12px 0 28px; } } .main-footer__contact-text:before { position: absolute; content: ''; top: 50%; left: 0; width: 1px; height: 50px; background: #003159; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .main-footer__contact-text--links { color: #ffc425; padding-top: 6px; font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 300; font-style: normal; } @media all and (min-width: 540px) { .main-footer__contact-text--links { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 300; font-style: normal; } } .main-footer__contact-text--links a { color: #ffc425; } .main-footer__logos { padding: 20px 0; order: 0; -webkit-order: 0; width: auto; margin: 0 24px; flex-wrap: wrap; -webkit-flex-wrap: wrap; border-bottom: solid 1px #003159; } @media all and (min-width: 540px) { .main-footer__logos { padding: 60px 0; flex: 1 1 100%; -webkit-flex: 1 1 100%; min-width: 1px; min-height: 1px; } } @media all and (min-width: 768px) { .main-footer__logos { flex-wrap: nowrap; -webkit-flex-wrap: nowrap; } } @media all and (min-width: 1024px) { .main-footer__logos { width: auto; border-bottom: none; order: 1; -webkit-order: 1; flex: 0 1 auto; -webkit-flex: 0 1 auto; min-width: 1px; min-height: 1px; } } .main-footer__logo-url { flex: 0 1 50%; -webkit-flex: 0 1 50%; min-width: 1px; min-height: 1px; padding: 20px; text-align: center; display: block; } @media all and (min-width: 768px) { .main-footer__logo-url { flex: 1 1 auto; -webkit-flex: 1 1 auto; min-width: 1px; min-height: 1px; padding: 0; margin: 20px; } .main-footer__logo-url:last-child { margin-right: 12px; } } /* perfect-scrollbar v0.7.0 */ .ps { -ms-touch-action: auto; touch-action: auto; overflow: hidden !important; -ms-overflow-style: none; } @supports (-ms-overflow-style: none) { .ps { overflow: auto !important; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .ps { overflow: auto !important; } } .ps.ps--active-x > .ps__scrollbar-x-rail, .ps.ps--active-y > .ps__scrollbar-y-rail { display: block; background-color: transparent; } .ps.ps--in-scrolling.ps--x > .ps__scrollbar-x-rail { background-color: #eeeeee; opacity: 0.9; } .ps.ps--in-scrolling.ps--x > .ps__scrollbar-x-rail > .ps__scrollbar-x { background-color: #999999; height: 11px; } .ps.ps--in-scrolling.ps--y > .ps__scrollbar-y-rail { background-color: #eeeeee; opacity: 0.9; } .ps.ps--in-scrolling.ps--y > .ps__scrollbar-y-rail > .ps__scrollbar-y { background-color: #999999; width: 11px; } .ps > .ps__scrollbar-x-rail { display: none; position: absolute; /* please don't change 'position' */ opacity: 0; -webkit-transition: background-color 0.2s linear, opacity 0.2s linear; -o-transition: background-color 0.2s linear, opacity 0.2s linear; -moz-transition: background-color 0.2s linear, opacity 0.2s linear; transition: background-color 0.2s linear, opacity 0.2s linear; bottom: 0px; /* there must be 'bottom' for ps__scrollbar-x-rail */ height: 15px; } .ps > .ps__scrollbar-x-rail > .ps__scrollbar-x { position: absolute; /* please don't change 'position' */ background-color: #aaaaaa; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out; transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out; -o-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out; -moz-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out, -moz-border-radius 0.2s ease-in-out; transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out; transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out, -moz-border-radius 0.2s ease-in-out; bottom: 2px; /* there must be 'bottom' for ps__scrollbar-x */ height: 6px; } .ps > .ps__scrollbar-x-rail:hover > .ps__scrollbar-x, .ps > .ps__scrollbar-x-rail:active > .ps__scrollbar-x { height: 11px; } .ps > .ps__scrollbar-y-rail { display: none; position: absolute; /* please don't change 'position' */ opacity: 0; -webkit-transition: background-color 0.2s linear, opacity 0.2s linear; -o-transition: background-color 0.2s linear, opacity 0.2s linear; -moz-transition: background-color 0.2s linear, opacity 0.2s linear; transition: background-color 0.2s linear, opacity 0.2s linear; right: 0; /* there must be 'right' for ps__scrollbar-y-rail */ width: 15px; } .ps > .ps__scrollbar-y-rail > .ps__scrollbar-y { position: absolute; /* please don't change 'position' */ background-color: #aaaaaa; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out; transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out; -o-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out; -moz-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out, -moz-border-radius 0.2s ease-in-out; transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out; transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out, -moz-border-radius 0.2s ease-in-out; right: 2px; /* there must be 'right' for ps__scrollbar-y */ width: 6px; } .ps > .ps__scrollbar-y-rail:hover > .ps__scrollbar-y, .ps > .ps__scrollbar-y-rail:active > .ps__scrollbar-y { width: 11px; } .ps:hover.ps--in-scrolling.ps--x > .ps__scrollbar-x-rail { background-color: #eeeeee; opacity: 0.9; } .ps:hover.ps--in-scrolling.ps--x > .ps__scrollbar-x-rail > .ps__scrollbar-x { background-color: #999999; height: 11px; } .ps:hover.ps--in-scrolling.ps--y > .ps__scrollbar-y-rail { background-color: #eeeeee; opacity: 0.9; } .ps:hover.ps--in-scrolling.ps--y > .ps__scrollbar-y-rail > .ps__scrollbar-y { background-color: #999999; width: 11px; } .ps:hover > .ps__scrollbar-x-rail, .ps:hover > .ps__scrollbar-y-rail { opacity: 0.6; } .ps:hover > .ps__scrollbar-x-rail:hover { background-color: #eeeeee; opacity: 0.9; } .ps:hover > .ps__scrollbar-x-rail:hover > .ps__scrollbar-x { background-color: #999999; } .ps:hover > .ps__scrollbar-y-rail:hover { background-color: #eeeeee; opacity: 0.9; } .ps:hover > .ps__scrollbar-y-rail:hover > .ps__scrollbar-y { background-color: #999999; } /**** PROMOS ****/ .b-social-icons { position: absolute; top: 50%; right: 18px; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .b-social-icons .ads-container { display: flex; display: -webkit-flex; align-items: center; -webkit-align-items: center; justify-content: flex-end; -webkit-justify-content: flex-end; } .b-social-icons .ads-container .icons-ad a { color: #ffc425; text-decoration: none; font-size: 22px; display: inline-block; padding: 0 2px; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .b-social-icons .ads-container .icons-ad a:hover { color: white; } .b-social-icons .ads-container .icons-ad span { display: none; } .b-social-icons .ads-container .main-header__search-icon.opened a i:before { content: '\e84d'; } .b-footer-sponsor { background: white; position: relative; } .b-footer-sponsor .ad.slick-slide { display: block; margin: 60px 12px; } .b-footer-sponsor .ad.slick-slide img { margin: 0 auto; } .b-footer-sponsor .slick-dots { position: absolute; bottom: 4px; left: 0; width: 100%; } .b-footer-sponsor .slick-dots button { border-color: #00467f; } .b-footer-sponsor .slick-dots button:hover { background: #00467f; } .b-footer-sponsor .slick-dots .slick-active button { background: #00467f; border-color: #00467f; } .content-ad .dfp-ad { margin: 0 auto; } @media screen and (max-width: 768px) { .content-ad .dfp-ad { margin-top: 20px; margin-bottom: 20px; } }