html { line-height: 1.15; -webkit-text-size-adjust: 100% } body { margin: 0 } main { display: block } hr { -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; overflow: visible } pre { font-family: monospace, monospace; font-size: 1em } a { background-color: transparent } abbr[title] { border-bottom: none; text-decoration: underline; -webkit-text-decoration: underline dotted; text-decoration: underline dotted } b, strong { font-weight: bolder } code, kbd, samp { font-family: monospace, monospace; font-size: 1em } small { font-size: 80% } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline } sub { bottom: -0.25em } sup { top: -0.5em } img { border-style: none } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0 } button, input { overflow: visible } button, select { text-transform: none } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: none } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0 } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText } fieldset { padding: 0.35em 0.75em 0.625em } legend { -webkit-box-sizing: border-box; box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal } progress { vertical-align: baseline } textarea { overflow: auto } [type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto } [type="search"] { -webkit-appearance: none; outline-offset: -2px } [type="search"]::-webkit-search-decoration { -webkit-appearance: none } ::-webkit-file-upload-button { -webkit-appearance: none; font: inherit } details { display: block } summary { display: list-item } template { display: none } [hidden] { display: none } @font-face { font-family: 'ExtBd'; src: url("../fonts/subset-GTAmericaLCG-ExtBd.woff2") format("woff2"), url("../fonts/subset-GTAmericaLCG-ExtBd.woff") format("woff"); font-weight: bold; font-style: normal; font-display: swap } @font-face { font-family: 'CnRg'; src: url("../fonts/subset-GTAmericaLCG-CnRg.woff2") format("woff2"), url("../fonts/subset-GTAmericaLCG-CnRg.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap } @font-face { font-family: 'CmRg'; src: url("../fonts/subset-GTAmericaLCG-CmRg.woff2") format("woff2"), url("../fonts/subset-GTAmericaLCG-CmRg.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap } @font-face { font-family: 'ExpLt'; src: url("../fonts/subset-GTAmericaLCG-ExpLt.woff2") format("woff2"), url("../fonts/subset-GTAmericaLCG-ExpLt.woff") format("woff"); font-weight: 300; font-style: normal; font-display: swap } @font-face { font-family: 'CnBd'; src: url("../fonts/subset-GTAmericaLCG-CnBd.woff2") format("woff2"), url("../fonts/subset-GTAmericaLCG-CnBd.woff") format("woff"); font-weight: bold; font-style: normal; font-display: swap } @font-face { font-family: 'ExpRg'; src: url("../fonts/subset-GTAmericaLCG-ExpRg.woff2") format("woff2"), url("../fonts/subset-GTAmericaLCG-ExpRg.woff") format("woff"); font-weight: normal; font-style: normal; font-display: swap } @font-face { font-family: 'ExtBl'; src: url("../fonts/subset-GTAmericaLCG-ExtBl.woff2") format("woff2"), url("../fonts/subset-GTAmericaLCG-ExtBl.woff") format("woff"); font-weight: 900; font-style: normal; font-display: swap } @font-face { font-family: 'ExpBl'; src: url("../fonts/subset-GTAmericaLCG-ExpBl.woff2") format("woff2"), url("../fonts/subset-GTAmericaLCG-ExpBl.woff") format("woff"); font-weight: 900; font-style: normal; font-display: swap } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline } a { text-decoration: none } a:active, a:hover, a:focus, input:active, input:hover, input:focus, button:active, button:hover, button:focus { outline: 0 } button { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } ul, li { list-style-type: none; margin: 0; padding: 0 } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal } html { -webkit-box-sizing: border-box; box-sizing: border-box } *, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box } :focus { outline: 0 } img, audio, video { max-width: 100%; height: auto } audio, canvas, iframe, video, img, svg { vertical-align: middle } iframe { border: 0 } textarea { resize: none; overflow: auto; vertical-align: top; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none } input, textarea, select, button { outline: none; border: none; font-size: 100%; margin: 0 } button, input { line-height: normal } table { border-collapse: collapse; border-spacing: 0 } td, th { padding: 0; text-align: left } /*! Animate.css - http://daneden.me/animate Licensed under the MIT license Copyright (c) 2013 Daniel Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ .animated { -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0) } 40% { -webkit-transform: translateY(-30px); transform: translateY(-30px) } 60% { -webkit-transform: translateY(-15px); transform: translateY(-15px) } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } 40% { -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px) } 60% { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px) } } .bounce { -webkit-animation-name: bounce; animation-name: bounce } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1 } 25%, 75% { opacity: 0 } } @keyframes flash { 0%, 50%, 100% { opacity: 1 } 25%, 75% { opacity: 0 } } .flash { -webkit-animation-name: flash; animation-name: flash } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1) } 50% { -webkit-transform: scale(1.1); transform: scale(1.1) } 100% { -webkit-transform: scale(1); transform: scale(1) } } @keyframes pulse { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } 50% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } } .pulse { -webkit-animation-name: pulse; animation-name: pulse } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translateX(0); transform: translateX(0) } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); transform: translateX(-10px) } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); transform: translateX(10px) } } @keyframes shake { 0%, 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px) } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px) } } .shake { -webkit-animation-name: shake; animation-name: shake } @-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg) } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg) } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg) } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg) } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg) } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg) } 40% { -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg) } 60% { -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg) } 80% { -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg) } 100% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg) } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing } @-webkit-keyframes tada { 0% { -webkit-transform: scale(1); transform: scale(1) } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg) } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg) } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg) } 100% { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0) } } @keyframes tada { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg) } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg) } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg) } 100% { -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0) } } .tada { -webkit-animation-name: tada; animation-name: tada } @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); transform: translateX(0%) } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg) } 30% { -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg) } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg) } 60% { -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg) } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg) } 100% { -webkit-transform: translateX(0%); transform: translateX(0%) } } @keyframes wobble { 0% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%) } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); -ms-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg) } 30% { -webkit-transform: translateX(20%) rotate(3deg); -ms-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg) } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); -ms-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg) } 60% { -webkit-transform: translateX(10%) rotate(2deg); -ms-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg) } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); -ms-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg) } 100% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%) } } .wobble { -webkit-animation-name: wobble; animation-name: wobble } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(0.3); transform: scale(0.3) } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05) } 70% { -webkit-transform: scale(0.9); transform: scale(0.9) } 100% { -webkit-transform: scale(1); transform: scale(1) } } @keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(0.3); -ms-transform: scale(0.3); transform: scale(0.3) } 50% { opacity: 1; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05) } 70% { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9) } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px) } 60% { opacity: 1; -webkit-transform: translateY(30px); transform: translateY(30px) } 80% { -webkit-transform: translateY(-10px); transform: translateY(-10px) } 100% { -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px) } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px) } 80% { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px) } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px) } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px) } 80% { -webkit-transform: translateX(-10px); transform: translateX(-10px) } 100% { -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px) } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px) } 80% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px) } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px) } 60% { opacity: 1; -webkit-transform: translateX(-30px); transform: translateX(-30px) } 80% { -webkit-transform: translateX(10px); transform: translateX(10px) } 100% { -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px) } 60% { opacity: 1; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px) } 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px) } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px) } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px) } 80% { -webkit-transform: translateY(10px); transform: translateY(10px) } 100% { -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px) } 60% { opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px) } 80% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px) } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); transform: scale(1) } 25% { -webkit-transform: scale(0.95); transform: scale(0.95) } 50% { opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1) } 100% { opacity: 0; -webkit-transform: scale(0.3); transform: scale(0.3) } } @keyframes bounceOut { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } 25% { -webkit-transform: scale(0.95); -ms-transform: scale(0.95); transform: scale(0.95) } 50% { opacity: 1; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1) } 100% { opacity: 0; -webkit-transform: scale(0.3); -ms-transform: scale(0.3); transform: scale(0.3) } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0) } 20% { opacity: 1; -webkit-transform: translateY(-20px); transform: translateY(-20px) } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px) } } @keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } 20% { opacity: 1; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px) } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px) } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0) } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px) } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px) } } @keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px) } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px) } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0) } 20% { opacity: 1; -webkit-transform: translateX(-20px); transform: translateX(-20px) } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px) } } @keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 20% { opacity: 1; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px) } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px) } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0) } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px) } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px) } } @keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px) } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px) } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp } @-webkit-keyframes widthIn { 0% { width: 0 } 100% { width: 100% } } @keyframes widthIn { 0% { width: 0 } 100% { width: 100% } } .widthIn { -webkit-animation-name: widthIn; animation-name: widthIn } @-webkit-keyframes heightIn { 0% { max-height: 0 } 100% { max-height: 10000px } } @keyframes heightIn { 0% { max-height: 0 } 100% { max-height: 1500px } } .heightIn { overflow: hidden; -webkit-animation-name: heightIn; animation-name: heightIn } @-webkit-keyframes fadeIn { 0% { opacity: 0 } 100% { opacity: 1 } } @keyframes fadeIn { 0% { opacity: 0 } 100% { opacity: 1 } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px) } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px) } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px) } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px) } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px) } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px) } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px) } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px) } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px) } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px) } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; -webkit-animation-duration: 700ms; animation-duration: 700ms } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px) } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px) } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig } @-webkit-keyframes fadeOut { 0% { opacity: 1 } 100% { opacity: 0 } } @keyframes fadeOut { 0% { opacity: 1 } 100% { opacity: 0 } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px) } } @keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px) } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px) } } @keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px) } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px) } } @keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px) } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px) } } @keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px) } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px) } } @keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px) } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px) } } @keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px) } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px) } } @keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px) } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px) } } @keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px) } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in } } @keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in } } .animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0 } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg) } 70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg) } 100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1 } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0 } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg) } 70% { -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg) } 100% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1 } } .flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0 } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg) } 70% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg) } 100% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1 } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0 } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); -ms-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg) } 70% { -webkit-transform: perspective(400px) rotateY(10deg); -ms-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg) } 100% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1 } } .flipInY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1 } 100% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0 } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1 } 100% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0 } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; backface-visibility: visible !important } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1 } 100% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0 } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1 } 100% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0 } } .flipOutY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0 } 60% { -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1 } 80% { -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1 } 100% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1 } } @keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0 } 60% { -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1 } 80% { -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1 } 100% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1 } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out } @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1 } 100% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0 } } @keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1 } 100% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0 } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0 } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } } @keyframes rotateIn { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0 } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0 } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0 } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0 } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0 } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0 } } @keyframes rotateOut { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0 } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0 } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0 } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0 } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0 } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight } @-webkit-keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px) } 100% { -webkit-transform: translateY(0); transform: translateY(0) } } @keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px) } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown } @-webkit-keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px) } 100% { -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px) } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft } @-webkit-keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px) } 100% { -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px) } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px) } } @keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px) } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px) } } @keyframes slideOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px) } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px) } } @keyframes slideOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px) } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } 40% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } 80% { -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0 } } @keyframes hinge { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } 20%, 60% { -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } 40% { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } 80% { -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0 } } .hinge { -webkit-animation-name: hinge; animation-name: hinge } @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg) } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg) } } @keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg) } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg) } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn } @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg) } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg) } } @keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg) } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg) } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut } body { counter-reset: section } .uppercase { text-transform: uppercase } .wrapper { width: 1200px; margin: 0 auto } @media (max-width: 1199px) { .wrapper { width: 100% } } .relative { position: relative } .z-index-5 { z-index: 5 } .z-index-10 { z-index: 10 } .text-left { text-align: left } .text-right { text-align: right } .text-center { text-align: center } .d-flex { display: -webkit-box; display: -ms-flexbox; display: flex } .order-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1 } .order-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2 } .justify-flex-end { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: end } .justify-space-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .justify-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .justify-space-around { -ms-flex-pack: distribute; justify-content: space-around } .ml-auto { margin-left: auto } .mr-auto { margin-right: auto } @media screen and (max-width: 1199px) { .d-mobile-none { display: none } } @media screen and (min-width: 1200px) { .d-xl-none { display: none } } @media screen and (max-width: 1199px) { .mx-mobile-auto { margin-left: auto; margin-right: auto } .mr-mobile-auto { margin-right: auto } } .z-index--1 { z-index: -1 } @media screen and (max-width: 1199px) { html { font-size: calc(16 * 100vw / 768) } } .header { position: relative } @media (max-width: 1199px) { .header { height: calc(1360 * 100vw / 768); overflow: hidden } } .header figure { position: absolute; left: 0; top: 0; width: 100%; overflow: hidden } @media (min-width: 1200px) { .header figure { max-height: 1080px } } @media (max-width: 1199px) { .header figure { height: 100% } } .header__img, .header__img-castle { width: 100%; -o-object-fit: none; object-fit: none; min-height: 1080px; -o-object-position: center top; object-position: center top; z-index: -1 } @media (max-width: 1199px) { .header__img, .header__img-castle { display: none } } .header__img-castle { position: absolute; -o-object-position: center; object-position: center; left: 0; z-index: 2 } @media (min-width: 1921px) { .header__img { -o-object-fit: cover; object-fit: cover; margin: -100px 0 0; -o-object-position: center; object-position: center } } @media (min-width: 1921px) { .header__img+.header__img-castle { -o-object-fit: cover; object-fit: cover; top: -100px } } @media (max-width: 1199px) { .header__img-mobile { width: 100%; display: block; height: 100%; -o-object-fit: cover; object-fit: cover } } @media (min-width: 1200px) { .header__img-mobile { display: none } } .header__img-mobile-copy { position: absolute; left: 0; top: 0 } .header__container { padding: 32px 15px; height: 100%; z-index: 20 } @media (max-width: 1199px) { .header__container { padding: calc(32 * 100vw / 768) calc(15 * 100vw / 768) } } .header__container ul { min-width: 50%; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: end } @media (max-width: 1199px) { .header__container ul { width: 70% } } .header__text { font-family: 'ExtBd', sans-serif; font-size: 20px; position: absolute; color: #fff; -webkit-transform: rotate(-24deg); -ms-transform: rotate(-24deg); transform: rotate(-24deg); left: 500px; top: 780px } @media (max-width: 1199px) { .header__text { font-size: calc(20 / 16 * 1rem); left: calc(465 * 100vw / 768); top: calc(785 * 100vw / 768) } } .logo { width: 460px; display: inline-block } @media (max-width: 1199px) { .logo { width: calc(162 * 100vw / 768) } } @media (max-width: 767px) { .logo { width: calc(220 * 100vw / 768) } } .tour-list a { width: 242px; display: block; padding: 18px 40px; font-family: 'CnBd', sans-serif; font-weight: 400; font-size: 20px; background: #FDEC34; margin: 0 40px 0 20px; position: relative; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; color: #000; text-align: center } @media (max-width: 1199px) { .tour-list a { width: calc(242 * 100vw / 768); margin: 0 calc(40 * 100vw / 768) 0 calc(20 * 100vw / 768); padding: calc(18 * 100vw / 768) calc(40 * 100vw / 768); font-size: calc(20 / 16 * 1rem) } } @media (max-width: 767px) { .tour-list a { font-size: calc(22 / 16 * 1rem); padding: calc(18 * 100vw / 768) calc(20 * 100vw / 768) } } .tour-list a:hover { background: #fff } @media (max-width: 1199px) { .tour-list { position: absolute; top: calc(102 * 100vw / 768); left: calc(25% - calc(121 * 100vw / 768)) } } .header-top { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 0 130px } @media (max-width: 1199px) { .header-top { padding: 0 0 calc(170 * 100vw / 768); height: calc(240 * 100vw / 768) } } .header-top ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .soc-net-icon { width: 50px; height: 50px; margin: 0 50px 0 0 } .soc-net-icon a { display: block; height: 100% } .soc-net-icon path { -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease } .soc-net-icon:hover path { fill: #FDEC34 } @media (max-width: 1199px) { .soc-net-icon { -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: calc(50 * 100vw / 768); margin: 0 calc(40 * 100vw / 768) 0 0; height: 100% } .soc-net-icon:hover path { fill: #fff } .soc-net-icon__f { margin-left: auto } } @media (max-width: 375px) { .soc-net-icon { margin: 0 20px 0 0 } .soc-net-icon__f { margin: 0 20px 0 auto } } .header-center { color: #fff; padding: 0 0 0 50px; max-width: 60%; margin: 0 0 183px } @media (max-width: 1199px) { .header-center { text-align: center; max-width: 100%; padding: 0; height: calc(250 * 100vw / 768); margin: 0 0 calc(565 * 100vw / 768) } } .header-center h1 { font-size: 89px; font-family: 'ExtBl', sans-serif; line-height: 100%; margin: 0 0 8px } @media (max-width: 1199px) { .header-center h1 { font-size: calc(45 / 16 * 1rem); margin: 0 0 calc(16 * 100vw / 768) } } @media (max-width: 767px) { .header-center h1 { font-size: calc(50 / 16 * 1rem); line-height: 115% } } .header-center p { font-size: 20px; line-height: 25px; font-family: 'ExtBd', sans-serif; font-weight: 400 } @media (max-width: 1199px) { .header-center p { font-size: calc(16 / 16 * 1rem); line-height: calc(20 / 16 * 1rem); max-width: 45%; margin: 0 auto } } @media (max-width: 767px) { .header-center p { font-size: calc(24 / 16 * 1rem); line-height: calc(30 / 16 * 1rem); max-width: 100% } } .header-bottom { color: #fff; text-align: left; width: 292px; height: 292px; -webkit-box-sizing: border-box; box-sizing: border-box; border: 37px solid #FDEC34; border-radius: 50%; padding: 25px; -webkit-transform: translate(51px, 0); -ms-transform: translate(51px, 0); transform: translate(51px, 0) } @media (max-width: 1199px) { .header-bottom { margin: 0 auto; width: calc(183 * 100vw / 768); height: calc(183 * 100vw / 768); border: calc(23 * 100vw / 768) solid #FDEC34; -webkit-transform: translate(calc(-25 * 100vw / 768), 0); -ms-transform: translate(calc(-25 * 100vw / 768), 0); transform: translate(calc(-25 * 100vw / 768), 0); padding: calc(15 * 100vw / 768) } } .header-bottom p { font-size: 40px; text-align: center; font-family: 'ExtBl', sans-serif; font-weight: 900; line-height: 1 } @media (max-width: 1199px) { .header-bottom p { font-size: calc(25 / 16 * 1rem) } } .header-bottom p.number { font-size: 100px; margin: -10px 0 0 } @media (max-width: 1199px) { .header-bottom p.number { font-size: calc(62 / 16 * 1rem); margin: calc(-5 * 100vw / 768) 0 0 } } .header-bottom p.number+p { font-size: 28px; font-family: 'ExpRg', sans-serif } @media (max-width: 1199px) { .header-bottom p.number+p { font-size: calc(17 / 16 * 1rem); font-family: 'ExpRg', sans-serif } } .road { position: absolute; top: -678px; left: 12px } @media screen and (max-width: 1199px) { .road { display: none } } .road-mobile { position: absolute; top: calc(-830 * 100vw / 768); left: 0; right: 0; margin-left: auto; margin-right: auto; width: calc(311 * 100vw / 768); -o-object-position: center; object-position: center; -o-object-fit: none; object-fit: none } @media screen and (min-width: 1200px) { .road-mobile { display: none } } .road-mobile svg { width: 100% } .main { padding: 70px 0 0 } @media (max-width: 1199px) { .main { padding: 0 } } .main-inner { padding: 80px 0 0 } @media (max-width: 1199px) { .main-inner { display: block; padding: 0; -o-object-position: center; object-position: center; -o-object-fit: cover; object-fit: cover } } .main-inner a { font-size: 26px; line-height: 32px; padding: 5px; color: #0645ad; margin: 11px 0; display: inline-block; font-family: 'CnRg', sans-serif; text-decoration: underline } @media (max-width: 1199px) { .main-inner a { font-size: calc(26 / 16 * 1rem); line-height: calc(32 / 16 * 1rem); padding: calc(5 * 100vw / 768); margin: calc(16 * 100vw / 768) 0 calc(24 * 100vw / 768); vertical-align: top } } .main-inner a:hover { color: rgba(6, 69, 173, 0.7) } .main-image { min-width: 50% } @media (max-width: 1199px) { .main-image { text-align: right } } @media (min-width: 1200px) { .main-inner .main-image__castle2 { -o-object-fit: cover; object-fit: cover } } .main-image figure img { width: 100%; -o-object-fit: none; object-fit: none; height: auto; position: relative } @media (max-width: 1199px) { .main-image figure img { -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; height: calc(460 * 100vw / 768) } } .main-image a { font-family: 'ExpLt', sans-serif; font-size: 20px; display: inline-block; margin: 5px 0 0; color: #000; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease } .main-image a:hover { color: rgba(0, 0, 0, 0.5) } @media (max-width: 1199px) { .main-image a { font-size: calc(20 / 16 * 1rem); line-height: calc(32 / 16 * 1rem); margin: 0 calc(20 * 100vw / 768) 0 auto; padding: calc(5 * 100vw / 768) } } .main-section { padding: 20px } @media (max-width: 1199px) { .main-section { text-align: center; height: calc(707 * 100vw / 768); padding: 0 15px } } @media (max-width: 1199px) { .main-section.castle-3 { height: calc(570 * 100vw / 768) } } .main-section:before { counter-increment: section; content: "№" counter(section) ""; font-family: 'ExpRg', sans-serif; font-size: 94px; color: #FDEC34 } @media (max-width: 1199px) { .main-section:before { font-size: calc(94 / 16 * 1rem); height: calc(118 * 100vw / 768); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100% } } @media (max-width: 767px) { .main-section:before { font-size: calc(80 / 16 * 1rem); height: calc(90 * 100vw / 768) } } .main-section h2 { font-family: 'ExpBl', sans-serif; font-size: 54px } @media (max-width: 1199px) { .main-section h2 { font-size: calc(45 / 16 * 1rem) } } .main-section-ul { -ms-flex-wrap: wrap; flex-wrap: wrap } @media (max-width: 1199px) { .main-section-ul { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: calc(16 * 100vw / 768) 0 0 } } .main-section-ul li.main-li { margin-left: 25px } @media (max-width: 1199px) { .main-section-ul li.main-li { margin-left: calc(25 * 100vw / 768) } } .main-section-ul li:last-child { -webkit-box-flex: 0; -ms-flex: 0 1 100%; flex: 0 1 100% } @media (max-width: 1199px) { .main-section-ul li svg { width: calc(20 * 100vw / 768); height: auto } } @media (max-width: 767px) { .main-section-ul li svg { width: calc(26 * 100vw / 768); height: auto } .main-section-ul.ul-wrapper li{ margin: 0 auto; } } .main-section-ul span { font-family: 'CmRg', sans-serif; display: inline-block; margin: 0 5px 0; font-size: 19px; line-height: 32px; color: rgba(0, 0, 0, 0.5) } @media (max-width: 1199px) { .main-section-ul span { margin: 0 calc(3 * 100vw / 768); font-size: calc(19 / 16 * 1rem); line-height: calc(24 / 16 * 1rem); vertical-align: middle } } @media (max-width: 767px) { .main-section-ul span { font-size: calc(26 * 100vw / 768); line-height: calc(30 * 100vw / 768) } } .main-description { font-family: 'CnRg', sans-serif; font-size: 20px; line-height: 24px; max-width: 90%; color: black } .main-description p+p { font-size: 26px; line-height: 100%; margin: 10px 0 0; } @media (max-width: 1199px) { .main-description p+p { font-size: calc(26 / 16 * 1rem); margin: calc(20 * 100vw / 768) 0 0 } } @media (max-width: 767px) { .main-description p+p { font-size: calc(28 / 16 * 1rem) } } @media (max-width: 1199px) { .main-description { font-size: calc(20 / 16 * 1rem); line-height: calc(25 / 16 * 1rem); width: 90%; margin: 0 auto } } @media (max-width: 767px) { .main-description { font-size: calc(24 / 16 * 1rem); line-height: calc(28 / 16 * 1rem) } } @media (max-width: 375px) { .main-description { width: 100% } } .main-figure-help img { width: 100%; height: 100%; -o-object-position: center; object-position: center; -o-object-fit: cover; object-fit: cover; position: relative; z-index: -1 } @media (max-width: 1199px) { .main-figure-help img { height: 460px } } .main-figure-help .img-help { position: absolute; z-index: 10; left: 0; top: 0 } .footer { padding: 170px 0 0 } @media (max-width: 1199px) { .footer { padding: calc(160 * 100vw / 768) calc(15 * 100vw / 768) calc(122 * 100vw / 768) } } @media (max-width: 767px) { .footer { padding: calc(160 * 100vw / 768) calc(15 * 100vw / 768) calc(90 * 100vw / 768) } } @media (max-width: 400px) { .footer { padding: calc(160 * 100vw / 768) calc(15 * 100vw / 768) calc(30 * 100vw / 768) } } .footer h3 { font-family: 'ExtBd', sans-serif; font-size: 28px; margin: 0 0 37px } @media (max-width: 1199px) { .footer h3 { font-size: calc(28 / 16 * 1rem); line-height: calc(35 / 16 * 1rem); margin: 0 0 calc(32 * 100vw / 768) } } .footer h3 span { display: block } .footer .ul-social { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0 0 133px } @media (max-width: 1199px) { .footer .ul-social { margin: 0 0 calc(133 * 100vw / 768) } } .footer .ul-social li { margin: 0 30px } @media (max-width: 1199px) { .footer .ul-social li { margin: 0 calc(25 * 100vw / 768) } } .footer .ul-social a { display: block; height: 100% } .footer .ul-social a path { -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease } .footer .ul-social a:hover path { fill: #0952FD } @media (max-width: 1199px) { .footer .ul-social a { width: calc(50 * 100vw / 768); height: calc(50 * 100vw / 768) } .footer .ul-social a:hover path { fill: #000 } .footer .ul-social a svg { width: 100%; height: auto } } .footer .footer-bottom { -webkit-box-align: center; -ms-flex-align: center; align-items: center } .footer .footer-bottom li { -webkit-box-flex: 0; -ms-flex: 0 1 33%; flex: 0 1 33% } .footer .footer-bottom-list { padding: 14px 36px; font-family: 'CnBd', sans-serif; font-weight: 400; font-size: 20px; line-height: 100%; background: #FDEC34; margin: 0 20px; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; border: 2px solid #FDEC34; color: #000 } .footer .footer-bottom-list:hover { background: #fff } @media (max-width: 1199px) { .footer .footer-bottom-list { padding: calc(14 * 100vw / 768) calc(36 * 100vw / 768); margin: 0; font-size: calc(20 / 16 * 1rem) } } @media (max-width: 767px) { .footer .footer-bottom-list { position: absolute; top: calc(-70 * 100vw / 768); left: calc( 50vw - calc(136 * 100vw / 768)) } } .footer .footer-bottom .footer-company { font-family: 'ExpBl', sans-serif; font-size: 28px; line-height: 35px; color: #000 } @media (max-width: 1199px) { .footer .footer-bottom .footer-company { font-size: calc(28 / 16 * 1rem); line-height: calc(35 / 16 * 1rem) } } .footer .footer-bottom .footer-company:hover { color: rgba(0, 0, 0, 0.7) } @media (max-width: 1199px) { .footer-logo { width: calc(157 * 100vw / 768) } } @media (max-width: 1199px) { .footer-logo svg { width: 100% } } @keyframes fadeInUp { 0% { opacity: 0; z-index: 10; position: relative; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px) } 100% { opacity: 1; position: relative; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } .fadeIn { -webkit-animation-duration: 1.2s; animation-duration: 1.2s } /* скрытые кнопки */ /* больше фото */ /* .main-image a, .main-image a:hover{ color: transparent; pointer-events: none; } */ /* список мандрив в шапке */ /* .tour-list a{ color: transparent; pointer-events: none; background: transparent; } */ /* список мандрив в футере */ /* .footer .footer-bottom-list{ color: transparent; pointer-events: none; background: transparent; border-color: transparent; } */