/* Start:/local/templates/index/css/button.css?17696900232093*/ .buttons { display: flex; justify-content: space-around; z-index: 2; } .button-block a { padding: 5px; display: inline-block; width: 250px; height: 60px; color: #191919; text-decoration: none; position: relative; text-align: center; line-height: 60px; transition: all 0.1s linear 0s; font-size: 18px; font-weight: bold; text-transform: uppercase; } .button-block a svg { position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .button-block a svg .line1 { transition: all 0.1s linear 0.2s; stroke-linecap: square; } .button-block a svg .line2 { transition: all 0.1s linear 0.1s; stroke-linecap: square; } .button-block a svg .line3 { transition: all 0.1s linear 0.2s; stroke-linecap: square; } .button-block a svg .line4 { transition: all 0.1s linear 0.1s; stroke-linecap: square; } .button-block a svg .circle1 { transition: all 0.1s linear 0.3s; } .button-block a svg .circle2 { transition: all 0.1s linear 0.3s; } .button-block a:hover { background-color: #c90310; color: white; transition: all 0.1s linear 0.3s; } .button-block a:hover svg .line1 { transition: all 0.1s linear 0.1s; transform: rotateY(90deg); } .button-block a:hover svg .line2 { transition: all 0.1s linear 0s; transform: rotateY(90deg); } .button-block a:hover svg .line3 { transition: all 0.1s linear 0.1s; transform: rotateY(90deg); } .button-block a:hover svg .line4 { transition: all 0.1s linear 0s; transform: rotateY(90deg); } .button-block a:hover svg .circle1 { transition: all 0.1s linear 0.2s; transform: rotateY(90deg); } .button-block a:hover svg .circle2 { transition: all 0.1s linear 0.2s; transform: rotateY(90deg); } /*# sourceMappingURL=styles.css.map */ /* End */ /* Start:/local/templates/index/owlcarousel/assets/owl.carousel.min.css?16022219503351*/ /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ .owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;touch-action:manipulation;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot{background:0 0;color:inherit;border:none;padding:0!important;font:inherit}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-ms-touch-action:pan-y;touch-action:pan-y;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""]{max-height:0}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(/local/templates/index/owlcarousel/assets/owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%} /* End */ /* Start:/local/templates/index/fancybox/jquery.fancybox.css?16022219504895*/ /*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; } .fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .fancybox-opened { z-index: 8030; } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } .fancybox-outer, .fancybox-inner { position: relative; } .fancybox-inner { overflow: hidden; } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; } .fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 15px; white-space: nowrap; } .fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; } .fancybox-image { max-width: 100%; max-height: 100%; } #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('/local/templates/index/fancybox/fancybox_sprite.png'); } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060; } #fancybox-loading div { width: 44px; height: 44px; background: url('/local/templates/index/fancybox/fancybox_loading.gif') center center no-repeat; } .fancybox-close { position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040; } .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url('/local/templates/index/fancybox/blank.gif'); /* helps IE */ -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 8040; } .fancybox-prev { left: 0; } .fancybox-next { right: 0; } .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; } .fancybox-prev span { left: 10px; background-position: 0 -36px; } .fancybox-next span { right: 10px; background-position: 0 -72px; } .fancybox-nav:hover span { visibility: visible; } .fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important; } /* Overlay helper */ .fancybox-lock { overflow: hidden !important; width: auto; } .fancybox-lock body { overflow: hidden !important; } .fancybox-lock-test { overflow-y: hidden !important; } .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url('/local/templates/index/fancybox/fancybox_overlay.png'); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; } /* Title helper */ .fancybox-title { visibility: hidden; font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; position: relative; text-shadow: none; z-index: 8050; } .fancybox-opened .fancybox-title { visibility: visible; } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; } .fancybox-title-inside-wrap { padding-top: 10px; } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8); } /*Retina graphics!*/ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5){ #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('/local/templates/index/fancybox/fancybox_sprite@2x.png'); background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ } #fancybox-loading div { background-image: url('/local/templates/index/fancybox/fancybox_loading@2x.gif'); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } } /* End */ /* Start:/local/templates/index/owlcarousel/assets/owl.theme.default.min.css?16022219501013*/ /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ .owl-theme .owl-dots,.owl-theme .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-nav{margin-top:10px}.owl-theme .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}.owl-theme .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none}.owl-theme .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-nav.disabled+.owl-dots{margin-top:10px}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791} /* End */ /* Start:/local/templates/index/css/animate.css?160222195063368*/ @charset "UTF-8"; /* Animate.css - http://daneden.me/animate Licensed under the MIT license Copyright (c) 2013 Daniel Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */ -webkit-backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s; -moz-animation-duration: 2s; -o-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-moz-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-o-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } .animated.flash { -webkit-animation-name: flash; -moz-animation-name: flash; -o-animation-name: flash; animation-name: flash; } @-webkit-keyframes shake { 0%, 100% {-webkit-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);} } @-moz-keyframes shake { 0%, 100% {-moz-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-moz-transform: translateX(10px);} } @-o-keyframes shake { 0%, 100% {-o-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-o-transform: translateX(10px);} } @keyframes shake { 0%, 100% {transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);} 20%, 40%, 60%, 80% {transform: translateX(10px);} } .animated.shake { -webkit-animation-name: shake; -moz-animation-name: shake; -o-animation-name: shake; animation-name: shake; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 40% {-webkit-transform: translateY(-30px);} 60% {-webkit-transform: translateY(-15px);} } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);} 40% {-moz-transform: translateY(-30px);} 60% {-moz-transform: translateY(-15px);} } @-o-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);} 40% {-o-transform: translateY(-30px);} 60% {-o-transform: translateY(-15px);} } @keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 40% {transform: translateY(-30px);} 60% {transform: translateY(-15px);} } .animated.bounce { -webkit-animation-name: bounce; -moz-animation-name: bounce; -o-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes tada { 0% {-webkit-transform: scale(1);} 10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);} 100% {-webkit-transform: scale(1) rotate(0);} } @-moz-keyframes tada { 0% {-moz-transform: scale(1);} 10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);} 100% {-moz-transform: scale(1) rotate(0);} } @-o-keyframes tada { 0% {-o-transform: scale(1);} 10%, 20% {-o-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);} 100% {-o-transform: scale(1) rotate(0);} } @keyframes tada { 0% {transform: scale(1);} 10%, 20% {transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);} 100% {transform: scale(1) rotate(0);} } .animated.tada { -webkit-animation-name: tada; -moz-animation-name: tada; -o-animation-name: tada; animation-name: tada; } @-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; } 20% { -webkit-transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); } } @-moz-keyframes swing { 20% { -moz-transform: rotate(15deg); } 40% { -moz-transform: rotate(-10deg); } 60% { -moz-transform: rotate(5deg); } 80% { -moz-transform: rotate(-5deg); } 100% { -moz-transform: rotate(0deg); } } @-o-keyframes swing { 20% { -o-transform: rotate(15deg); } 40% { -o-transform: rotate(-10deg); } 60% { -o-transform: rotate(5deg); } 80% { -o-transform: rotate(-5deg); } 100% { -o-transform: rotate(0deg); } } @keyframes swing { 20% { transform: rotate(15deg); } 40% { transform: rotate(-10deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } } .animated.swing { -webkit-transform-origin: top center; -moz-transform-origin: top center; -o-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; -moz-animation-name: swing; -o-animation-name: swing; animation-name: swing; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); } } @-moz-keyframes wobble { 0% { -moz-transform: translateX(0%); } 15% { -moz-transform: translateX(-25%) rotate(-5deg); } 30% { -moz-transform: translateX(20%) rotate(3deg); } 45% { -moz-transform: translateX(-15%) rotate(-3deg); } 60% { -moz-transform: translateX(10%) rotate(2deg); } 75% { -moz-transform: translateX(-5%) rotate(-1deg); } 100% { -moz-transform: translateX(0%); } } @-o-keyframes wobble { 0% { -o-transform: translateX(0%); } 15% { -o-transform: translateX(-25%) rotate(-5deg); } 30% { -o-transform: translateX(20%) rotate(3deg); } 45% { -o-transform: translateX(-15%) rotate(-3deg); } 60% { -o-transform: translateX(10%) rotate(2deg); } 75% { -o-transform: translateX(-5%) rotate(-1deg); } 100% { -o-transform: translateX(0%); } } @keyframes wobble { 0% { transform: translateX(0%); } 15% { transform: translateX(-25%) rotate(-5deg); } 30% { transform: translateX(20%) rotate(3deg); } 45% { transform: translateX(-15%) rotate(-3deg); } 60% { transform: translateX(10%) rotate(2deg); } 75% { transform: translateX(-5%) rotate(-1deg); } 100% { transform: translateX(0%); } } .animated.wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -o-animation-name: wobble; animation-name: wobble; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(1.1); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes pulse { 0% { -moz-transform: scale(1); } 50% { -moz-transform: scale(1.1); } 100% { -moz-transform: scale(1); } } @-o-keyframes pulse { 0% { -o-transform: scale(1); } 50% { -o-transform: scale(1.1); } 100% { -o-transform: scale(1); } } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); } } .animated.pulse { -webkit-animation-name: pulse; -moz-animation-name: pulse; -o-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; } } @-moz-keyframes flip { 0% { -moz-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -moz-animation-timing-function: ease-out; } 40% { -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -moz-animation-timing-function: ease-out; } 50% { -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -moz-animation-timing-function: ease-in; } 80% { -moz-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -moz-animation-timing-function: ease-in; } 100% { -moz-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -moz-animation-timing-function: ease-in; } } @-o-keyframes flip { 0% { -o-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -o-animation-timing-function: ease-out; } 40% { -o-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -o-animation-timing-function: ease-out; } 50% { -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -o-animation-timing-function: ease-in; } 80% { -o-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -o-animation-timing-function: ease-in; } 100% { -o-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -o-animation-timing-function: ease-in; } } @keyframes flip { 0% { transform: perspective(400px) translateZ(0) rotateY(0) scale(1); animation-timing-function: ease-out; } 40% { transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); animation-timing-function: ease-out; } 50% { transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); animation-timing-function: ease-in; } 80% { transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); animation-timing-function: ease-in; } 100% { transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible !important; -webkit-animation-name: flip; -moz-backface-visibility: visible !important; -moz-animation-name: flip; -o-backface-visibility: visible !important; -o-animation-name: flip; backface-visibility: visible !important; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @-moz-keyframes flipInX { 0% { -moz-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -moz-transform: perspective(400px) rotateX(-10deg); } 70% { -moz-transform: perspective(400px) rotateX(10deg); } 100% { -moz-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @-o-keyframes flipInX { 0% { -o-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -o-transform: perspective(400px) rotateX(-10deg); } 70% { -o-transform: perspective(400px) rotateX(10deg); } 100% { -o-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX { 0% { transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { transform: perspective(400px) rotateX(-10deg); } 70% { transform: perspective(400px) rotateX(10deg); } 100% { transform: perspective(400px) rotateX(0deg); opacity: 1; } } .animated.flipInX { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-backface-visibility: visible !important; -moz-animation-name: flipInX; -o-backface-visibility: visible !important; -o-animation-name: flipInX; backface-visibility: visible !important; animation-name: flipInX; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); opacity: 0; } } @-moz-keyframes flipOutX { 0% { -moz-transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -moz-transform: perspective(400px) rotateX(90deg); opacity: 0; } } @-o-keyframes flipOutX { 0% { -o-transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -o-transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes flipOutX { 0% { transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { transform: perspective(400px) rotateX(90deg); opacity: 0; } } .animated.flipOutX { -webkit-animation-name: flipOutX; -webkit-backface-visibility: visible !important; -moz-animation-name: flipOutX; -moz-backface-visibility: visible !important; -o-animation-name: flipOutX; -o-backface-visibility: visible !important; animation-name: flipOutX; backface-visibility: visible !important; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); opacity: 1; } } @-moz-keyframes flipInY { 0% { -moz-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -moz-transform: perspective(400px) rotateY(-10deg); } 70% { -moz-transform: perspective(400px) rotateY(10deg); } 100% { -moz-transform: perspective(400px) rotateY(0deg); opacity: 1; } } @-o-keyframes flipInY { 0% { -o-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -o-transform: perspective(400px) rotateY(-10deg); } 70% { -o-transform: perspective(400px) rotateY(10deg); } 100% { -o-transform: perspective(400px) rotateY(0deg); opacity: 1; } } @keyframes flipInY { 0% { transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { transform: perspective(400px) rotateY(-10deg); } 70% { transform: perspective(400px) rotateY(10deg); } 100% { transform: perspective(400px) rotateY(0deg); opacity: 1; } } .animated.flipInY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInY; -moz-backface-visibility: visible !important; -moz-animation-name: flipInY; -o-backface-visibility: visible !important; -o-animation-name: flipInY; backface-visibility: visible !important; animation-name: flipInY; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); opacity: 0; } } @-moz-keyframes flipOutY { 0% { -moz-transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -moz-transform: perspective(400px) rotateY(90deg); opacity: 0; } } @-o-keyframes flipOutY { 0% { -o-transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -o-transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes flipOutY { 0% { transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { transform: perspective(400px) rotateY(90deg); opacity: 0; } } .animated.flipOutY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipOutY; -moz-backface-visibility: visible !important; -moz-animation-name: flipOutY; -o-backface-visibility: visible !important; -o-animation-name: flipOutY; backface-visibility: visible !important; animation-name: flipOutY; } @-webkit-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-moz-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-o-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } .animated.fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUp { 0% { opacity: 0; -o-transform: translateY(20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } } .animated.fadeInUp { -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDown { 0% { opacity: 0; -moz-transform: translateY(-20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDown { 0% { opacity: 0; -o-transform: translateY(-20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } } .animated.fadeInDown { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeft { 0% { opacity: 0; -o-transform: translateX(-20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } } .animated.fadeInLeft { -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRight { 0% { opacity: 0; -moz-transform: translateX(20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRight { 0% { opacity: 0; -o-transform: translateX(20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateX(0); } } .animated.fadeInRight { -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -o-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUpBig { 0% { opacity: 0; -moz-transform: translateY(2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUpBig { 0% { opacity: 0; -o-transform: translateY(2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; transform: translateY(2000px); } 100% { opacity: 1; transform: translateY(0); } } .animated.fadeInUpBig { -webkit-animation-name: fadeInUpBig; -moz-animation-name: fadeInUpBig; -o-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDownBig { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDownBig { 0% { opacity: 0; -o-transform: translateY(-2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; transform: translateY(-2000px); } 100% { opacity: 1; transform: translateY(0); } } .animated.fadeInDownBig { -webkit-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig; -o-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeftBig { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeftBig { 0% { opacity: 0; -o-transform: translateX(-2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px); } 100% { opacity: 1; transform: translateX(0); } } .animated.fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; -moz-animation-name: fadeInLeftBig; -o-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRightBig { 0% { opacity: 0; -moz-transform: translateX(2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRightBig { 0% { opacity: 0; -o-transform: translateX(2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; transform: translateX(2000px); } 100% { opacity: 1; transform: translateX(0); } } .animated.fadeInRightBig { -webkit-animation-name: fadeInRightBig; -moz-animation-name: fadeInRightBig; -o-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-moz-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-o-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } .animated.fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); } } @-moz-keyframes fadeOutUp { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-20px); } } @-o-keyframes fadeOutUp { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-20px); } } .animated.fadeOutUp { -webkit-animation-name: fadeOutUp; -moz-animation-name: fadeOutUp; -o-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); } } @-moz-keyframes fadeOutDown { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(20px); } } @-o-keyframes fadeOutDown { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(20px); } } .animated.fadeOutDown { -webkit-animation-name: fadeOutDown; -moz-animation-name: fadeOutDown; -o-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); } } @-moz-keyframes fadeOutLeft { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-20px); } } @-o-keyframes fadeOutLeft { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-20px); } } .animated.fadeOutLeft { -webkit-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft; -o-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); } } @-moz-keyframes fadeOutRight { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(20px); } } @-o-keyframes fadeOutRight { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(20px); } } .animated.fadeOutRight { -webkit-animation-name: fadeOutRight; -moz-animation-name: fadeOutRight; -o-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes fadeOutUpBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes fadeOutUpBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } } .animated.fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; -moz-animation-name: fadeOutUpBig; -o-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes fadeOutDownBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes fadeOutDownBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(2000px); } } .animated.fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; -moz-animation-name: fadeOutDownBig; -o-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes fadeOutLeftBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes fadeOutLeftBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } } .animated.fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; -moz-animation-name: fadeOutLeftBig; -o-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes fadeOutRightBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes fadeOutRightBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } } .animated.fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; -moz-animation-name: fadeOutRightBig; -o-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); } 70% { -webkit-transform: scale(.9); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes bounceIn { 0% { opacity: 0; -moz-transform: scale(.3); } 50% { opacity: 1; -moz-transform: scale(1.05); } 70% { -moz-transform: scale(.9); } 100% { -moz-transform: scale(1); } } @-o-keyframes bounceIn { 0% { opacity: 0; -o-transform: scale(.3); } 50% { opacity: 1; -o-transform: scale(1.05); } 70% { -o-transform: scale(.9); } 100% { -o-transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; transform: scale(.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(.9); } 100% { transform: scale(1); } } @-webkit-keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes slideInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes slideInDown { 0% { opacity: 0; -o-transform: translateY(-2000px); } 100% { -o-transform: translateY(0); } } @keyframes slideInDown { 0% { opacity: 0; transform: translateY(-2000px); } 100% { transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; -moz-animation-name: slideInDown; -o-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes slideInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes slideInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px); } 100% { -o-transform: translateX(0); } } @keyframes slideInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 100% { transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; -moz-animation-name: slideInLeft; -o-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes slideInRight { 0% { opacity: 0; -moz-transform: translateX(2000px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes slideInRight { 0% { opacity: 0; -o-transform: translateX(2000px); } 100% { -o-transform: translateX(0); } } @keyframes slideInRight { 0% { opacity: 0; transform: translateX(2000px); } 100% { transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; -moz-animation-name: slideInRight; -o-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes slideOutLeft { 0% { -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes slideOutLeft { 0% { -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes slideOutLeft { 0% { transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; -moz-animation-name: slideOutLeft; -o-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes slideOutRight { 0% { -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes slideOutRight { 0% { -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes slideOutRight { 0% { transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } } .slideOutRight { -webkit-animation-name: slideOutRight; -moz-animation-name: slideOutRight; -o-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes slideOutUp { 0% { -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes slideOutUp { 0% { -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes slideOutUp { 0% { transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } } .slideOutUp { -webkit-animation-name: slideOutUp; -moz-animation-name: slideOutUp; -o-animation-name: slideOutUp; animation-name: slideOutUp; } .animated.bounceIn { -webkit-animation-name: bounceIn; -moz-animation-name: bounceIn; -o-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInUp { 0% { opacity: 0; -moz-transform: translateY(2000px); } 60% { opacity: 1; -moz-transform: translateY(-30px); } 80% { -moz-transform: translateY(10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInUp { 0% { opacity: 0; -o-transform: translateY(2000px); } 60% { opacity: 1; -o-transform: translateY(-30px); } 80% { -o-transform: translateY(10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; transform: translateY(2000px); } 60% { opacity: 1; transform: translateY(-30px); } 80% { transform: translateY(10px); } 100% { transform: translateY(0); } } .animated.bounceInUp { -webkit-animation-name: bounceInUp; -moz-animation-name: bounceInUp; -o-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 60% { opacity: 1; -moz-transform: translateY(30px); } 80% { -moz-transform: translateY(-10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInDown { 0% { opacity: 0; -o-transform: translateY(-2000px); } 60% { opacity: 1; -o-transform: translateY(30px); } 80% { -o-transform: translateY(-10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; transform: translateY(-2000px); } 60% { opacity: 1; transform: translateY(30px); } 80% { transform: translateY(-10px); } 100% { transform: translateY(0); } } .animated.bounceInDown { -webkit-animation-name: bounceInDown; -moz-animation-name: bounceInDown; -o-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 60% { opacity: 1; -moz-transform: translateX(30px); } 80% { -moz-transform: translateX(-10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px); } 60% { opacity: 1; -o-transform: translateX(30px); } 80% { -o-transform: translateX(-10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 60% { opacity: 1; transform: translateX(30px); } 80% { transform: translateX(-10px); } 100% { transform: translateX(0); } } .animated.bounceInLeft { -webkit-animation-name: bounceInLeft; -moz-animation-name: bounceInLeft; -o-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInRight { 0% { opacity: 0; -moz-transform: translateX(2000px); } 60% { opacity: 1; -moz-transform: translateX(-30px); } 80% { -moz-transform: translateX(10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInRight { 0% { opacity: 0; -o-transform: translateX(2000px); } 60% { opacity: 1; -o-transform: translateX(-30px); } 80% { -o-transform: translateX(10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; transform: translateX(2000px); } 60% { opacity: 1; transform: translateX(-30px); } 80% { transform: translateX(10px); } 100% { transform: translateX(0); } } .animated.bounceInRight { -webkit-animation-name: bounceInRight; -moz-animation-name: bounceInRight; -o-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); } 25% { -webkit-transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); } } @-moz-keyframes bounceOut { 0% { -moz-transform: scale(1); } 25% { -moz-transform: scale(.95); } 50% { opacity: 1; -moz-transform: scale(1.1); } 100% { opacity: 0; -moz-transform: scale(.3); } } @-o-keyframes bounceOut { 0% { -o-transform: scale(1); } 25% { -o-transform: scale(.95); } 50% { opacity: 1; -o-transform: scale(1.1); } 100% { opacity: 0; -o-transform: scale(.3); } } @keyframes bounceOut { 0% { transform: scale(1); } 25% { transform: scale(.95); } 50% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(.3); } } .animated.bounceOut { -webkit-animation-name: bounceOut; -moz-animation-name: bounceOut; -o-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes bounceOutUp { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(20px); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes bounceOutUp { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(20px); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(20px); } 100% { opacity: 0; transform: translateY(-2000px); } } .animated.bounceOutUp { -webkit-animation-name: bounceOutUp; -moz-animation-name: bounceOutUp; -o-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes bounceOutDown { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(-20px); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes bounceOutDown { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(-20px); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(-20px); } 100% { opacity: 0; transform: translateY(2000px); } } .animated.bounceOutDown { -webkit-animation-name: bounceOutDown; -moz-animation-name: bounceOutDown; -o-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes bounceOutLeft { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(20px); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes bounceOutLeft { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(20px); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(20px); } 100% { opacity: 0; transform: translateX(-2000px); } } .animated.bounceOutLeft { -webkit-animation-name: bounceOutLeft; -moz-animation-name: bounceOutLeft; -o-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes bounceOutRight { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(-20px); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes bounceOutRight { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(-20px); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(-20px); } 100% { opacity: 0; transform: translateX(2000px); } } .animated.bounceOutRight { -webkit-animation-name: bounceOutRight; -moz-animation-name: bounceOutRight; -o-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateIn { 0% { -moz-transform-origin: center center; -moz-transform: rotate(-200deg); opacity: 0; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateIn { 0% { -o-transform-origin: center center; -o-transform: rotate(-200deg); opacity: 0; } 100% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { transform-origin: center center; transform: rotate(-200deg); opacity: 0; } 100% { transform-origin: center center; transform: rotate(0); opacity: 1; } } .animated.rotateIn { -webkit-animation-name: rotateIn; -moz-animation-name: rotateIn; -o-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .animated.rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; -moz-animation-name: rotateInUpLeft; -o-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .animated.rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; -moz-animation-name: rotateInDownLeft; -o-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .animated.rotateInUpRight { -webkit-animation-name: rotateInUpRight; -moz-animation-name: rotateInUpRight; -o-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .animated.rotateInDownRight { -webkit-animation-name: rotateInDownRight; -moz-animation-name: rotateInDownRight; -o-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(200deg); opacity: 0; } } @-moz-keyframes rotateOut { 0% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(200deg); opacity: 0; } } @-o-keyframes rotateOut { 0% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: center center; -o-transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { transform-origin: center center; transform: rotate(0); opacity: 1; } 100% { transform-origin: center center; transform: rotate(200deg); opacity: 0; } } .animated.rotateOut { -webkit-animation-name: rotateOut; -moz-animation-name: rotateOut; -o-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } } .animated.rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; -moz-animation-name: rotateOutUpLeft; -o-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } } .animated.rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; -moz-animation-name: rotateOutDownLeft; -o-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } } .animated.rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; -moz-animation-name: rotateOutUpRight; -o-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } } .animated.rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; -moz-animation-name: rotateOutDownRight; -o-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); opacity: 0; } } @-moz-keyframes hinge { 0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 100% { -moz-transform: translateY(700px); opacity: 0; } } @-o-keyframes hinge { 0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 100% { -o-transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; } 20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; } 40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; } 80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } 100% { transform: translateY(700px); opacity: 0; } } .animated.hinge { -webkit-animation-name: hinge; -moz-animation-name: hinge; -o-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } } @-moz-keyframes rollIn { 0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } } @-o-keyframes rollIn { 0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; transform: translateX(0px) rotate(0deg); } } .animated.rollIn { -webkit-animation-name: rollIn; -moz-animation-name: rollIn; -o-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); } } @-moz-keyframes rollOut { 0% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -moz-transform: translateX(100%) rotate(120deg); } } @-o-keyframes rollOut { 0% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -o-transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; transform: translateX(100%) rotate(120deg); } } .animated.rollOut { -webkit-animation-name: rollOut; -moz-animation-name: rollOut; -o-animation-name: rollOut; animation-name: rollOut; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-moz-keyframes lightSpeedIn { 0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-o-keyframes lightSpeedIn { 0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { transform: translateX(0%) skewX(0deg); opacity: 1; } } .animated.lightSpeedIn { -webkit-animation-name: lightSpeedIn; -moz-animation-name: lightSpeedIn; -o-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } .animated.lightSpeedIn { -webkit-animation-duration: 0.5s; -moz-animation-duration: 0.5s; -o-animation-duration: 0.5s; animation-duration: 0.5s; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-moz-keyframes lightSpeedOut { 0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-o-keyframes lightSpeedOut { 0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { transform: translateX(100%) skewX(-30deg); opacity: 0; } } .animated.lightSpeedOut { -webkit-animation-name: lightSpeedOut; -moz-animation-name: lightSpeedOut; -o-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } .animated.lightSpeedOut { -webkit-animation-duration: 0.25s; -moz-animation-duration: 0.25s; -o-animation-duration: 0.25s; animation-duration: 0.25s; } /* End */ /* Start:/local/templates/index/styles.css?177753441344680*/ body { margin: 0; padding: 0; font-family: 'Open Sans', sans-serif; font-size: 16px; line-height:1.2; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; background: #fff; color: #1f1f1f; height: auto; text-align: justify; overflow-x: hidden; } * { box-sizing: content-box; } p,h1,h2,h3,h4,input {margin-top:0px;} a img{border:0;} input[type='button'], input[type='submit'] {cursor: pointer;} article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary, div { display: block; position: relative; }div.clear {clear: both;} input,textarea{outline:none;} html {height: 100%;} .clear {clear: both;} img {height: auto; vertical-align: middle;} p { margin-bottom: 20px; line-height: 1.2; } a {color:#c90410;} a:hover {text-decoration: none;} .hidden{ opacity: 0; } .visible{ opacity: 1; } .center { clear: both; width: 1825px; margin: 0 auto; } .header { width: 100%; height: 120px; padding: 20px 0 15px; background: #fff; } .header-logo { display: block; float: left; margin: 0px 0 0; position: absolute; z-index: 2; width: 240px; } .header-logo svg { max-height: 120px; width: 100%; } .header-contacts { float: right; width: 410px; margin-top: -25px; } .header-contacts-adres-icon { color: #c90410; font-size: 40px; display: block; width: 40px; margin-left: 15px; float: left; } .header-contacts-adres-value { display: block; width: 280px; margin-top: 8px; float: left; } .header-call { clear: both; width: 100%; float: left; margin: 15px 0 0; display: flex; align-items: center; justify-content: space-between; } .header-call>span{ display: flex; align-items: center; } .header-call-phone a { display: block; /*float: left;*/ color: #c90410; text-decoration: none; font-size: 20px; font-weight: bold; } .header-call-phone>span{ display: flex; flex-direction: column; justify-content: center; } .header-contacts-adres .header-call-phone a { color: #c90410; } .header-contacts-adres .header-call-phone a:hover { text-decoration: underline; } .header-call-phone-icon { display: block; float: left; font-size: 30px; text-align: center; height: 50px; width: 50px; line-height: 50px; margin: 0 15px 0 0; border-radius: 50px; border: 2px solid #c90410; } .header-call-phone-value { display: block; float: left; /* margin: 12px 0 0;*/ } .header-callback-btn { display: block; /*float: right;*/ font-size: 16px; color: #000000; padding: 0 5px; border-bottom: 1px dashed #000; /*margin: 14px 0 0 0;*/ } .header-callback-btn:hover { cursor: pointer; color: #c90410; border-bottom: 1px dashed #c90410; } .header-title { font-size: 24px; font-weight: bold; color: #000; position: absolute; padding: 40px 410px 0 310px; } .header-title p{ margin-bottom: 10px; } .topmenu { width: 100%; height: 70px; background: #1c1c1c; position: sticky; top: 0; z-index: 999; } .topmenu-block { float: left; width: 1170px; height: 70px; } .topmenu-ul { margin: 0; padding: 0; list-style: } .topmenu-item { float: left; position: relative; list-style: none; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; } .topmenu-link { display: block; color: #fff; line-height: 70px; font-size: 20px; padding: 0 30px; font-weight: bold; text-transform: uppercase; text-decoration: none; } .topmenu-item.active, .topmenu-item:hover { background: #c90410; } .submenu { display: none; position: absolute; border: 6px solid #c90410; padding: 60px 0 40px; z-index: 10; width: 1820px; background: #fff; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; opacity: 0; } .topmenu-item:hover .submenu { /*display: block;*/ display: flex; flex-wrap: wrap; height: 50vh; overflow: auto; row-gap: 40px; z-index: 999; opacity: 1; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; } .submenu-columm { float: left; width: 23%; } .submenu-columm:first-child { width: 31%; } .submenu-columm-logo { display: table-cell; padding: 0 40px; height: 100px; vertical-align: middle; } .submenu-columm-logo img{ max-width: 100%; max-height: 100%; } .submenu-columm-ul { list-style: none; margin: 0; padding: 0; } .submenu-columm-item { width: 100%; } .submenu-columm-link { display: block; padding: 10px 40px; text-decoration: none; color: #1c1c1c; font-size: 18px; font-weight: 600; text-align: left; } .submenu-columm-item:hover .submenu-columm-link{ background: #c90410; color: #fff; } /*.submenu-columm:nth-child(7) .submenu-columm-logo, .submenu-columm:nth-child(8) .submenu-columm-logo{*/ /* display: none;*/ /*}*/ .header-personal { float: right; width: 600px; } .header-search { float: left; width: 375px; margin-top: 10px; } .header-search-form-value{ border: none; border-bottom: 1px solid #a8a8a8; color: #a8a8a8; width: 340px; } .header-search-form-value { border: none; border-bottom: 1px solid #a8a8a8; color: #a8a8a8; width: 340px; background: none; height: 40px; font-size: 14px; } .header-search-form-submit { border: none; position: absolute; right: 28px; top: 8px; width: 26px; height: 26px; background: url(/local/templates/index/img/icon/search.png) center center no-repeat; } .header-cart { float: right; margin-top: 8px; } .header-cart-link { display: block; } .header-cart-link-icon { display: block; width: 50px; height: 50px; border-radius: 50px; line-height: 50px; text-align: center; font-size: 25px; color: #fff; border: 2px solid #fff; } .header-personal-active .header-cart-link-icon { color: #c90410; border-color: #c90410; } .header-cart-info { display: none; } .header-personal-active .header-cart-info { display: block; } .header-cart-info-price { display: block; color: #c90410; font-size: 22px; font-weight: bold; float: left; /*width: 110px;*/ margin-right:10px; } .header-cart-info-count { display: block; color: #c90410; font-size: 16px; width: 30px; float: left; } .header-personal-active .header-cart-link-icon { color: #c90410; border-color: #c90410; float: left; width: 50px; } .header-personal-active .header-cart-info { display: block; float: left; margin-left: 10px; line-height: 52px; } .header-personal-active .header-search { width: 315px; } .header-personal-active .header-search-form-value { width: 280px; } .partner-item-img img { max-width: 170px; } .main { clear: both; float: left; width: 100%; background: url(/local/templates/index/img/body-bg.png) center bottom 450px no-repeat; } .slider-index { overflow: hidden; background: #1c1c1c; } /*.slider-index .owl-stage-outer > div:not(.active){ display: none; }*/ .owl-item { float: left; } .slider-index-info { position: absolute; width: 740px; top: 170px; left: 310px; text-align: left; } .slider-inde-item-link { display: block; } .slider-index-info-title { font-size: 80px; font-weight: 800; color: #fff; margin-bottom: 70px; position: relative; } .slider-index-info-title::after { content: ""; position: absolute; width: 80px; height: 2px; background: #fff; bottom: -30px; left: 0; } .slider-index-info-preview { display: block; width: 100%; font-size: 30px; color: #fff; } .slider-index .owl-nav { position: absolute; right: 0; top: 220px; } .slider-index .owl-nav button span{ display: none; } .slider-index .owl-nav button { border: 2px solid transparent; background: none; width: 135px; height: 145px; border-radius: 150px; cursor: pointer; outline: none; } .slider-index .owl-nav button.owl-prev { background: url(/local/templates/index/img/icon/arr-left2.png) center center no-repeat; } .slider-index .owl-nav button.owl-next { background: url(/local/templates/index/img/icon/arr-right2.png) center center no-repeat; } .slider-index .owl-nav button.owl-prev:hover { background: url(/local/templates/index/img/icon/arr-left2a.png) center center no-repeat; } .slider-index .owl-nav button.owl-next:hover { background: url(/local/templates/index/img/icon/arr-right2a.png) center center no-repeat; } .brand-index { clear: both; width: 100%; background: #1c1c1c; padding: 70px 0; float: left; overflow: hidden; } .brand-index .center { overflow: hidden; } .top-product-index { clear:both; width: 100%; height: 930px; padding-top: 120px; background: #c90310; background-attachment: fixed; } .top-product-index:after { content: ""; position: absolute; top: 0; right: 0; width: 100%; height: 100%; background: url(/local/templates/index/img/bg-red-after.png) 0 0 no-repeat; z-index: 0; } .title-h2 { font-size: 60px; color: #fff; padding-left: 155px; position: relative; margin: 0 0 40px; } .title-h2::after { content: ""; width: 110px; height: 5px; background: #fff; position: absolute; left: 0; top: 50%; margin-top: -2px; } .title-h2::before { content: ""; width: 20px; height: 20px; border-radius: 20px; background: #fff; position: absolute; left: 110px; top: 50%; margin-top: -10px; } .brand-index-block { clear: both; width: 100%; float: left; margin: 40px 0; } .brand-index-item { float: left; margin: 0 58px; } .top-product-index-slider { float: left; width: 100%; padding-bottom: 100px; overflow: hidden; z-index: 3; } .top-product-index-slider-item { border: 5px solid #fff; width: 425px; margin-left: 28px; float: left; background: #fff; } .top-product-index-slider-item:first-child { margin: 0; } .top-product-index-slider-item-link { display: block; height: 350px; overflow: hidden; width: 100%; background: #fff; text-align: center; } .top-product-index-slider-item .top-product-index-slider-item-link .top-product-index-slider-item-link-img { -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; -webkit-transition: all 1s ease-out; width: 90%; } .top-product-index-slider-item:hover .top-product-index-slider-item-link .top-product-index-slider-item-link-img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); } .top-product-index-slider-item:hover { border: 5px solid #ffcc00; background: #ffcc00; } .top-product-index .title-h2 { margin-bottom: 120px; } .top-product-index-slider-item-name { display: block; text-align: left; width: 86%; height: 46px; line-height: 25px; background: #fff; font-size: 19px; font-weight: bold; text-decoration: none; color: #1c1c1c; padding: 0 7% 20px; overflow: hidden; } .top-product-index-slider-item:hover .top-product-index-slider-item-name { background: #ffcc00; /*position: absolute; bottom: -131px;*/ position: relative; left: -5px; padding: 25px 7% 80px; border: 5px solid #fc0; } .top-product-index-slider-item:hover .top-product-index-slider-item-name::after { content: ""; width: 16%; height: 5px; background: #1c1c1c; position: absolute; left: 7%; /*top: 86px;*/ top: 110px; margin-top: -2px; } .top-product-index-slider-item:hover .top-product-index-slider-item-name::before { content: ""; width: 14px; height: 14px; border-radius: 20px; background: #1c1c1c; position: absolute; left: 22%; /*top: 89px;*/ top: 114px; margin-top: -10px; } .top-product-index-slider .owl-nav { position: absolute; left: 0; top: 200px; width: 99%; } .top-product-index-slider .owl-nav button span{ display: none; } .top-product-index-slider .owl-nav button { background: none; width: 17px; height: 40px; cursor: pointer; position: absolute; border: none; } .top-product-index-slider .owl-nav button.owl-prev { background: url(/local/templates/index/img/icon/arr-left2.png) center center no-repeat; left: 10px; } .top-product-index-slider .owl-nav button.owl-next { background: url(/local/templates/index/img/icon/arr-right2.png) center center no-repeat; right: 12px; } .top-product-index-slider .owl-nav button.owl-prev:hover { background: url(/local/templates/index/img/icon/arr-left2a.png) center center no-repeat; } .top-product-index-slider .owl-nav button.owl-next:hover { background: url(/local/templates/index/img/icon/arr-right2a.png) center center no-repeat; } .catalog-section { clear: both; float: left; width: 100%; } .catalog-section .buttons { position: absolute; right: 0; top: 23px; } .top-product-index:before{ content: ""; width: 100%; height: 184px; background: url(/local/templates/index/img/bg-red-before.png) 0 0 no-repeat; position: absolute; bottom: 0; z-index: 3; background-size: 100%; background-position: bottom center; } .catalog-section:before { /*content: "";*/ position: absolute; top: -180px; width: 100%; height: 184px; background: url(/local/templates/index/img/bg-red-before.png) 0 0 no-repeat; z-index: 3; } .catalog-section .title-h2 { color: #c90410; margin-top: 30px; margin-bottom: 80px; } .catalog-section .title-h2:after { background: #c90410; } .catalog-section .title-h2:before { background: #c90410; } .catalog-section-item { float: left; width: 425px; height: 425px; margin: 0 0 45px 40px; } .catalog-section-item:nth-child(4n+1) { clear: both; margin-left: 0px; } .catalog-section-item-name { font-size: 30px; color: #191919; text-decoration: none; font-weight: bold; display: inline-block; position: absolute; left: 145px; top: 110px; width: 300px; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; } .catalog-section-item:nth-child(2) .catalog-section-item-name, .catalog-section-item:nth-child(5) .catalog-section-item-name, .catalog-section-item:nth-child(6) .catalog-section-item-name{ left:85px; } .catalog-section-item:nth-child(4) .catalog-section-item-name, .catalog-section-item:nth-child(8) .catalog-section-item-name{ left:115px; } .catalog-section-item-name-value { outline: #fc0 solid 5px; background-color: #ffcc00; } .catalog-section-item-name-block { position: absolute; } .catalog-section-item-photo-img { width: 100%; height: 100%; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; /* IE 6-9 */ /*Добавим вот такой вот код*/ -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; /*конец кода с transition*/ } .catalog-section-item:hover .catalog-section-item-photo-img { -webkit-filter: none; -moz-filter: none; -ms-filter: none; -o-filter: none; filter: none; filter: none; /* IE 6-9 */ } .catalog-section-item-photo { display: block; } .catalog-section-item:hover .catalog-section-item-name { color: #c90410; } .catalog-section-item-name-icon { display: block; position: absolute; padding: 5px 15px; width: 70px; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; opacity: 0; bottom: -48px; left: -5px; height: 35px; } .catalog-section-item:hover .catalog-section-item-name-icon { opacity: 1; background: #ffcc00; } .catalog-section-item:hover .catalog-section-item-name-icon::after { content: ""; width: 55px; height: 3px; background: #c90410; position: absolute; left: 22px; top: 50%; margin-top: -2px; } .catalog-section-item:hover .catalog-section-item-name-icon::before { content: ""; width: 10px; height: 10px; border-radius: 10px; background: #c90410; position: absolute; left: 71px; top: 27px; margin-top: -10px; } .benefits-index { clear: both; float: left; width: 100%; } .benefits-index .title-h2 { color: #c90410; margin-top: 30px; margin-bottom: 80px; } .benefits-index .title-h2:before, .benefits-index .title-h2:after { background-color: #c90410; } .services-sections-list { display: flex; flex-wrap: wrap; margin-left: -20px; margin-right: -20px; } .benefits-section-item { box-sizing: border-box; padding: 20px 20px; text-align: center; width: 25%; } .benefits-section-item-name { color: #191919; font-weight: bold; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; } .benefits-section-item-icon svg path { fill: #c90410; } .benefits-section-item-icon svg:hover path { fill: #ffcc00; } @media (max-width: 800px) { .benefits-section-item { width: calc(100% / 3); } } @media (max-width: 480px) { .benefits-section-item { width: 50%; } } .news-block { clear: both; float: left; width: 100%; padding: 30px 0 70px; background: #ffcc00; } .news-block .title-h2 { color: #c90410; margin-bottom: 60px; } .news-block .buttons { position: absolute; right: 0; top: 23px; } .news-block .title-h2:after { background: #c90410; } .news-block .title-h2:before { background: #c90410; } .news-block-list { border: 5px solid #fff; padding: 40px 0 20px; } .news-block-item { float: left; width: 47%; padding: 0 1.5% 20px; } .page-news .news-block-item { float: left; width: 47%; padding: 0 3% 20px 0; } .news-block-item-photo { float: left; margin-right: 30px; max-width: 260px; } .news-block-item-photo-link { display: block; overflow: hidden; } .news-block-item-photo-img { width: 100%; } .news-block-item-name { display: block; color: #1f1f1f; font-size: 20px; font-weight: bold; text-decoration: none; margin-bottom: 20px; } .news-block-item-name:hover { color: #c90410; } .news-block-item-date { display: block; color: #1f1f1f; font-size: 14px; margin-bottom: 20px; } .news-block-item:first-child::after { content: ""; position: absolute; width: 2px; height: 250px; background: #fff; right: 0; top: -15px; } .news-block-item-info { float: left; width: 560px; text-align: left; } .news-after { width: 100%; clear: both; float: left; height: 230px; background: url(/local/templates/index/img/news-after-bg.png) 0 0 no-repeat; background-position: bottom center; } .main-text .title-h2 { color: #c90410; margin-bottom: 60px; } .main-text .buttons { position: absolute; right: 0; top: 23px; } .main-text .title-h2:after { background: #c90410; } .main-text .title-h2:before { background: #c90410; } .main-text { clear: both; width: 100%; margin: 250px 0 0; float: left; } .main-text-center { clear: both; width: 1440px; margin: 0 auto; margin-left: 160px; } .partner-list { clear: both; width: 100%; float: left; margin: 60px 0 10px; overflow: hidden; } .partner-item { float: left; width: 100%; text-align: center; height: 150px; } .partner-item-img { display: table-cell; vertical-align: middle; height: 150px; width: 320px; text-align: center; margin: 0 auto; } .partner-list .owl-nav { position: absolute; left: 0; top: 50px; width: 99%; } .partner-list .owl-nav button span{ display: none; } .partner-list .owl-nav button { background: none; width: 17px; height: 40px; cursor: pointer; position: absolute; border: none; } .partner-list .owl-nav button.owl-prev { background: url(/local/templates/index/img/icon/arr-left2.png) center center no-repeat; left: 0px; } .partner-list .owl-nav button.owl-next { background: url(/local/templates/index/img/icon/arr-right2.png) center center no-repeat; right: 0px; } .partner-list .owl-nav button.owl-prev:hover { background: url(/local/templates/index/img/icon/arr-left2a.png) center center no-repeat; } .partner-list .owl-nav button.owl-next:hover { background: url(/local/templates/index/img/icon/arr-right2a.png) center center no-repeat; } .news-block-item .news-block-item-photo-link .news-block-item-photo-img { -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; -webkit-transition: all 1s ease-out; } .news-block-item:hover .news-block-item-photo-link .news-block-item-photo-img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); } .footer { clear: both; height: 217px; width: 100%; background: #1f1f1f; padding: 30px 0; } .footer-logo { display: block; margin: -8px 0 0; float: left; width: 200px; } .footer-logo svg { max-height: 150px; width: 100%; } .footer-contacts { float: right; width: 340px; color: #fff; font-size: 12px; } .footer-phone{ display: block; } .footer-phone .ya-phone{ display: flex; flex-direction: column; } .footer-phone a { color: #fff; text-decoration: none; font-size: 17px; font-weight: bold; /*margin: 5px 0 20px;*/ padding: 10px 0 0; /*float: left;*/ /*width: 100%;*/ } .footer-phone>span{ display: flex; flex-wrap: wrap; padding-right: 20px; justify-content: space-between; } .footer-adress { display: block; margin: 20px 0 0; line-height: 2; } .footer-mail { display: block; text-decoration: none; color: #fff; margin-bottom: 20px; line-height: 2; } .footer-uniofweb { display: block; color: #fff; font-size: 12px; text-decoration: none; background: url(/local/templates/index/img/uniofweb.png) 210px 2px no-repeat; padding: 5px 0; } .bx_item_list_bestsellers.col5.bx_red { display: none; } .bnt-menu-mobile { display: none; } .mobile-menu { display: none; } .popup-form { position: fixed; width: 590px; padding: 0; background: #ededed; background-size: 100%; z-index: 99; left: 50%; margin: -140px 0 0 -285px; top: 30%; display: none; } .callback-form-title { display: block; width: 100%; text-align: center; color: #fff; margin-bottom: 35px; height: 50px; background: #c90410; line-height: 50px; font-size: 18px; text-transform: uppercase; } .popup-form .close { font-size: 20px; position: absolute; /*right: -24px;*/ right: 2px; /*top: -2px;*/ top: 2px; width: 20px; height: 20px; background: url(/local/templates/index/img/close-callback-form.png) center center no-repeat; z-index: 40; text-align: center; color: #fff; text-transform: uppercase; /* font-family: Verdana; */ cursor: pointer; } .popup-overlay { position: fixed; width: 100%; display: none; height: 100%; z-index: 98; background: rgba(0,0,0,0.4); top: 0; left: 0; } .blue-form-content-line { float: left; margin-bottom: 15px; width: 86%; padding: 0 7%; } .popup-form .blue-form-content-label { display: block; float: left; width: 100%; font-size: 16px; font-weight: 600; color: #afafaf; margin-bottom: 5px; } .popup-form .blue-form-content-input { float: right; /* padding: 0 25px; */ line-height: 40px; width: 100%; background: #fff; color: #1c1c1c; height: 40px; font-size: 16px; font-family: 'Open Sans', sans-serif; border: 1px solid #828080; font-weight: normal; } .popup-form .blue-form-content-textarea { float: right; line-height: 46px; width: 100%; background: #fff; color: #1c1c1c; height: 115px; resize: none; font-size: 16px; font-family: 'Open Sans', sans-serif; border: 1px solid #828080; font-weight: normal; } .popup-form .blue-form-content-submit { float: none; border: 2px solid #c90410; background: #ededed; width: 180px; height: 55px; line-height: 50px; color: #c90410; cursor: pointer; font-size: 15px; text-align: center; /* border-radius: 60px; */ margin-top: 30px; font-weight: 600; /* padding: 0; */ margin: 20px auto; display: inline-block; display: block; } .popup-form .blue-form-content-submit:hover { color: #fff; background: #c90410; } .popup-form .blue-form-yes { float: left; /*margin-left: 200px;*/ margin-left: 7%; width: 500px; color: #fff; font-size: 20px; font-weight: 600; /*margin-top: 30px;*/ margin-bottom: 20px; /*display: none;*/ } .popup-form .blue-form-yes-span { display: block; /*margin-left: 45px; margin-top: -27px;*/ margin-left: 30px; margin-top: -23px; cursor: pointer; font-size: 14px; color: #5d5d5d; } .popup-form .blue-form-yes .blue-form-yes-span:after { content: ""; /*background: #1e2873 url(/local/templates/index/img/icon/checkbox2-popup.png) 0 0 no-repeat;*/ height: 31px; width: 31px; position: absolute; left: 0; top: 4px; } .popup-form .blue-form-yes input[type="checkbox"]:checked + .blue-form-yes-span:after { /*background: #1e2873 url(/local/templates/index/img/icon/checkbox-popup.png) 0 0 no-repeat;*/ } .popup-form .blue-form-yes-span a { color: #5d5d5d; } a.catalog-section-item-name-new { display: block; position: absolute; left: 0; top: 20px; background: #000; width: 100%; padding: 15px 0%; text-align: center; text-decoration: none; opacity: 0.7; color: #fff; } .catalog-section-item:hover a.catalog-section-item-name-new{ opacity: 0.9; color: #c90410; background: #ffcc00; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; } .brand-index .owl-nav button.owl-prev { background: url(/local/templates/index/img/icon/arr-left2.png) center center no-repeat; left: 10px; } .brand-index .owl-nav button.owl-next { background: url(/local/templates/index/img/icon/arr-right2.png) center center no-repeat; right: 12px; } .brand-index .owl-nav button.owl-prev:hover { background: url(/local/templates/index/img/icon/arr-left2a.png) center center no-repeat; } .brand-index .owl-nav button.owl-next:hover { background: url(/local/templates/index/img/icon/arr-right2a.png) center center no-repeat; } .brand-index .owl-nav button { background: none; width: 17px; height: 40px; cursor: pointer; position: absolute; border: none; top: 35px; } .brand-index-slider-item.item { padding: 0 16%; } .brand-index-slider-item.item img { width: 100%; } .mobile-filter-btn { display: none; } a.topmenu-link:hover, a.topmenu-link:focus { color: #fff!important; } .search-page input[type='text'] { border: 2px solid #c90410; height: 40px; line-height: 40px; padding: 0 20px; } .search-page input[type='submit'] { height: 42px; line-height: 40px; width: 100px; border: none; background: #c90410; color: #fff; font-size: 17px; } span.header-contacts-adres-value a { color: #1f1f1f; text-decoration: none; } .footer-adress a { color: #fff; text-decoration: none; } .partner-list .owl-nav button.owl-next:focus, .brand-index .owl-nav button.owl-next:focus, .top-product-index-slider .owl-nav button.owl-next:focus { border: none!important; outline: none; } .partner-list .owl-nav button.owl-prev:focus, .brand-index .owl-nav button.owl-prev:focus, .top-product-index-slider .owl-nav button.owl-prev:focus { border: none!important; outline: none; } .brand-index-slider-item.item a { display: table-cell; width: 100%; height: 112px; vertical-align: middle; } .brand-index-slider-item.item a:hover { background-color: rgba(255, 204, 0, 0.8); } .bx_catalog_item_container .element_item_title, .bx_catalog_item_container .bx_catalog_item_props{ text-align: left; } .ash1 { padding: 40px 0px 40px 0px; background-color: #ffcc00 } .title-h1 { text-align: center;color: #fff;margin: auto;text-shadow: 2px 1px 1px #000000; } .title-h2 { text-align: left; } .bx_filter .bx_filter_popup_result.left { right: 1%!important; top: 90px!important; } a.header-logo img { width: 100%; } .header-contacts-adres a { color: #000; } .catalog-section-index.catalog-section-index-page { clear: both; float: left; width: 100%; padding: 5px 0 0; } .bx_catalog_list_home { clear: both!important; } img.carusel-main-item-img-hidden { max-width: 100%; max-height: 100%; } ul.has-parent { display:none; position:absolute; z-index:10; background:#fff; border:6px solid #c90410; list-style:none; margin:0; padding:0; left:0; top:100%; } ul.has-parent .submenu-link { display:block; padding:10px 100px 10px 30px; text-align:left; text-decoration:none; color:#1c1c1c; text-transform:none; font-size:18px; font-weight:600; line-height:1.5; white-space:break-spaces; } ul.has-parent .submenu-link:hover { background:#c90410; color:#fff; } ul.has-parent li.topmenu-link { padding:0; } .topmenu-item:hover ul.has-parent { display:block; height: 50vh; overflow: auto; } .sertificate-item { float:left; margin-right:20px; margin-bottom:20px; } .sertificate-item img { height:300px; } .footer-policy{margin-top:10px;} .footer-policy>a{font-size:12px;color:#fff;} .popup-window-titlebar>div{font-size:20px;margin-top:10px;text-align:center;} .popup-window-content img{height:200px;margin-bottom:10px;} div[id^="CatalogElementPopup"] .popup-window-content img{height:auto;} .callback_field_5{display:none;} .callback_field_18{display:none;} .buy-one-click-item-title{padding: 0 35px;text-align: center;margin: -15px 0 10px 0;font-weight: bold;color: #c90410;} .popup-form-success{padding: 0 35px;text-align: center;margin-top:20px;margin-bottom:20px;font-weight:bold;} .popup-form-error-text{padding: 0 35px;} .buy-one-click-btn{margin-left: 60px;line-height: 70px;color: #c90410;text-decoration: underline;font-weight: bold;font-size: 16px;cursor: pointer;white-space:nowrap;} .buy-one-click-btn:hover { text-decoration: none; /* убираем подчёркивание при наведении */ } @media(max-width:760px){ .buy-one-click-btn{margin-left:0;} .bx_item_container .buttons{flex-direction:column;} .popup-form .blue-form-yes-span{width:200px;} #buy-one-click{width:98%;left:0;margin-left:1%;} } /* Loader */ .cssload-loader-block{ top: 0; left: 0; height:100%; width:100%; display:none; align-items: center; position: absolute; background: rgb(0 0 0 / 10%); } .cssload-loader-block.active{ display:flex; } .cssload-loader { display: block; margin:0 auto; width: 29px; height: 29px; position: relative; border: 4px solid rgba(0,0,0,0.5); animation: cssload-loader 3.8s infinite ease; -o-animation: cssload-loader 3.8s infinite ease; -ms-animation: cssload-loader 3.8s infinite ease; -webkit-animation: cssload-loader 3.8s infinite ease; -moz-animation: cssload-loader 3.8s infinite ease; } .cssload-loader-inner { vertical-align: top; display: inline-block; width: 100%; background-color: rgba(201,4,16,0.98); animation: cssload-loader-inner 3.8s infinite ease-in; -o-animation: cssload-loader-inner 3.8s infinite ease-in; -ms-animation: cssload-loader-inner 3.8s infinite ease-in; -webkit-animation: cssload-loader-inner 3.8s infinite ease-in; -moz-animation: cssload-loader-inner 3.8s infinite ease-in; } @keyframes cssload-loader { 0% { transform: rotate(0deg); } 25% { transform: rotate(180deg); } 50% { transform: rotate(180deg); } 75% { transform: rotate(360deg); } 100% { transform: rotate(360deg); } } @-o-keyframes cssload-loader { 0% { transform: rotate(0deg); } 25% { transform: rotate(180deg); } 50% { transform: rotate(180deg); } 75% { transform: rotate(360deg); } 100% { transform: rotate(360deg); } } @-ms-keyframes cssload-loader { 0% { transform: rotate(0deg); } 25% { transform: rotate(180deg); } 50% { transform: rotate(180deg); } 75% { transform: rotate(360deg); } 100% { transform: rotate(360deg); } } @-webkit-keyframes cssload-loader { 0% { transform: rotate(0deg); } 25% { transform: rotate(180deg); } 50% { transform: rotate(180deg); } 75% { transform: rotate(360deg); } 100% { transform: rotate(360deg); } } @-moz-keyframes cssload-loader { 0% { transform: rotate(0deg); } 25% { transform: rotate(180deg); } 50% { transform: rotate(180deg); } 75% { transform: rotate(360deg); } 100% { transform: rotate(360deg); } } @keyframes cssload-loader-inner { 0% { height: 0%; } 25% { height: 0%; } 50% { height: 100%; } 75% { height: 100%; } 100% { height: 0%; } } @-o-keyframes cssload-loader-inner { 0% { height: 0%; } 25% { height: 0%; } 50% { height: 100%; } 75% { height: 100%; } 100% { height: 0%; } } @-ms-keyframes cssload-loader-inner { 0% { height: 0%; } 25% { height: 0%; } 50% { height: 100%; } 75% { height: 100%; } 100% { height: 0%; } } @-webkit-keyframes cssload-loader-inner { 0% { height: 0%; } 25% { height: 0%; } 50% { height: 100%; } 75% { height: 100%; } 100% { height: 0%; } } @-moz-keyframes cssload-loader-inner { 0% { height: 0%; } 25% { height: 0%; } 50% { height: 100%; } 75% { height: 100%; } 100% { height: 0%; } } .top-menu-flex{ display: flex; justify-content: space-between; } .top-menu-flex .topmenu-block{width: auto;} .header-cart-new, .header-favorite-new, .header-compare-new { align-self: center; margin-left: 50px; } .header-cart-new a{ display: block; height: 52px; width: 52px; background: url('/local/templates/index/img/icon/cart_new_icon.png') no-repeat center; } .header-favorite-new a{ display: block; height: 52px; padding-left: 60px; background: url('/local/templates/index/img/icon/favorite_header.png') no-repeat left center; line-height: 52px; font-size: 16px; color: #fff; text-decoration: none; font-weight: 600; } .header-compare-new a{ display: block; height: 52px; padding-left: 60px; background: url('/local/templates/index/img/icon/compare_header.png') no-repeat left center; line-height: 52px; font-size: 16px; color: #fff; text-decoration: none; font-weight: 600; } .header-search-new{ align-self: center; flex-grow: 1; margin-left: 35px; } .header-search-new form{ display: none; } .header-search-icon{ margin-left: auto; cursor: pointer; width: 26px; height: 26px; background: url(/local/templates/index/img/icon/search.png) center center no-repeat; } .header-search-new form .header-search-form-value{ width: 95%; } .header-search-new form .header-search-form-submit{ right: 0; } .footer-policy-mobile{ display: none; } @media (max-width: 1270px){ .top-menu-flex{ height: 100%; } .header-search-new{ margin-left: 120px; } .header-search-icon{ display: none; } .header-search-new form{ display: block; } .header-cart-new, .header-favorite-new{ margin-left: 35px; } } @media (max-width: 760px){ .center.top-menu-flex{ width: 95%; } .top-menu-flex{ justify-content: flex-end; } .header-search-new{ display: none; } .bnt-menu-mobile{ z-index: 2; } } .header__separator { display: none;} a[href*="AllImpexBot"] { display: inline-block; text-align: center; } .header-contacts-adres-value{ width: 300px; } .header{ height: 150px; } .img-2-div img{ max-width:380px;margin-right:2%; margin-left:2%;width:45%; } .img-2-div{ display:flex; justify-content:center; margin: 0 auto; } @media (max-width: 760px){ .img-2-div img{ max-width:380px;margin-right:0%; margin-left:0%;width:48%; } .img-2-div{ display:flex; justify-content:space-between; margin: 0 auto; } } .borders-1{ width:100%; margin-top:20px; margin-bottom:30px; } .borders-1 td{padding:4px; text-align:center; } .borders-1 td:nth-child(1){ text-align:left; } @media (max-width: 760px){ .overflow-table{ overflow-x:scroll; } } .warning { position: fixed; bottom: 0; background-color: #dedede; display: none; left: -10000px; justify-content: center; width: 100%; box-sizing: border-box; z-index: 10000000000; bottom: 0; } .warning__apply svg { position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .warning--active { display: flex; left: 0; } .warning__text{ font-size: 15px; } .warning-body { padding: 16px 20px; display: flex; justify-content: space-between; align-items: center; } .warning__apply { min-width: 206px; height: auto; cursor: pointer; background: none; font-size: 15px; padding: 25px 16px; font-weight: bold; margin-left: 30px; text-transform: uppercase; border: none; position: relative; } .footer a { text-decoration: none; color: #fff; } .warning__text a{ color:#c90410; } @media (max-width: 830px){ .warning__text { font-size: 15px; margin-bottom: 10px; } .warning-body { flex-wrap: wrap; justify-content: center; font-size: 14px; line-height: 17px; } } .cookies-a{ margin-right:10px; } .arrow-up { position: fixed; right: 40px; bottom: 115px; width: 45px; height: 45px; padding: 0; border: none; border-radius: 50%; outline: none; background-color: #C90410; box-shadow: 0 0 8px #000000; z-index: 5; cursor: pointer; rotate: -180deg; opacity: 0; visibility: hidden; transition: rotate .5s linear, visibility .5s linear, opacity .5s linear; } .arrow-up.active { rotate: 0deg; opacity: 1; visibility: visible; } .arrow-up::after { content: "\2191"; font-size: 20px; color: #FFFFFF; } @media (pointer:none), (pointer:coarse) { .arrow-up { right: 28px; width: 50px; height: 50px; } } .header-contacts-adres-value:hover { text-decoration: underline; } .header-call-mobil { margin-top: 115px; width: 250px; margin-left: auto; margin-right: auto; } @media (max-width: 830px) { .topmenu { margin-top: 0px; } .header-call-phone-icon.header-callback-btn { padding: 0; border-bottom: none; border: 2px solid #c90410 !important; } .header-callback-btn { display: none; } .header-call-mobil div div a span, .header-call-mobil div div > i { display: none !important; } .header-call-phone-icon { margin: 0px 5px !important; } .fa.fa-paper-plane { margin: 0px 5px; height: 43px; display: flex; align-items: center; justify-content: space-between; } .head-cont-mobil-tg { text-decoration: none; } .fa.fa-phone.mobil { margin: auto !important; } .ya-phone { order: 1 ; margin: 0 5px !important; } .header-call-mobil > span { display: flex !important; } } @media (min-width: 830px){ .header-call-mobil { display: none; } .head-cont-mobil-tg { display: none !important; } } [data-tooltip] { position: relative; /* Относительное позиционирование */ } [data-tooltip]::after { content: attr(data-tooltip); /* Выводим текст */ position: absolute; /* Абсолютное позиционирование */ width: max-content; /* Ширина подсказки */ left: -200px; top: 0px; /* Положение подсказки */ background: #fff; /* Синий цвет фона */ color: black; /* Цвет текста */ padding: 0.5em; /* Поля вокруг текста */ box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /* Параметры тени */ pointer-events: none; /* Подсказка */ opacity: 0; /* Подсказка невидима */ transition: 1s; /* Время появления подсказки */ border: 1px solid; z-index: 9; } [data-tooltip]:hover::after { opacity: 1; /* Показываем подсказку */ top: 2em; /* Положение подсказки */ } .ya-phone > a:hover { text-decoration: underline; /* Добавляем подчеркивание при наведении курсора мыши на ссылку */ } .top-product-index-slider-item-price { padding: 0 7% 20px; color: #c90410; text-shadow: 2px 1px 1px #ccc; font-size: 23px; font-weight: bold; } .top-product-index-slider-item-char { padding: 0 7% 20px; text-align: left; list-style-type: none; } /*new footer*/ .footer { height: auto; display: flex; justify-content: space-between; width: auto; gap: 20px; padding-bottom: 50px; } .container { padding-left: 50px; padding-right: 50px; } .footer-menu { margin: 0; display: flex; column-gap: 60px; row-gap: 30px; } .footer-menu__one, .footer-menu__two, .footer-menu__three, .footer-submenu { margin: 0; padding: 0; list-style: none; } .footer-contacts { font-size: 14px; display: flex; flex-direction: column; justify-content: space-between; } .footer-contacts__phone { display: flex; flex-direction: column; } .footer-contacts__phone a { font-size: 20px; line-height: 32px; font-weight: bold; } .footer-other { display: flex; flex-direction: column; color: #fff; font-size: 13px; line-height: 24px; } .footer-other a { font-size: 13px; line-height: 24px; } .footer__column { display: flex; flex-direction: column; justify-content: space-between; } .footer-submenu { margin-top: 20px; } .footer-menu__three { display: flex; flex-direction: column; gap: 20px; } .footer-submenu__link { font-size: 16px; line-height: 29px; } .footer-menu__link { font-size: 20px; font-weight: bold; } .footer-contacts__dev span { vertical-align: sub; margin-right: 10px; } .footer-contacts__address { line-height: 18px; display: flex; flex-direction: column; gap: 5px; } @media(max-width: 1440px) { .footer-menu { flex-wrap: wrap; } .footer-menu__three { width: 100%; } .footer-submenu__link { font-size: 14px; line-height: 27px; } .footer-menu__link { font-size: 18px; } .footer-contacts__address { margin-bottom: auto; margin-top: 50px; } } @media(max-width: 1024px) { .container { padding-left: 15px; padding-right: 15px; } .footer-menu { flex-direction: column; row-gap: 20px; } .footer-submenu { display: none; } .footer__column { gap: 140px; } } @media(max-width: 559px) { .container { padding-left: 55px; padding-right: 55px; } .footer { flex-direction: column; } .footer-contacts { width: 100%; } .footer-menu { display: grid; grid-template-areas: 'one three' 'two three' 'blank three'; margin-top: 40px; } .footer-menu__three { grid-area: three; } .footer-contacts__address { gap: 15px; margin-top: 30px; } .footer-contacts__dev { margin-top: 15px; } } /* End */ /* Start:/local/templates/index/media.css?177668077320859*/ /*Разрешение 1600px*/ @media screen and (max-width:1800px) { .center { width: 1540px; } .header-title { font-size: 19px; } .topmenu-block { width: 990px; } .topmenu-link { font-size: 18px; padding: 0 25px; } .header-personal { float: right; width: 520px; } .header-cart-info-price { font-size: 20px; /*width: 100px;*/ } .header-personal-active .header-search { width: 285px; } .header-personal-active .header-search-form-value { width: 255px; } .submenu { width: 1525px; } .submenu-columm { float: left; width: 24%; } .submenu-columm:first-child { width: 28%; } .submenu-columm-link { display: block; padding: 10px 30px; } .submenu-columm-logo { padding: 0 30px; } .brand-index-item img { width: 85%; } .brand-index-item { float: left; margin: 0 23px; } .top-product-index-slider-item { width: 340px; } .top-product-index-slider .owl-nav { width: 98%; } .top-product-index-slider-item-link { display: block; height: 300px; } .top-product-index-slider-item-name { height: 60px; font-size: 18px; } .top-product-index-slider-item:hover .top-product-index-slider-item-name { padding: 25px 7% 60px; height: 60px; /*bottom: -125px;*/ } .top-product-index-slider-item:hover .top-product-index-slider-item-name::before {top: 97px;} .top-product-index-slider-item:hover .top-product-index-slider-item-name::after {top: 94px;} .catalog-section-item { width: 315px; height: 315px; } .catalog-section-item-name { font-size: 22px; } .catalog-section-item-name-icon { height: 25px; } .catalog-section-item:hover .catalog-section-item-name-icon::before { margin-top: -13px; } .catalog-section-item-name-icon { bottom: -38px; } .main-text-center { clear: both; width: 1240px; } .news-block-item-info { width: 425px; } .news-block-item-name { font-size: 18px; } .contacts-list-item { float: left; border: 6px solid #c90410; width: 29%; padding: 40px 1% 40px; margin-left: 24px; min-height: 480px; } .page-content-1500 { width: 1210px; } .partner-detail-logo { float: left; width: 30%; } .partner-detail-info { float: right; width: 65%; } .page-news .news-block-item .news-block-item-photo { width: 27%; } .page-news .news-block-item .news-block-item-info { width: 61%; } .page-news-detail-info { float: right; width: 100%; } .page-news-detail-photo { float: left; width: 30%; } .catalog-section-index.to-bottom .catalog-section-item { width: 355px; height: 355px; } .page-content .center { width: 1380px; margin: 0 auto; } .partners-list-item-info { width: 355px; } .partners-list-item-logo { width: 225px; } } /*Разрешение 1024px*/ @media screen and (max-width:1590px) { .center { width: 1180px; } .header-title { padding: 35px 410px 0 310px; } .header-contacts { margin-top: -25px; } .topmenu-link { font-size: 16px; padding: 0 10px; } .topmenu-block { width: 750px; } .header-personal { float: right; width: 430px; } .header-cart-info-price { font-size: 18px; /*width: 80px;*/ } .header-search { width: 325px; } .header-search-form-value { width: 300px; } .header-personal-active .header-search { width: 215px; } .header-personal-active .header-search-form-value { width: 195px; } .slider-index-info-title { font-size: 70px; } .slider-index-info { top: 120px; left: 100px; } .slider-index-info-preview { font-size: 27px; } .brand-index-block { display: block; width: 100%; } .brand-index-item { display: block; float: none; } .top-product-index-slider-item { width: 270px; } .top-product-index-slider-item-link { display: block; height: 260px; } .top-product-index { height: 670px; } .catalog-section::before { top: -125px; background-size: 100%; } .top-product-index::after { background-size: 100% 100%; } .top-product-index { padding-top: 70px; } .top-product-index .title-h2 { margin-bottom: 70px; } .title-h2 { font-size: 50px; } .brand-index { padding: 50px 0; } .top-product-index-slider-item-name { height: 50px; font-size: 14px; width: 92%; padding: 0 4% 20px; } .top-product-index-slider-item:hover .top-product-index-slider-item-name { padding: 25px 4% 45px; height: 50px; /*bottom: -100px;*/ } .top-product-index-slider .owl-nav { width: 99%; top: 150px; } .catalog-section-item-name { font-size: 20px; } .catalog-section-item-name { width: 185px; } .catalog-section-item-name { left: 80px; top: 85px; } .catalog-section-item:nth-child(4) .catalog-section-item-name, .catalog-section-item:nth-child(8) .catalog-section-item-name { left: 70px; } .catalog-section-item:nth-child(3) .catalog-section-item-name, .catalog-section-item:nth-child(7) .catalog-section-item-name { left: 40px; } .partner-item-img img { max-width: 115px; } .main-text-center { clear: both; width: 100%; margin-left: 0; } .news-after { /*height: 155px;*/ background-size: 100%; } .news-block-item-info { width: 365px; } .news-block-item-photo-link { width: 150px; } .submenu { width: 1165px; } .submenu-columm{ width: 30%; } .submenu-columm:first-child { width: 33%; } .submenu-columm:nth-child(4) { margin-top: 0; } a.product-section-item { font-size: 12px; } .news-after { /*height: 170px;*/ background-size: 100%; } .catalog-section::before { top: -145px; background-size: 100%; } span.product-section-item-value { min-height: 30px; } .product-sections span.product-section-item-value { /* min-height: 20px; */ /*margin: 7px 0;*/ } .catalog-section-item { width: 350px; height: 350px; margin: 0 0 45px 30px; } .catalog-section-item:nth-child(4n+1) { clear: none; margin: 0 0 45px 30px; } .catalog-section-item:nth-child(3n+1) { clear: both; margin-left: 0; } .catalog-section-index.to-bottom .catalog-section-item { width: 253px; height: 253px; margin: 0 0 45px 40px; } .catalog-section-index.to-bottom .catalog-section-item:nth-child(4n+1) { /*margin: 0 0 45px 40px;*/ } .catalog-section-index.to-bottom .catalog-section-item:nth-child(3n+1) { /*clear: both; margin-left: 0px!important;*/ clear: unset !important; } .page-content .center { width: 1180px; margin: 0 auto; } .contacts-list-item { width: 28%; } .slider-index-info{ top: 50%; transform: translate(0, -50%); } .slider-index .owl-nav{ top: 50%; transform: translate(0, -50%); } .slider-inde-item img{ width: 100%; } } /*Разрешение 1024px*/ @media screen and (max-width:1270px) { .center { width: 1000px; } .topmenu-block { display: none; } .header-contacts { float: right; width: 330px; } .header-contacts-adres-value { width: 260px; font-size: 14px; } .header-callback-btn { font-size: 14px; } .header-call-phone-icon { font-size: 25px; height: 40px; width: 40px; line-height: 40px; margin: 0 10px 0 0; } .header-call-phone a { font-size: 16px; } .header-title { padding: 10px 342px 0 285px; font-size: 16px; } .header-personal { width: 620px; } .header-search, .header-personal-active .header-search{ width: 375px; } .header-search-form-value, .header-personal-active .header-search-form-value { width: 340px; } .top-product-index-slider-item { width: 310px; } .catalog-section::before { top: -95px; background-size: 100%; } .title-h2 { font-size: 45px; } .catalog-section .buttons, .main-text .buttons, .news-block .buttons { top: 0px; } .catalog-section-item { width: 280px; height: 280px; margin: 0 0 45px 60px; } .catalog-section-item:nth-child(4n+1) { clear: none; margin: 0 0 45px 60px; } .catalog-section-item:nth-child(3n+1) { clear: both; margin-left: 0px; } .catalog-section-item-name { left: 110px; top: 105px; } .catalog-section-item:nth-child(3) .catalog-section-item-name, .catalog-section-item:nth-child(7) .catalog-section-item-name { left: 80px; } .catalog-section-item:nth-child(4) .catalog-section-item-name, .catalog-section-item:nth-child(8) .catalog-section-item-name { left: 105px; } .news-after { height: 155px; /*height: 118px;*/ background-size: 100%; } .news-block-item-photo { margin-right: 20px; } .news-block-item-info { width: 300px; } .news-block-item-photo-link { width: 140px; } .page-content-1500 { width: 100%; } .page-content-1230 { width: 100%; } .product-sections span.product-section-item-value { font-size: 10px; } .catalog-section-index.to-bottom .catalog-section-item { width: 305px; height: 305px; margin: 0 0 45px 28px; } .page-content .center { width: 980px; margin: 0 auto; } .product-sections a.product-section-item { width: 22.4%; } span.product-section-item-value { min-height: 36px; } a.product-section-item { margin: 0.7%; } .partners-list-item-logo { width: 225px; float: none; margin: 0 auto; display: block; } .bnt-menu-mobile { position: absolute; width: 70px; height: 70px; background: #c90310 url(/local/templates/index/img/icon-menu.png) center center no-repeat; left: 30px; top: 0; display: block; z-index: 2; } .mobile-menu { position: absolute; top: 70px; height: 50vh; overflow: auto; left: 0; padding: 25px 0; background: #ededed; width: 100%; box-sizing: border-box; z-index: 999; border: 4px solid #c90310; } .mobile-menu .header-search { display: none; } .mobile-menu .header-search-form-submit { background: url(/local/templates/index/img/icon/search-mobile.png) center center no-repeat; } .mobile-menu .header-search-form-value { border-bottom: 1px solid #000000; } .mobile-menu .header-contacts { display: block; } .mobile-menu .header-contacts { display: block; width: 100%; } .mobile-menu .topmenu-block { display: block; width: 100%; height: auto; margin: 30px 0; } .mobile-menu li.topmenu-item { width: 60%; padding: 0 20%; height: 70px; line-height: 70px; } .mobile-menu a.topmenu-link { padding: 0; text-transform: uppercase; color: #1c1c1c; font-size: 22px; } .mobile-menu li.topmenu-item:hover { background: #c90310; } .mobile-menu li.topmenu-item:hover .topmenu-link, .mobile-menu li.topmenu-item.active .topmenu-link{ color: #fff; } .mobile-menu li.topmenu-item:hover div { display: none; } .mobile-menu .center { width: 360px; } .brand-index-block{ margin: 0; } .partner-list{ margin: 0; } a.header-contacts-link{ display: flex; } a.header-contacts-link .header-contacts-adres-icon{ flex-shrink: 0; } } /*Разрешение 768px*/ @media screen and (max-width:990px) { .popup-window-content img{ max-width: 100%; } .footer-logo{ margin-top: 0; } .center { width: 740px; } .header-title { display: none; } .slider-index-info { left: 20px; width: 480px; } .slider-index-info-title { font-size: 60px; } .slider-index-info-preview { font-size: 20px; } .title-h2 { font-size: 40px; } .top-product-index-slider-item { width: 300px; margin-left: 20px; } .top-product-index-slider-item:first-child { margin-left: 30px; } .top-product-index-slider .owl-nav { width: 100%; } .catalog-section::before { top: -70px; background-size: 100%; } .catalog-section .title-h2 { width: 50%; } .catalog-section .buttons, .news-block .buttons{ top: 22px; } .catalog-section-item, .catalog-section-item:nth-child(4n+1), .catalog-section-item:nth-child(3n+1) { margin: 0 40px 40px; clear: none; } .button-block a { width: 180px; font-size: 16px; } .news-after { /*height: 90px;*/ height: 118px; background-size: 100%; } .news-block .title-h2 { width: 50%; } .news-block-item-photo-link { width: 215px; } .page-news .news-block-item { float: left; width: 94%; padding: 0px 3% 40px; } .news-block-item:first-child::after { display: none; } .news-block-item-info { width: 325px; } .slider-index .owl-nav { top: auto; bottom: 70px; transform: none; } .slider-index .owl-nav button { width: 100px; height: 100px; } .top-product-index-slider .owl-nav button.owl-prev { left: 0; } .top-product-index-slider .owl-nav button.owl-next { right: 0; } .contacts-top-item { width: 96%; margin: 0px 2%; } .contacts-top-item:first-child::after { display: none; } .contacts-list-item { width: 96%; padding: 40px 1% 40px; min-height: 227px; margin: 0; margin-bottom: 20px; } .partners-list-item-info { float: left; margin-left: 1px; width: 340px; } .product-sections a.product-section-item { width: 46%; padding: 0px 0; height: 44px; line-height: 44px; } .catalog-section-index.to-bottom .catalog-section-item { width: 350px; height: 350px; margin: 0 0 45px 40px; } .catalog-section-index.to-bottom .catalog-section-item:nth-child(3n+1) { clear: none; margin: 0 0 45px 40px!important; } .catalog-section-index.to-bottom .catalog-section-item:nth-child(2n+1) { clear: both; margin-left: 0px!important; } .page-content .center { width: 720px; margin: 0 auto; } .grid2x1 .bx_sidebar { width: 100%; } .grid2x1 .bx_content_section { width: 100%; } a.product-section-item { width: 47%; } .slider-index-info-title{ margin-bottom: 50px; } .slider-index-info-title::after{ bottom: -25px; } .brand-index .title-h2{ margin-bottom: 30px; } .news-block-item{ float: none; width: 100%; box-sizing: border-box; padding: 0 2.5% 20px; display: flex; margin-bottom: 15px; } .news-block-item-info{ width: auto; } .page-content .title-h2:after{ display: none; } .page-content .title-h2:before{ display: none; } .page-content .title-h2 { padding: 0; } } /*Разрешение 480px*/ @media screen and (max-width:760px) { .mobile-menu .header-search { display: block; } .popup-form{ width: 98%; left: 0; margin-left: 1%; position: absolute; margin-top: 0; } .popup-form .blue-form-yes{ width: auto; } .partner-list{ margin-top: 0; } .top-product-index{ height: 615px; } .top-product-index:before{height: 145px;} .center { width: 360px; } header .center{ width: 480px; display: flex; } .header-contacts { display: none; } .header-search { display: none; } .header-logo { width: 100%; text-align: center; position: unset; } .header-call-mobil{ align-items: end; display: flex; min-width: 248px; max-width: 248px; margin-top: 0!important; margin-bottom: 10px; } .header-logo img{ width: auto; } .slider-index-info-title { font-size: 35px; } .slider-index-info { left: 0px; width: 360px; left: 50%; margin-left: -180px; } .slider-index-info-preview { font-size: 16px; } .title-h2 { font-size: 30px; padding-left: 100px; } .title-h2::after { width: 70px; } .title-h2::before { width: 15px; height: 15px; left: 69px; margin-top: -7px; } .brand-index-block { display: block; width: 100%; } .brand-index-item { display: block; float: left; width: 44%; margin: 0 3% 60px; } .brand-index-item img{width: 90%} .brand-index-item:nth-child(2n+1){ clear: both; } .catalog-section::before { top: -35px; background-size: 100%; } .top-product-index-slider-item { margin: 0 25px!important; } .news-after { /*height: 48px;*/ height: 90px; background-size: 100%; } .catalog-section .buttons, .news-block .buttons, .main-text .buttons { position: relative; margin: -30px 0 50px; } .main { background: url(/local/templates/index/img/body-bg.png) center bottom 1100px no-repeat; } .news-block-item-photo { margin-right: 0; width: 300px; margin: 0 auto 20px; float: none; } .news-block-item-photo-link { width: 100%; } .news-block-item-info { width: 300px; margin: 0 auto; clear: both; float: none; } .footer { clear: both; /*height: 290px;*/ /* height: 365px; */ } .header-personal { width: 280px; } a.product-section-item { width: 97%; margin-bottom: 10px; height: 28px; } .bx-touch .bx_catalog_list_home.col2 .bx_catalog_item, .bx-touch .bx_catalog_list_home.col3 .bx_catalog_item, .bx-touch .bx_catalog_list_home.col4 .bx_catalog_item, .bx-touch .bx_catalog_list_home.col5 .bx_catalog_item { padding: 1px 16px; margin: 0 1% 30px; width: 98%; clear: none; } .contacts-top-item { font-size: 15px; } .page-news .news-block-item .news-block-item-photo { width: 100%; } .page-news .news-block-item .news-block-item-info { width: 94%; } .page-content-img-block a img { width: 100%; margin: 0!important; } .page-content-img-block a { width: 100%; margin-right: 0%; margin-bottom: 20px; margin-left: 0; } .page-content .title-h2 { font-size: 35px; line-height: 1.1; padding: 0; } .partners-list-item { width: 96%; margin: 0 2%; } .partners-list-item-info { float: left; margin-left: 0; width: 94%; } .partner-detail-info { float: right; width: 100%; } .partner-detail-logo { float: left; width: 100%; margin-bottom: 30px; } .page-news-detail-photo { float: left; width: 100%; } .page-news-detail-info { float: right; width: 100%; } span.product-section-item-value { display: block; } span.product-section-item-value:before { top: 22px; } span.product-section-item-value:after { top: 26px; } .mobile-filter-btn { display: block; position: relative; } /*.bx_filter { display: none; }*/ .mobile-filter-btn:after { content: ''; display: block; width: 16px; height: 18px; background: url(/local/templates/index/img/icon/ico-filter.png) center center no-repeat; position: absolute; left: 32px; top: 22px; } .mobile-filter-btn:before { content: ''; display: block; width: 21px; height: 9px; background: url(/local/templates/index/img/icon/ico-filter-arr.png) center center no-repeat; position: absolute; right: 20px; top: 27px; } .mobile-filter-btn.open:before { background: url(/local/templates/index/img/icon/ico-filter-arr2.png) center center no-repeat; } .mobile-filter-btn { display: block; height: 60px; margin-bottom: 20px; width: 70%; padding: 0 10% 0 20%; background: #c90310; color: #fff; line-height: 60px; font-size: 18px; } .page-content .title-h2 { font-size: 30px; } span.product-section-item-value { min-height: 30px; padding: 7px 0 0 55px; } .product-sections span.product-section-item-value { /* min-height: 20px; */ margin: 10px 0; } .catalog-section-index.to-bottom .catalog-section-item { width: 360px; height: 360px; margin: 0 0 45px; } .catalog-section-index.to-bottom .catalog-section-item:nth-child(3n+1) { clear: both; margin: 0 0 45px!important; } .catalog-section-index.to-bottom .catalog-section-item:nth-child(2n+1) { clear: both; margin: 0 0 45px!important; } .page-content .center { width: 360px; margin: 0 auto; } .grid2x1 .bx_sidebar { width: 100%; } .grid2x1 .bx_content_section { width: 100%; } .brand-menu { display: none; } .news-block-item { float: left; width: 97%; padding: 0 1.5% 20px; } a.header-logo img { width: 70%; } #bx-soa-order *{ box-sizing: border-box; } #bx-soa-order .col-sm-9{ width: 100% !important; } #bx-soa-order .col-sm-3{ width: 100% !important; } #bx-soa-order .col-xs-12{ width: 100% !important; } #bx-soa-order .form-control{ width: 100% !important; } .catalog-items-block .bx_bt_button{ margin: 0 5px 10px 5px; } .slider-inde-item{ height: 260px; } .slider-inde-item img{ width: 100%; height: 100%; object-fit: cover; } .slider-index-info{ top: 15px; transform: none; } .slider-index .owl-nav{ bottom: 0; } .brand-index .title-h2{ margin-bottom: 15px; } .brand-index-slider-item.item a{ text-align: center; } .brand-index-slider-item.item img{ width: 80%; } .news-block-item{ flex-direction: column; } .footer-policy{ display: none; } .footer-policy.footer-policy-mobile{ display: block; } .footer-contacts{ margin-top: 10px; } .header-cart-new, .header-favorite-new{ margin-left: 12px; } .popup-window-with-titlebar .popup-window-buttons .bx_item_detail{ display: block; } .popup-window-with-titlebar .popup-window-buttons .bx_item_detail:first-child .bx_bt_button{ margin-right: 0 !important; } .popup-window-with-titlebar .popup-window-buttons .bx_item_detail:first-child{ margin-bottom: 10px; } } @media (max-width: 479px){ header .center{ width: unset; } .header{ height: unset; } body{ min-width: 380px; } .footer-phone>span{ flex-direction: column; } } #menu-mobile-close-button{ position: absolute; right: 10px; top: 10px; padding: 0px 10px 2px 10px; font-size: 20px; font-weight: 600; color: red; border: 2px red solid; border-radius: 50%; } /* End */ /* Start:/local/templates/.default/components/bitrix/news.list/reviews-list/style.css?16430945162430*/ .reviews-list-wrapper *{ box-sizing: border-box; } .reviews-list-wrapper{ margin: 0 -30px; display: flex; flex-wrap: wrap; } .reviews-item-outer{ width: 50%; padding: 0 30px; margin-bottom: 40px; } .reviews-item{ border-bottom: 2px solid #c90410; display: flex; padding-bottom: 30px; height: 100%; box-sizing: border-box; } .reviews-item-left{ margin-right: 30px; flex-shrink: 0; } .reviews-item-left-inner{ width: 260px; display: block; } .reviews-item-left-inner img{ width: 100%; height: auto; } .reviews-item-title{ font-size: 20px; font-weight: bold; margin-bottom: 25px; margin-top: -5px; text-align: left; } .reviews-item-text{ text-align: left; } .reviews-item-text.text-detail{ display: none; } .page-content .reviews-item-text p{ color: #1f1f1f; line-height: 22px; } .reviews-item-full{ margin-top: 20px; display: flex; justify-content: flex-end; } .reviews-item-full-btn{ padding-right: 60px; position: relative; font-size: 14px; font-weight: bold; text-transform: uppercase; cursor: pointer; text-align: right; } .reviews-item-full-btn:after{ content: ' '; position: absolute; top: 50%; transform: translate(0, -50%); right: 0; height: 8px; width: 8px; border-radius: 50%; background: #1f1f1f; } .reviews-item-full-btn:before{ content: ' '; position: absolute; top: 50%; transform: translate(0, -50%); right: 2px; height: 2px; width: 48px; background: #323232; } .reviews-item-full-btn:hover, .reviews-item-full-btn.active{ color: #c90410; } .reviews-item-full-btn:hover:after, .reviews-item-full-btn.active:after{ background: #c90410; } .reviews-item-full-btn:hover:before, .reviews-item-full-btn.active:before{ background: #cc1a25; } @media (max-width: 1590px){ .reviews-item-left-inner{ width: 175px; } } @media (max-width: 1280px){ .reviews-item-left-inner{ width: 145px; } } @media (max-width: 1024px){ .reviews-item-outer{ width: 100%; } .reviews-item-left-inner{ width: 240px; } } @media (max-width: 800px){ .reviews-item-left-inner{ width: 120px; } .reviews-item-left{ float: left; margin-right: 15px; margin-bottom: 15px; } .reviews-item{ display: block; } .reviews-item-title{ font-size: 18px; } .reviews-list-wrapper{ margin: 0; } .reviews-item-outer{ padding: 0; } } /* End */ /* /local/templates/index/css/button.css?17696900232093 */ /* /local/templates/index/owlcarousel/assets/owl.carousel.min.css?16022219503351 */ /* /local/templates/index/fancybox/jquery.fancybox.css?16022219504895 */ /* /local/templates/index/owlcarousel/assets/owl.theme.default.min.css?16022219501013 */ /* /local/templates/index/css/animate.css?160222195063368 */ /* /local/templates/index/styles.css?177753441344680 */ /* /local/templates/index/media.css?177668077320859 */ /* /local/templates/.default/components/bitrix/news.list/reviews-list/style.css?16430945162430 */