@font-face {
    font-family: 'Gotham Pro';
    src: url('GothamPro.eot');
    src: local('Gotham Pro'), local('GothamPro'),
        url('../fonts/GothamPro.eot') format('embedded-opentype'),
        url('../fonts/GothamPro.bin') format('woff'),
        url('../fonts/GothamPro-1.bin') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('GothamPro-Bold.eot');
    src: local('Gotham Pro Bold'), local('GothamPro-Bold'),
        url('../fonts/GothamPro-Bold.eot') format('embedded-opentype'),
        url('../fonts/GothamPro-Bold.bin') format('woff'),
        url('../fonts/GothamPro-Bold-1.bin') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('GothamPro-Italic.eot');
    src: local('Gotham Pro Italic'), local('GothamPro-Italic'),
        url('../fonts/GothamPro-Italic.eot') format('embedded-opentype'),
        url('../fonts/GothamPro-Italic.bin') format('woff'),
        url('../fonts/GothamPro-Italic-1.bin') format('truetype');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('GothamPro-Black.eot');
    src: local('Gotham Pro Black'), local('GothamPro-Black'),
        url('../fonts/GothamPro-Black.eot') format('embedded-opentype'),
        url('../fonts/GothamPro-Black.bin') format('woff'),
        url('../fonts/GothamPro-Black-1.bin') format('truetype');
    font-weight: 900;
    font-style: normal;
}

.responsive,section{max-width:100%}
.btn,a{text-decoration:none}
.btn,button{cursor:pointer}
.btn:after,.icon-box{display:inline-block;position:relative}
.btn:after,.icon-box,section{position:relative}
.btn:after,.humburger:after,.humburger:before{content:''}
.close,.navigation,section{overflow:hidden}
.form-group input:focus,.humburger:focus,button:focus{outline:0}
html{font-size:15px}
body,html{width:100%;min-height:100%;margin:0;padding:0; background:#f3f3fb; color:#191726}
body,button{font:300 1rem/1.5 Gotham Pro, sans-serif}
button{border:0}
a{color:#8885e8;transition:all .3s ease-in; border-bottom:1px solid rgba(136, 133, 232)}
a:hover{color:#6661ff; border-bottom-color: #6661ff}
.btn,.navigation,.s-gallery-list img{transition:all .25s ease}
section{padding:4rem 0}
.btn{background:#fc7a23; font-size:1.2rem; color:#fff; padding:1rem 3rem; display:inline-block; border:0;border-radius:2px;font-weight:bold; box-shadow: 0 20px 50px rgba(254,146,36, .8)}
.btn:hover{ box-shadow: 0 22px 60px rgba(254,146,36, .8); transform:translateY(-2px); color:#fff;}
.icon{ width:24px; display: inline-block; height:24px; }
.btn .icon{fill:#fff; width:16px; height:16px; margin-right:20px;}
.container{padding:0 1rem;}
.title{font-weight: 900; color:#3425a1; text-transform: uppercase; text-align: center; margin-bottom:2em;  font-size: 1.6rem}
.sub-title{margin-top:-1.6rem; font-weight: 900; font-size: 1rem; text-align: center; text-transform: uppercase;}
h3.sub-title{color:#fc7a23; text-transform: uppercase;}


.top-panel{position: fixed; top:0; left:0; width:100%; padding:10px; z-index: 40; background: #3425a1;}
.top-panel.fixed{background: #3425a1;}
.cart-link{fill:#fff; border:none;}

.intro{background:no-repeat 50% 0; background-size: contain; position: relative; overflow: hidden;}
.intro:before, .intro:after{content:''; display: block; width:40%; height:100%; position: absolute; bottom:0; }
.intro:before{left:0; background:no-repeat 100% 100%;}
.intro:after{right:0;  background:no-repeat 0 100%;}

.intro-block{color:#eee; text-align: center;}
.intro-title{color:#fc7a23; font-size:1.8rem; line-height: 1.3; font-weight: 900; text-transform: uppercase;}
.intro-title span{display: block;}
.intro-text{font-size: 1.2rem; max-width:300px; margin:0 auto 2rem;}
.intro-hint{max-width: 320px; margin:0 auto;}
.intro-row{ min-height: 82vh;}


.s-feature{background: no-repeat 50% 0 #3124a0; background-size: cover; color:#fff;}
.s-feature .title{color:#fff;}
.s-feature .icon{width:42px; height:42px; fill:#ff632a; text-align: center; }
.r-feature{list-style: none; padding:0; margin:6rem auto 2rem; text-align: center;}
.r-feature p{margin:1rem 2rem 4rem;}
.cart-link{position: relative; display: inline-block; }
.cart-count{position: absolute; top:-2px; right:-18px; font-size: 12px; display: inline-block; background:#fc7a23; color:#fff; text-align: center; line-height: 18px; width:18px; height:18px; border-radius: 50%;}


.s-rating{background:#fc7a23; padding:0;}
.s-rating-image{margin-top:-6rem;}
.s-rating-image img{display: block; max-width: 100%;}
.s-offer h2{color:#fff; text-align: left; font-size: 1.4rem;}
.s-rating-text{font-weight: 900; font-size: 1.2rem; color:#fff;}
.s-rating-number{font-size: 2em;}
.s-rating-text{margin:2rem 0;}

.sizes-hint{text-align: center;}
.sizes-table{width:100%; border-collapse: collapse;}
.sizes-table td{padding:1rem; border:1px solid #eee;}
.sizes-title{margin-bottom:0; font-size: 2rem;}
.sizes-text{margin-top:0;}
.sizes-title, .sizes-text{text-align: center;}


.product-item img{max-width: 100%; display: block; transition: all .45s ease;}
.product-image-block{height: 140px; border:none; display: block; overflow: hidden;}
.product-image-block:hover img{transform: scale(1.2);}
.product-item.sales .product-image-block{background: rgba(0,0,0,1); display: block;}
.product-item.sales .product-image-block img{opacity: .6;}
.product-item.sales:hover img{transform: scale(1);}
.product-item{transition:all .45s ease; margin-bottom:1rem; position: relative; text-align: center; }
.product-item .quantity{ color:rgba(255,255,255,.5); z-index: 10; font-weight:900; text-transform: uppercase; font-size: 2rem; text-align: center; position: absolute; top:16%; left:0; width:100%; transform: rotate(-25deg); }
.product-item h3{margin-bottom:0; font-weight: 300;}
.product-item h4{margin-top:0; font-weight: 900; height:46px; margin-bottom:0;}
.product-item:hover{background:#fff;  box-shadow:0 10px 30px rgba(0, 0, 0, .2);}
.product-item.sales:hover{background:transparent; box-shadow:none;}
.product-item.sales .btn{display: none;}
.product-sale{background: #fc7a23; font-weight: bold; position: absolute; padding:4px 10px; color:#fff; z-index: 20;}
.product-btn, .close-popup{border:1px solid #3425a1; display: block; color:#3425a1; padding:8px 2rem 10px;  background: transparent; box-shadow:none; transition:all .45s ease;}
.product-item:hover .product-btn, .checkout , .checkout:hover, .close-popup:hover{box-shadow:0 10px 30px rgba(99, 81, 232, .2), 0 2px 0 #180e5f; background:#3425a1; color:#fff;  border:1px solid #3425a1; }
.product-price-block{margin-bottom:1rem;}
.product-price-block p{margin:0;}
.product-price{font-weight: 900;}
.product-price-old{position: relative; display: inline-block;}
.product-price-old:after{content:''; width:100%; height:2px; background:#fc7a23; position: absolute; top:50%; left:0; transform: rotate(10deg);}

.s-shop-footer{border:4px solid #fc7a23; max-width: 450px; margin:3rem auto 0; padding:1rem; font-weight: 900; font-size: 1.2rem; text-align: center; color:#fc7a23;}
.s-shop-title{text-transform: uppercase; text-align: center; font-size: 1.8rem; color:#3425a1;}

.s-delivery{background: no-repeat 50% 50%; background-size: contain;}

.s-gallery-list{list-style: none; padding:0;}
.s-gallery-list a{display: block; border-radius: 18px; overflow: hidden; margin-bottom:1rem; border:none;}
.s-gallery-list img{display: block; max-width: 100%;}
.s-gallery-list a:hover img{transform: scale(1.1)}

.s-reviews-list{padding:0; list-style: none;}
.s-reviews-list .content{max-width: 400px; margin:1rem auto; text-align: center;}
.s-reviews-list .auth{ color:#fc7a23; text-align: center; margin:4rem auto 2rem;}
.s-reviews-list .ava{ width:130px; height:130px; border-radius: 50%; margin:1rem auto;  position: relative;}
.s-reviews-list .ava:after{content:''; display: block; width:80%; border-radius: 50%; height:80%; position: absolute; bottom:10%; z-index: -1; left:10%; box-shadow: 0 20px 50px rgba(169,159,191,2);}
.s-reviews-list .ava img{ display: block; width:100%;  border-radius: 50%; border:10px solid #fff;}

.tovars{max-height:300px; margin:0 -2rem; overflow-y: auto; overflow-x: hidden;}
.cart_body .head p{padding:1rem;}
.itogo{text-align: right; font-weight: bold; font-size: 1.4rem;}
.popup_cart_buttons { margin-top:1rem;}
.popup_cart_buttons .btn{ padding:1rem;}
.tovar_image img{max-width: 100%;}
.tovar_quantity input{width:20px; text-align: center;}
.tovar_row{padding:5px 2rem; }
.tovar_row a{border:none; display: inline-block; padding:3px 5px;}
.tovar_row a:hover{color:#3425a1; background:#f3f3fb;}
.tovar_row .qty{padding:0 4px; display: inline-block; cursor:pointer;}
.tovar_suma{width:62px; white-space: nowrap;}
.tovar_name {min-width: 160px;}
.tovar_suma{text-align: right; visibility: hidden;}
.tovar_price{visibility: hidden;}
.tovars>div:nth-child(2n){ background:#f3f3fb;}

.s-delivery-list{padding:0; list-style: none;}
.s-delivery-list {margin:4rem 0;}
.s-delivery-list li{text-align: center; font-weight: bold; margin-bottom:1rem;}

.slick-arrow:before {
    display: block;
    content: ''
}
.slick-arrow {
    position: absolute;
    top: 50%; z-index: 10;
    background: 0 0;
    font-size: 0
}

.slick-arrow:before {
    width: 15px;
    height: 15px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg)
}

.slick-prev {
    left: 0
}

.slick-prev:before {
    border-left: 4px solid #d5d5de;
    border-bottom: 4px solid #d5d5de
}

.slick-next {
    right: 0
}

.slick-next:before {
    border-right: 4px solid #d5d5de;
    border-top: 4px solid #d5d5de
}
.slick-arrow:hover:before{border-color:#3425a1;}
.slick-dots{padding:0;  display:-webkit-box; display: -ms-flexbox; display:flex; max-width: 200px; list-style:none; margin:1rem auto; 
    -webkit-box-pack: justify;
    -ms-flex-pack: justify; justify-content: space-between;}



.slick-dots li button {
    font-size: 0;
    height: 12px;
    border-radius: 50%;
    width: 12px;
    display: block;
    margin: .5rem;
    background:#d5d5de
}

.slick-dots li.slick-active button {
    background: #fc7a23;
}

footer{background:no-repeat 50% 0; color:#fff; padding:6rem 1rem;}
footer .b-form{margin-top:20rem;}
.footer-buttons a{margin:1rem;}
.agreement{margin:2rem auto; text-align: center; font-size: 1rem; max-width:290px;}
.footer-copyright{margin-top:5rem; top:2rem; position: relative; text-align: center;}
.footer-contacts{max-width: 400px; margin:1rem auto;}
.footer-contacts p{ margin:0;}
.footer-phone{border-bottom: none; font-weight: bold;}
.whatsapp {color:#3fc63f; border-bottom-color:#3fc63f;}
.vk {border:none; padding:5px;}
.vk .icon{width:42px; height:42px; fill:#804b9b;}
.vk:hover .icon{fill:#fe3c8d;}

.form-group {
    position: relative;
    width: 220px;
    margin: 1rem auto 2rem
}

.form-group label {
    position: absolute;
    left: 0;
    bottom: .58rem;
    transition: all .25s ease;
    cursor: text
}

.form-group.focused label {
    font-size: 10px;
    transform: translateY(-1.5rem);
    color: #999
}

.form-group input {
    border: 0;
    width: 100%;
    margin-top: 1rem;
    border-bottom: 1px solid #999;
    padding: .6rem 0;
    background: 0 0
}

.form-group.focused input {
    border-color: #3425a1;
    box-shadow: 0 2px 0 #3425a1;
}

.form_btn{max-width: 300px; display: block; margin:1rem auto;}

.modal-title {
    font-weight: 300;
    font-size: 2rem;
    text-align: center;
}

.modal-text {
    font-weight: 300;
    font-size: 1.4rem; 
    text-align: center;
    font-weight: bold;
}

.close {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 24px;
    height: 24px;
    cursor: pointer
}

.close:hover::after,
.close:hover::before {
    background: #fc7a23;
}

.close::after,
.close::before {
    content: '';
    position: absolute;
    height: 2px;
    width: 100%;
    top: 50%;
    left: 0;
    margin-top: -1px;
    background: #c5c1c2
}

.close::before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg)
}

.close::after {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.close.hairline::after,
.close.hairline::before {
    height: 1px
}


.modal-box {
    background: #fff;
    box-shadow: 0 10px 50px rgba(0, 0, 0, .2);
    padding: 2rem;
    width: 100%;
    max-width: 500px;
    position: relative;
    z-index: 121;
}


.modal.active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center
}

.modal.active .modal-block { transform: scale(1, 1)}

.modal {
    position: fixed;
    z-index: 120;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255,.8);
}

.close, .modal-box { display: inline-block}

.offer-fix{position: fixed; left:1rem; bottom:0; background: no-repeat 0 50% #f3f3fb; padding:1rem; padding-left:120px; box-shadow:0 -20px 80px rgba(0,0,0,.1); z-index: 21;}
.offer-fix h3{margin-bottom:0;}
.offer-fix p{margin-top:0;}
.hide{opacity: 0;}

@media screen and (max-width:48em){
.sizes-table tbody{display: table-row;}
.sizes-table tr{display: table-cell; width:50%;}
.sizes-table td{display: block; border-bottom:0;}
.sizes-table tr:nth-child(1) td{border-right:0;}
.s-rating-image img{position: relative; left:15%;}
.title{margin:1rem; line-height: 1.4;}
.product-image-block{height:220px;}
.intro-text{margin-bottom:10px;}
h3.sub-title{margin-top:10px;}
.slick-arrow{margin-top:-15px;}
.popup_cart .head{display: none;}
.tovars{max-height:250px;}
.popup_cart_buttons .btn{padding:10px; display: block; width:100%; margin:5px 0 ;}
.itogo{padding-top:9px;}

}

@media screen and (min-width:48em){
.s-rating-image{margin-top:-4rem;}
.title{max-width: 600px; margin:1rem auto 2rem; font-size: 2rem}
.intro-title{font-size: 2.2rem; line-height: 1.2;}
.intro-text{max-width: 300px;}
.s-rating-text{font-size: 1.4rem;}
.s-rating{overflow: visible;}
.product-image-block{height: 140px;}
.intro-row{min-height:50vh;}
.intro:before{left:0; background:no-repeat 100% 100%;}
.intro:after{right:0;  background:no-repeat 0 100%;}
.intro{background:no-repeat 50% 0; background-size: contain;}
footer{background:no-repeat 50% 0 #33259d; color:#fff;}

}

@media screen and (min-width:64em){
.intro-row{ min-height: 90vh;}
.intro-title{font-size: 2.2rem; line-height: 1.2;}
.intro-text{max-width: 460px;}
.product-image-block{height: 180px;}
.s-rating-text{font-size: 2rem;}
.intro:before{left:0; background:no-repeat 100% 100%;}
.intro:after{right:0;  background:no-repeat 0 100%;}
footer{background:no-repeat 50% 0 #33259d; color:#fff;}
.intro-text{margin:0 auto 8rem;}
.s-feature{background: no-repeat 50% 100%;}

}

@media screen and (min-width:100em){
.s-rating-image{margin-top:-12rem;}
.title{font-size: 3rem; line-height:1.2; white-space: pre-line;}
h3.sub-title{font-size: 1.4rem;}
.intro{background: no-repeat 50% 0;}
.intro-title{font-size: 4rem; line-height: 1.2;}
.intro-text{font-size: 2rem; line-height: 1.2;}

}



.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.intro-title .animated {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}
.intro-text .animated {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
}

.intro:before, .intro:after{
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.intro:before{
      -webkit-animation-name: cross_left;
  animation-name: cross_left;
}
.intro:after{
      -webkit-animation-name: cross_right;
  animation-name: cross_right;
}

@-webkit-keyframes cross_left {
  from {
    opacity: 0;
    -webkit-transform: translate3d(20%, 0, 0);
    transform: translate3d(20%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes cross_left {
  from {
    opacity: 0;
    -webkit-transform: translate3d(20%, 0, 0);
    transform: translate3d(20%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@-webkit-keyframes cross_right {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-20%, 0, 0);
    transform: translate3d(-20%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes cross_right {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-20%, 0, 0);
    transform: translate3d(-20%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes scale {
  from {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes scale {
  from {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.scale {
  -webkit-animation-name: scale;
  animation-name: scale;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}


@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
}