/* Start:/bitrix/templates/petmen/css/jquery.fancybox.min.css?169763274512795*/ body.compensate-for-scrollbar{overflow:hidden}.fancybox-active{height:auto}.fancybox-is-hidden{left:-9999px;margin:0;position:absolute!important;top:-9999px;visibility:hidden}.fancybox-container{-webkit-backface-visibility:hidden;height:100%;left:0;outline:none;position:fixed;-webkit-tap-highlight-color:transparent;top:0;-ms-touch-action:manipulation;touch-action:manipulation;transform:translateZ(0);width:100%;z-index:99992}.fancybox-container *{box-sizing:border-box}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{bottom:0;left:0;position:absolute;right:0;top:0}.fancybox-outer{-webkit-overflow-scrolling:touch;overflow-y:auto}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.9;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption,.fancybox-infobar,.fancybox-navigation .fancybox-button,.fancybox-toolbar{direction:ltr;opacity:0;position:absolute;transition:opacity .25s ease,visibility 0s ease .25s;visibility:hidden;z-index:99997}.fancybox-show-caption .fancybox-caption,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-nav .fancybox-navigation .fancybox-button,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;transition:opacity .25s ease 0s,visibility 0s ease 0s;visibility:visible}.fancybox-infobar{color:#ccc;font-size:13px;-webkit-font-smoothing:subpixel-antialiased;height:44px;left:0;line-height:44px;min-width:44px;mix-blend-mode:difference;padding:0 10px;pointer-events:none;top:0;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-toolbar{right:0;top:0}.fancybox-stage{direction:ltr;overflow:visible;transform:translateZ(0);z-index:99994}.fancybox-is-open .fancybox-stage{overflow:hidden}.fancybox-slide{-webkit-backface-visibility:hidden;display:none;height:100%;left:0;outline:none;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:absolute;text-align:center;top:0;transition-property:transform,opacity;white-space:normal;width:100%;z-index:99994}.fancybox-slide:before{content:"";display:inline-block;font-size:0;height:100%;vertical-align:middle;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:hidden;padding:44px 0}.fancybox-slide--image:before{display:none}.fancybox-slide--html{padding:6px}.fancybox-content{background:#fff;display:inline-block;margin:0;max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:relative;text-align:left;vertical-align:middle}.fancybox-slide--image .fancybox-content{animation-timing-function:cubic-bezier(.5,0,.14,1);-webkit-backface-visibility:hidden;background:transparent;background-repeat:no-repeat;background-size:100% 100%;left:0;max-width:none;overflow:visible;padding:0;position:absolute;top:0;transform-origin:top left;transition-property:transform,opacity;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:99995}.fancybox-can-zoomOut .fancybox-content{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-content{cursor:zoom-in}.fancybox-can-pan .fancybox-content,.fancybox-can-swipe .fancybox-content{cursor:grab}.fancybox-is-grabbing .fancybox-content{cursor:grabbing}.fancybox-container [data-selectable=true]{cursor:text}.fancybox-image,.fancybox-spaceball{background:transparent;border:0;height:100%;left:0;margin:0;max-height:none;max-width:none;padding:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content,.fancybox-slide--map .fancybox-content,.fancybox-slide--pdf .fancybox-content,.fancybox-slide--video .fancybox-content{height:100%;overflow:visible;padding:0;width:100%}.fancybox-slide--video .fancybox-content{background:#000}.fancybox-slide--map .fancybox-content{background:#e5e3df}.fancybox-slide--iframe .fancybox-content{background:#fff}.fancybox-iframe,.fancybox-video{background:transparent;border:0;display:block;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.fancybox-iframe{left:0;position:absolute;top:0}.fancybox-error{background:#fff;cursor:default;max-width:400px;padding:40px;width:100%}.fancybox-error p{color:#444;font-size:16px;line-height:20px;margin:0;padding:0}.fancybox-button{background:rgba(30,30,30,.6);border:0;border-radius:0;box-shadow:none;cursor:pointer;display:inline-block;height:44px;margin:0;padding:10px;position:relative;transition:color .2s;vertical-align:top;visibility:inherit;width:44px}.fancybox-button,.fancybox-button:link,.fancybox-button:visited{color:#ccc}.fancybox-button:hover{color:#fff}.fancybox-button:focus{outline:none}.fancybox-button.fancybox-focus{outline:1px dotted}.fancybox-button[disabled],.fancybox-button[disabled]:hover{color:#888;cursor:default;outline:none}.fancybox-button div{height:100%}.fancybox-button svg{display:block;height:100%;overflow:visible;position:relative;width:100%}.fancybox-button svg path{fill:currentColor;stroke-width:0}.fancybox-button--fsenter svg:nth-child(2),.fancybox-button--fsexit svg:first-child,.fancybox-button--pause svg:first-child,.fancybox-button--play svg:nth-child(2){display:none}.fancybox-progress{background:#ff5268;height:2px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:0;transition-property:transform;transition-timing-function:linear;z-index:99998}.fancybox-close-small{background:transparent;border:0;border-radius:0;color:#ccc;cursor:pointer;opacity:.8;padding:8px;position:absolute;right:-12px;top:-44px;z-index:401}.fancybox-close-small:hover{color:#fff;opacity:1}.fancybox-slide--html .fancybox-close-small{color:currentColor;padding:10px;right:0;top:0}.fancybox-slide--image.fancybox-is-scaling .fancybox-content{overflow:hidden}.fancybox-is-scaling .fancybox-close-small,.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small{display:none}.fancybox-navigation .fancybox-button{background-clip:content-box;height:100px;opacity:0;position:absolute;top:calc(50% - 50px);width:70px}.fancybox-navigation .fancybox-button div{padding:7px}.fancybox-navigation .fancybox-button--arrow_left{left:0;left:env(safe-area-inset-left);padding:31px 26px 31px 6px}.fancybox-navigation .fancybox-button--arrow_right{padding:31px 6px 31px 26px;right:0;right:env(safe-area-inset-right)}.fancybox-caption{background:linear-gradient(0deg,rgba(0,0,0,.85) 0,rgba(0,0,0,.3) 50%,rgba(0,0,0,.15) 65%,rgba(0,0,0,.075) 75.5%,rgba(0,0,0,.037) 82.85%,rgba(0,0,0,.019) 88%,transparent);bottom:0;color:#eee;font-size:14px;font-weight:400;left:0;line-height:1.5;padding:75px 44px 25px;pointer-events:none;right:0;text-align:center;z-index:99996}@supports (padding:max(0px)){.fancybox-caption{padding:75px max(44px,env(safe-area-inset-right)) max(25px,env(safe-area-inset-bottom)) max(44px,env(safe-area-inset-left))}}.fancybox-caption--separate{margin-top:-50px}.fancybox-caption__body{max-height:50vh;overflow:auto;pointer-events:all}.fancybox-caption a,.fancybox-caption a:link,.fancybox-caption a:visited{color:#ccc;text-decoration:none}.fancybox-caption a:hover{color:#fff;text-decoration:underline}.fancybox-loading{animation:a 1s linear infinite;background:transparent;border:4px solid #888;border-bottom-color:#fff;border-radius:50%;height:50px;left:50%;margin:-25px 0 0 -25px;opacity:.7;padding:0;position:absolute;top:50%;width:50px;z-index:99999}@keyframes a{to{transform:rotate(1turn)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{opacity:0;transform:translate3d(-100%,0,0)}.fancybox-fx-slide.fancybox-slide--next{opacity:0;transform:translate3d(100%,0,0)}.fancybox-fx-slide.fancybox-slide--current{opacity:1;transform:translateZ(0)}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{opacity:0;transform:scale3d(1.5,1.5,1.5)}.fancybox-fx-zoom-in-out.fancybox-slide--next{opacity:0;transform:scale3d(.5,.5,.5)}.fancybox-fx-zoom-in-out.fancybox-slide--current{opacity:1;transform:scaleX(1)}.fancybox-fx-rotate.fancybox-slide--previous{opacity:0;transform:rotate(-1turn)}.fancybox-fx-rotate.fancybox-slide--next{opacity:0;transform:rotate(1turn)}.fancybox-fx-rotate.fancybox-slide--current{opacity:1;transform:rotate(0deg)}.fancybox-fx-circular.fancybox-slide--previous{opacity:0;transform:scale3d(0,0,0) translate3d(-100%,0,0)}.fancybox-fx-circular.fancybox-slide--next{opacity:0;transform:scale3d(0,0,0) translate3d(100%,0,0)}.fancybox-fx-circular.fancybox-slide--current{opacity:1;transform:scaleX(1) translateZ(0)}.fancybox-fx-tube.fancybox-slide--previous{transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{transform:translateZ(0) scale(1)}@media (max-height:576px){.fancybox-slide{padding-left:6px;padding-right:6px}.fancybox-slide--image{padding:6px 0}.fancybox-close-small{right:-6px}.fancybox-slide--image .fancybox-close-small{background:#4e4e4e;color:#f2f4f6;height:36px;opacity:1;padding:6px;right:0;top:0;width:36px}.fancybox-caption{padding-left:12px;padding-right:12px}@supports (padding:max(0px)){.fancybox-caption{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}}}.fancybox-share{background:#f4f4f4;border-radius:3px;max-width:90%;padding:30px;text-align:center}.fancybox-share h1{color:#222;font-size:35px;font-weight:700;margin:0 0 20px}.fancybox-share p{margin:0;padding:0}.fancybox-share__button{border:0;border-radius:3px;display:inline-block;font-size:14px;font-weight:700;line-height:40px;margin:0 5px 10px;min-width:130px;padding:0 15px;text-decoration:none;transition:all .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fancybox-share__button:link,.fancybox-share__button:visited{color:#fff}.fancybox-share__button:hover{text-decoration:none}.fancybox-share__button--fb{background:#3b5998}.fancybox-share__button--fb:hover{background:#344e86}.fancybox-share__button--pt{background:#bd081d}.fancybox-share__button--pt:hover{background:#aa0719}.fancybox-share__button--tw{background:#1da1f2}.fancybox-share__button--tw:hover{background:#0d95e8}.fancybox-share__button svg{height:25px;margin-right:7px;position:relative;top:-1px;vertical-align:middle;width:25px}.fancybox-share__button svg path{fill:#fff}.fancybox-share__input{background:transparent;border:0;border-bottom:1px solid #d7d7d7;border-radius:0;color:#5d5b5b;font-size:14px;margin:10px 0 0;outline:none;padding:10px 15px;width:100%}.fancybox-thumbs{background:#ddd;bottom:0;display:none;margin:0;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;padding:2px 2px 4px;position:absolute;right:0;-webkit-tap-highlight-color:rgba(0,0,0,0);top:0;width:212px;z-index:99995}.fancybox-thumbs-x{overflow-x:auto;overflow-y:hidden}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:212px}.fancybox-thumbs__list{font-size:0;height:100%;list-style:none;margin:0;overflow-x:hidden;overflow-y:auto;padding:0;position:absolute;position:relative;white-space:nowrap;width:100%}.fancybox-thumbs-x .fancybox-thumbs__list{overflow:hidden}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar{width:7px}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track{background:#fff;border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:10px}.fancybox-thumbs__list a{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:rgba(0,0,0,.1);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;float:left;height:75px;margin:2px;max-height:calc(100% - 8px);max-width:calc(50% - 4px);outline:none;overflow:hidden;padding:0;position:relative;-webkit-tap-highlight-color:transparent;width:100px}.fancybox-thumbs__list a:before{border:6px solid #ff5268;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:all .2s cubic-bezier(.25,.46,.45,.94);z-index:99991}.fancybox-thumbs__list a:focus:before{opacity:.5}.fancybox-thumbs__list a.fancybox-thumbs-active:before{opacity:1}@media (max-width:576px){.fancybox-thumbs{width:110px}.fancybox-show-thumbs .fancybox-inner{right:110px}.fancybox-thumbs__list a{max-width:calc(100% - 10px)}} /* End */ /* Start:/bitrix/templates/petmen/css/animate.css?169826819557114*/ @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. */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes pulse { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } } @keyframes shake { 0%, 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); transform: translateX(0%); } } @keyframes wobble { 0% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); -ms-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); -ms-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); -ms-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); -ms-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); -ms-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); transform: scale(.9); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } } @keyframes bounceOut { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-100px); transform: translateY(-100px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-150px); transform: translateX(-150px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-150px); -ms-transform: translateX(-150px); transform: translateX(-150px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(150px); transform: translateX(150px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(150px); -ms-transform: translateX(150px); transform: translateX(150px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(100px); transform: translateY(100px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; -ms-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } .flipInX { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); -ms-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); -ms-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } .flipInY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes slideOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes slideOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } /* End */ /* Start:/bitrix/templates/petmen/styles.css?174913298376847*/ @font-face { font-family: 'icomoon'; src: url('/bitrix/templates/petmen/fonts/icomoon.ttf?30w907') format('truetype'), url('/bitrix/templates/petmen/fonts/icomoon.woff?30w907') format('woff'), url('/bitrix/templates/petmen/fonts/icomoon.svg?30w907#icomoon') format('svg'); font-weight: normal; font-style: normal; font-display: block; } [class^="ico-"], [class*=" ico-"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'icomoon' !important; speak: never; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ico-step:before { content: "\e900";} .ico-back:before { content: "\e901";} .ico-arrow-right-big:before { content: "\e902";} .ico-close:before { content: "\e903";} .ico-check-big:before { content: "\e904";} .ico-location-big:before { content: "\e905";} .ico-mail-big:before { content: "\e906";} .ico-arrow-right:before { content: "\e907";} .ico-rocket:before { content: "\e908";} .ico-diamond:before { content: "\e909";} .ico-conveyor:before { content: "\e90a";} .ico-calendar:before { content: "\e90b";} .ico-account_circle:before { content: "\e90c";} .ico-check:before { content: "\e90d";} .ico-zoom:before { content: "\e90e";} .ico-more:before { content: "\e90f";} .ico-arrow-small:before { content: "\e910";} .ico-location:before { content: "\e911";} .ico-mail:before { content: "\e912";} .ico-call:before { content: "\e913";} .ico-tune:before { content: "\e914";} .ico-call-big:before { content: "\e915";} .ico-web:before { content: "\e916";} .ico-calendar-today:before { content: "\e917";} .ico-rotate, .ico-rotate-180 { display: inline-block; transform:rotate(180deg);} .ico-rotate-90 { display: inline-block; transform:rotate(90deg);} .ico-rotate-270 { display: inline-block; transform:rotate(270deg);} :root{ --text: #10283D; --text-rgb: 16,40,61; --primary: #419FF6; --primary-hover: #5EADF7; --primary-rgb: 65,159,246; --blue: #003E76; --dark-blue: #173856; --gray: #DBDFE2; --gray-text: #707E8B; } html { font-size: 16px; -webkit-text-size-adjust: none; text-size-adjust: none;} body{ font-size: 1.125rem; line-height:1.6; font-family:'Raleway', Arial, sans-serif; color:var(--text);} a { color: inherit; text-decoration: none;} a:hover { color: inherit; text-decoration: none;} img { max-width: 100%; height: auto;} h1, h2, h3, h4, h5, h6 { font-weight:700; line-height: 1.3; margin:0 0 1.8125rem;} h1, h2 { font-size:3.125rem; line-height: 3.75rem; font-weight: 900;} h3 { font-size: 2.5rem; line-height: 3rem; font-weight: 900;} h4 { font-size: 1.625rem;} h5 { font-size: 1.25rem;} h6 { font-size: 1.125rem;} .page-heading, .page-title { margin-bottom:4.375rem;} .page-heading .page-title { margin-bottom: 0;} mark { background: none; color:var(--primary); padding: 0;} .btn { font-weight: bold; font-size: 1.125rem; line-height: 1.8125rem; padding: 1.0625rem 2.125rem;} .btn-sm { font-size: 1rem; line-height:1.625rem; padding: 0.5625rem 1.5rem;} .btn-primary, .btn-primary.disabled, .btn-primary:disabled { background-color:var(--primary); border-color:var(--primary);} .btn-primary:hover, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle { background:var(--primary-hover); color: #fff; border-color:var(--primary-hover);} .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus { background:var(--primary-hover); border-color:var(--primary-hover); color: #fff; outline: none; box-shadow: 0 0 0 .2rem rgba(var(--primary-rgb), 0.5);} .btn-secondary, .btn-secondary.disabled, .btn-secondary:disabled { background-color:#fff; border-color:var(--primary); color:var(--text);} .btn-secondary:hover, .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle { background:var(--primary-hover); color: #fff; border-color:var(--primary-hover);} .btn-secondary:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus, .show>.btn-secondary.dropdown-toggle:focus { background:var(--primary-hover); border-color:var(--primary-hover); color: #fff; outline: none; box-shadow: 0 0 0 .2rem rgba(var(--primary-rgb), 0.5);} .btn-dark, .btn-dark.disabled, .btn-dark:disabled { background-color:var(--text); border-color:transparent;} .btn-dark:hover, .btn-dark:not(:disabled):not(.disabled).active, .btn-dark:not(:disabled):not(.disabled):active, .show>.btn-dark.dropdown-toggle { background:var(--primary); border-color:transparent;} .btn-dark:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, .btn-dark:not(:disabled):not(.disabled):active:focus, .show>.btn-dark.dropdown-toggle:focus { background:var(--primary); border-color:transparent; outline: none; box-shadow: 0 0 0 .2rem rgba(var(--primary-rgb), 0.5);} .btn .ico { font-size: 0.75rem;} .btn .ico-start { margin-right: 0.875rem;} .btn .ico-end { margin-left: 0.875rem;} #wrapper { width: 100%; min-width: 320px;} #content-wrapper { padding: 6.25rem 0;} .page-catalog #content-wrapper { padding-top: 3.75rem;} @media (min-width: 1200px) { .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1472px;} } .container .container { padding-left: 0; padding-right: 0;} .row { --bs-gutter-x: 2rem;} .row.g-0 { --bs-gutter-x: 0;} .row.g-10 { --bs-gutter-x: 1.25rem;} .row.g-35 { --bs-gutter-x: 4.375rem;} .row.g-50 { --bs-gutter-x: 6.25rem;} /* carousel */ .jcarousel-wrap { position:relative;} .jcarousel { position:relative; overflow:hidden;} .jcarousel>ul { width:20000em; position:relative; list-style:none; margin:0; padding:0;} .jcarousel>ul>li { float:left; position:relative;} .jcarousel>ul>li a { text-decoration:none;} .jcarousel-prev, .jcarousel-next { display:block; position:absolute; width:2.75rem; height:2.75rem; top:50%; transform:translateY(-50%); cursor:pointer; z-index:50; text-align:center; line-height:calc(2.75rem - 2px); font-size:0.75rem; vertical-align:top; text-align: center; color:var(--text); border:1px solid transparent; border-radius: 3px; transition: all 0.3s ease; user-select: none;} .jcarousel-prev { left:0;} .jcarousel-next { right:0;} .jcarousel-prev:hover, .jcarousel-next:hover { color:var(--primary);} .jcarousel-pagination { margin-top:1.875rem; display: flex; justify-content: center; flex-wrap:wrap;} .jcarousel-pagination span { margin: 0 2px; padding: 3px; cursor: pointer;} .jcarousel-pagination span:before { content:''; display: block; width:5px; height: 5px; background:#CFD4D8; border-radius: 50%;} .jcarousel-pagination span.active:before, .jcarousel-pagination span:hover:before { background: var(--primary);} .jcarousel-actions { display: flex; justify-content: center; align-items: center; margin-top: 1.875rem;} .jcarousel-actions .jcarousel-prev, .jcarousel-actions .jcarousel-next { position: relative; left:auto; right:auto; top:auto; transform:none;} .jcarousel-actions .jcarousel-pagination { margin:0 0.625rem;} .btns-hidden .jcarousel-prev, .btns-hidden .jcarousel-next, .btns-hidden .jcarousel-pagination { display:none;} /* header */ #header { position: relative; z-index: 150;} .header-top { position:relative; z-index: 151; background:var(--dark-blue); padding: 0.625rem 0; color:#fff; font-size: 1rem;} .header-contacts .contact-item { margin-left:3.125rem;} .contact-item { position: relative; padding-left: 2rem; font-size: 1rem;} .contact-item .ico { position: absolute; left:0; top:0.125rem; width: 1.375rem; font-size:1.375rem; line-height:1.375rem; color:var(--primary); display: block;} .contact-item a:hover { color:var(--primary);} .contact-item a.btn:hover { color:#fff;} .page-header { background: var(--text); color:#fff; padding: 0; margin: 0; border:none; border-radius: 0;} .page-header>.container { height: calc(5.125rem + 4px);} .header-logo { width: 12.375rem;} #navi { flex-grow:0; width: auto;} .main-menu .sub-menu { display: none;} .main-menu li { position: relative;} .main-menu>li>a { display: block; font-size: 1rem; line-height: 1.625rem; padding: 1.75rem 0; border:2px solid transparent; border-width:2px 0; font-weight: bold; color:#fff;} .main-menu li.parent>a .menu-arrow { display: inline-block; font-size: 0.625rem; margin-left: 0.625rem; vertical-align: top; position: relative; top: 0.125rem;} .main-menu>li.selected>a, .main-menu>li:hover>a { color:var(--primary); border-bottom-color:var(--primary);} .main-menu>li+li { margin-left: 3.125rem;} .main-menu li .sub-menu { display: none; list-style: none; position: absolute; left:0; top:100%; background: var(--text); padding: 0; margin: 0; border-radius: 0 0 3px 3px;} .main-menu li .sub-menu .sub-menu { left:100%; top:0; border-radius: 0 0 3px 0;} .main-menu .sub-menu li a { display: block; position: relative; font-size: 1rem; line-height: 1.625rem; border-top:1px solid #34485A; color:#fff; padding: 0.875rem 1.25rem; white-space: nowrap;} .main-menu .sub-menu li:last-child>a { border-radius: 0 0 3px 3px;} .main-menu .sub-menu .sub-menu li:last-child>a { border-radius: 0 0 3px 0;} .main-menu .sub-menu li:hover>a { background:#34485A;} .main-menu .sub-menu li.parent>a { padding-right: 2.5rem;} .main-menu .sub-menu li.parent>a .menu-arrow { display: block; position: absolute; margin: 0; padding: 0; top:50%; right:0.9375rem; transform:translateY(-50%) rotate(-90deg);} .navbar-main-toggler { width: 28px; height:28px; border:none; border-radius:0; position: relative; transition: .25s ease-in-out; box-shadow: none !important; outline: none !important;} .navbar-main-toggler span { display: block; position: absolute; height:3px; width:22px; background: #fff; border-radius: 2px; left:3px; top:13px; transform: rotate(0deg); transition: .25s ease-in-out;} .navbar-main-toggler span:nth-child(1), .navbar-main-toggler span:nth-child(4) { width:0%; left:50%;} .navbar-main-toggler span:nth-child(2) { transform: rotate(45deg);} .navbar-main-toggler span:nth-child(3) { transform: rotate(-45deg);} .navbar-main-toggler.collapsed span:nth-child(1) { top:6px; width:22px; left:3px;} .navbar-main-toggler.collapsed span:nth-child(2), .navbar-main-toggler.collapsed span:nth-child(3) { transform: rotate(0deg);} .navbar-main-toggler.collapsed span:nth-child(4) { top:20px; width:22px; left:3px;} .header-button .btn { white-space: nowrap;} .header-phone { font-size:1.75rem; line-height: 1.475rem;} .header-dropdown { position: relative; padding-bottom: 0.625rem; margin-bottom:-0.625rem;} .header-dropdown .dropdown-single { position: relative; padding-right: 1rem;} .header-dropdown .dropdown-single:after { content:''; display: block; position: absolute; right:0; top:50%; transform:translateY(-50%); border-top:5px solid #fff; border-left:4px solid transparent; border-right:4px solid transparent;} .header-dropdown.contact-item { padding-left: 0;} .header-dropdown.contact-item .dropdown-single { padding-left: 2rem;} .header-dropdown .dropdown-arrow { display: block; margin-left: 9px; width: 9px; height: 5px; background: url(/bitrix/templates/petmen/images/icons/arrow-down.svg) no-repeat center center; background-size: 100% 100%;} .header-dropdown .dropdown-box { display: none; position: absolute; left:0; top:100%; width: 263px; background: #fff; color:var(--text); line-height: 1.3125rem; border-radius: 0; padding:1.5rem 1.5rem 1.75rem; box-shadow:10px 10px 25px 5px rgba(0,0,0,0.05);} .header-dropdown:hover .dropdown-box { display: block;} .header-dropdown .dropdown-box dl { margin-bottom: 1.25rem;} .header-dropdown .dropdown-box dl dt { color:#a0aab2; font-weight: 400; margin-bottom: 3px;} .header-dropdown .dropdown-box .btn { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem;} .header-dropdown .dropdown-box > :last-child { margin-bottom: 0;} /* content */ p, .entry-content p { margin-bottom: 1.8125rem;} .entry-content > :last-child { margin-bottom: 0 !important;} .entry-content img { border-radius: 3px;} /* category */ .category-title, .product-single-title { font-size: 2.5rem; line-height: 3rem; margin-bottom: 3.125rem;} .catalog-section { margin-bottom: 4.375rem;} .product-item-container { margin: 0; height: 100% !important;} .product-item { display: flex; flex-direction: column; padding: 1.875rem; border:1px solid var(--gray); border-left:none; border-radius: 0; height: 100%;} [class*="col-xl-3"]:nth-child(n+5) .product-item { border-top:none;} [class*="col-xl-3"]:nth-child(4n+1) .product-item { border-left:1px solid var(--gray);} .product-item-image-wrapper { padding-top: 100%; margin-bottom: 1.875rem;} .product-item-title { font-weight: bold; margin-bottom: 1.25rem;} .product-item-title a { color:var(--text); font-size: 1.125rem;} .product-item-price-container { display: none;} .product-item-info-container { margin-bottom: 1.25rem;} .product-item-info-container:last-child { margin-top: auto; margin-bottom: 0;} .product-item-button-container .btn { margin-bottom: 0; width: 100%;} .product-item-button-container .btn .ico { font-size: 0.75rem; margin-left: 0.625rem;} .product-item-properties { border-bottom:1px solid var(--gray); display: flex; justify-content: space-between; color:var(--gray-text); font-size: 0.875rem; padding: 0.25rem 0;} .product-item-properties:first-child { border-top:1px solid var(--gray);} .product-item-properties dd { margin-bottom: 0; color:var(--text)} .bx-no-touch .product-item-container.hover .product-item-title a { color:var(--primary);} .bx-no-touch .product-item-container.hover .product-item { box-shadow: 0 0 60px rgba(var(--text-rgb), 0.1);} /* filter */ .bx-sidebar-filter { border:1px solid var(--gray); border-radius:3px;} .bx-sidebar-filter .bx_sitemap { margin: 0; padding:15px;} .bx-sidebar-filter .bx_sitemap_ul { list-style: none; padding: 0; margin: 0;} .bx-sidebar-filter .bx_sitemap .bx_sitemap_ul li { display: block; margin: 0; line-height: 1.6;} .bx-sidebar-filter .bx_sitemap .bx_sitemap_ul li+li { margin-top: 5px;} .bx-sidebar-filter .bx_sitemap .bx_sitemap_li_title a { display: block; font-size: 1rem; color:var(--text); white-space: normal; padding: 0.625rem; 0.875rem; border-radius: 3px;} .bx-sidebar-filter .bx_sitemap .current-cat a, .bx-sidebar-filter .bx_sitemap .bx_sitemap_li_title a:hover { background: #ECEEEF;} .bx-filter { min-width: 0; font-family: inherit; margin:0;} .bx-filter .bx-filter-section { padding-top:0; background: #fff !important;} .bx-filter .bx-filter-parameters-box { padding: 1.875rem; border-top:1px solid var(--gray);} .bx-filter .bx-filter-parameters-box-title { font-size:1rem; font-weight: bold; padding-bottom: 0; margin-bottom: 1.5rem;} .bx-filter .bx-filter-parameters-box-title span { border:none; color:var(--text); cursor: default;} .bx-filter .bx-filter-block { display: block;} .bx-filter .bx-filter-parameters-box-container { padding: 0;} .bx-filter-parameters-box-container .checkbox { padding: 2px 0; line-height: 1.375rem;} .bx-filter .bx-filter-param-label { display: block; font-size: 0.875rem; min-height:1.375rem;} .bx-filter .bx-filter-input-checkbox { position: relative; display: block; padding-left:1.75rem;} .bx-filter .bx-filter-input-checkbox input { position: absolute; left:0; top:0.125rem; width: 1.125rem; height: 1.125rem; margin: 0; opacity: 0; z-index: 1;} .bx-filter .bx-filter-input-checkbox .input-check { display: block; position: absolute; left:0; top:0.125rem; width: 1.125rem; height: 1.125rem; line-height: 1.125rem; text-align: center; font-size: 0.625rem; border:1px solid var(--primary); border-radius: 3px; color:#fff;} .bx-filter .bx-filter-input-checkbox .input-check .ico { opacity: 0;} .bx-filter .bx-filter-input-checkbox input:checked+.input-check { background: var(--primary);} .bx-filter .bx-filter-input-checkbox input:checked+.input-check .ico { opacity: 1;} .filter-more-items { display: none;} .btn-filters-more { width: 100%; background: #ECEEEF; color:var(--text); border-color:transparent; font-size: 0.875rem; line-height:1.375rem; padding: 0.625rem 1rem; outline: none; box-shadow: none; margin-top: 1.5rem;} .btn-filters-more:hover { background: var(--primary); color:#fff;} .bx-filter .bx-filter-button-box { padding:1.875rem; border-top:1px solid var(--gray);} .bx-filter-button-box .bx-filter-parameters-box-container { display: flex; justify-content: space-between;} .bx-filter-button-box .bx-filter-parameters-box-container .btn { width: calc(50% - 0.375rem);} .bx-filter .filter-toggler { display: flex; justify-content:center; cursor: pointer; background: #ECEEEF; font-size: 0.875rem; text-align: center; font-weight: bold; border-radius: 3px; padding: 0.75rem 1.5rem; margin-bottom: 1rem;} .bx-filter .filter-toggler .ico { font-size: 1.375rem; margin-right: 0.625rem;} .bx-filter .bx-filter-popup-result { display: none !important;} /* product single */ .product-item-detail-slider-container { position: sticky; top:3.75rem; border:1px solid var(--gray); padding: 3.125rem; margin-bottom: 2.5rem;} .product-item-detail-slider-block { padding-top: 100%;} .product-item-detail-slider-left, .product-item-detail-slider-right { display: none;} .product-item-detail-slider-controls-block { padding: 0 3.25rem; margin: 1.5rem 0 0;} .product-item-detail-slider-controls-image { display: block; width:100%; height: auto; padding-bottom: calc(100% - 2px); flex-shrink: 0; outline:none; border:1px solid transparent;} .product-item-detail-slider-controls-image.active { border-color:var(--primary);} .product-item-detail-slider-image img, .product-item-detail-slider-controls-image img { top:0; left:0; max-width:none; max-height:none; width:100%; height:100%; transform:none; object-fit: contain;} .product-images-carousel.btns-hidden ul { display: flex; justify-content: center; width: 100%; left:auto !important; top:auto !important;} .product-images-carousel li { padding:0 0.125rem;} .product-images-carousel .jcarousel-prev, .product-images-carousel .jcarousel-next { height: 4.375rem; line-height: calc(4.375rem - 2px); font-size: 1rem;} .back-link { font-size: 0.875rem; font-weight:bold; color:var(--primary); margin-bottom: 1.25rem;} .back-link .ico { font-size: 0.75rem; margin-right: 0.875rem;} .product-single-title { margin-bottom: 2.25rem;} .product-item-detail-info-section { padding: 0;} .product-item-detail-info-container { font-family: inherit;} .product-short-description { font-size: 1rem; margin-bottom: 2rem;} .product-item-detail-pay-block { display: none;} .product-request { margin-bottom:1.75rem;} .product-request .row { --bs-gutter-x: 1rem;} .product-request .submit-row { margin-top: 0;} .product-request .form-control { font-size: 1rem; border-color:var(--primary);} .product-request .form-control, .product-request-form .btn { padding-top: 0.875rem; padding-bottom: 0.875rem; min-height: calc(3.5625rem + 2px);} .product-request .input-with-icon .ico { top:1.0625rem;} .product-request .submit-row .spinner-border { top:0.8125rem;} .product-item-detail-tabs-container { border-bottom:1px solid var(--gray); min-height: 1px; overflow: hidden;} .product-item-detail-tabs-list { display: flex; overflow: auto; margin-bottom: -1rem; padding-bottom: 1rem;} .product-item-detail-tabs-list:after { display: none;} .product-item-detail-tab { min-height: 1px; margin-right: 5px;} .product-item-detail-tab:last-child { margin-right: 0;} .product-item-detail-tab-link { display:block; font-size: 1rem; line-height: 1.6; font-weight:bold; white-space: nowrap; height: auto; text-overflow: clip; padding:0.875rem 1.5rem; color: var(--gray-text); text-transform: none;} .product-item-detail-tab-link:after { background:var(--primary);} .product-item-detail-tab-link:hover, .product-item-detail-tab.active .product-item-detail-tab-link { color:var(--text);} .product-item-detail-tab-link:hover:after, .product-item-detail-tab.active .product-item-detail-tab-link:after { height: 2px;} .product-tab-containers { margin-bottom:3.75rem;} .product-item-detail-tab-content { padding: 1.5rem 0 0;} .product-item-detail-tab-content .entry-content { font-size: 1rem;} .product-item-detail-tab-content .entry-content p { margin-bottom: 1.625rem;} .product-item-detail-properties { display: flex; justify-content: space-between; padding: 0.625rem 0; max-width:100%; color:var(--gray-text); border-bottom:1px solid var(--gray); font-size: 1rem;} .product-item-detail-properties:first-child { padding-top: 0;} .product-item-detail-properties dd { margin-bottom: 0; color:var(--text);} .product-fixed-bar { visibility: hidden; position: fixed; top:-12.5rem; padding: 1.875rem 0; background: #fff; border-bottom:1px solid var(--gray); transition: visibility 0.35s ease, top 0.35s ease; z-index: 150;} .product-fixed-bar.active { visibility: visible; top:0;} .product-fixed-bar .fixed-bar-main { margin-right: 1.5rem;} .product-fixed-bar .back-link { margin-bottom: 0.625rem;} .product-fixed-bar .product-single-title { font-size: 1.625rem; line-height: 2.125rem; font-weight: 700; margin:0;} .product-fixed-bar .btn { margin-top: auto; white-space: nowrap;} /* palitra */ .section-palitra { background: #F0F4F7; border-radius:3px; padding: 2.5rem; margin-bottom: 4.375rem;} .chart-colors { width: 7.5rem; height: 7.5rem;} .canvasjs-chart-credit { display: none !important;} .colors-block { width: 12.5rem; position: relative; padding-top: 4.375rem;} .colors-block .colors-photos { position: absolute; top:0; right:0; width:5rem; height:11.5rem;} .colors-block .photo-item { display:none; position: absolute; left:0; top:0; width:100%; height: 100%;} .colors-block .photo-item img { display: block; position: absolute; left:0; top:0; width:100%; height: 100%; object-fit: contain; object-position: center; margin: 0;} .colors-block .colors-photos:before { content:''; display: block; position: absolute; top:3rem; right:100%; width: 2.5rem; height:1.375rem; border:1px solid var(--primary); border-width: 1px 0 0 1px;} .palitra-info { width:calc(100% - 16.25rem); font-size: 1rem;} .palitra-info .caption { font-size: 1.625rem; line-height: 2.125rem; font-weight:500; margin-bottom: 1.25rem;} .related-section { margin-bottom: 2.5rem;} .carousel-head { position:relative; min-height: 2.75rem; margin-bottom: 1.5rem;} .related-title { font-size: 1.625rem; line-height:2.125rem; font-weight: 700; margin: 0;} .related-carousel .jcarousel { border-left:1px solid var(--gray);} .related-carousel .jcarousel>ul { display: flex;} .carousel-head .jcarousel-prev, .carousel-head .jcarousel-next { transform:none; top:0; border:1px solid var(--gray);} .carousel-head .jcarousel-prev { border-radius: 3px 0 0 3px; right:calc(2.75rem - 1px); left:auto;} .carousel-head .jcarousel-next { border-radius: 0 3px 3px 0; right:0;} /* samples */ .samples-box { border: 1px solid var(--gray); position: relative; overflow: hidden; padding: 2.25rem 3.25rem 2rem; margin-bottom: 2.5rem;} .samples-parallax { position: absolute; width: 60%; right:0; top:0; transform:translateY(-70%);} .samples-parallax img { display: block; width: 100%; height: auto;} .samples-box .samples-inner { max-width: 33rem; position: relative; z-index: 1;} .samples-box .samples-title { font-size: 2rem; line-height: 2.25rem; margin-bottom: 1rem;} .samples-box p { margin-bottom: 1.25rem;} /* home */ .icon svg path { fill:currentColor;} .home-top-section { position: relative; background:#fff; color:var(--text); border-bottom:1px solid #e4f1fd; margin-bottom: 3.125rem;} .home-top-section .home-top-bg { display: block; position: absolute; left:0; top:0; width: 100%; height: 100%; overflow: hidden;} .home-top-section .home-top-bg:before { content:''; display: block; position: absolute; left:0; top:0; width: 100%; height: 120%; background: url(/bitrix/templates/petmen/images/home-bg-new.jpg) no-repeat center top; background-size:100% auto; opacity: 0; transition:all 1.2s ease;} .home-top-section .home-top-bg:after { content:''; display: block; position: absolute; left:0; top:0; width: 100%; height: 100%; background: url(/bitrix/templates/petmen/images/home-bg-back.png) no-repeat left top; background-size:auto 120%;} .home-top-section.animated .home-top-bg:before { opacity: 1;} .home-top-inner { display: flex; flex-direction: column; justify-content: center; position: relative; z-index: 2; padding: 3rem 0 5.5rem;} .home-top-section h1 { font-size: 4.375rem; line-height: 5.125rem; max-width: 36rem;} .home-top-section .home-advantages { margin-top: 1.5rem; font-size:1rem; line-height: 1.25rem;} .home-advantage-item .icon { width:3.75rem; height: 3.75rem; background: #fff; color:var(--primary); border-radius: 3px; font-size: 1.75rem; line-height: 3.75rem; font-weight: 900; text-align: center; margin-right:1.25rem; flex-shrink: 0;} .home-top-buttons { margin-top: 5rem; gap:1.625rem;} .home-top-buttons .btn-secondary { border-color:transparent !important; color:var(--primary);} .home-top-buttons .btn-secondary:hover, .home-top-buttons .btn-secondary:active, .home-top-buttons .btn-secondary:focus { color:#fff;} .home-top-section .section-arrow-border { display: block; position: absolute; left:50%; bottom:0; transform:translateX(-50%); border-bottom:3.125rem solid #e4f1fd; border-left:2.5rem solid transparent; border-right:2.5rem solid transparent; margin-bottom: -1px; z-index: 3;} .home-top-section .section-arrow { display: block; position: absolute; left:50%; bottom:0; transform:translateX(-50%); border-bottom:3.125rem solid #fff; border-left:2.5rem solid transparent; border-right:2.5rem solid transparent; margin-bottom: -2px; z-index: 4;} .home-top-section .section-arrow .ico { display: block; position: absolute; font-size: 1rem; top:1.5rem; left:50%; margin-left: -0.5rem; color:var(--primary);} @media screen and (min-width: 1200px) { .home-top-section .home-advantages .row > .col-12:nth-child(2) { min-width: 280px;} } .section { padding: 6.25rem 0;} .section-head { text-align: center; margin-bottom: 3.75rem;} .section-title { text-align: center; margin-bottom:3.125rem;} .section-head .section-title { margin: 0;} .section-head .section-subtitle { font-size: 1rem; margin-top: 1.875rem;} .item-thumb { display: block; position: relative; width: 100%; padding-bottom: 100%;} .item-thumb img { display: block; position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: contain;} /* home categories */ .home-cats-section .section-head { max-width: 31.25rem; margin-left: auto; margin-right: auto;} .home-cat-item { display: block; position: relative; background: var(--text); color:#fff; height: 100%;} .home-cat-item:hover { color:#fff;} .home-cat-item .img-wrap { display: block; background:#fff; border:1px solid var(--primary); border-bottom:none; padding: 1.875rem;} .home-cat-item .item-thumb { padding-bottom: 112%;} .home-cat-item .item-entry { display: block; padding: 1.875rem; text-align: center;} .home-cat-item .item-title { display: block; font-weight: bold;} .home-cat-item .item-thumb .thumb-alternative { z-index: 1; opacity: 0; transition: opacity 300ms linear;} .home-cat-item:hover .item-thumb .thumb-alternative { opacity: 1;} @media screen and (min-width: 992px) { .home-cat-item .btn-more { display: block; position: absolute; top:0.625rem; right:0.625rem; font-size: 0; line-height: 0; padding:0.6875rem; border-radius: 3px; z-index:2;} .home-cat-item .btn-more .ico { font-size: 0.75rem;} } /* home about */ .home-about-block { --dot-size: 10px;} .home-about-left { width: 30.5%; flex-shrink: 0; display: flex; align-items: center; position: relative; padding: 6.25rem 0; z-index: 1;} .home-about-image { position: relative; width: 164%; flex-shrink: 0;} .home-about-image img { display: block; width: 100%; border-radius: 0.25rem;} .dots { display: flex; flex-direction: column;} .dots .dots-line { height:var(--dot-size); background: url(/bitrix/templates/petmen/images/dots.png) repeat 0 0; background-size: calc(var(--dot-size) * 2) calc(var(--dot-size) * 2);} .dots.dots-gray .dots-line { background-image:url(/bitrix/templates/petmen/images/dots-gray.png); } .home-about-image .dots { position: absolute; right:calc(39% + var(--dot-size));} .home-about-image .dots-top { bottom:calc(100% + var(--dot-size));} .home-about-image .dots-bottom { top:calc(100% + var(--dot-size));} .home-about-image .dots .dots-line { margin-left: auto;} .home-about-image .dots-top .dots-line { margin-top: var(--dot-size);} .home-about-image .dots-bottom .dots-line { margin-bottom: var(--dot-size);} .home-about-image .dots-top .dots-line-1 { width: calc(var(--dot-size) * 15);} .home-about-image .dots-top .dots-line-2 { width: calc(var(--dot-size) * 23);} .home-about-image .dots-top .dots-line-3 { width: calc(var(--dot-size) * 31);} .home-about-image .dots-bottom .dots-line-1 { width: calc(var(--dot-size) * 21);} .home-about-image .dots-bottom .dots-line-2 { width: calc(var(--dot-size) * 15);} .home-about-right { position: relative; width: 69.5%; flex-shrink: 0; display: flex; align-items: center; background: var(--blue); color:#fff; border-radius: 3px; overflow:hidden;} .home-about-right:before, .home-about-right:after { content:''; display: block; position: absolute; width: 17.5rem; height: 17.5rem; border:3.75rem solid #08447A; border-radius: 3px;} .home-about-right:before { left:7.25rem; bottom:-3rem;} .home-about-right:after { top:-7.75rem; right:-7rem;} .home-about-text { padding: 6.25rem 10% 6.25rem 36%; position: relative; z-index: 2;} .home-text h2 { margin-bottom:3.125rem;} .home-text .btn { margin-top: 1.3125rem;} .clients-block { padding-bottom: 6.25rem;} .clients-list { border:1px solid var(--gray); border-radius: 3px;} .clients-list .client-item { height: 100%; padding-bottom: 66.67%; position: relative;} .clients-list .client-item img { display: block; position: absolute; left:12.5%; top:18.75%; width: 75%; height: 62.5%; object-fit: contain; filter: grayscale(1); opacity: 0.5; transition:all 0.2s ease;} .clients-list .client-item img:hover { filter:grayscale(0); opacity: 1;} .clients-list .col-lg-2 .client-item { border-left:1px solid var(--gray);} .clients-list .col-lg-2:nth-child(6n+1) .client-item { border-left:none;} .clients-list .col-lg-2:nth-child(n+7) .client-item { border-top:1px solid var(--gray);} /* achievements */ .achievements-block { border:1px solid var(--gray); border-radius: 3px;} .achievements-block .achievement-item { height: 100%; padding: 3.125rem;} .achievement-item .caption { font-size: 5rem; line-height: 5.875rem; font-weight: 900; color:var(--blue);} .achievement-item .achievement-text { margin-top: 0.625rem;} .achievements-block [class^="col-"] .achievement-item { border-left:1px solid var(--gray);} .achievements-block [class^="col-"]:nth-child(2n+1) .achievement-item { border-left:none;} .achievements-block [class^="col-"]:nth-child(n+3) .achievement-item { border-top:1px solid var(--gray);} .home-achievements .achievements-block { border:none; row-gap:3.75rem;} .home-achievements .achievements-block .achievement-item { padding: 0;} .home-achievements .achievement-item .caption { font-size:6.25rem; line-height: 8.125rem;} .home-achievements .achievements-block [class^="col-"] .achievement-item { border:none;} /* sertificates */ .sertificates-block { --dot-size: 10px; position: relative; padding: 4.625rem 0; align-items: center;} .home-sert-left { position: absolute; top:0; bottom:0; left:7%; width: 35%; display: flex; align-items: center; z-index: 2;} .home-sert-image { position: relative; height: 100%; background: #dbeeff; border-radius: 3px; display: flex; align-items: center;} .home-sert-image img { display: block; max-height: 100%; max-width: 100%; height: auto; width: auto; border-radius: 3px;} .home-sert-right { width: 100%; background: var(--blue); color:#fff; padding: 7% 7% 7% 48%; border-radius: 3px; position: relative;} .home-sert-text { padding-left:8.75rem; position: relative; z-index: 1;} .home-sert-text .sert-icon { position: absolute; left:0; top:0; width:7.5rem;} .home-sert-text .sert-icon img { display: block; width: 100%;} .home-sert-right:after { content:''; display: block; position: absolute; left:50%; bottom:0; transform:translateX(-50%); width: 4.9375rem; height: 27.3125rem; background: url(/bitrix/templates/petmen/images/sert-logo.png) no-repeat center bottom; background-size: 100% 100%;} .sertificates-block .dots { position: absolute;} .home-sert-left .dots-top-left, .home-sert-left .dots-top-right { top: calc(4.625rem - var(--dot-size) * 4);} .home-sert-left .dots-bottom-left, .home-sert-left .dots-bottom-right { bottom: calc(4.625rem - var(--dot-size) * 2);} .home-sert-left .dots-top-left, .home-sert-left .dots-bottom-left { right:calc(100% + var(--dot-size));} .home-sert-left .dots-top-right, .home-sert-left .dots-bottom-right { left:calc(100% + var(--dot-size));} .home-sert-left .dots-top-left .dots-line, .home-sert-left .dots-bottom-left .dots-line { margin-left: auto;} .home-sert-left .dots-top-right .dots-line, .home-sert-left .dots-bottom-right .dots-line { margin-right: auto;} .home-sert-left .dots-top-left .dots-line, .home-sert-left .dots-top-right .dots-line { margin-bottom: var(--dot-size);} .home-sert-left .dots-bottom-left .dots-line, .home-sert-left .dots-bottom-right .dots-line { margin-top: var(--dot-size);} .home-sert-left .dots-top-left .dots-line-1 { width: calc(var(--dot-size) * 5);} .home-sert-left .dots-top-left .dots-line-2 { width: calc(var(--dot-size) * 7);} .home-sert-left .dots-top-right .dots-line-1 { width: calc(var(--dot-size) * 17);} .home-sert-left .dots-top-right .dots-line-2 { width: calc(var(--dot-size) * 29);} .home-sert-left .dots-bottom-left .dots-line-1 { width: calc(var(--dot-size) * 5);} .home-sert-left .dots-bottom-right .dots-line-1 { width: calc(var(--dot-size) * 15);} .home-sert-right .dots-bottom { bottom: calc(var(--dot-size) * -4); right:calc(var(--dot-size) * 4);} .home-sert-right .dots-bottom .dots-line { margin-left: auto; margin-top: var(--dot-size);} .home-sert-right .dots-bottom .dots-line-1 { width: calc(var(--dot-size) * 43);} .home-sert-right .dots-bottom .dots-line-2 { width: calc(var(--dot-size) * 11);} /* home production */ .section.home-production { position: relative; z-index: 1; padding-bottom: 0;} .production-text { width: 70%; margin-bottom: 3.75rem;} .production-photos { position: relative;} .production-photos .photos-list img { display: block; width:calc(50% - 0.625rem); border-radius: 3px;} .production-photos .btn { position: absolute; right:0; bottom:calc(100% + 3.75rem);} .home-slogan { background:var(--blue) url(/bitrix/templates/petmen/images/slogan-bg.jpg) no-repeat 0 0; background-size: cover; color:#fff; padding: 24rem 0 9.375rem; margin-top: -14.75rem;} .home-slogan ul { display: flex; justify-content: center; list-style: none; padding: 0; margin: 0; font-size: 4rem; line-height: 4.75rem; font-weight: 900; text-transform: uppercase; border:1px solid rgba(255,255,255,0.3); border-width: 1px 0; padding:1.875rem;} .home-slogan ul li { position: relative; padding:0 2.875rem;} .home-slogan ul li:before, .home-slogan ul li:last-child:after { content:'\e900'; font-family:'icomoon'; color:var(--primary); display: block; position: absolute; top:50%; transform:translateY(-50%); font-size: 1.375rem;} .home-slogan ul li:before { left:-0.625rem;} .home-slogan ul li:last-child:after { right:-0.625rem;} /* gallery */ .row.gallery-list { margin-bottom: 2.5rem;} .gallery-list .gallery-cell { margin-bottom:2rem;} .more-pagination { position: relative; margin-bottom: 2.5rem;} .more-pagination .loading { position: absolute; top:0; left:0; width: 100%; height: 100%; background: rgba(255,255,255,0.5);} .more-pagination .loading .spinner-border { position: absolute; left:50%; top:50%; margin: -1rem 0 0 -1rem;} /* about page */ .section.section-about { padding: 0 0 5.625rem;} .section.section-about .section { padding: 0;} .about-text > :last-child { margin-bottom: 0;} .about-photo { position: relative; --dot-size:10px; padding: calc(var(--dot-size) * 5) 0 0 calc(var(--dot-size) * 9);} .about-photo img { display: block; position: relative; width: 100%; margin: 0; z-index: 2;} .about-photo .photo-bg { display: block; position: absolute; left:0; top:0; bottom:calc(var(--dot-size) * 5); right:27%; background: var(--blue); border-radius: 3px;} .about-photo .photo-slogan { display: block; position: absolute; left:0; margin-top:calc(var(--dot-size) * -5 - 1.875rem); font-size: 2.5rem; line-height: calc(var(--dot-size) * 9); font-weight: 900; text-transform: uppercase; color:var(--primary); transform:rotate(-90deg); transform-origin: top left;} .about-photo.photo-right { padding: calc(var(--dot-size) * 5) calc(var(--dot-size) * 9) 0 0;} .about-photo.photo-right .photo-bg { right:0; left:27%;} .about-photo.photo-right .photo-slogan { left:100%; margin-left: calc(var(--dot-size) * -9)} .about-photo .dots { position: absolute;} .about-photo .dots-top { left:calc(100% + var(--dot-size)); top:var(--dot-size);} .about-photo .dots-bottom { left:var(--dot-size); top:calc(100% + var(--dot-size));} .about-photo .dots .dots-line { margin-bottom: var(--dot-size);} .about-photo .dots-top .dots-line { margin-right: auto;} .about-photo .dots-bottom .dots-line { margin-left: auto;} .about-photo .dots-top .dots-line-1 { width: calc(var(--dot-size) * 7);} .about-photo .dots-top .dots-line-2 { width: calc(var(--dot-size) * 11);} .about-photo .dots-bottom .dots-line-1 { width: calc(var(--dot-size) * 7);} .about-photo .dots-bottom .dots-line-2 { width: calc(var(--dot-size) * 5);} .about-photo.photo-right .dots-top { left:auto; right:calc(100% + var(--dot-size));} .about-photo.photo-right .dots-bottom { left:auto; right:var(--dot-size);} .about-photo.photo-right .dots-top .dots-line { margin-left: auto; margin-right: 0;} .about-photo.photo-right .dots-bottom .dots-line { margin-left: 0; margin-right: auto;} .advantages-list { border:1px solid var(--gray); border-radius: 3px;} .advantage-item .icon { display: block; width:6.875rem; height: 6.875rem; margin: 0 auto 1.875rem; background: var(--blue); color:#fff; padding: 1.25rem; border-radius: 50%;} .advantage-item .icon svg { display: block; width:4.375rem; height: 4.375rem;} .advantages-list .advantage-item { border-left:1px solid var(--gray); height: 100%; text-align: center; padding: 3.125rem 1.5rem 2.5rem; font-size: 1.375rem; line-height: 1.875rem; font-weight: 600;} .advantages-list [class^="col-"]:nth-child(4n+1) .advantage-item { border-left:none;} .advantages-list [class^="col-"]:nth-child(n+5) .advantage-item { border-top:1px solid var(--gray);} .section.section-about-video { padding: 5rem; position: relative; background: #F0F4F7; border-radius: 5px; margin-bottom: 5.625rem;} .section-about-video h2 { font-size: 2.5rem; line-height: 3rem; font-weight: 700; margin-bottom: 2.5rem;} .video-wrap { display: block; position: relative;} .video-wrap img { display: block; width: 100%; height: auto; border-radius:5px;} .video-wrap:before { content:''; display: block; position: absolute; width: 100%; height: 100%; border-radius:5px; background:rgba(0,62,118,0.7); z-index: 1;} .video-wrap .play { display: block; position: absolute; left:50%; top:50%; transform:translate(-35%,-50%) scale(1); width:5.625rem; height: 5.625rem; border-radius: 50%; background: var(--primary); z-index: 2; transition:all 0.2s ease;} .video-wrap .play:before { content:''; display: block; border-left: 1.125rem solid #fff; border-top:0.625rem solid transparent; border-bottom:0.625rem solid transparent; position: absolute; left:50%; top:50%; transform:translate(-50%,-50%);} .video-wrap:hover .play { transform:translate(-35%,-50%) scale(1.1);} .section-about-video { --dot-size:10px;} .section-about-video .dots { position: absolute;} .section-about-video .dots-topleft { left:1.875rem; top:1.5625rem;} .section-about-video .dots-topright { right:1.875rem; top:1.875rem; flex-direction:row;} .section-about-video .dots-bottomleft { left:1.875rem; bottom:1.875rem;} .section-about-video .dots-bottomright { right:1.875rem; bottom:1.875rem;} .section-about-video .dots-topleft .dots-line, .section-about-video .dots-bottomleft .dots-line, .section-about-video .dots-bottomright .dots-line { margin-top:var(--dot-size);} .section-about-video .dots-topright .dots-line { width: var(--dot-size); margin-left:var(--dot-size);} .section-about-video .dots-topleft .dots-line, .section-about-video .dots-topright .dots-line { margin-right: auto;} .section-about-video .dots-bottomright .dots-line { margin-left: auto;} .section-about-video .dots-topleft .dots-line-1 { width: calc(var(--dot-size) * 53);} .section-about-video .dots-topleft .dots-line-2 { width: calc(var(--dot-size) * 45);} .section-about-video .dots-bottomleft .dots-line { width: calc(var(--dot-size) * 31);} .section-about-video .dots-bottomright .dots-line-1 { width: calc(var(--dot-size) * 15);} .section-about-video .dots-bottomright .dots-line-2 { width: calc(var(--dot-size) * 21);} .section-about-video .dots-topright .dots-line-1 { height: calc(var(--dot-size) * 15);} .section-about-video .dots-topright .dots-line-2 { height: calc(var(--dot-size) * 23);} .section-about-video .dots-topright .dots-line-3 { height: calc(var(--dot-size) * 31);} /* news */ .row.news-list { margin-bottom: 2.5rem;} div.news-list img.preview_picture { float:none; margin: 0 0 1.25rem;} .news-list .news-item { margin-bottom: 2rem;} .news-date-time { display: block; font-size: 1rem; font-weight: bold; color: #9FA9B1; margin-bottom: 0.375rem;} .page-heading .news-date-time { margin-top: 1rem;} .news-item .news-title { color:var(--text); font-weight: bold; margin-bottom: 0.75rem;} .news-item .news-title a:hover { color:var(--primary);} .news-detail { margin-bottom: 1.5rem;} .news-detail-image { margin-bottom: 2.5rem;} /* sertificates */ .sert-list .sert-cell { position: relative; padding-bottom: 135%; margin-bottom:1.25rem;} .sert-list .sert-cell img { display: block; position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: contain; object-position: center;} .sert-list .sert-cell .btn { position: absolute; left:50%; bottom:10%; transform:translateX(-50%); white-space: nowrap; opacity: 0; transition:all 0.3s ease; z-index: 1;} .sert-list .sert-cell:hover .btn { opacity: 1;} /* vacancies */ .vacancy-block { border-top:1px solid var(--gray);} .vacancy-toggler { font-size: 2rem; line-height: 2.5rem; position: relative; padding:1.75rem 2.5rem 1.75rem 0; margin: 0; cursor: pointer;} .vacancy-toggler:after { content:'–'; display: block; position: absolute; right:0; top:1.75rem; width: 2.5rem; text-align: center; font-family: Arial;} .vacancy-toggler.collapsed:after { content:'+';} .vacancy-wrapper { display: flex; flex-wrap:wrap; justify-content: space-between; padding-top: 1rem; padding-bottom: 1.5rem;} .vacancy-wrapper h2 { font-size: 2rem; line-height: 2.5rem;} .vacancy-wrapper h3 { font-size: 1.5rem; line-height: 2rem;} .vacancy-wrapper h4 { font-size: 1.35rem; line-height: 1.5rem;} .vacancy-content { width: calc(100% - 19rem); flex:0 0 calc(100% - 19rem); margin-bottom: 0;} .vacancy-column { width: 17.5rem; flex:0 0 17.5rem;} .vacancy-contacts { border:1px solid var(--gray); font-size: 1rem; padding: 1.75rem 1.875rem 2rem; margin-bottom: 1.5rem;} .vacancy-contacts-title { font-weight:bold; margin-bottom: 1rem;} .vacancy-contacts a { text-decoration: underline;} /* contacts */ .map-wrapper { max-width: 640px; margin-left: auto;} #contact_map { height: 535px; width:100%;} .map-info { padding-top: 0.875rem;} .map-info-row { margin-top: 1rem; font-size: 0.875rem; line-height: 1.375rem; text-transform: uppercase; text-align: right;} .map-info-row svg { height: 1.125rem; width:auto; vertical-align: top; margin: 0.125rem; color:var(--blue);} .map-info-row svg path { fill:currentColor;} .map-info-row .info-circle { display: inline-block; width:1.375rem; height: 1.375rem; line-height: 1.25rem; background: var(--blue); color:#fff; border-radius: 50%; text-align: center; font-weight: bold;} .contacts-box { font-size: 1.375rem; margin-bottom: 1.875rem;} .contacts-box .icon { width: 4.375rem; height: 4.375rem; flex-shrink: 0; border:1px solid var(--gray); border-radius: 50%; margin-right: 1.25rem; display: flex; align-items:center; justify-content: center; font-size: 2rem; color:var(--primary);} .contacts-box .cb-label { font-size: 1rem; font-weight: bold; color:#9FA9B1; margin-bottom: 0.3125rem;} .contacts-buttons { margin-top: 2.5rem;} .contacts-buttons .btn { margin-right: 1rem;} .contact-addresses { margin-top:6.25rem;} .address-item { border:1px solid var(--gray); height: calc(100% + 1px); margin: -1px 0 0 -1px; padding: 2.5rem; font-size: 1rem;} .address-item .caption { font-size: 1.125rem; font-weight: bold; margin-bottom: 1.875rem;} .address-item .meta-row { margin-bottom: 1rem;} .address-item > :last-child { margin-bottom: 0;} .address-item .meta-row .ico { display: block; flex-shrink: 0; width: 1.375rem; font-size: 1.375rem; line-height:1.6rem; color:var(--primary); margin-right: 0.625rem;} .address-item .meta-row a:hover, .contacts-box a:hover { color:var(--primary);} .route-button { margin-top: 1rem; margin-right: auto;} .route-button .btn { padding-left: 1.5rem; padding-right: 1.5rem;} .map-level-0 { column-count:2;} .map-level-1>li { display: inline-block; width: 100%;} /* form */ .form-group { margin-bottom: 1rem;} .form-group.input-with-icon { position: relative;} .form-label { font-size: 0.8125rem; font-weight: bold; color:#9FA9B1; margin: 0;} .form-control { font-size: 1.125rem; line-height: 1.8125rem; padding: 1.0625rem 1.5rem; min-height: calc(3.9375rem + 2px); color:var(--text); border:1px solid var(--gray);} .form-control-sm { font-size: 1rem; line-height:1.625rem; padding: 0.625rem 0.875rem 0.5rem; min-height: calc(2.75rem + 2px);} textarea { height:6.125rem;} .input-with-icon .form-control { padding-left: 3.875rem;} .input-with-icon .form-control-sm { padding-left: 3.125rem;} .input-with-icon .ico { display: block; position: absolute; font-size: 1.5rem; width:1.5rem; height: 1.5rem; left:1.5rem; top:1.25rem; color:var(--primary);} .input-with-icon .ico-sm { font-size: 1.25rem; width:1.25rem; height: 1.25rem; left:1rem; top:0.8125rem;} .form-check-label { font-size: 0.875rem;} .form-check-label a { text-decoration: underline;} .form-check-label a:hover { color:var(--primary);} .form-check-input { width: 1.125rem; height: 1.125rem; top:0.125rem; border-radius: 3px; border:1px solid var(--primary);} .form-check-input:checked { background-color:var(--primary); border-color:var(--primary);} .form-check-input:checked[type="checkbox"] { background-image: url(/bitrix/templates/petmen/images/checkbox.svg); background-size:contain;} .cpt-group, [name="cpt"] { display: none !important;} .submit-row { position: relative; margin-top: 1.25rem;} .submit-row:last-child { margin-bottom: 0;} .submit-row .btn { width: 100%;} .submit-row .spinner-border { position: absolute; left:0.75rem; top:1rem;} .submit-row .spinner-border-sm { width: 1.5rem; height: 1.5rem; top:0.6875rem;} .form-policy { font-size: 0.875rem; color:rgba(var(--text-rgb), 0.6); text-align: center; margin: 0.625rem 0 0;} .form-policy a { text-decoration: underline;} .form-policy a:hover { color:var(--primary);} .form-control.error { border-color:red;} label.error { display: block; color:red; font-size: 0.875rem; margin-top: 3px;} /* consult section */ .consult-section { background:var(--blue) url(/bitrix/templates/petmen/images/form-bg.jpg) no-repeat center center; background-size:cover; position: relative; padding: 9.375rem 0; color:#fff;} .consult-text { width: 45%;} .consult-text h2 { margin-bottom: 3.125rem;} .check-list { list-style: none; padding: 0;} .check-list li { position: relative; padding:0.1875rem 0 0.1875rem 3.125rem; margin-bottom: 1.25rem;} .check-list li:before { content:'\e90d'; font-family: 'icomoon'; display: block; position: absolute; left:0; top:0; width:2.1875rem; height: 2.1875rem; line-height: 2.1875rem; text-align: center; background: var(--text); color:var(--primary); border-radius: 50%;} .consult-text .check-list, .consult-text .check-list li:last-child { margin-bottom: 0;} .consult-form { width: 40%;} .consult-form .form-control { border-color:transparent;} .consult-form .submit-row { margin-top: 1.5rem; margin-bottom: 0.625rem;} .consult-form .submit-row .spinner-border { left:1rem;} .consult-form .form-policy { color: rgba(255,255,255,0.6);} .consult-form .form-policy a:hover { color:#fff;} #policy_message { display: flex; flex-direction: row; align-items: center; position: fixed; left: 2.5%; bottom: 50px; width: 526px; max-width: 95%; background: #f7f5fc; border-radius:4px; z-index: 180; padding: 20px 20px 20px 24px; font-size: 16px; line-height: 20px; font-weight: 400;} #policy_message svg { display: block; width: 32px; height: 32px; margin-right: 16px; flex-shrink: 0;} #policy_message .message-part a { text-decoration: underline;} #policy_message .policy-close { margin-left: 20px; min-width: 60px; padding-left: 10px; padding-right: 10px; text-align: center; text-transform: uppercase;} /* footer */ .page-footer { background: var(--text); color:#fff; padding:6.25rem 0;} .footer-logo { width: 12.375rem;} .footer-contacts { margin-top: 3.125rem; max-width: 20rem;} .footer-contacts .contact-item + .contact-item { margin-top:1rem;} .footer-navi .menu-title { font-weight: bold; margin-bottom: 1.5rem;} .footer-menu { list-style: none; margin: 0; padding: 0;} .footer-menu li { font-size: 1rem;} .footer-menu li+li { margin-top: 1rem;} .footer-menu li a:hover { color:var(--primary);} .footer-menu.footer-links li a { color:#87939E; text-decoration: underline;} .footer-menu.footer-links li a:hover { color:#fff;} .copyright { margin-top: 2.5rem; font-size: 0.875rem; color:#87939E;} /* modal */ .modal-backdrop { background:var(--text);} .modal-backdrop.show { opacity: 0.8;} .modal-content { border:none; border-radius:0.25rem;} .modal-body { padding:3.75rem;} .modal-title { font-size: 1.625rem; line-height: 2.125rem; font-weight: bold; text-align: center; margin: 0 0 2.5rem;} .modal-close { display: block; position: absolute; top:0.625rem; right:0.625rem; width: 1.5rem; height: 1.5rem; line-height: 1.5rem; text-align: center; font-size: 0.875rem; color:#ABB4BB; cursor: pointer;} .modal-close:hover { color:var(--primary);} @media screen and (min-width: 768px) { .modal .modal-dialog { max-width: 640px;} .modal-callback .modal-dialog { max-width: 420px;} .modal-contact .submit-row .btn { width: auto; padding-left: 3rem; padding-right: 3rem;} } .modal-contact .form-group { margin-bottom: 1.25rem;} .modal-contact .form-group.submit-row { margin-bottom: 0;} .modal-success .modal-dialog { max-width: 320px;} .modal-success .modal-body { text-align: center;} .modal-success .modal-title { margin-bottom: 1.25rem;} .modal-success .title-check { display: flex; align-items: center; justify-content: center; width: 7.5rem; height: 7.5rem; font-size:2.75rem; border-radius: 50%; color:var(--primary); border:1px solid var(--primary); margin: 0 auto 2.5rem;} .modal-success .modal-body > :last-child { margin-bottom: 0;} .fancybox-container .fancybox-bg { background: #fff;} .fancybox-container.fancybox-is-open .fancybox-bg { opacity: 1;} .fancybox-navigation .fancybox-button { background: none;} .fancybox-navigation .fancybox-button>div { padding: 3px;} .fancybox-navigation .fancybox-button>div:before { content:'\e902'; font-family: 'icomoon'; font-size: 2rem; line-height: 2rem; color:var(--text);} .fancybox-navigation .fancybox-button svg { display: none;} .fancybox-navigation .fancybox-button--arrow_left>div { transform:rotate(-180deg);} .fancybox-toolbar .fancybox-button { background: rgba(var(--text-rgb), 0.6);} .fancybox-toolbar .fancybox-button, .fancybox-toolbar .fancybox-button:link, .fancybox-toolbar .fancybox-button:visited { color:#fff;} @media screen and (min-width: 992px){ #navi .navi-inner { padding: 0; width: auto; height: auto; max-width: none;} .main-menu li:hover>.sub-menu { display: block;} .bx-filter .bx-filter-section { display: block !important;} .bx-filter .bx-filter-button-box { display: none;} .bx-filter-button-box .bx-filter-parameters-box-container .btn { font-size:0.875rem; line-height: 1.375rem; padding-left: 0.25rem; padding-right: 0.25rem;} .fancybox-navigation .fancybox-button.fancybox-button--arrow_left { width: 90px; padding-left: 26px;} .fancybox-navigation .fancybox-button.fancybox-button--arrow_right { width: 90px; padding-right: 26px;} .modal-contact .modal-title { text-align: left;} } @media screen and (min-width: 1200px){ .col-xl-20 { width: 20%;} .col-xl-80 { width: 80%;} .product-summary-col { padding-left: 2rem;} } @media screen and (min-width: 992px) and (max-width: 1199px) { html { font-size: 14px;} .header-contact-item { margin-left: 1rem;} .main-menu>li+li { margin-left: 1rem;} .palitra-info .caption { font-size: 1.25rem; line-height: 1.625rem;} } @media screen and (max-width: 1470px) { .bx-filter .bx-filter-parameters-box, .bx-filter .bx-filter-button-box { padding-left: 1rem; padding-right: 1rem;} .home-achievements .achievements-block { row-gap:1.875rem;} .home-achievements .achievement-item .caption { font-size: 5rem; line-height: 5.875rem;} .home-slogan ul { font-size: 3.5rem; line-height: 4.25rem;} } @media screen and (max-width: 1360px) { .home-text h2 { font-size: 2.5rem; line-height: 3rem;} .home-slogan { padding-top: 21.75rem; margin-top: -12.5rem;} .home-slogan ul { font-size: 3rem; line-height: 3.5rem;} .about-photo .photo-slogan { font-size: 2.25rem;} .palitra-info { width:calc(100% - 15rem);} } @media screen and (max-width: 1199px) { .row.g-50 { --bs-gutter-x: 3.75rem;} .section { padding: 4.25rem 0;} [class*="col-md-4"]:nth-child(n+4) .product-item { border-top:none;} [class*="col-xl-3"]:nth-child(4n+1) .product-item { border-left:none;} [class*="col-md-4"]:nth-child(3n+1) .product-item { border-left:1px solid var(--gray);} .home-about-block { --dot-size: 8px;} .clients-block { padding-bottom: 4.25rem;} .achievements-block .achievement-item { padding: 2.5rem;} .achievement-item .caption, .home-achievements .achievement-item .caption { font-size: 4rem; line-height: 4.75rem;} .sertificates-block { --dot-size:8px; padding: 2.5rem 0;} .home-sert-right { padding-top: 4%; padding-bottom: 4%;} .home-sert-right:after { transform:translateX(-50%) scale(0.75);} .home-sert-left .dots-top-left, .home-sert-left .dots-top-right { top: calc(2.5rem - var(--dot-size) * 4);} .home-sert-left .dots-bottom-left, .home-sert-left .dots-bottom-right { bottom: calc(2.5rem - var(--dot-size) * 2);} .home-sert-left .dots-top-left .dots-line-1 { width: calc(var(--dot-size) * 3);} .home-sert-left .dots-top-left .dots-line-2 { width: calc(var(--dot-size) * 5);} .home-slogan { padding-top: 18.75rem; margin-top: -10rem;} .home-slogan ul { font-size: 2.75rem; line-height: 3.25rem;} .about-photo { --dot-size:8px;} .about-photo .photo-slogan { font-size: 2rem;} .advantages-list .advantage-item { font-size: 1.125rem; line-height: 1.8125rem;} } @media screen and (max-width: 991px) { body { font-size: 1rem;} h1, h2, h3, h4, h5, h6 { margin-bottom:1.625rem;} h1, h2 { font-size:2rem; line-height: 2.625rem;} h3 { font-size: 1.75rem; line-height: 2.25rem;} .page-heading, .page-title { margin-bottom:2rem;} .jcarousel-prev, .jcarousel-next { width: 2.5rem; height: 2.5rem; line-height: calc(2.52rem - 1px); font-size: 1rem;} #wrapper { padding-top: 3.75rem;} #content-wrapper { padding: 2.5rem 0;} .page-catalog #content-wrapper { padding-top: 2.5rem;} #header { position: fixed; top:0; left:0; width: 100%; z-index: 200;} #bx-panel { position: fixed !important; left:0; top:0; width: 100% !important;} #bx-panel ~ #wrapper { padding-top: calc(3.75rem + 39px);} #bx-panel ~ #wrapper #header { top:39px;} .page-header>.container { height: 3.75rem;} .header-logo { width: 8.75rem;} .header-contacts { margin-top: 2.5rem;} .header-contacts .contact-item { margin-left: 0;} .header-contacts .contact-item + .contact-item { margin-top: 1rem;} .header-button { text-align: center; margin-top: 2.5rem;} .header-button .btn { width: 100%; max-width: 25rem;} .header-dropdown { padding-bottom:0; margin-bottom:0;} .header-dropdown .dropdown-single { padding-right: 0;} .header-dropdown .dropdown-single:after, .header-dropdown:hover .dropdown-box { display: none;} #navi { display: block !important; visibility: hidden; position: fixed; width: 100%; top:3.75rem; bottom:0; left:0; height: 0 !important; overflow: hidden; background: var(--text); border-top:1px solid #34485A; transition: height 0.3s ease; z-index: 200;} #navi.collapsing { visibility: visible;} #navi.collapse-show, #navi.show { visibility: visible; height:calc(100vh - 3.75rem) !important;} #bx-panel ~ #wrapper #navi { top:calc(3.75rem + 39px);} #bx-panel ~ #wrapper #navi.collapse-show, #bx-panel ~ #wrapper #navi.show { height:calc(100vh - 3.75rem - 39px) !important;} .navi-inner { padding-bottom: 2.5rem; height: 100%; overflow: auto;} .navi-inner.container { padding-left: 1rem; padding-right: 1rem;} .main-menu>li { border-bottom:1px solid #34485A;} .main-menu>li+li { margin-left:0;} .main-menu>li>a { position: relative; font-size: 1.125rem; line-height: 1.75rem; padding: 1.25rem 0; border:none;} .main-menu li.parent>a { padding-right: 1.75rem;} .main-menu li.parent>a .menu-arrow { display: block; position: absolute; right:0; width: 1.5rem; height: 1.5rem; line-height: 1.5rem; top:50%; right:0; font-size: 0.75rem; margin:-0.75rem 0 0; transform:rotate(0); transition:all 0.2s ease;} .main-menu li .sub-menu { position: relative; border-top:1px solid #34485A; left:auto; top:auto; background:none; padding:0.625rem 0 0.625rem 1.25rem; margin: 0; border-radius: 0;} .main-menu li .sub-menu .sub-menu { left:auto; top:auto; border-radius: 0;} .main-menu .sub-menu li a { border:none; padding: 0.625rem 0; white-space: normal; border-radius: 0 !important;} .main-menu .sub-menu li.parent>a { padding-right: 1.75rem;} .main-menu .sub-menu li.parent>a .menu-arrow { margin:-0.75rem 0 0; right:0; transform:rotate(0);} .main-menu li.parent.opened>a .menu-arrow, .main-menu .sub-menu li.parent.opened>a .menu-arrow { transform:rotate(-180deg);} p, .entry-content p { margin-bottom: 1.625rem;} .category-title, .product-single-title { font-size: 1.75rem; line-height: 2.25rem; margin-bottom: 1.875rem;} .catalog-section { margin-bottom: 2.5rem;} .bx-sidebar-filter { border:none; border-radius: 0;} .bx-sidebar-filter .bx_sitemap { display:none;} .bx-filter .bx-filter-section { display: none; position: fixed; top:0; left:0; width: 100%; height: 100%; padding: 0; overflow: hidden; z-index: 999;} .bx-filter-section .filter-head { background: var(--text); color:#fff; font-size: 1.25rem; line-height:1.625rem; font-weight: bold; padding: 1.0625rem 1.25rem; height:3.75rem;} .bx-filter-section .filter-head .ico { font-size: 1.125rem; margin-right: 1.125rem;} .bx-filter-section .smartfilter { height: calc(100vh - 3.75rem); overflow: auto;} .bx-filter-section .smartfilter>.row { margin-left: 0; margin-right: 0;} .bx-filter .bx-filter-parameters-box-title { margin-bottom: 1rem;} .bx-filter-parameters-box-container .checkbox { padding: 0.625rem 0;} .btn-filters-more { margin-top: 1rem;} .product-item-detail-slider-container { padding: 1rem;} .product-item-detail-slider-left, .product-item-detail-slider-right { display: block;} .product-item-detail-slider-left { left:-1rem;} .product-item-detail-slider-right { right:-1rem;} .product-item-detail-slider-controls-block { padding: 0; margin-top: 1rem;} .product-item-detail-slider-controls-image { display: block; width:15px; height:15px; padding:5px; border:none;} .product-item-detail-slider-controls-image img { display: none;} .product-item-detail-slider-controls-image:before { content:''; display: block; width: 5px; height: 5px; border-radius: 50%; background: #CFD4D8;} .product-item-detail-slider-controls-image.active:before, .product-item-detail-slider-controls-image:hover:before { background:var(--primary);} .product-images-carousel ul { left:auto !important; top:auto !important;} .product-single-title { margin-bottom: 1.5rem;} .request-popup { height: 0;} .request-button-wrapper { position: relative; height: 4.9375rem; z-index: 10;} .request-button-wrapper .btn { width: 100%; padding-top: 0.75rem; padding-bottom: 0.75rem;} .request-button-wrapper.active { position: fixed; bottom:0; z-index: 150;} .product-item-detail-tabs-container { border:none; margin-top: 1.5rem;} .product-item-detail-tab { margin-right: 0.625rem;} .product-item-detail-tab-link { color:var(--text); border:1px solid var(--text); border-radius: 3px; padding: 0.25rem 0.75rem;} .product-item-detail-tab-link:hover, .product-item-detail-tab.active .product-item-detail-tab-link { color:#fff; background: var(--text);} .product-item-detail-tab-link:after { display: none;} .product-tab-containers { margin-bottom: 3.125rem;} .product-item-detail-properties { font-size:0.875rem;} .product-item-detail-properties:first-child { border-top:1px solid var(--gray); padding-top: 0.625rem;} .related-carousel { margin-bottom: 1.5rem;} .carousel-head .jcarousel-prev, .carousel-head .jcarousel-next { display: none;} .section-palitra { padding:1.875rem; margin-bottom: 3.125rem;} .colors-block { margin-bottom: 2.75rem;} .palitra-info { width: auto;} .samples-box { padding: 1.875rem;} .samples-box .samples-title { font-size: 1.75rem;} .home-top-section { margin-bottom: 2.25rem;} .home-top-inner { padding:2rem 0 3rem;} .home-top-section h1 { font-size: 2.375rem; line-height:3.125rem; max-width: 22rem;} .home-top-section .home-advantages { margin-top: 1rem;} .home-advantage-item { font-size:1rem; margin-top: 1.5rem;} .home-top-buttons { margin-top:2.5rem;} .home-top-section .section-arrow-border, .home-top-section .section-arrow { border-width:0 1.875rem 1.875rem 1.875rem;} .home-top-section .section-arrow .ico { top:0.875rem;} .section { padding: 2.25rem 0;} .section-head { text-align: left; margin-bottom: 1.875rem;} .section-title { text-align: left; margin-bottom:1.5rem;} .section-head .section-subtitle { margin-top: 1.5rem;} .home-cats-section .section-head { max-width: none; margin: 0 0 1.875rem;} .home-cat-item { height: auto; margin-bottom: 0.625rem;} .home-cat-item .img-wrap { width:40%; padding:1.875rem 0; display: flex; align-items: center; border-bottom:1px solid var(--primary); border-right:none;} .home-cat-item .item-entry { width: 60%; padding: 1.5rem; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; text-align: left;} .home-cat-item .btn-more { margin-top: 1.25rem; font-size: 0.875rem; line-height: 1.375rem; padding:0.375rem 1.125rem;} .home-cat-item .btn-more .ico { font-size: 0.625rem; margin-left: 0.75rem;} .home-about-block { --dot-size: 10px; position: relative; background: var(--blue); border-radius: 3px; margin: calc(var(--dot-size) * 4) 0;} .home-about-left { display: block; position: static; width:auto; padding: 2.5rem 0 0;} .home-about-image { width:auto; position: static; flex-shrink: 1; margin-left: calc(var(--dot-size) * -3); margin-right: calc(var(--dot-size) * -3);} .home-about-image img { border-radius: 0; position: relative; z-index: 2;} .home-about-image .dots { right:auto; left:50%; transform:translateX(-50%);} .home-about-image .dots-top .dots-line { margin-left: 0; margin-right: auto;} .home-about-image .dots-top .dots-line-1, .home-about-image .dots-bottom .dots-line-1 { width: calc(var(--dot-size) * 11);} .home-about-image .dots-top .dots-line-2, .home-about-image .dots-bottom .dots-line-2 { width: calc(var(--dot-size) * 43);} .home-about-image .dots-top .dots-line-3 { display: none;} .home-about-image .dots-sizes { top:0; right:0; left:0; width: 100%; transform: none;} .home-about-image .dots-sizes .dots-line { display: block; position: absolute; top:1.25rem; margin: 0; width:var(--dot-size); height:calc(var(--dot-size) * 65);} .home-about-image .dots-sizes .dots-line-1 { left:calc(var(--dot-size) * -2)} .home-about-image .dots-sizes .dots-line-2 { right:calc(var(--dot-size) * -2)} .home-about-right { width:auto; background: none;} .home-about-right:before, .home-about-right:after { display: none;} .home-about-text { padding: 1.875rem;} .home-text h2 { font-size: 1.75rem; line-height: 2.125rem; margin-bottom: 1.875rem;} .home-text .btn { margin-top: 0.25rem; font-size: 1rem; line-height:1.625rem; padding: 0.75rem 1.25rem;} .clients-block { padding-bottom: 2.25rem;} .clients-block { border-top:0.25rem;} .clients-list .col-md-4:nth-child(3n+1) .client-item { border-left:none;} .clients-list .col-md-4:nth-child(n+4) .client-item { border-top:1px solid var(--gray);} .achievements-block .achievement-item { padding: 1.5rem;} .achievement-item .caption, .home-achievements .achievement-item .caption { font-size: 2.75rem; line-height: 3.25rem;} .sertificates-block { --dot-size: 10px; padding: 0 0 calc(var(--dot-size) * 5);} .home-sert-left { display: block; position: relative; bottom:auto; left:auto; top:auto; width: auto; padding-bottom: 41%; overflow: hidden; z-index: 1;} .home-sert-image { display: block; position: absolute; top:0; background:none; left:calc(var(--dot-size) * 6); right:calc(var(--dot-size) * 6);} .home-sert-image img { max-height: none; width: 100%;} .home-sert-right { padding:3.125rem 1.875rem; z-index: 2;} .home-sert-text { padding-left:0;} .home-sert-text .sert-icon, .home-sert-right:after { display: none;} .home-sert-left .dots-top-left, .home-sert-left .dots-top-right { top:auto; bottom: var(--dot-size); flex-direction: row;} .home-sert-left .dots-top-left { right:auto; left:calc(var(--dot-size) * -4);} .home-sert-left .dots-top-right { left:auto; right:calc(var(--dot-size) * -4);} .home-sert-left .dots-top-left .dots-line { margin-left:0; margin-right:var(--dot-size);} .home-sert-left .dots-top-right .dots-line { margin-right:0; margin-left:var(--dot-size);} .home-sert-left .dots-top-left .dots-line, .home-sert-left .dots-top-right .dots-line { width:var(--dot-size); margin-bottom:0; margin-top: auto;} .home-sert-left .dots-top-left .dots-line-1 { height: calc(var(--dot-size) * 7);} .home-sert-left .dots-top-left .dots-line-2 { height: calc(var(--dot-size) * 11);} .home-sert-left .dots-top-right .dots-line-1 { height: calc(var(--dot-size) * 21);} .home-sert-left .dots-top-right .dots-line-2 { height: calc(var(--dot-size) * 17);} .section.home-production { padding-bottom: 2.25rem;} .production-text { width: auto; margin-bottom: 1.875rem;} .production-photos .photos-list img { width: 100%; margin-bottom: 1rem;} .production-photos .btn { position: relative; right:auto; bottom:auto; margin-top: 1.5rem; font-size: 1rem; line-height: 1.625rem; padding: 0.75rem 1.25rem;} .home-slogan { margin-top: 2.25rem; padding: 3.125rem;} .home-slogan ul { display: block; text-align: center; font-size: 2.5rem; line-height: 3.25rem; border:none; padding:0;} .home-slogan ul li { padding: 0;} .home-slogan ul li + li { padding-top: 3.75rem;} .home-slogan ul li:before { font-size:1.25rem; left:50%; top:1.875rem; transform:translate(-50%,-50%) rotate(90deg);} .home-slogan ul li:first-child:before, .home-slogan ul li:last-child:after { display: none;} .section.section-about { padding-bottom:2.5rem;} .about-photo, .about-video { margin-bottom:2.5rem;} .advantages-list [class^="col-"]:nth-child(2n+1) .advantage-item { border-left:none;} .advantages-list [class^="col-"]:nth-child(n+3) .advantage-item { border-top:1px solid var(--gray);} .section.section-about-video { padding:2.5rem; margin-bottom: 2.5rem;} .section-about-video h2 { font-size:1.75rem; line-height: 2.25rem; margin-bottom:1.625rem;} .section-about-video .dots { display: none;} .row.gallery-list, .row.news-list { margin-bottom: 1.875rem;} .more-pagination { margin-bottom: 1.875rem;} .sert-list .sert-cell .btn { opacity: 1; transform:translateX(-50%) scale(0.8);} .map-wrapper { max-width:none; margin-left: 0; margin-top: 2.5rem;} /*#contact_map { height: 340px;}*/ .map-info-row { text-align: left;} .contacts-box { font-size: 1.25rem; margin-bottom: 1.5rem;} .contacts-box .icon { width: 3.75rem; height: 3.75rem; margin-right: 1rem; font-size:1.6875rem;} .contacts-box .cb-label { font-size: 0.875rem;} .contacts-buttons { margin-top: 1rem;} .contacts-buttons .btn { font-size: 1rem; line-height: 1.6rem;} .contact-addresses { margin-top:2.5rem;} .address-item { border:none; height:auto; margin:0; padding: 1.875rem 0; font-size: 1rem;} .contact-addresses .col-lg-4 + .col-lg-4 .address-item { border-top:1px solid var(--gray);} .consult-section { padding: 2rem 0;} .consult-text, .consult-form { width:100%; padding: 1.25rem 0;} .consult-text h2 { font-size: 1.75rem; line-height: 2.25rem; margin-bottom: 2.25rem;} .check-list li { padding:0.125rem 0 0.125rem 2.75rem; margin-bottom: 1rem;} .check-list li:before { width:1.875rem; height: 1.875rem; line-height: 1.875rem;} .consult-form .form-group { margin-bottom: 0.625rem} .consult-form .submit-row { margin-top: 1.25rem;} .page-footer { padding: 4.375rem 0;} .footer-contacts { margin-top: 2.5rem;} .footer-menu-col { margin-top: 3.125rem;} .page-footer.padding-large { padding-bottom: 6.25rem;} } @media screen and (max-width: 767px) { .row.g-50 { --bs-gutter-x: 2rem;} [class*="col-6"]:nth-child(n+3) .product-item { border-top:none;} [class*="col-md-4"]:nth-child(3n+1) .product-item { border-left:none;} [class*="col-6"]:nth-child(2n+1) .product-item { border-left:1px solid var(--gray);} .gallery-list .gallery-cell { margin-bottom:15px;} .clients-list .col-6:nth-child(3n+1) .client-item { border-left:1px solid var(--gray);} .clients-list .col-6:nth-child(2n+1) .client-item { border-left:none;} .clients-list .col-6:nth-child(n+3) .client-item { border-top:1px solid var(--gray);} .achievements-block { border:none;} .home-achievements .achievements-block { row-gap:0;} .achievements-block .achievement-item, .home-achievements .achievements-block .achievement-item { padding: 1.5rem 0;} .achievements-block [class^="col-"]:first-child .achievement-item, .home-achievements .achievements-block [class^="col-"]:first-child .achievement-item { padding-top: 0;} .achievements-block [class^="col-"]:last-child .achievement-item, .home-achievements .achievements-block [class^="col-"]:last-child .achievement-item { padding-bottom: 0;} .achievements-block [class^="col-"] .achievement-item { border-left:none;} .achievements-block [class^="col-"]:nth-child(n+2) .achievement-item, .home-achievements [class^="col-"]:nth-child(n+2) .achievement-item { border-top:1px solid var(--gray);} .home-about-block, .sertificates-block { --dot-size: 8px;} .home-text .btn, .production-photos .btn { width: 100%;} .advantages-list { border:none;} .advantage-item .icon { width:5rem; height:5rem; margin: 0 1.25rem 0 0; padding: 0.6875rem; flex-shrink: 0;} .advantage-item .icon svg { width:3.625rem; height:3.625rem;} .advantages-list .advantage-item { border:none !important; display: flex; align-items: center; height: auto; text-align: left; padding:0.75rem 0; font-size: 1rem; line-height: 1.625rem;} .map-info-rows { width: 100%;} .news-list .news-item, .news-detail-image { margin-bottom: 1.5rem;} .video-wrap .play { width: 3.75rem; height: 3.75rem;} .vacancy-content, .vacancy-column { width:100%; flex:0 0 100%;} #policy_message { bottom:25px;} .footer-logo { width: 11rem;} .modal-dialog { margin: 0; width: 100%; max-width: none; min-height: 100%; flex-direction: column;} .modal-content { flex: 1 1 100%; width: 100%; height: 100%; border-radius: 0; justify-content: center; overflow: auto;} .modal-body { flex:0 0 auto;} .modal-title { margin: 1.875rem;} .modal-contact .form-group { margin-bottom: 0.625rem;} } @media screen and (max-width: 575px) { .catalog-section { margin-left: -1rem; margin-right: -1rem;} .product-item { border-left:none;} .product-item-detail-slider-container { max-width:none; border-width: 0 0 1px 0; margin-left: -1rem; margin-right: -1rem;} .related-carousel .carousel-overflow { margin-left: -1rem; margin-right: -1rem; padding-right: 0;} .home-about-block, .sertificates-block { --dot-size: 5px;} .about-photo { margin-left: -1rem; margin-right: -1rem;} .row.gallery-list [class^="col-"], .row.gallery-list [class*=" col-"] { padding-left:0; padding-right: 0;} .gallery-list .gallery-cell { margin-bottom:1rem;} .row.sert-list { --bs-gutter-x: 0.625rem;} .row.sert-list .sert-cell { margin-bottom: 0.625rem;} .contacts-buttons { flex-direction: column;} .contacts-buttons .btn { width: 100%; margin-right: 0; margin-bottom: 0.625rem;} .map-wrapper { margin-left: -1rem; margin-right: -1rem; margin-top: 1.875rem;} .map-info { padding-left: 1rem; padding-right: 1rem;} .footer-logo { width: 11rem;} .modal-dialog { margin: 0; width: 100%; max-width: none; min-height: 100%; flex-direction: column;} .modal-content { flex: 1 1 100%; width: 100%; height: 100%; border-radius: 0; justify-content: center; overflow: auto;} .modal-body { flex:0 0 auto;} } @media screen and (max-width: 479px) { .product-item { padding: 1rem;} .product-item-image-wrapper, .product-item-title, .product-item-info-container { margin-bottom: 1rem;} .product-item-title a { font-size: 1rem;} .product-item-button-container .btn { font-size: 0.875rem; line-height: 1.375rem; padding: 0.25rem 0.75rem;} .product-item-button-container .btn .ico { font-size: 0.5rem; margin-left: 0.5rem;} .about-photo { --dot-size:5px;} .about-photo .photo-slogan { font-size: 1.5rem;} .section.section-about-video { padding:1.75rem;} .sert-list .sert-cell .btn { transform:translateX(-50%) scale(0.65);} .modal-body { padding-left: 1.25rem; padding-right: 1.25rem;} } @media screen and (min-width: 420px) and (max-width: 575px) { .home-about-image .dots-top .dots-line-1, .home-about-image .dots-bottom .dots-line-1 { width: calc(var(--dot-size) * 21);} .home-about-image .dots-top .dots-line-2, .home-about-image .dots-bottom .dots-line-2 { width: calc(var(--dot-size) * 61);} .home-about-image .dots-sizes .dots-line { height:calc(var(--dot-size) * 91);} .home-sert-right .dots-bottom .dots-line-1 { width: calc(var(--dot-size) * 65);} .home-sert-right .dots-bottom .dots-line-2 { width: calc(var(--dot-size) * 17);} } @media screen and (max-width: 359px) { .sert-list .sert-cell .btn { transform:translateX(-50%) scale(0.5);} } /* End */ /* /bitrix/templates/petmen/css/jquery.fancybox.min.css?169763274512795 */ /* /bitrix/templates/petmen/css/animate.css?169826819557114 */ /* /bitrix/templates/petmen/styles.css?174913298376847 */