.swiper-container { margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1 }
.swiper-container-no-flexbox .swiper-slide { float: left }
.swiper-container-vertical>.swiper-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column }
.swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; box-sizing: content-box }
.swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translateZ(0); transform: translateZ(0) }
.swiper-container-multirow>.swiper-wrapper { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap }
.swiper-container-free-mode>.swiper-wrapper { -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto }
.swiper-slide { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform }
.swiper-invisible-blank-slide { visibility: hidden }
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide { height: auto }
.swiper-container-autoheight .swiper-wrapper { -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-transition-property: height, -webkit-transform; transition-property: height, -webkit-transform; transition-property: transform, height; transition-property: transform, height, -webkit-transform }
.swiper-container-3d { -webkit-perspective: 1200px; perspective: 1200px }
.swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper { -webkit-transform-style: preserve-3d; transform-style: preserve-3d }
.swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10 }
.swiper-container-3d .swiper-slide-shadow-left { background-image: -webkit-gradient(linear, right top, left top, from(rgba(0,0,0,.5)), to(transparent)); background-image: -webkit-linear-gradient(right, rgba(0,0,0,.5), transparent); background-image: linear-gradient(270deg, rgba(0,0,0,.5), transparent) }
.swiper-container-3d .swiper-slide-shadow-right { background-image: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,.5)), to(transparent)); background-image: -webkit-linear-gradient(left, rgba(0,0,0,.5), transparent); background-image: linear-gradient(90deg, rgba(0,0,0,.5), transparent) }
.swiper-container-3d .swiper-slide-shadow-top { background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0,0,0,.5)), to(transparent)); background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,.5), transparent); background-image: linear-gradient(0deg, rgba(0,0,0,.5), transparent) }
.swiper-container-3d .swiper-slide-shadow-bottom { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,.5)), to(transparent)); background-image: -webkit-linear-gradient(top, rgba(0,0,0,.5), transparent); background-image: linear-gradient(180deg, rgba(0,0,0,.5), transparent) }
.swiper-container-wp8-horizontal, .swiper-container-wp8-horizontal>.swiper-wrapper { -ms-touch-action: pan-y; touch-action: pan-y }
.swiper-container-wp8-vertical, .swiper-container-wp8-vertical>.swiper-wrapper { -ms-touch-action: pan-x; touch-action: pan-x }
.swiper-button-next, .swiper-button-prev { position: absolute; top: 50%; width: 27px; height: 44px; margin-top: -22px; z-index: 10; cursor: pointer; background-size: 27px 44px; background-position: 50%; background-repeat: no-repeat }
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { opacity: .35; cursor: auto; pointer-events: none }
.swiper-button-prev, .swiper-container-rtl .swiper-button-next { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23007aff'/%3E%3C/svg%3E"); left: 10px; right: auto }
.swiper-button-next, .swiper-container-rtl .swiper-button-prev { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23007aff'/%3E%3C/svg%3E"); right: 10px; left: auto }
.swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23fff'/%3E%3C/svg%3E") }
.swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23fff'/%3E%3C/svg%3E") }
.swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z'/%3E%3C/svg%3E") }
.swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z'/%3E%3C/svg%3E") }
.swiper-button-lock { display: none }
.swiper-pagination { position: absolute; text-align: center; -webkit-transition: opacity .3s; transition: opacity .3s; -webkit-transform: translateZ(0); transform: translateZ(0); z-index: 10 }
.swiper-pagination.swiper-pagination-hidden { opacity: 0 }
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 10px; left: 0; width: 100% }
.swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0 }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transform: scale(.33); transform: scale(.33); position: relative }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { -webkit-transform: scale(1); transform: scale(1) }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { -webkit-transform: scale(.66); transform: scale(.66) }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { -webkit-transform: scale(.33); transform: scale(.33) }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { -webkit-transform: scale(.66); transform: scale(.66) }
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { -webkit-transform: scale(.33); transform: scale(.33) }
.swiper-pagination-bullet { width: 8px; height: 8px; display: inline-block; border-radius: 100%; background: #000; opacity: .2 }
button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none }
.swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer }
.swiper-pagination-bullet-active { opacity: 1; background: #007aff }
.swiper-container-vertical>.swiper-pagination-bullets { right: 10px; top: 50%; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 6px 0; display: block }
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 8px }
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; -webkit-transition: top .2s, -webkit-transform .2s; transition: top .2s, -webkit-transform .2s; -webkit-transition: transform .2s, top .2s; transition: transform .2s, top .2s; -webkit-transition: transform .2s, top .2s, -webkit-transform .2s; transition: transform .2s, top .2s, -webkit-transform .2s }
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 4px }
.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap }
.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition: left .2s, -webkit-transform .2s; transition: left .2s, -webkit-transform .2s; -webkit-transition: transform .2s, left .2s; transition: transform .2s, left .2s; -webkit-transition: transform .2s, left .2s, -webkit-transform .2s; transition: transform .2s, left .2s, -webkit-transform .2s }
.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition: right .2s, -webkit-transform .2s; transition: right .2s, -webkit-transform .2s; -webkit-transition: transform .2s, right .2s; transition: transform .2s, right .2s; -webkit-transition: transform .2s, right .2s, -webkit-transform .2s; transition: transform .2s, right .2s, -webkit-transform .2s }
.swiper-pagination-progressbar { background: rgba(0,0,0,.25); position: absolute }
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: #007aff; position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: left top; transform-origin: left top }
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { -webkit-transform-origin: right top; transform-origin: right top }
.swiper-container-horizontal>.swiper-pagination-progressbar { width: 100%; height: 4px; left: 0; top: 0 }
.swiper-container-vertical>.swiper-pagination-progressbar { width: 4px; height: 100%; left: 0; top: 0 }
.swiper-pagination-white .swiper-pagination-bullet-active { background: #fff }
.swiper-pagination-progressbar.swiper-pagination-white { background: hsla(0,0%,100%,.25) }
.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill { background: #fff }
.swiper-pagination-black .swiper-pagination-bullet-active { background: #000 }
.swiper-pagination-progressbar.swiper-pagination-black { background: rgba(0,0,0,.25) }
.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill { background: #000 }
.swiper-pagination-lock { display: none }
.swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1) }
.swiper-container-horizontal>.swiper-scrollbar { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98% }
.swiper-container-vertical>.swiper-scrollbar { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98% }
.swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 10px; left: 0; top: 0 }
.swiper-scrollbar-cursor-drag { cursor: move }
.swiper-scrollbar-lock { display: none }
.swiper-zoom-container { width: 100%; height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center }
.swiper-zoom-container>canvas, .swiper-zoom-container>img, .swiper-zoom-container>svg { max-width: 100%; max-height: 100%; object-fit: contain }
.swiper-slide-zoomed { cursor: move }
.swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-animation: swiper-preloader-spin 1s steps(12) infinite; animation: swiper-preloader-spin 1s steps(12) infinite }
.swiper-lazy-preloader:after { display: block; content: ""; width: 100%; height: 100%; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%236c6c6c' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E"); background-position: 50%; background-size: 100%; background-repeat: no-repeat }
.swiper-lazy-preloader-white:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%23fff' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E") }
@-webkit-keyframes swiper-preloader-spin { to {
-webkit-transform:rotate(1turn);
transform:rotate(1turn)
}
}
@keyframes swiper-preloader-spin { to {
-webkit-transform:rotate(1turn);
transform:rotate(1turn)
}
}
.swiper-container .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000 }
.swiper-container-fade.swiper-container-free-mode .swiper-slide { -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out }
.swiper-container-fade .swiper-slide { pointer-events: none; -webkit-transition-property: opacity; transition-property: opacity }
.swiper-container-fade .swiper-slide .swiper-slide { pointer-events: none }
.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto }
.swiper-container-cube { overflow: visible }
.swiper-container-cube .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; visibility: hidden; -webkit-transform-origin: 0 0; transform-origin: 0 0; width: 100%; height: 100% }
.swiper-container-cube .swiper-slide .swiper-slide { pointer-events: none }
.swiper-container-cube.swiper-container-rtl .swiper-slide { -webkit-transform-origin: 100% 0; transform-origin: 100% 0 }
.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active { pointer-events: auto }
.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next+.swiper-slide, .swiper-container-cube .swiper-slide-prev { pointer-events: auto; visibility: visible }
.swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden }
.swiper-container-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; background: #000; opacity: .6; -webkit-filter: blur(50px); filter: blur(50px); z-index: 0 }
.swiper-container-flip { overflow: visible }
.swiper-container-flip .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1 }
.swiper-container-flip .swiper-slide .swiper-slide { pointer-events: none }
.swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active { pointer-events: auto }
.swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden }
.swiper-container-coverflow .swiper-wrapper { -ms-perspective: 1200px }
.fp-enabled body, html.fp-enabled { margin: 0; padding: 0; overflow: hidden; -webkit-tap-highlight-color: rgba(0,0,0,0) }
.fp-section { position: relative; box-sizing: border-box }
.fp-slide { float: left }
.fp-slide, .fp-slidesContainer { height: 100%; display: block }
.fp-slides { z-index: 1; height: 100%; overflow: hidden; position: relative; -webkit-transition: all .3s ease-out; transition: all .3s ease-out }
.fp-section.fp-table, .fp-slide.fp-table { display: table; table-layout: fixed; width: 100% }
.fp-tableCell { display: table-cell; vertical-align: middle; width: 100%; height: 100% }
.fp-slidesContainer { float: left; position: relative }
.fp-controlArrow { -webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select: none; position: absolute; z-index: 4; top: 50%; cursor: pointer; width: 0; height: 0; border-style: solid; margin-top: -38px; -webkit-transform: translateZ(0); transform: translateZ(0) }
.fp-controlArrow.fp-prev { left: 15px; width: 0; border-width: 38.5px 34px 38.5px 0; border-color: transparent #fff transparent transparent }
.fp-controlArrow.fp-next { right: 15px; border-width: 38.5px 0 38.5px 34px; border-color: transparent transparent transparent #fff }
.fp-scrollable { position: relative }
.fp-scrollable, .fp-scroller { overflow: hidden }
.iScrollIndicator { border: 0!important }
.fp-notransition { -webkit-transition: none!important; transition: none!important }
#fp-nav { position: fixed; z-index: 100; margin-top: -32px; top: 50%; opacity: 1; -webkit-transform: translateZ(0) }
#fp-nav.right { right: 17px }
#fp-nav.left { left: 17px }
.fp-slidesNav { position: absolute; z-index: 4; opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0); left: 0!important; right: 0; margin: 0 auto!important }
.fp-slidesNav.bottom { bottom: 17px }
.fp-slidesNav.top { top: 17px }
#fp-nav ul, .fp-slidesNav ul { margin: 0; padding: 0 }
#fp-nav ul li, .fp-slidesNav ul li { display: block; width: 14px; height: 13px; margin: 7px; position: relative }
.fp-slidesNav ul li { display: inline-block }
#fp-nav ul li a, .fp-slidesNav ul li a { display: block; position: relative; z-index: 1; width: 100%; height: 100%; cursor: pointer; text-decoration: none }
#fp-nav ul li:hover a.active span, #fp-nav ul li a.active span, .fp-slidesNav ul li:hover a.active span, .fp-slidesNav ul li a.active span { height: 12px; width: 12px; margin: -6px 0 0 -6px; border-radius: 100% }
#fp-nav ul li a span, .fp-slidesNav ul li a span { border-radius: 50%; position: absolute; z-index: 1; height: 4px; width: 4px; border: 0; background: #333; left: 50%; top: 50%; margin: -2px 0 0 -2px; -webkit-transition: all .1s ease-in-out; transition: all .1s ease-in-out }
#fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span { width: 10px; height: 10px; margin: -5px 0 0 -5px }
#fp-nav ul li .fp-tooltip { position: absolute; top: -2px; color: #fff; font-size: 14px; font-family: arial, helvetica, sans-serif; white-space: nowrap; max-width: 220px; overflow: hidden; display: block; opacity: 0; width: 0; cursor: pointer }
#fp-nav.fp-show-active a.active+.fp-tooltip, #fp-nav ul li:hover .fp-tooltip { -webkit-transition: opacity .2s ease-in; transition: opacity .2s ease-in; width: auto; opacity: 1 }
#fp-nav ul li .fp-tooltip.right { right: 20px }
#fp-nav ul li .fp-tooltip.left { left: 20px }
.fp-auto-height.fp-section, .fp-auto-height .fp-slide, .fp-auto-height .fp-tableCell, .fp-responsive .fp-auto-height-responsive.fp-section, .fp-responsive .fp-auto-height-responsive .fp-slide, .fp-responsive .fp-auto-height-responsive .fp-tableCell { height: auto!important }
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both }
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite }
.animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s }
.animated.bounceIn, .animated.bounceOut, .animated.flipOutX, .animated.flipOutY { -webkit-animation-duration: .75s; animation-duration: .75s }
@-webkit-keyframes bounce { 0%, 20%, 53%, 80%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1);
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
40%, 43% {
-webkit-animation-timing-function:cubic-bezier(.755, .05, .855, .06);
animation-timing-function:cubic-bezier(.755, .05, .855, .06);
-webkit-transform:translate3d(0, -30px, 0);
transform:translate3d(0, -30px, 0)
}
70% {
-webkit-animation-timing-function:cubic-bezier(.755, .05, .855, .06);
animation-timing-function:cubic-bezier(.755, .05, .855, .06);
-webkit-transform:translate3d(0, -15px, 0);
transform:translate3d(0, -15px, 0)
}
90% {
-webkit-transform:translate3d(0, -4px, 0);
transform:translate3d(0, -4px, 0)
}
}
@keyframes bounce { 0%, 20%, 53%, 80%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1);
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
40%, 43% {
-webkit-animation-timing-function:cubic-bezier(.755, .05, .855, .06);
animation-timing-function:cubic-bezier(.755, .05, .855, .06);
-webkit-transform:translate3d(0, -30px, 0);
transform:translate3d(0, -30px, 0)
}
70% {
-webkit-animation-timing-function:cubic-bezier(.755, .05, .855, .06);
animation-timing-function:cubic-bezier(.755, .05, .855, .06);
-webkit-transform:translate3d(0, -15px, 0);
transform:translate3d(0, -15px, 0)
}
90% {
-webkit-transform:translate3d(0, -4px, 0);
transform:translate3d(0, -4px, 0)
}
}
.bounce { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; transform-origin: center bottom }
@-webkit-keyframes flash { 0%, 50%, to {
opacity:1
}
25%, 75% {
opacity:0
}
}
@keyframes flash { 0%, 50%, to {
opacity:1
}
25%, 75% {
opacity:0
}
}
.flash { -webkit-animation-name: flash; animation-name: flash }
@-webkit-keyframes pulse { 0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
50% {
-webkit-transform:scale3d(1.05, 1.05, 1.05);
transform:scale3d(1.05, 1.05, 1.05)
}
to { -webkit-transform: scaleX(1); transform: scaleX(1) }
}
@keyframes pulse { 0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
50% {
-webkit-transform:scale3d(1.05, 1.05, 1.05);
transform:scale3d(1.05, 1.05, 1.05)
}
to { -webkit-transform: scaleX(1); transform: scaleX(1) }
}
.pulse { -webkit-animation-name: pulse; animation-name: pulse }
@-webkit-keyframes rubberBand { 0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
30% {
-webkit-transform:scale3d(1.25, .75, 1);
transform:scale3d(1.25, .75, 1)
}
40% {
-webkit-transform:scale3d(.75, 1.25, 1);
transform:scale3d(.75, 1.25, 1)
}
50% {
-webkit-transform:scale3d(1.15, .85, 1);
transform:scale3d(1.15, .85, 1)
}
65% {
-webkit-transform:scale3d(.95, 1.05, 1);
transform:scale3d(.95, 1.05, 1)
}
75% {
-webkit-transform:scale3d(1.05, .95, 1);
transform:scale3d(1.05, .95, 1)
}
to { -webkit-transform: scaleX(1); transform: scaleX(1) }
}
@keyframes rubberBand { 0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
30% {
-webkit-transform:scale3d(1.25, .75, 1);
transform:scale3d(1.25, .75, 1)
}
40% {
-webkit-transform:scale3d(.75, 1.25, 1);
transform:scale3d(.75, 1.25, 1)
}
50% {
-webkit-transform:scale3d(1.15, .85, 1);
transform:scale3d(1.15, .85, 1)
}
65% {
-webkit-transform:scale3d(.95, 1.05, 1);
transform:scale3d(.95, 1.05, 1)
}
75% {
-webkit-transform:scale3d(1.05, .95, 1);
transform:scale3d(1.05, .95, 1)
}
to { -webkit-transform: scaleX(1); transform: scaleX(1) }
}
.rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand }
@-webkit-keyframes shake { 0%, to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
20%, 40%, 60%, 80% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
}
@keyframes shake { 0%, to {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
20%, 40%, 60%, 80% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
}
.shake { -webkit-animation-name: shake; animation-name: shake }
@-webkit-keyframes headShake { 0% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
6.5% {
-webkit-transform:translateX(-6px) rotateY(-9deg);
transform:translateX(-6px) rotateY(-9deg)
}
18.5% {
-webkit-transform:translateX(5px) rotateY(7deg);
transform:translateX(5px) rotateY(7deg)
}
31.5% {
-webkit-transform:translateX(-3px) rotateY(-5deg);
transform:translateX(-3px) rotateY(-5deg)
}
43.5% {
-webkit-transform:translateX(2px) rotateY(3deg);
transform:translateX(2px) rotateY(3deg)
}
50% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes headShake { 0% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
6.5% {
-webkit-transform:translateX(-6px) rotateY(-9deg);
transform:translateX(-6px) rotateY(-9deg)
}
18.5% {
-webkit-transform:translateX(5px) rotateY(7deg);
transform:translateX(5px) rotateY(7deg)
}
31.5% {
-webkit-transform:translateX(-3px) rotateY(-5deg);
transform:translateX(-3px) rotateY(-5deg)
}
43.5% {
-webkit-transform:translateX(2px) rotateY(3deg);
transform:translateX(2px) rotateY(3deg)
}
50% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
.headShake { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: headShake; animation-name: headShake }
@-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)
}
to { -webkit-transform: rotate(0deg); transform: rotate(0deg) }
}
@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)
}
to { -webkit-transform: rotate(0deg); transform: rotate(0deg) }
}
.swing { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing }
@-webkit-keyframes tada { 0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
10%, 20% {
-webkit-transform:scale3d(.9, .9, .9) rotate(-3deg);
transform:scale3d(.9, .9, .9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate(3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate(-3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate(-3deg)
}
to { -webkit-transform: scaleX(1); transform: scaleX(1) }
}
@keyframes tada { 0% {
-webkit-transform:scaleX(1);
transform:scaleX(1)
}
10%, 20% {
-webkit-transform:scale3d(.9, .9, .9) rotate(-3deg);
transform:scale3d(.9, .9, .9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate(3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate(-3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate(-3deg)
}
to { -webkit-transform: scaleX(1); transform: scaleX(1) }
}
.tada { -webkit-animation-name: tada; animation-name: tada }
@-webkit-keyframes wobble { 0% {
-webkit-transform:none;
transform:none
}
15% {
-webkit-transform:translate3d(-25%, 0, 0) rotate(-5deg);
transform:translate3d(-25%, 0, 0) rotate(-5deg)
}
30% {
-webkit-transform:translate3d(20%, 0, 0) rotate(3deg);
transform:translate3d(20%, 0, 0) rotate(3deg)
}
45% {
-webkit-transform:translate3d(-15%, 0, 0) rotate(-3deg);
transform:translate3d(-15%, 0, 0) rotate(-3deg)
}
60% {
-webkit-transform:translate3d(10%, 0, 0) rotate(2deg);
transform:translate3d(10%, 0, 0) rotate(2deg)
}
75% {
-webkit-transform:translate3d(-5%, 0, 0) rotate(-1deg);
transform:translate3d(-5%, 0, 0) rotate(-1deg)
}
to { -webkit-transform: none; transform: none }
}
@keyframes wobble { 0% {
-webkit-transform:none;
transform:none
}
15% {
-webkit-transform:translate3d(-25%, 0, 0) rotate(-5deg);
transform:translate3d(-25%, 0, 0) rotate(-5deg)
}
30% {
-webkit-transform:translate3d(20%, 0, 0) rotate(3deg);
transform:translate3d(20%, 0, 0) rotate(3deg)
}
45% {
-webkit-transform:translate3d(-15%, 0, 0) rotate(-3deg);
transform:translate3d(-15%, 0, 0) rotate(-3deg)
}
60% {
-webkit-transform:translate3d(10%, 0, 0) rotate(2deg);
transform:translate3d(10%, 0, 0) rotate(2deg)
}
75% {
-webkit-transform:translate3d(-5%, 0, 0) rotate(-1deg);
transform:translate3d(-5%, 0, 0) rotate(-1deg)
}
to { -webkit-transform: none; transform: none }
}
.wobble { -webkit-animation-name: wobble; animation-name: wobble }
@-webkit-keyframes jello { 0%, 11.1%, to {
-webkit-transform:none;
transform:none
}
22.2% {
-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);
transform:skewX(-12.5deg) skewY(-12.5deg)
}
33.3% {
-webkit-transform:skewX(6.25deg) skewY(6.25deg);
transform:skewX(6.25deg) skewY(6.25deg)
}
44.4% {
-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);
transform:skewX(-3.125deg) skewY(-3.125deg)
}
55.5% {
-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);
transform:skewX(1.5625deg) skewY(1.5625deg)
}
66.6% {
-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);
transform:skewX(-.78125deg) skewY(-.78125deg)
}
77.7% {
-webkit-transform:skewX(.39062deg) skewY(.39062deg);
transform:skewX(.39062deg) skewY(.39062deg)
}
88.8% {
-webkit-transform:skewX(-.19531deg) skewY(-.19531deg);
transform:skewX(-.19531deg) skewY(-.19531deg)
}
}
@keyframes jello { 0%, 11.1%, to {
-webkit-transform:none;
transform:none
}
22.2% {
-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);
transform:skewX(-12.5deg) skewY(-12.5deg)
}
33.3% {
-webkit-transform:skewX(6.25deg) skewY(6.25deg);
transform:skewX(6.25deg) skewY(6.25deg)
}
44.4% {
-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);
transform:skewX(-3.125deg) skewY(-3.125deg)
}
55.5% {
-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);
transform:skewX(1.5625deg) skewY(1.5625deg)
}
66.6% {
-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);
transform:skewX(-.78125deg) skewY(-.78125deg)
}
77.7% {
-webkit-transform:skewX(.39062deg) skewY(.39062deg);
transform:skewX(.39062deg) skewY(.39062deg)
}
88.8% {
-webkit-transform:skewX(-.19531deg) skewY(-.19531deg);
transform:skewX(-.19531deg) skewY(-.19531deg)
}
}
.jello { -webkit-animation-name: jello; animation-name: jello; -webkit-transform-origin: center; transform-origin: center }
@-webkit-keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
20% {
-webkit-transform:scale3d(1.1, 1.1, 1.1);
transform:scale3d(1.1, 1.1, 1.1)
}
40% {
-webkit-transform:scale3d(.9, .9, .9);
transform:scale3d(.9, .9, .9)
}
60% {
opacity:1;
-webkit-transform:scale3d(1.03, 1.03, 1.03);
transform:scale3d(1.03, 1.03, 1.03)
}
80% {
-webkit-transform:scale3d(.97, .97, .97);
transform:scale3d(.97, .97, .97)
}
to { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1) }
}
@keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
20% {
-webkit-transform:scale3d(1.1, 1.1, 1.1);
transform:scale3d(1.1, 1.1, 1.1)
}
40% {
-webkit-transform:scale3d(.9, .9, .9);
transform:scale3d(.9, .9, .9)
}
60% {
opacity:1;
-webkit-transform:scale3d(1.03, 1.03, 1.03);
transform:scale3d(1.03, 1.03, 1.03)
}
80% {
-webkit-transform:scale3d(.97, .97, .97);
transform:scale3d(.97, .97, .97)
}
to { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1) }
}
.bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn }
@-webkit-keyframes bounceInDown { 0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, -3000px, 0);
transform:translate3d(0, -3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, 25px, 0);
transform:translate3d(0, 25px, 0)
}
75% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
90% {
-webkit-transform:translate3d(0, 5px, 0);
transform:translate3d(0, 5px, 0)
}
to { -webkit-transform: none; transform: none }
}
@keyframes bounceInDown { 0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, -3000px, 0);
transform:translate3d(0, -3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, 25px, 0);
transform:translate3d(0, 25px, 0)
}
75% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
90% {
-webkit-transform:translate3d(0, 5px, 0);
transform:translate3d(0, 5px, 0)
}
to { -webkit-transform: none; transform: none }
}
.bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown }
@-webkit-keyframes bounceInLeft { 0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(-3000px, 0, 0);
transform:translate3d(-3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(25px, 0, 0);
transform:translate3d(25px, 0, 0)
}
75% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
90% {
-webkit-transform:translate3d(5px, 0, 0);
transform:translate3d(5px, 0, 0)
}
to { -webkit-transform: none; transform: none }
}
@keyframes bounceInLeft { 0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(-3000px, 0, 0);
transform:translate3d(-3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(25px, 0, 0);
transform:translate3d(25px, 0, 0)
}
75% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
90% {
-webkit-transform:translate3d(5px, 0, 0);
transform:translate3d(5px, 0, 0)
}
to { -webkit-transform: none; transform: none }
}
.bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft }
@-webkit-keyframes bounceInRight { 0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(3000px, 0, 0);
transform:translate3d(3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(-25px, 0, 0);
transform:translate3d(-25px, 0, 0)
}
75% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
90% {
-webkit-transform:translate3d(-5px, 0, 0);
transform:translate3d(-5px, 0, 0)
}
to { -webkit-transform: none; transform: none }
}
@keyframes bounceInRight { 0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(3000px, 0, 0);
transform:translate3d(3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(-25px, 0, 0);
transform:translate3d(-25px, 0, 0)
}
75% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
90% {
-webkit-transform:translate3d(-5px, 0, 0);
transform:translate3d(-5px, 0, 0)
}
to { -webkit-transform: none; transform: none }
}
.bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight }
@-webkit-keyframes bounceInUp { 0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, 3000px, 0);
transform:translate3d(0, 3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, -20px, 0);
transform:translate3d(0, -20px, 0)
}
75% {
-webkit-transform:translate3d(0, 10px, 0);
transform:translate3d(0, 10px, 0)
}
90% {
-webkit-transform:translate3d(0, -5px, 0);
transform:translate3d(0, -5px, 0)
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
@keyframes bounceInUp { 0%, 60%, 75%, 90%, to {
-webkit-animation-timing-function:cubic-bezier(.215, .61, .355, 1);
animation-timing-function:cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, 3000px, 0);
transform:translate3d(0, 3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, -20px, 0);
transform:translate3d(0, -20px, 0)
}
75% {
-webkit-transform:translate3d(0, 10px, 0);
transform:translate3d(0, 10px, 0)
}
90% {
-webkit-transform:translate3d(0, -5px, 0);
transform:translate3d(0, -5px, 0)
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
.bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp }
@-webkit-keyframes bounceOut { 20% {
-webkit-transform:scale3d(.9, .9, .9);
transform:scale3d(.9, .9, .9)
}
50%, 55% {
opacity:1;
-webkit-transform:scale3d(1.1, 1.1, 1.1);
transform:scale3d(1.1, 1.1, 1.1)
}
to { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3) }
}
@keyframes bounceOut { 20% {
-webkit-transform:scale3d(.9, .9, .9);
transform:scale3d(.9, .9, .9)
}
50%, 55% {
opacity:1;
-webkit-transform:scale3d(1.1, 1.1, 1.1);
transform:scale3d(1.1, 1.1, 1.1)
}
to { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3) }
}
.bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut }
@-webkit-keyframes bounceOutDown { 20% {
-webkit-transform:translate3d(0, 10px, 0);
transform:translate3d(0, 10px, 0)
}
40%, 45% {
opacity:1;
-webkit-transform:translate3d(0, -20px, 0);
transform:translate3d(0, -20px, 0)
}
to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0) }
}
@keyframes bounceOutDown { 20% {
-webkit-transform:translate3d(0, 10px, 0);
transform:translate3d(0, 10px, 0)
}
40%, 45% {
opacity:1;
-webkit-transform:translate3d(0, -20px, 0);
transform:translate3d(0, -20px, 0)
}
to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0) }
}
.bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown }
@-webkit-keyframes bounceOutLeft { 20% {
opacity:1;
-webkit-transform:translate3d(20px, 0, 0);
transform:translate3d(20px, 0, 0)
}
to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0) }
}
@keyframes bounceOutLeft { 20% {
opacity:1;
-webkit-transform:translate3d(20px, 0, 0);
transform:translate3d(20px, 0, 0)
}
to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0) }
}
.bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft }
@-webkit-keyframes bounceOutRight { 20% {
opacity:1;
-webkit-transform:translate3d(-20px, 0, 0);
transform:translate3d(-20px, 0, 0)
}
to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0) }
}
@keyframes bounceOutRight { 20% {
opacity:1;
-webkit-transform:translate3d(-20px, 0, 0);
transform:translate3d(-20px, 0, 0)
}
to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0) }
}
.bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight }
@-webkit-keyframes bounceOutUp { 20% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
40%, 45% {
opacity:1;
-webkit-transform:translate3d(0, 20px, 0);
transform:translate3d(0, 20px, 0)
}
to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0) }
}
@keyframes bounceOutUp { 20% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
40%, 45% {
opacity:1;
-webkit-transform:translate3d(0, 20px, 0);
transform:translate3d(0, 20px, 0)
}
to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0) }
}
.bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp }
@-webkit-keyframes fadeIn { 0% {
opacity:0
}
to { opacity: 1 }
}
@keyframes fadeIn { 0% {
opacity:0
}
to { opacity: 1 }
}
.fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn }
@-webkit-keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown }
@-webkit-keyframes fadeInDownBig { 0% {
opacity:0;
-webkit-transform:translate3d(0, -2000px, 0);
transform:translate3d(0, -2000px, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInDownBig { 0% {
opacity:0;
-webkit-transform:translate3d(0, -2000px, 0);
transform:translate3d(0, -2000px, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig }
@-webkit-keyframes fadeInLeft { 0% {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInLeft { 0% {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft }
@-webkit-keyframes fadeInLeftBig { 0% {
opacity:0;
-webkit-transform:translate3d(-2000px, 0, 0);
transform:translate3d(-2000px, 0, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInLeftBig { 0% {
opacity:0;
-webkit-transform:translate3d(-2000px, 0, 0);
transform:translate3d(-2000px, 0, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig }
@-webkit-keyframes fadeInRight { 0% {
opacity:0;
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInRight { 0% {
opacity:0;
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight }
@-webkit-keyframes fadeInRightBig { 0% {
opacity:0;
-webkit-transform:translate3d(2000px, 0, 0);
transform:translate3d(2000px, 0, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInRightBig { 0% {
opacity:0;
-webkit-transform:translate3d(2000px, 0, 0);
transform:translate3d(2000px, 0, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig }
@-webkit-keyframes fadeInUp { 0% {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInUp { 0% {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp }
@-webkit-keyframes fadeInUpBig { 0% {
opacity:0;
-webkit-transform:translate3d(0, 2000px, 0);
transform:translate3d(0, 2000px, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInUpBig { 0% {
opacity:0;
-webkit-transform:translate3d(0, 2000px, 0);
transform:translate3d(0, 2000px, 0)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig }
@-webkit-keyframes fadeOut { 0% {
opacity:1
}
to { opacity: 0 }
}
@keyframes fadeOut { 0% {
opacity:1
}
to { opacity: 0 }
}
.fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut }
@-webkit-keyframes fadeOutDown { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0) }
}
@keyframes fadeOutDown { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0) }
}
.fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown }
@-webkit-keyframes fadeOutDownBig { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0) }
}
@keyframes fadeOutDownBig { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0) }
}
.fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig }
@-webkit-keyframes fadeOutLeft { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0) }
}
@keyframes fadeOutLeft { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0) }
}
.fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft }
@-webkit-keyframes fadeOutLeftBig { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0) }
}
@keyframes fadeOutLeftBig { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0) }
}
.fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig }
@-webkit-keyframes fadeOutRight { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0) }
}
@keyframes fadeOutRight { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0) }
}
.fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight }
@-webkit-keyframes fadeOutRightBig { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0) }
}
@keyframes fadeOutRightBig { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0) }
}
.fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig }
@-webkit-keyframes fadeOutUp { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0) }
}
@keyframes fadeOutUp { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0) }
}
.fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp }
@-webkit-keyframes fadeOutUpBig { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0) }
}
@keyframes fadeOutUpBig { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0) }
}
.fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig }
@-webkit-keyframes flip { 0% {
-webkit-transform:perspective(400px) rotateY(-1turn);
transform:perspective(400px) rotateY(-1turn);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
40% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg);
transform:perspective(400px) translateZ(150px) rotateY(-190deg);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
50% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg);
transform:perspective(400px) translateZ(150px) rotateY(-170deg);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
80% {
-webkit-transform:perspective(400px) scale3d(.95, .95, .95);
transform:perspective(400px) scale3d(.95, .95, .95);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in }
}
@keyframes flip { 0% {
-webkit-transform:perspective(400px) rotateY(-1turn);
transform:perspective(400px) rotateY(-1turn);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
40% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg);
transform:perspective(400px) translateZ(150px) rotateY(-190deg);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
50% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg);
transform:perspective(400px) translateZ(150px) rotateY(-170deg);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
80% {
-webkit-transform:perspective(400px) scale3d(.95, .95, .95);
transform:perspective(400px) scale3d(.95, .95, .95);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
to { -webkit-transform: perspective(400px); transform: perspective(400px); -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);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in;
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateX(-20deg);
transform:perspective(400px) rotateX(-20deg);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
60% {
-webkit-transform:perspective(400px) rotateX(10deg);
transform:perspective(400px) rotateX(10deg);
opacity:1
}
80% {
-webkit-transform:perspective(400px) rotateX(-5deg);
transform:perspective(400px) rotateX(-5deg)
}
to { -webkit-transform: perspective(400px); transform: perspective(400px) }
}
@keyframes flipInX { 0% {
-webkit-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in;
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateX(-20deg);
transform:perspective(400px) rotateX(-20deg);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
60% {
-webkit-transform:perspective(400px) rotateX(10deg);
transform:perspective(400px) rotateX(10deg);
opacity:1
}
80% {
-webkit-transform:perspective(400px) rotateX(-5deg);
transform:perspective(400px) rotateX(-5deg)
}
to { -webkit-transform: perspective(400px); transform: perspective(400px) }
}
.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);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in;
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateY(-20deg);
transform:perspective(400px) rotateY(-20deg);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
60% {
-webkit-transform:perspective(400px) rotateY(10deg);
transform:perspective(400px) rotateY(10deg);
opacity:1
}
80% {
-webkit-transform:perspective(400px) rotateY(-5deg);
transform:perspective(400px) rotateY(-5deg)
}
to { -webkit-transform: perspective(400px); transform: perspective(400px) }
}
@keyframes flipInY { 0% {
-webkit-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in;
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateY(-20deg);
transform:perspective(400px) rotateY(-20deg);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
60% {
-webkit-transform:perspective(400px) rotateY(10deg);
transform:perspective(400px) rotateY(10deg);
opacity:1
}
80% {
-webkit-transform:perspective(400px) rotateY(-5deg);
transform:perspective(400px) rotateY(-5deg)
}
to { -webkit-transform: perspective(400px); transform: perspective(400px) }
}
.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);
transform:perspective(400px)
}
30% {
-webkit-transform:perspective(400px) rotateX(-20deg);
transform:perspective(400px) rotateX(-20deg);
opacity:1
}
to { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0 }
}
@keyframes flipOutX { 0% {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
30% {
-webkit-transform:perspective(400px) rotateX(-20deg);
transform:perspective(400px) rotateX(-20deg);
opacity:1
}
to { -webkit-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);
transform:perspective(400px)
}
30% {
-webkit-transform:perspective(400px) rotateY(-15deg);
transform:perspective(400px) rotateY(-15deg);
opacity:1
}
to { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0 }
}
@keyframes flipOutY { 0% {
-webkit-transform:perspective(400px);
transform:perspective(400px)
}
30% {
-webkit-transform:perspective(400px) rotateY(-15deg);
transform:perspective(400px) rotateY(-15deg);
opacity:1
}
to { -webkit-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:translate3d(100%, 0, 0) skewX(-30deg);
transform:translate3d(100%, 0, 0) skewX(-30deg);
opacity:0
}
60% {
-webkit-transform:skewX(20deg);
transform:skewX(20deg);
opacity:1
}
80% {
-webkit-transform:skewX(-5deg);
transform:skewX(-5deg);
opacity:1
}
to { -webkit-transform: none; transform: none; opacity: 1 }
}
@keyframes lightSpeedIn { 0% {
-webkit-transform:translate3d(100%, 0, 0) skewX(-30deg);
transform:translate3d(100%, 0, 0) skewX(-30deg);
opacity:0
}
60% {
-webkit-transform:skewX(20deg);
transform:skewX(20deg);
opacity:1
}
80% {
-webkit-transform:skewX(-5deg);
transform:skewX(-5deg);
opacity:1
}
to { -webkit-transform: none; transform: none; 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% {
opacity:1
}
to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0 }
}
@keyframes lightSpeedOut { 0% {
opacity:1
}
to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) 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;
transform-origin:center;
-webkit-transform:rotate(-200deg);
transform:rotate(-200deg);
opacity:0
}
to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1 }
}
@keyframes rotateIn { 0% {
-webkit-transform-origin:center;
transform-origin:center;
-webkit-transform:rotate(-200deg);
transform:rotate(-200deg);
opacity:0
}
to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; 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(-45deg);
transform:rotate(-45deg);
opacity:0
}
to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1 }
}
@keyframes rotateInDownLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
opacity:0
}
to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; 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(45deg);
transform:rotate(45deg);
opacity:0
}
to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1 }
}
@keyframes rotateInDownRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
opacity:0
}
to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; 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(45deg);
transform:rotate(45deg);
opacity:0
}
to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1 }
}
@keyframes rotateInUpLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
opacity:0
}
to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; 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
}
to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1 }
}
@keyframes rotateInUpRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1 }
}
.rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight }
@-webkit-keyframes rotateOut { 0% {
-webkit-transform-origin:center;
transform-origin:center;
opacity:1
}
to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0 }
}
@keyframes rotateOut { 0% {
-webkit-transform-origin:center;
transform-origin:center;
opacity:1
}
to { -webkit-transform-origin: center; transform-origin: center; -webkit-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;
opacity:1
}
to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0 }
}
@keyframes rotateOutDownLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
opacity:1
}
to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0 }
}
.rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft }
@-webkit-keyframes rotateOutDownRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
opacity:1
}
to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0 }
}
@keyframes rotateOutDownRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
opacity:1
}
to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0 }
}
.rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight }
@-webkit-keyframes rotateOutUpLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
opacity:1
}
to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0 }
}
@keyframes rotateOutUpLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
opacity:1
}
to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0 }
}
.rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft }
@-webkit-keyframes rotateOutUpRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
opacity:1
}
to { -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;
transform-origin:right bottom;
opacity:1
}
to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0 }
}
.rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight }
@-webkit-keyframes hinge { 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%, 80% {
-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;
opacity:1
}
to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0 }
}
@keyframes hinge { 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%, 80% {
-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;
opacity:1
}
to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0 }
}
.hinge { -webkit-animation-name: hinge; animation-name: hinge }
@-webkit-keyframes jackInTheBox { 0% {
opacity:0;
-webkit-transform:scale(.1) rotate(30deg);
transform:scale(.1) rotate(30deg);
-webkit-transform-origin:center bottom;
transform-origin:center bottom
}
50% {
-webkit-transform:rotate(-10deg);
transform:rotate(-10deg)
}
70% {
-webkit-transform:rotate(3deg);
transform:rotate(3deg)
}
to { opacity: 1; -webkit-transform: scale(1); transform: scale(1) }
}
@keyframes jackInTheBox { 0% {
opacity:0;
-webkit-transform:scale(.1) rotate(30deg);
transform:scale(.1) rotate(30deg);
-webkit-transform-origin:center bottom;
transform-origin:center bottom
}
50% {
-webkit-transform:rotate(-10deg);
transform:rotate(-10deg)
}
70% {
-webkit-transform:rotate(3deg);
transform:rotate(3deg)
}
to { opacity: 1; -webkit-transform: scale(1); transform: scale(1) }
}
.jackInTheBox { -webkit-animation-name: jackInTheBox; animation-name: jackInTheBox }
@-webkit-keyframes rollIn { 0% {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0) rotate(-120deg);
transform:translate3d(-100%, 0, 0) rotate(-120deg)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes rollIn { 0% {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0) rotate(-120deg);
transform:translate3d(-100%, 0, 0) rotate(-120deg)
}
to { opacity: 1; -webkit-transform: none; transform: none }
}
.rollIn { -webkit-animation-name: rollIn; animation-name: rollIn }
@-webkit-keyframes rollOut { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate(120deg); transform: translate3d(100%, 0, 0) rotate(120deg) }
}
@keyframes rollOut { 0% {
opacity:1
}
to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate(120deg); transform: translate3d(100%, 0, 0) rotate(120deg) }
}
.rollOut { -webkit-animation-name: rollOut; animation-name: rollOut }
@-webkit-keyframes zoomIn { 0% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
50% {
opacity:1
}
}
@keyframes zoomIn { 0% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
50% {
opacity:1
}
}
.zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn }
@-webkit-keyframes zoomInDown { 0% {
opacity:0;
-webkit-transform:scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform:scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function:cubic-bezier(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
@keyframes zoomInDown { 0% {
opacity:0;
-webkit-transform:scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform:scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function:cubic-bezier(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown }
@-webkit-keyframes zoomInLeft { 0% {
opacity:0;
-webkit-transform:scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform:scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform:scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-webkit-animation-timing-function:cubic-bezier(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
@keyframes zoomInLeft { 0% {
opacity:0;
-webkit-transform:scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform:scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform:scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-webkit-animation-timing-function:cubic-bezier(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft }
@-webkit-keyframes zoomInRight { 0% {
opacity:0;
-webkit-transform:scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform:scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform:scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function:cubic-bezier(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
@keyframes zoomInRight { 0% {
opacity:0;
-webkit-transform:scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform:scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform:scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function:cubic-bezier(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight }
@-webkit-keyframes zoomInUp { 0% {
opacity:0;
-webkit-transform:scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform:scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function:cubic-bezier(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
@keyframes zoomInUp { 0% {
opacity:0;
-webkit-transform:scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform:scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function:cubic-bezier(.175, .885, .32, 1);
animation-timing-function:cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp }
@-webkit-keyframes zoomOut { 0% {
opacity:1
}
50% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
to { opacity: 0 }
}
@keyframes zoomOut { 0% {
opacity:1
}
50% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
to { opacity: 0 }
}
.zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut }
@-webkit-keyframes zoomOutDown { 40% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); animation-timing-function: cubic-bezier(.175, .885, .32, 1) }
}
@keyframes zoomOutDown { 40% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform:scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); animation-timing-function: cubic-bezier(.175, .885, .32, 1) }
}
.zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown }
@-webkit-keyframes zoomOutLeft { 40% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(42px, 0, 0);
transform:scale3d(.475, .475, .475) translate3d(42px, 0, 0)
}
to { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center }
}
@keyframes zoomOutLeft { 40% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(42px, 0, 0);
transform:scale3d(.475, .475, .475) translate3d(42px, 0, 0)
}
to { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center }
}
.zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft }
@-webkit-keyframes zoomOutRight { 40% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
transform:scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
}
to { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center }
}
@keyframes zoomOutRight { 40% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
transform:scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
}
to { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center }
}
.zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight }
@-webkit-keyframes zoomOutUp { 40% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); animation-timing-function: cubic-bezier(.175, .885, .32, 1) }
}
@keyframes zoomOutUp { 40% {
opacity:1;
-webkit-transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform:scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function:cubic-bezier(.55, .055, .675, .19);
animation-timing-function:cubic-bezier(.55, .055, .675, .19)
}
to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1); animation-timing-function: cubic-bezier(.175, .885, .32, 1) }
}
.zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp }
@-webkit-keyframes slideInDown { 0% {
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0);
visibility:visible
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
@keyframes slideInDown { 0% {
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0);
visibility:visible
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
.slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown }
@-webkit-keyframes slideInLeft { 0% {
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0);
visibility:visible
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
@keyframes slideInLeft { 0% {
-webkit-transform:translate3d(-100%, 0, 0);
transform:translate3d(-100%, 0, 0);
visibility:visible
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
.slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft }
@-webkit-keyframes slideInRight { 0% {
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0);
visibility:visible
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
@keyframes slideInRight { 0% {
-webkit-transform:translate3d(100%, 0, 0);
transform:translate3d(100%, 0, 0);
visibility:visible
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
.slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight }
@-webkit-keyframes slideInUp { 0% {
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0);
visibility:visible
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
@keyframes slideInUp { 0% {
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0);
visibility:visible
}
to { -webkit-transform: translateZ(0); transform: translateZ(0) }
}
.slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp }
@-webkit-keyframes slideOutDown { 0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0) }
}
@keyframes slideOutDown { 0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0) }
}
.slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown }
@-webkit-keyframes slideOutLeft { 0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0) }
}
@keyframes slideOutLeft { 0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0) }
}
.slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft }
@-webkit-keyframes slideOutRight { 0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0) }
}
@keyframes slideOutRight { 0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0) }
}
.slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight }
@-webkit-keyframes slideOutUp { 0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0) }
}
@keyframes slideOutUp { 0% {
-webkit-transform:translateZ(0);
transform:translateZ(0)
}
to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0) }
}
.slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp }
.bg-navy { background-color: #001f3f }
.bg-blue { background-color: #0074d9 }
.bg-aqua { background-color: #1394c9 }
.bg-teal { background-color: #39cccc }
.bg-olive { background-color: #3d9970 }
.bg-green { background-color: #2ecc40 }
.bg-lime { background-color: #01ff70 }
.bg-yellow { background-color: #ffdc00 }
.bg-orange { background-color: #ff851b }
.bg-red { background-color: #ff4136 }
.bg-fuchsia { background-color: #f012be }
.bg-purple { background-color: #b10dc9 }
.bg-maroon { background-color: #85144b }
.bg-white { background-color: #fff }
.bg-gray { background-color: #aaa }
.bg-silver { background-color: #f2f2f2 }
.bg-black { background-color: #111 }
.navy { color: #001f3f }
.blue { color: #d86512; }
.aqua { color: #1394c9 }
.teal { color: #23acb1 }
.olive { color: #3d9970 }
.green { color: #2ecc40 }
.lime { color: #01ff70 }
.yellow { color: #ffdc00 }
.orange { color: #ff851b }
.red { color: #ff4136 }
.fuchsia { color: #f012be }
.purple { color: #b10dc9 }
.maroon { color: #85144b }
.white { color: #fff }
.silver { color: #ddd }
.gray { color: #aaa }
.black { color: #111 }
.border--navy { border-color: #001f3f }
.border--blue { border-color: #0074d9 }
.border--aqua { border-color: #1394c9 }
.border--teal { border-color: #39cccc }
.border--olive { border-color: #3d9970 }
.border--green { border-color: #2ecc40 }
.border--lime { border-color: #01ff70 }
.border--yellow { border-color: #ffdc00 }
.border--orange { border-color: #ff851b }
.border--red { border-color: #ff4136 }
.border--fuchsia { border-color: #f012be }
.border--purple { border-color: #b10dc9 }
.border--maroon { border-color: #85144b }
.border--white { border-color: #fff }
.border--gray { border-color: #aaa }
.border--silver { border-color: #ddd }
.border--black { border-color: #111 }
.fill-navy { fill: #001f3f }
.fill-blue { fill: #0074d9 }
.fill-aqua { fill: #1394c9 }
.fill-teal { fill: #39cccc }
.fill-olive { fill: #3d9970 }
.fill-green { fill: #2ecc40 }
.fill-lime { fill: #01ff70 }
.fill-yellow { fill: #ffdc00 }
.fill-orange { fill: #ff851b }
.fill-red { fill: #ff4136 }
.fill-fuchsia { fill: #f012be }
.fill-purple { fill: #b10dc9 }
.fill-maroon { fill: #85144b }
.fill-white { fill: #fff }
.fill-gray { fill: #aaa }
.fill-silver { fill: #ddd }
.fill-black { fill: #111 }
.stroke-navy { stroke: #001f3f }
.stroke-blue { stroke: #0074d9 }
.stroke-aqua { stroke: #1394c9 }
.stroke-teal { stroke: #39cccc }
.stroke-olive { stroke: #3d9970 }
.stroke-green { stroke: #2ecc40 }
.stroke-lime { stroke: #01ff70 }
.stroke-yellow { stroke: #ffdc00 }
.stroke-orange { stroke: #ff851b }
.stroke-red { stroke: #ff4136 }
.stroke-fuchsia { stroke: #f012be }
.stroke-purple { stroke: #b10dc9 }
.stroke-maroon { stroke: #85144b }
.stroke-white { stroke: #fff }
.stroke-gray { stroke: #aaa }
.stroke-silver { stroke: #ddd }
.stroke-black { stroke: #111 }
a, a:focus, a:hover { color: currentColor }
.paging { width: 100%; height: 152px; padding-top: 70px }
.paging .p-more { display: none }
.paging #page { margin: 0 auto; width: 100%; text-align: center }
.paging .page_div { margin-top: 20px; margin-bottom: 20px; font-size: 15px; font-family: ; color: #666; margin-right: 10px; padding-left: 20px; box-sizing: border-box }
.paging .page_div a { width: 40px; height: 40px; border: 1px solid #dedede!important; text-align: center; margin: 0 4px; cursor: pointer; line-height: 40px; color: #929292; font-size: 14px; display: inline-block; border-radius: 3px }
.paging .page_div a:hover { text-decoration: none }
.paging #firstPage, .paging #lastPage { display: none }
.paging #nextPage, .paging #prePage { width: 85px; height: 40px; color: #929292; font-size: 14px; line-height: 40px; border-radius: 3px; text-align: center; border: 1px solid #dedede!important }
.paging #nextPage:hover, .paging #prePage:hover { text-decoration: none }
.paging .page_div .current { background-color: #1496cc; border-color: #1496cc; color: #fff }
.paging .totalPages { margin: 0 10px }
.paging .totalPages span, .paging .totalSize span { color: #0073a9; margin: 0 5px }
.paging .totalSize { display: none }
@media (min-width:768px) and (max-width:1023px) {
.paging .page_div a { width: 30px; height: 30px; line-height: 30px; font-size: 12px }
.paging .page_div a:hover { text-decoration: none }
.paging #nextPage, .paging #prePage { width: 55px; height: 30px; font-size: 12px; line-height: 30px }
}
.navbar { border: none; background-color: transparent }
.navbar .right-nav { max-width: 100px; float: right; margin-top: 20px }
@media (max-width:1000px) {
.navbar .right-nav { display: none }
}
.navbar-brand { padding: 0; height: 60px }
.navbar-brand img { min-width: 145px; max-height: 60px }
.navbar-nav { position: absolute; left: 50%; top: 50%; width: 769px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: all .5s ease; transition: all .5s ease; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center }
@media (max-width:1000px) {
.navbar-nav { display: none }
}
.navbar-nav>li>a { color:#fff}
.navbar-nav>li>a:hover { opacity: .7 }
.nav>li>a:focus, .nav>li>a:hover { background-color: transparent }
.navbar-default .navbar-nav>li>a, .navbar-default .navbar-text { color: #fff; opacity: .8; -webkit-transition: color .3s; transition: color .3s }
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { color: #fff; opacity: 1 }
.navbar-default .navbar-toggle { border-color: transparent }
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background-color: transparent }
.navbar { padding: 10px 30px; width: 100%; height: 80px }
.navbar.navbar-fixed-top { position: fixed; top: 0; left: 0; z-index: 999 }
.navbar .navbar-link { display: inline-block; width: 180px; height: 40px }
.navbar .navbar-link img { display: block; height: 148% }
.navbar .hamburger { position: relative; display: block; height: 60px; width: 30px; cursor: pointer }
@media (min-width:1001px) {
.navbar .hamburger { display: none }
}
.navbar .hamburger i { position: absolute; width: 80%; height: 3px; top: 50%; right: 0; background-color: #fff; pointer-events: auto; -webkit-transition-duration: .35s; transition-duration: .35s; -webkit-transition-delay: .35s; transition-delay: .35s }
.navbar .hamburger:after, .navbar .hamburger:before { position: absolute; display: block; width: 100%; height: 3px; top: 50%; left: 50%; background-color: #fff; content: ""; -webkit-transition: -webkit-transform .35s; transition: -webkit-transform .35s; transition: transform .35s; transition: transform .35s, -webkit-transform .35s; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50% }
.navbar .hamburger:after { -webkit-transform: translate(-50%, 10px); transform: translate(-50%, 10px) }
.navbar .hamburger:before { -webkit-transform: translate(-50%, -10px); transform: translate(-50%, -10px) }
.blue .navbar-nav>li>a { color: #d86512; }
.blue .hamburger:after, .blue .hamburger:before, .blue .hamburger i { background-color: #1394c9!important }
.blue .right-nav { color: #1394c9 }
.blue .right-nav .brf { border-color: #1394c9 }
.cover-bg { position: fixed; background: transparent; display: none; top: 0; bottom: 0; left: 0; right: 0; z-index: 9999; background: rgba(0,0,0,.6) }
.side-menu { position: fixed; right: -420px; height: 100%; width: 80%; max-width: 420px; background: #1b1b1b; top: 0; opacity: 0; overflow-y: auto; z-index: 10000 }
.close-ct { height: 80px; line-height: 80px; text-align: right; padding-right: 42px }
.close-ct .close-btn { display: inline-block; cursor: pointer; width: 32px; height: 32px; line-height: 32px; color: #fff; font-size: 24px; vertical-align: middle }
.close-ct .close-btn i { font-size: 30px }
.link-ul { margin: 0 }
.link-ul li { list-style: none; font-size: 24px; color: #fff; padding-left: 10%; padding-top: 5%; padding-bottom: 5%; -webkit-transition: all .3s; transition: all .3s; cursor: pointer }
.link-ul li:hover { color: #1393d7 }
@media (max-width:768px) {
.link-ul li { font-size: 18px }
}
@media (min-width:769px) and (max-width:1023px) {
.link-ul li { font-size: 18px }
}
@media (min-width:1024px) {
.link-ul li { font-size: 20px }
}
.link-ul li span:hover { color: #1393d7 }
.link-ul li.last { font-size: 16px; padding-top: 12% }
.link-ul li.last:hover { color: #fff }
@media (max-width:768px) {
#footer-menu-wrapper { width: 100%; background: #f2f2f2 }
#footer-menu-wrapper .footer-menu { width: 92%; padding-top: 5px }
#footer-menu-wrapper .footer-menu .footer-option .footer-line { width: 100% }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title { width: 100%; height: 45px; line-height: 45px; border-bottom: 1px solid #929292 }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title h3 { line-height: 45px; font-size: 16px; color: #333; margin: 0 }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title .delete { display: block; font-size: 24px; color: #323232; cursor: pointer }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content { width: 100%; margin-top: 4px; padding-bottom: 4px; display: none; border-bottom: 1px solid #929292 }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content a { display: block; height: 30px; line-height: 30px; font-size: 15px; color: #929292 }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content a:hover { color: #1496cc }
#footer-menu-wrapper .footer-menu .right h3 { margin-top: 0 }
#footer-menu-wrapper .footer-menu .right .list { width: 176px }
#footer-menu-wrapper .footer-menu .right .list li { display: inline-block; float: left; width: 34px; height: 34px; line-height: 34px; margin-left: 5px; margin-right: 5px; border-radius: 50%; -webkit-transition: all .3s; transition: all .3s; background-color: #a6a7a7; text-align: center; color: #fff }
#footer-menu-wrapper .footer-menu .right .list li a .iconfont { font-size: 20px }
#footer-menu-wrapper .footer-menu .right .list .facebook:hover { background-color: #3b5997!important }
#footer-menu-wrapper .footer-menu .right .list .linkedin:hover { background-color: #006dc0!important }
#footer-menu-wrapper .footer-menu .right .list .twitter:hover { background-color: #1aa9e1!important }
#footer-menu-wrapper .footer-menu .right .list .youtube:hover { background-color: #de322e!important }
#footer-menu-wrapper .footer-menu .right .p-phone { width: 200px }
#footer-menu-wrapper .footer-menu .right .p-phone .iconfont { font-size: 46px }
#footer-bottom-wrapper, #footer-bottom-wrapper .footer-bottom { width: 100%; height: 40px; background: #323232 }
#footer-bottom-wrapper .footer-bottom p a { color: #929292 }
#footer-bottom-wrapper .footer-bottom p .a-top { display: block; line-height: 20px }
#footer-bottom-wrapper .footer-bottom p .a-bottom { line-height: 20px }
}
@media (min-width:769px) and (max-width:992px) {
#footer-menu-wrapper { width: 100%; min-height: 320px; background: #f2f2f2 }
#footer-menu-wrapper .footer-menu { width: 96.5%; height: 100%; padding-top: 25px }
#footer-menu-wrapper .footer-menu .footer-option { width: 70% }
#footer-menu-wrapper .footer-menu .footer-option .footer-line { margin-right: 50px; min-height: 200px }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title .delete { display: none }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title h3 { color: #333; line-height: 47px }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content { display: block }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content a { text-decoration: none; line-height: 24px; color: #929292; display: block }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content a:hover { color: #1496cc }
#footer-menu-wrapper .footer-menu .right { width: 28% }
#footer-menu-wrapper .footer-menu .right .list { width: 176px }
#footer-menu-wrapper .footer-menu .right .list li { display: inline-block; float: left; width: 34px; height: 34px; line-height: 34px; margin-left: 5px; margin-right: 5px; border-radius: 50%; -webkit-transition: all .3s; transition: all .3s; background-color: #a6a7a7; text-align: center; color: #fff }
#footer-menu-wrapper .footer-menu .right .list li a .iconfont { font-size: 20px }
#footer-menu-wrapper .footer-menu .right .list .facebook:hover { background-color: #3b5997!important }
#footer-menu-wrapper .footer-menu .right .list .linkedin:hover { background-color: #006dc0!important }
#footer-menu-wrapper .footer-menu .right .list .twitter:hover { background-color: #1aa9e1!important }
#footer-menu-wrapper .footer-menu .right .list .youtube:hover { background-color: #de322e!important }
#footer-menu-wrapper .footer-menu .right .p-phone { width: 200px }
#footer-menu-wrapper .footer-menu .right .p-phone .iconfont { font-size: 46px }
#footer-bottom-wrapper { width: 100%; height: 79px; background: #323232 }
#footer-bottom-wrapper .footer-bottom { width: 95.3%; height: 79px; line-height: 79px; background: #323232 }
#footer-bottom-wrapper .footer-bottom p a { color: #929292 }
}
@media (min-width:992px) and (max-width:1200px) {
#footer-menu-wrapper { width: 100%; min-height: 320px; background: #f2f2f2 }
#footer-menu-wrapper .footer-menu { width: 96.5%; height: 100%; padding-top: 25px }
#footer-menu-wrapper .footer-menu .footer-option { width: 77% }
#footer-menu-wrapper .footer-menu .footer-option .footer-line { margin-right: 50px; min-height: 200px }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title .delete { display: none }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title h3 { color: #333; line-height: 47px }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content { display: block }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content a { text-decoration: none; line-height: 24px; color: #929292; display: block }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content a:hover { color: #1496cc }
#footer-menu-wrapper .footer-menu .right { width: 20% }
#footer-menu-wrapper .footer-menu .right .list { width: 176px }
#footer-menu-wrapper .footer-menu .right .list li { display: inline-block; float: left; width: 34px; height: 34px; line-height: 34px; margin-left: 5px; margin-right: 5px; border-radius: 50%; -webkit-transition: all .3s; transition: all .3s; background-color: #a6a7a7; text-align: center; color: #fff }
#footer-menu-wrapper .footer-menu .right .list li a .iconfont { font-size: 20px }
#footer-menu-wrapper .footer-menu .right .list .facebook:hover { background-color: #3b5997!important }
#footer-menu-wrapper .footer-menu .right .list .linkedin:hover { background-color: #006dc0!important }
#footer-menu-wrapper .footer-menu .right .list .twitter:hover { background-color: #1aa9e1!important }
#footer-menu-wrapper .footer-menu .right .list .youtube:hover { background-color: #de322e!important }
#footer-menu-wrapper .footer-menu .right .p-phone { width: 200px }
#footer-menu-wrapper .footer-menu .right .p-phone .iconfont { font-size: 46px }
#footer-bottom-wrapper { width: 100%; height: 79px; background: #323232 }
#footer-bottom-wrapper .footer-bottom { width: 95.3%; height: 79px; line-height: 79px; background: #323232 }
#footer-bottom-wrapper .footer-bottom p a { color: #929292 }
}
@media (min-width:1200px) {
#footer-menu-wrapper { width: 100%; min-height: 320px; background: #f2f2f2 }
#footer-menu-wrapper .footer-menu { width: 95.3%; height: 100%; padding-top: 25px }
#footer-menu-wrapper .footer-menu .footer-option { width: 80% }
#footer-menu-wrapper .footer-menu .footer-option .footer-line { margin-right: 55px; min-height: 200px }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title .delete { display: none }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-title h3 { color: #333; line-height: 47px }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content { display: block }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content a { text-decoration: none; line-height: 24px; color: #929292; display: block }
#footer-menu-wrapper .footer-menu .footer-option .footer-line .footer-content a:hover { color: #1496cc }
#footer-menu-wrapper .footer-menu .right { width: 17% }
#footer-menu-wrapper .footer-menu .right .list { width: 176px }
#footer-menu-wrapper .footer-menu .right .list li { display: inline-block; float: left; width: 34px; height: 34px; line-height: 34px; margin-left: 5px; margin-right: 5px; border-radius: 50%; -webkit-transition: all .3s; transition: all .3s; background-color: #a6a7a7; text-align: center; color: #fff }
#footer-menu-wrapper .footer-menu .right .list li a .iconfont { font-size: 20px }
#footer-menu-wrapper .footer-menu .right .list .facebook:hover { background-color: #3b5997!important }
#footer-menu-wrapper .footer-menu .right .list .linkedin:hover { background-color: #006dc0!important }
#footer-menu-wrapper .footer-menu .right .list .twitter:hover { background-color: #1aa9e1!important }
#footer-menu-wrapper .footer-menu .right .list .youtube:hover { background-color: #de322e!important }
#footer-menu-wrapper .footer-menu .right .p-phone { width: 200px }
#footer-menu-wrapper .footer-menu .right .p-phone .iconfont { font-size: 46px }
#footer-bottom-wrapper { width: 100%; height: 79px; background: #323232 }
#footer-bottom-wrapper .footer-bottom { width: 95.3%; height: 79px; line-height: 79px; background: #323232 }
#footer-bottom-wrapper .footer-bottom p a { color: #929292 }
}
.ie-tip { display: none }
.ie-tip-bg { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 99999; background-color: rgba(0,0,0,.9) }
.ie-tip-ct { position: absolute; top: 50%; left: 50%; width: 600px; height: 506px; z-index: 99999; margin-left: -300px; margin-top: -253px; background: url(../images/ie-tip-bg.33a86dbb.png) no-repeat 50%; background-size: cover }
.ie-txt { margin-top: 274px; padding: 0 47px; font-size: 24px; line-height: 2 }
.ie-btn { margin-top: 50px; text-align: center; font-size: 16px }
.ie-btn .ie-btn-l { border-radius: 40px; color: #fff; background-color: #1496cc }
.ie-btn .ie-btn-l, .ie-btn .ie-btn-r { display: inline-block; padding: .8em 3em }
.ie-btn .ie-btn-r { border-radius: 40px; margin-left: 30px; color: #1496cc; border: 1px solid #1496cc }
.section1 { background-size: cover }
.section1 .ytp-large-play-button { display: none!important }
.section1 .fullsceen .vjs-tech { min-width: 100%; min-height: 100%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) }
.section1 .swiper-container { height: 100%; width: 100% }
.section1 .swiper-container img { width: 100% }
.section1 .swiper-container .swiper-pagination { bottom: 68px; left: 40% }
.section1 .swiper-container .swiper-pagination .swiper-pagination-bullet { margin: 0 11px; width: 14px; height: 14px; background: #fff; opacity: 1 }
.section1 .swiper-container .swiper-pagination .swiper-pagination-bullet-active { width: 16px; height: 16px; background: #4a73ff; border: 2px solid #fff; border-radius: 50% }
.section1 .swiper-container .swiper-button-prev { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAsCAYAAACHfIO0AAACHElEQVRIiaXXzUtUURgH4MdGKcqbQUGFpm1qU4tSbOWqTWJBUmS27K/LKO1jUYs+sOhjEW2iT6MIIjArC29SWjktzhlGZMaZOXdg4DczZ5655733nvNO28LCgoKPLpzHYntBqB1j2IaODQWx4+hGGZNFsEEcjvl2lmXvU7FeDMf8Ao8gBdsq1KmEz7iWZVk5BStFqBO/MJFl2XLlw1axEfQIBb+M76s/bAUbiE+4i3drBzSL7YlHBS/xoNagZrAMZ4V6zeGqMM2WsRLOCAX/jQks1xvcCBsWrqkyJjG/3uD1sH7hKodpvG3ww3WxHuG+g9e43wiqh3WqFvwLrqhT8EZYpeCZasGXmoFqYcfQF/MUvjULrcUO4UjM05hpBVqNdeNEzG9wr1Wogm0RVoJ2fBWm11TBa2GnhE1hSYsFr4XtjHnemiUlBbsuTGu36oWajM3gTnzdr3pGkzB4iOcxD2NvEayMa5iN71U21iQM/ghncxGbMY6OVAx+4BJWsAujaEvF4ANuxnwAQ0UweIKnMR/F/iIY3MBHYZqnsaMI9g8XsYCNOIdNqRj8jOBfbI9HWPc7zeybn4RbDvYJNUzG4BkexzyEg0UwuKXaX5wUFoZkbEXofOaFO2NcWFiTMGJPJrQIXRjL87yUihGal6mY+1Tb0SSMsMtPxzyY5/lAEYywg72KeSTP894iWFloHeaETmC06J+KZVwQzvDsf/LUdXvXJBSZAAAAAElFTkSuQmCC) no-repeat 50%; z-index: 1000 }
.section1 .swiper-container .swiper-button-next { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAsCAYAAACHfIO0AAACL0lEQVRIiaXWS4jNURwH8M8djyh/CxqjPBbMhmYhGslWk92YHRplBnmPpCmyEBMa5VmkMcTG0oIaQ6RGysZiFqRJyZQoZTF3PPIci3OuOw1z597//7f63v6nzz2d3/n/z8nl8/keVKMJ71RYSZL8zVVYiPm4iqmVYqOrCrvwG8vQmRV7gpPx9wa0ZMHgMu7EfAwrs2AjOICXmIJuzE2LwRdswZDQ3e4Ip8JgEDuFhqxQXMtUGPThVMzN2JQFg4voifmEMMvU2Aj2Y0BYt2uoSYvBZ7Qijzm4YoKGlMLgDXbHmdajIwsGj3A65s3YmAWD87gXcyeWZ8FGsA+vFBtSnRaDT4oNqUGXMQ2pBIPXaIt5FY5mweABzsTcOjw8vL7wIJfP51N4criBBnxHU5Ik/WkxSHAXi4WzY20WDGojOAN9adZsdA0KbwksyYp1ok74/rVnwVoVX63OJEkepsVWCwcP3MYl0m2NBejFLLxAY5IkX6l8007H9Qh9RGsBqhTL4RyW4ie24+3oAZVgbWiM+Qiejh1QLtaAgzHfFF6lf6ocrFY4rXJ4hsPjDZwImxlnkeA9tuFHGmySsH8W4Ru24kOpfy6FHcKamNvRXwoqha3Dnpi7cGsiaDysTthP8BjHy4H+h80Wdvg04dOyA7/SYIVL3jzFq8FQudBYrEM4cWCvcGmpqApYs3D0E06e+5VCBaxe8YbYi7NpoAJ2QVivAeEKMJIWm4znMbcIC5+6/gAkSHnqHURbaQAAAABJRU5ErkJggg==) no-repeat 50%; z-index: 1000 }
.section1 .swiper-container .swiper-button-prev { width: 42px; top: 50%; left: 50px; height: 75px; border-radius: 3px; background-color: #191919; opacity: .35 }
.section1 .swiper-container .swiper-button-prev:hover { opacity: .8 }
.section1 .swiper-container .swiper-button-next { width: 42px; top: 50%; right: 50px; height: 75px; border-radius: 3px; background-color: #191919; opacity: .35 }
.section1 .swiper-container .swiper-button-next:hover { opacity: .8 }
.section1 .s2 { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.2) }
.section1 .s2 .congvlpert, .section1 .s2 .img-link, .section1 .s2 .mall-name, .section1 .s2 .section2.active .type-ct, .section1 .s2 .section2.active .type-ct .tlit.one, .section1 .s2 .section2.active .type-ct .tlit.two, .section1 .s2 .section2.active h1, .section1 .s2 .section3.active .global-products, .section1 .s2 .section3.active .tab-nav, .section2.active .section1 .s2 .type-ct, .section2.active .section1 .s2 h1, .section2.active .type-ct .section1 .s2 .tlit.one, .section2.active .type-ct .section1 .s2 .tlit.two, .section3.active .section1 .s2 .global-products, .section3.active .section1 .s2 .tab-nav { opacity: 0; -webkit-transition: all 1s; transition: all 1s; -webkit-transition-delay: .7s; transition-delay: .7s }
.section1 .s2 .congvlpert { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) }
.section1 .s2 .congvlpert .palybut { position: relative }
.section1 .s2 .congvlpert .palybut img { display: block; width: 84px; height: 84px }
.section1 .s2 .congvlpert .palybut:before { content: ""; display: block; width: 84px; height: 84px; border-radius: 50%; position: absolute; left: 50%; top: 50%; margin-left: -42px; margin-top: -42px; opacity: 0; -webkit-transition: all .4s; transition: all .4s; box-shadow: 0 0 40px hsla(0,0%,100%,.9) }
.section1 .s2 .congvlpert .palybut:hover:before { opacity: 1; -webkit-transform: scale(1); transform: scale(1) }
.section1 .s2 .brand { width: 100%; position: absolute; bottom: 100px; z-index: 100 }
@media (max-width:768px) {
.section1 .s2 .wp100 { width: 100% }
}
.section1 .s2 .mall-name { min-width: 320px; padding-right: 25px; border-right: 1px solid #fff; color: #fff; line-height: 78px }
@media (max-width:768px) {
.section1 .s2 .mall-name { border-color: transparent }
}
@media (min-width:769px) and (max-width:1179px) {
.section1 .s2 .mall-name { border-color: transparent }
}
.section1 .s2 .img-link { width: 200px; line-height: 78px; -webkit-transform: translateY(30%); transform: translateY(30%) }
.section1 .s2 .img-link:first-child { margin-left: 0 }
@media (max-width:768px) {
.section1 .s2 .img-link { width: 25% }
.section1 .s2 .img-link img { width: auto; max-width: 80% }
.section1 .s2 .img-link:first-child { margin-left: 0 }
}
.section1.active .s2 .congvlpert, .section1.active .s2 .mall-name { opacity: 1 }
.section1.active .s2 .img-link { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) }
.section1.active .s2 .img-link.one { -webkit-transition-delay: .6s; transition-delay: .6s }
.section1.active .s2 .img-link.two { -webkit-transition-delay: .7s; transition-delay: .7s }
.section1.active .s2 .img-link.three { -webkit-transition-delay: .8s; transition-delay: .8s }
.section1.active .s2 .img-link.four { -webkit-transition-delay: .9s; transition-delay: .9s }
.section2 { background: url(../images/123.jpg) 50% no-repeat; background-size: cover }
.section2 p { margin: 0 }
.section2 .center { position: absolute; top: 50%; left: 0; width: 100%; -webkit-transform: translateY(-50%); transform: translateY(-50%) }
.section2 .type-ct { padding-top: 120px; width: 90%; max-width: 1163px; margin: 0 auto; -webkit-transition: all 1s; transition: all 1s; opacity: 0; border-bottom: 1px solid #bcbcbd }
@media (max-width:768px) {
.section2 .type-ct { padding-top: 50px }
}
.section2 .type-ct .tlit { width: 49%; max-width: 300px; color: #fff; opacity: 0; -webkit-transition: all 1s; transition: all 1s; font-size: 24px; padding-bottom: 23px }
@media (max-width:768px) {
.section2 .type-ct .tlit { font-size: 18px }
}
.section2 .type-ct .tlit.one { -webkit-transform: translateX(-100px); transform: translateX(-100px) }
.section2 .type-ct .tlit.two { -webkit-transform: translateX(100px); transform: translateX(100px) }
.section2 .type-ct .tlit.active { position: relative; color: #1394c9 }
.section2 .type-ct .tlit.active p { color: #1394c9 }
.section2 .type-ct .tlit.active:after { position: absolute; left: 50%; margin-left: -10px; bottom: -11px; content: ""; width: 21px; height: 21px; border: 1px solid #bcbcbd; border-left-color: transparent; border-top-color: transparent; -webkit-transform: rotate(45deg); transform: rotate(45deg) }
.section2 .type-ct .tlit.active:before { position: absolute; left: 50%; margin-left: -14px; bottom: -1px; content: ""; -webkit-transform: scale(.3); transform: scale(.3); width: 28px; height: 1px; background: url(data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABGAAD/4QN/aHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzEzOCA3OS4xNTk4MjQsIDIwMTYvMDkvMTQtMDE6MDk6MDEgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6M2FmYWQ1YjctYzk2OS05ZDQzLWI5YzMtMmUxYzZkMGVhMmM1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjg3OTczRUM3MUMzMjExRTg4MDg0RDQ0MTkzOUJDMENGIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjg3OTczRUM2MUMzMjExRTg4MDg0RDQ0MTkzOUJDMENGIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE3IChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOmRmMmNiOWQxLTA5ZjUtMTU0MS1hNzE5LTI5N2Y4YTdmMjM4MyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozYWZhZDViNy1jOTY5LTlkNDMtYjljMy0yZTFjNmQwZWEyYzUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAEAwMDAwMEAwMEBgQDBAYHBQQEBQcIBgYHBgYICggJCQkJCAoKDAwMDAwKDAwNDQwMEREREREUFBQUFBQUFBQUAQQFBQgHCA8KCg8UDg4OFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wAARCAAHAAsDAREAAhEBAxEB/8QAVwABAQAAAAAAAAAAAAAAAAAAAgcBAQEBAAAAAAAAAAAAAAAAAAEAAxAAAgEEAwEAAAAAAAAAAAAAAREhADFBEvChAgMRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AI+CQNgBPogOTmVg1oBX1Sc6q+Xe3Oqg/9k=) 50% repeat }
.section2 .type-ct .tlit p { -webkit-transition: color .3s; transition: color .3s }
.section2 .type-ct .tlit:hover { text-decoration: none }
.section2 .type-ct .tlit:hover p { color: #1394c9 }
.section2 .ctype-ct { padding-top: 80px; width: 90%; max-width: 1163px; height:auto; margin: 0 auto }
@media (max-width:768px) {
.section2 .ctype-ct { padding-top: 40px }
}
.section2 .ctype-ct .swiper-slide { width: 14%; min-width: 84px; margin: 0 5px }
.section2 .ctype-ct .ctlit { color: #fff; opacity: 0; -webkit-transition: all 1s; transition: all 1s; -webkit-transform: translateY(30%); transform: translateY(30%) }
.section2 .ctype-ct .ctlit p { word-break: break-all; letter-spacing: 1px; -webkit-transition: color .3s; transition: color .3s }
@media (max-width:768px) {
.section2 .ctype-ct .ctlit p { font-size: 14px }
}
.section2 .ctype-ct .ctlit .mt10 { margin-top: 10px }
.section2 .ctype-ct .ctlit .img-icon { width: 65px; height: 65px; background-position: -65px, 0; background-repeat: no-repeat }
.section2 .ctype-ct .ctlit .iconfont { font-size: 40px }
@media (max-width:768px) {
.section2 .ctype-ct .ctlit .iconfont { font-size: 36px }
}
.section2 .ctype-ct .ctlit:hover { text-decoration: none }
.section2 .ctype-ct .ctlit:hover p { color: #0d9dd9 }
.section2 h1 { opacity: 0; -webkit-transform: scale(.5); transform: scale(.5); -webkit-transition: all .7s; transition: all .7s }
@media (max-width:768px) {
.section2 h1 { font-size: 30px; margin-top: 50px }
}
.section2 .my-button-prev { position: absolute; font-size: 43px; left: -44px; top: 50%; opacity: 0; -webkit-transition: all .3s; transition: all .3s; -webkit-transform: translateY(30%); transform: translateY(30%) }
@media (max-width:768px) {
.section2 .my-button-prev { display: none }
}
.section2 .my-button-next { position: absolute; font-size: 43px; right: -40px; top: 50%; opacity: 0; -webkit-transition: all .3s; transition: all .3s; -webkit-transform: translateY(30%); transform: translateY(30%) }
@media (max-width:768px) {
.section2 .my-button-next { display: none }
}
.section2 .my-button-disabled { display: none }
.section1 .s2 .section2.active .congvlpert, .section1 .s2 .section2.active .img-link, .section1 .s2 .section2.active .mall-name, .section2.active .section1 .s2 .congvlpert, .section2.active .section1 .s2 .img-link, .section2.active .section1 .s2 .mall-name, .section2.active .section3.active .global-products, .section2.active .section3.active .tab-nav, .section2.active .type-ct, .section2.active .type-ct .tlit.one, .section2.active .type-ct .tlit.two, .section2.active h1, .section3.active .section2.active .global-products, .section3.active .section2.active .tab-nav { opacity: 1; -webkit-transition-delay: .7s; transition-delay: .7s }
.section2.active h1 { -webkit-transform: scale(1); transform: scale(1) }
.section2.active .type-ct .tlit.one, .section2.active .type-ct .tlit.two { -webkit-transform: translateX(0); transform: translateX(0) }
.section2.active .ctype-ct .ctlit { display: block; width: 100% }
.section2.active .ctype-ct .ctlit, .section2.active .my-button-next, .section2.active .my-button-prev { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: .6s; transition-delay: .6s }
@-webkit-keyframes warn { 0% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:0
}
25% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:.1
}
50% {
-webkit-transform:scale(.5);
transform:scale(.5);
opacity:.5
}
75% {
-webkit-transform:scale(.8);
transform:scale(.8);
opacity:.9
}
to { -webkit-transform: scale(1); transform: scale(1); opacity: 0 }
}
@keyframes warn { 0% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:0
}
25% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:.1
}
50% {
-webkit-transform:scale(.5);
transform:scale(.5);
opacity:.5
}
75% {
-webkit-transform:scale(.8);
transform:scale(.8);
opacity:.9
}
to { -webkit-transform: scale(1); transform: scale(1); opacity: 0 }
}
@-webkit-keyframes warn1 { 0% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:0
}
25% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:.1
}
50% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:.5
}
75% {
-webkit-transform:scale(.5);
transform:scale(.5);
opacity:.9
}
to { -webkit-transform: scale(.8); transform: scale(.8); opacity: 0 }
}
@keyframes warn1 { 0% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:0
}
25% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:.1
}
50% {
-webkit-transform:scale(.3);
transform:scale(.3);
opacity:.5
}
75% {
-webkit-transform:scale(.5);
transform:scale(.5);
opacity:.9
}
to { -webkit-transform: scale(.8); transform: scale(.8); opacity: 0 }
}
.section3 { background: url(../images/map-bg.bb99969c.jpg) 50% no-repeat; background-size: cover }
.section3 canvas { display: block; margin: 0; width: 100%; height: 100%; position: absolute; left: 0; right: 0; top: 0; bottom: 0 }
.section3 .global-products { padding-top: 120px; opacity: 0; -webkit-transform: scale(.5); transform: scale(.5); -webkit-transition: all .7s; transition: all .7s }
@media (max-width:768px) {
.section3 .global-products { font-size: 30px }
}
@media screen and (max-height:900px) {
.section3 .global-products { padding-top: 100px }
}
.section3 .center { width: 100%; max-width: 1200px; margin: 0 auto }
.section3 .min-cont { width: 100%; min-width: 700px }
.section3 .mpabig { display: block; width: 100% }
.section3 .tab-nav { width: 100%; max-width: 1200px; margin: 1% auto; opacity: 0; -webkit-transition: all .7s; transition: all .7s }
@media screen and (max-height:900px) {
.section3 .tab-nav { margin: 15px auto }
}
.section3 .tab-nav li { position: relative; font-family: Light; font-size: 20px; color: #d86512; height: 55px; overflow: hidden; line-height: 55px; cursor: pointer; -webkit-transition: all .3s; transition: all .3s; border-bottom: 2px solid hsla(0,0%,100%,.1) }
@media (max-width:768px) {
.section3 .tab-nav li { font-size: 16px }
}
.section3 .tab-nav li.active { border-bottom-color: #d86512 }
.section3 .tab-nav li.active:after { position: absolute; left: 50%; margin-left: -10px; bottom: -11px; content: ""; width: 21px; height: 21px; background-color: #060a1a; border: 2px solid #1394c9; border-left-color: transparent; border-top-color: transparent; -webkit-transform: rotate(45deg); transform: rotate(45deg) }
.section3 .mapcont { opacity: 0; -webkit-transform: translateY(100px); transform: translateY(100px); -webkit-transition: all .7s; transition: all .7s }
.section3 .mapulcont { position: absolute; width: 100%; height: 100%; top: 0; left: 0 }
#mapmove ul{ position: relative;}
.section3 .mapulcont li { position: absolute; width: 10px; height: 10px; border-radius: 100%; cursor: pointer; background-color: #d86512 }
.section3 .mapulcont li:before { content: ""; position: absolute; width: 35px; height: 35px; left: -13px; top: -13px; border-radius: 50%; z-index: 1; opacity: 0; -webkit-animation: warn 1.5s ease-out infinite; animation: warn 1.5s ease-out infinite; box-shadow: 1px 1px 30px #d86512 }
.section3 .mapulcont li:after { content: ""; position: absolute; width: 18px; height: 18px; left: -4px; top: -4px; border: 1px solid #d86512; border-radius: 50%; z-index: 1; opacity: 1 }
.section3 .mapulcont li .loc { position: absolute; display: block; left: -12px; bottom: 9px; width: 36px; height: 52px; display: none; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAA0CAMAAADVCGoxAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAACxFBMVEX///8KqOn////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////k9f275/mg3fac3Paf3fa65vni9fzf9Px+0fMutewKqOkrtOx80fPb8vzr+P1oyfEOqekNqellyPHn9v245vker+saruqz5Pia2/YLqOmU2fWo4PfP7vsRquoQqurI7Pr7/v80t+1hx/Gw4/je8/zw+v6y5PhjyPEvtez4/f47ue3c8/zm9v1Au+7+//8stOxKv+/2/P78/v+Z2/Yps+wnsuyV2fb3/P5UwvAlsuvD6vrx+v71/P5OwO9Jv+/0+/685/mp4fdkyPFcxfCx4/h1zvNHve4dr+vM7foqs+w+uu4isetgx/F2zvNty/JqyvIbrusSq+qF1PRLv+89uu6K1fQPqumD0/RIvu85ue1myfFpyvJgxvFwzPIWrOo/u+655vmv4/g3uO02uO1xzfLC6flGve48uu39/v/K7Pq05Pjl9v0ttOxEvO6r4ff5/f4cruvu+f13z/MZreqE0/Ts+P225fih3ve15fjp9/1vzPImsuyR2PUYreofsOuM1vWt4vik3/fE6vpXw/BNwO/a8vwMqenS7/tuy/ITq+rj9fyH1PQzt+3O7vvg9Px4z/MAAADLimW2AAAAWnRSTlMAABxHY2dkSB5Knt/hoUxh5OhF2NxJdnuVm4deZTAzx8o3PsTGAgpUiJDAyebt9/oB6/LI0ZScWGASG83S10ZLzD3FLS5zfeoUW9rgTVHOQS+CGfZq41PV8zY7g9hPAAAAAWJLR0Trv90muAAAAAlwSFlzAAALEgAACxIB0t1+/AAAAAd0SU1FB+IDARAmOnGw9HoAAAMOSURBVDjLhZTle1RXEIdnkaDFKVIsSNC2OIXg7q5vChRZAiTBpS2uyQaWECSB4AGCuwZ3d4K0uLbwV3D2nrubu5ubMF/OzO++z3nOzJ0ZET/Llj1HzqBcuSVzy5M3H9ry/1DAHilYCKsVDnIo80eKFDU+hf0+eMjQP4YZfrHiAdCPHnX4iJFObaPCR3uEEn5QSaWMGRvhTLfIqHFKK2VhSqt4/ASnv02cpNSSPuYnFU2OdAbalKlKL2MyZZU/bYrTxiarL+U0VB6m/2nHOP/6GyoYTDDMmOlVZ82eM3fOvPneFBYshIoeqBIMMbVFiyF6ehgsjjEV9azKiqkCrlitLFnqXhanzuXxM1as1NIqN4SIFIDVWohLSFxjXrA2KcGs6zqoKlINwnW8ng2+J29kk3Y2Q3WRGrDFCJPdWy11WO3aZpzboaZILUgxwh3stGS/i93GuQd+FvkF9hrhPvZboAMc1I6qp8ivcMiIDnPEAh31Qi6oLXUg2YiOcdwCneCkcaZCXZF6cEpXgNMW6AxnjfMc1BdpAOe1fsF10cdcunxFO8ehoUgjuGq+1X3tusnEhblvaO8m/CbSGG7d1sJO7kR5koicNYa7WrqXCE3Uz6sJ980Lxibx4OGjx2kkPjGVcAj1dEF2SEg2tafPolVdouNTzPj5A9AT2BTi09NKHfVPevAvNNOd2Vy9Kta2M58uhRZmk6tXvbCFXkJL77SoBnbF2DBnL0Mr30ypDn5lA6mGa50+nG1USq8zMG+U2tYywu3gbUQA8+49tLfugpAO8CEAilL/v6PfVukEaal+zMdPEBSwnzrDZz9I/ZAugUusKySlWJjkBOgWCEl3GGqB4qFphnUoPcD9n4+JvQXNM0JSGR76oBdq3Bw2UE9VO++8xKgZCbaDpBf8b87wK6jksIV694ETBvNaXdrGHpK+8MWz8iLeQjtHJlDtfvBVQR+gQ0hmkPSHOxOdqWnQyZEpJAPgmfMzdHZkARWHhTFJ0DUrSCqAGsfujiyhcgNV9gODs4ZkUCihg+S7FpJR+gZupfo1OAeo3wAAAABJRU5ErkJggg==) 50% no-repeat }
.section3 .mapulcont li .tip-ct { position: absolute; z-index: 2; padding: 25px; top: 33px; left: 6px; -webkit-transform: translateX(-50%); transform: translateX(-50%); min-height: 98px; width: 228px; border-radius: 5px; background-color: #f4f7f9; display: none }
.section3 .mapulcont li .tip-ct h2 { margin: 0; font-weight: 700 }
.section3 .mapulcont li .tip-ct p { margin: 0; margin-top: 10px }
.section3 .mapulcont li .tip-ct:after { position: absolute; left: 50%; margin-left: -10px; top: -10px; content: ""; width: 21px; height: 21px; background-color: #f4f7f9; border-left-color: transparent; border-top-color: transparent; -webkit-transform: rotate(-135deg); transform: rotate(-135deg) }
.section3 .mapulcont li:hover .tip-ct { display: block }
.section1 .s2 .section3.active .congvlpert, .section1 .s2 .section3.active .img-link, .section1 .s2 .section3.active .mall-name, .section2.active .section3.active .type-ct, .section2.active .section3.active h1, .section2.active .type-ct .section3.active .tlit.one, .section2.active .type-ct .section3.active .tlit.two, .section3.active .global-products, .section3.active .section1 .s2 .congvlpert, .section3.active .section1 .s2 .img-link, .section3.active .section1 .s2 .mall-name, .section3.active .section2.active .type-ct, .section3.active .section2.active .type-ct .tlit.one, .section3.active .section2.active .type-ct .tlit.two, .section3.active .section2.active h1, .section3.active .tab-nav { opacity: 1; -webkit-transition-delay: .7s; transition-delay: .7s }
.section3.active .global-products { -webkit-transform: scale(1); transform: scale(1);color:#d86512 }
.section3.active .mapcont { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: .6s; transition-delay: .6s }
.section4 .img-ct { padding: 110px 6% 20px; height: 100% }
@media (max-width:768px) {
.section4 .img-ct { padding: 0 }
}
.section4 .left1 .left-c1, .section4 .left1 .left-c2, .section4 .left2, .section4 .p1, .section4 .p2, .section4 .p3 { opacity: 0; -webkit-transition: all .7s; transition: all .7s }
.section4 .left1 { width: 50%; height: 100%; margin-left: -10px; overflow: hidden }
.section4 .left1 .left-c1 { width: 100%; height: 50%; margin-bottom: 15px; margin-top: -10px; background: url(../images/left01.b5eb0666.jpg) 50% no-repeat; background-size: cover; -webkit-transform: translateY(-100px); transform: translateY(-100px) }
@media (max-width:768px) {
.section4 .left1 .left-c1 { height: 100%; margin: 0; -webkit-transform: translateY(100px); transform: translateY(100px) }
}
.section4 .left1 .left-c1 .losf { position: absolute; bottom: 0; left: 0; width: 100%; height: 60px; line-height: 60px; background: rgba(0,0,0,.3); text-align: center; font-weight: 400; font-size: 26px; color: #fff }
.section4 .left1 .left-c1:before { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: ""; -webkit-transition: all .3s; transition: all .3s; background-color: transparent }
.section4 .left1 .left-c1:hover .losf-b { display: block }
.section4 .left1 .left-c1:hover .losf { display: none }
.section4 .left1 .left-c1:hover .ljgd { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) }
.section4 .left1 .left-c2 { width: 100%; height: 50%; background: url(../images/left02.55437aa6.jpg) 50% no-repeat; background-size: cover; -webkit-transform: translateY(100px); transform: translateY(100px) }
@media (max-width:768px) {
.section4 .left1 .left-c2 { display: none }
}
.section4 .left1 .left-c2 .losf { position: absolute; bottom: 6px; left: 0; width: 100%; height: 60px; line-height: 60px; background: rgba(0,0,0,.3); text-align: center; font-weight: 400; font-size: 26px; color: #fff }
.section4 .left1 .left-c2:before { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: ""; background-color: transparent }
.section4 .left1 .left-c2:hover .losf-b { display: block }
.section4 .left1 .left-c2:hover .losf { display: none }
.section4 .left1 .left-c2:hover .ljgd { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) }
.section4 .left1 .losf-b { display: none; height: 100%; line-height: 60px; background: rgba(0,0,0,.3); text-align: center; font-weight: 400; font-size: 26px; color: #fff }
.section4 .left1 .losf-b, .section4 .left1 .losf-b .center { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100% }
.section4 .left1 .ljgd { position: absolute; bottom: 24px; left: 50px; color: #fff; -webkit-transition: all .3s; transition: all .3s; opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px) }
.section4 .left1 .ljgd p { padding-right: 50px }
@media (max-width:768px) {
.section4 .left1 .ljgd p { font-size: 14px }
}
.section4 .left1 .ljgd .more { display: inline-block; padding: 10px 50px; background-color: #fff; cursor: pointer; color: #020202 }
@media (max-width:768px) {
.section4 .left1 .ljgd .more { padding: 5px 25px; font-size: 12px }
}
.section4 .left1 .ljgd .more:hover { color: #1394c9 }
@media (max-width:768px) {
.section4 .left1 { width: 100%; height: 40%; height: calc(40% - 10px); margin-top: 20px; margin-left: 0 }
}
.section4 .left2 { width: 50%; height: 100%; margin-right: -10px; -webkit-transform: translateX(100px); transform: translateX(100px); background: url(../images/show-03.0452bf3e.jpg) 50% no-repeat; background-size: cover }
@media (max-width:768px) {
.section4 .left2 { width: 100%; height: 60%; height: calc(60% - 10px); margin-right: 0; -webkit-transform: translateY(-100px); transform: translateY(-100px) }
}
.section4 .left2 .ct-st { position: absolute; left: 0; bottom: 0; width: 100%; height: 100px; background: rgba(0,0,0,.3); color: #fff; font-size: 40px; font-weight: 400; line-height: 100px }
.section4 .left2 .ct-st p { font-size: 40px }
@media (max-width:1024px) {
.section4 .left2 .ct-st p { font-size: 40px }
}
.section4 .left2 .ct-st .my-btn { display: inline-block; font-size: 22px; padding: .6em 2.6em; border: 1px solid #fff; border-radius: 2em; background-color: hsla(0,0%,100%,0) }
@media (max-width:1024px) {
.section4 .left2 .ct-st .my-btn { font-size: 16px }
}
.section4 .left2 .ct-st-b { height: 100%; background: rgba(0,0,0,.3); color: #fff; font-size: 40px; font-weight: 400; display: none }
.section4 .left2 .ct-st-b, .section4 .left2 .ct-st-b .center { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100% }
.section4 .left2 .ct-st-b p { font-size: 40px }
@media (max-width:1024px) {
.section4 .left2 .ct-st-b p { font-size: 40px }
}
.section4 .left2 .ct-st-b .my-btn { display: inline-block; font-size: 22px; padding: .6em 2.6em; border: 1px solid #fff; border-radius: 2em; background-color: hsla(0,0%,100%,0) }
@media (max-width:1024px) {
.section4 .left2 .ct-st-b .my-btn { font-size: 16px }
}
.section4 .left2:hover .ct-st-b { display: block }
.section4 .left2:hover .ct-st { display: none }
.section4 .left2:hover .ljgd { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) }
.section4 h1, .section4 h2, .section4 h3 { margin: 0 }
.section4 .p1, .section4 .p2 { position: absolute; bottom: 6%; width: 100%; padding-left: 4%; max-width: 520px; opacity: 0; -webkit-transform: translateY(100%); transform: translateY(100%) }
.section4 .p1 p, .section4 .p2 p { height: 42px; margin-top: 20px; overflow: hidden }
.section4 .p3 { position: absolute; top: 7%; width: 100%; opacity: 0; -webkit-transform: translateY(100%); transform: translateY(100%) }
.section4.active .left1 .left-c1, .section4.active .left1 .left-c2, .section4.active .left2, .section4.activels .left1 .left-c1, .section4.activels .left1 .left-c2, .section4.activels .left2 { opacity: 1; -webkit-transition-delay: .7s; transition-delay: .7s }
.section4.active .left1 .left-c1, .section4.active .left1 .left-c2, .section4.activels .left1 .left-c1, .section4.activels .left1 .left-c2 { -webkit-transform: translateY(0); transform: translateY(0) }
.section4.active .left2, .section4.activels .left2 { -webkit-transform: translateX(0); transform: translateX(0) }
@media (max-width:768px) {
.section4.active .left2, .section4.activels .left2 { -webkit-transform: translateY(0); transform: translateY(0) }
}
#fp-nav ul li, .fp-slidesNav ul li { width: 10px; height: 10px; margin-bottom: 20px }
#fp-nav ul li a span, .fp-slidesNav ul li a span { width: 100%; height: 100%; margin: 0; left: 0; top: 0; background-color: hsla(0,0%,100%,.5) }
#fp-nav ul li:hover a.active span, #fp-nav ul li:hover a span, #fp-nav ul li a.active span, .fp-slidesNav ul li:hover a.active span, .fp-slidesNav ul li:hover a span, .fp-slidesNav ul li a.active span { width: 100%; height: 100%; margin: 0; background-color: #fff }
.vidoelist { min-width: 100%; min-height: 100%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) }
.vlistcont { position: relative }
.vlistcont .zahimg { display: block; width: 100% }
.vlistcont .vlistpage { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden }
.vli-close { position: absolute; left: 50%; width: 44px; height: 44px; text-align: center; line-height: 44px; color: #fff; border-radius: 50%; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAApWqozAAAAXVBMVEUAAAAAAAD4+PhiYmIAAADPz88AAAAAAAAAAAAAAAAAAADAwMD29vZlZWUAAAAAAAAAAAAAAAD+/v68vLxUVFT7+/vz8/MsLCwAAADw8PDp6enZ2dnJycltbW3///8g4zXNAAAAHnRSTlNNAO9pSLJANygZFaPuajMLAy37nmT35FcE4NW9q27VZzZnAAABKklEQVQ4y5XV6ZKDIBAE4FaRy1005tjs5fs/5uJWZALpxKL/oV9NUSIzaPJM3hqtAKWN9VPxMsc+RCdRwT/FTuMh2lE8GtCY8RE7hSdRrsQWL2JzfMDLHATndXltwQ67cRse1T5W4w0bYD/mH8smfodTSX7mXjay4nRu7dJ2ue2X5ZzOcsUeWy7LpsUux7TyEYe06tpNix1kGRpMANHEIlIPoqmN1IJoaiM1IJraSDWIfmc2UgWiZ2aF5ppanu9ozx0ktLZ8s3XfhGpm+zemNQyxAzqmDSyzoNrCM8u1x8Qs1xOaQCzVIfv5P8SKPskusmuFr/kIFDo90bcLK7XLk/+8pMquphVUNZna9lXfGPdbbm0zrx8T+wOodrTxoZlTOjQl1/txfC1e/gEuchSnlShdWQAAAABJRU5ErkJggg==) 50% no-repeat; bottom: -60px; margin-left: -22px }
.modal-backdrop { background-color: #fff }
@media (min-width:769px) {
.modal-dialog { width: 60%; max-width: 1000px }
}
.loading-page { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 10000; background-color: #fff }
.loading-page #loader { position: absolute; left: 50%; top: 50%; width: 100px; height: 100px; margin-top: -50px; margin-left: -50px; background: url(../images/loading_01.0cc7cbb7.gif) no-repeat 50%; background-size: cover }
.next-nav { position: fixed; left: 50%; width: 40px; margin-left: -20px; text-align: center; bottom: 40px; -webkit-animation: mymove 1.5s infinite; animation: mymove 1.5s infinite; display: none }
.next-nav:after { display: inline-block; width: 20px; height: 20px }
.next-nav:after, .next-nav:before { content: ""; border-radius: 4px; border: 2px solid #fff; border-left-color: transparent; border-top-color: transparent; -webkit-transform: rotate(45deg); transform: rotate(45deg) }
.next-nav:before { display: block; margin: 0 auto; width: 18px; height: 18px; margin-bottom: -10px }
.floatnav-kf { position: fixed; right: 50px; bottom: 100px; display: block; width: 48px; height: 48px; background: #5c5c5c; text-align: center; line-height: 48px; color: #dedede; cursor: pointer; border-radius: 5px }
.floatnav-kf .iconfont { font-size: 30px }
@media (max-width:768px) {
#fp-nav, .floatnav-kf { display: none }
.next-nav { display: block }
#footer-menu-wrapper { min-height: calc(100vh - 40px) }
}
@-webkit-keyframes mymove { form {
opacity:1;
-webkit-transform:translateY(0) scale(.5);
transform:translateY(0) scale(.5)
}
to { opacity: 0; -webkit-transform: translateY(25px) scale(1); transform: translateY(25px) scale(1) }
}
@keyframes mymove { form {
opacity:1;
-webkit-transform:translateY(0) scale(.5);
transform:translateY(0) scale(.5)
}
to { opacity: 0; -webkit-transform: translateY(25px) scale(1); transform: translateY(25px) scale(1) }
}
#floatnav-wrapper { display: block; width: 50px; height: 100px; position: fixed; bottom: 160px; right: 40px; z-index: 99; border-radius: 6px 6px 6px 6px; background: rgba(0,0,0,.2) }
#floatnav-wrapper .floatnav-top { height: 50px; width: 100%; line-height: 50px; text-align: center }
#floatnav-wrapper .floatnav-top:hover { background-color: #d86512; }
#floatnav-dialog { position: fixed; display: none; left: 0; top: 0; z-index: 1000; background: rgba(0,0,0,.6); width: 100%; height: 100% }
#floatnav-dialog .form-message { width: 600px; background: #fff; border-radius: 4px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); padding: 30px 30px 16px }
#floatnav-dialog .form-message .form-header { position: relative; text-align: center; font-size: 24px; color: #333 }
#floatnav-dialog .form-message .form-header .close { position: absolute; right: 0; top: 0; width: 16px; height: 16px }
#floatnav-dialog .form-message .messages { font-size: 16px; font-weight: 400; color: #333; line-height: 24px; margin-top: 20px }
#floatnav-dialog .form-message #register_form span { font-size: 16px; font-weight: 400; color: #666 }
#floatnav-dialog .form-message #register_form input { width: 540px; height: 40px; border: 1px solid #999; border-radius: 4px; padding-left: 10px; box-sizing: border-box }
#floatnav-dialog .form-message #register_form textarea { width: 540px; height: 100px; border: 1px solid #999; border-radius: 4px; padding-left: 10px; box-sizing: border-box; resize: none }
#floatnav-dialog .form-message #register_form .order { color: #666 }
#floatnav-dialog .form-message .line { width: 100%; height: 1px; background: #e2e4e7 }
#floatnav-dialog .form-message .button .button-l { background: #333; border-radius: 4px; color: #fff; margin-left: 172px }
#floatnav-dialog .form-message .button .button-l, #floatnav-dialog .form-message .button .button-r { width: 88px; height: 34px; font-size: 16px; font-weight: 400; text-align: center; line-height: 34px; margin-top: 16px }
#floatnav-dialog .form-message .button .button-r { border: 1px solid #999; border-radius: 4px; color: #999; margin-left: 20px }
.ntalk-window-containter { left: auto!important; top: auto!important; right: 0!important; bottom: 0!important }