/* Slider */ .slick-slider { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } *{ -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; &:after, &:before{ -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; } } .br(@r){ -moz-border-radius:@r; -webkit-border-radius:@r; -o-border-radius:@r; border-radius:@r; } .bs(@s){ -moz-box-shadow:@s; -webkit-box-shadow:@s; -o-box-shadow:@s; box-shadow:@s; } .t(@s){ -moz-transition:@s; -webkit-transition:@s; -o-transition:@s; transition:@s; } .lg(@from,@col1,@col2){ background-color:@col2; background-image:-o-linear-gradient(@from,@col1,@col2); background-image:-moz-linear-gradient(@from,@col1,@col2); background-image:-webkit-linear-gradient(@from,@col1,@col2); background-image:linear-gradient(@from,@col1,@col2); } .flex{ display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; } .usn{ -webkit-user-select:none; -moz-user-select:none; -o-user-select:none; -ms-user-select:none; user-select:none; } .row, .clearfix{ &:after{ display:table; line-height:0; content:''; clear:both; } } .flex-row{ display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; margin-left:-10px; margin-right:-10px; font-size:0; } .flex-row-item{ display:inline-block; vertical-align:top; padding-left:10px; padding-right:10px; font-size:1rem; } .container{ width:1000px!important; margin-left:auto; margin-right:auto; padding-left:10px; padding-right:10px; @media (max-width: 1023px){ width:750px!important; } @media (max-width: 767px){ width:auto!important; } } html{ font-size:12px; } body{ height:auto; min-width:320px; overflow-x:hidden; } #container{ .container; } .phones{ a{ font-size:inherit; color:inherit; white-space:nowrap; text-decoration:none; display:inline-block; .t(.2s); &:hover{ color:#25c6ef; } } } #content .box-product > div > div.category-name{ height:auto; min-height:56px; width:297px; line-height:1; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; margin:auto; max-width:100%; } #content .box-product .image{ width:297px; margin:auto; max-width:100%; } .jcarousel-item{ a{ display:inline-block; max-width:100%; img{ max-width:100%; } } } #header #info{ .clearfix; height:auto; min-height:35px; } #header #logo{ position:static; padding:20px 40px; a{ display:inline-block; position:relative; padding-left:50px; img{ position:absolute; left:0; top:50%; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); } } } #header{ height:auto; margin:0; padding:0 0 5px; } .menu-toggle{ position:relative; color:#fff; .usn; cursor:pointer; padding-left:25px; font-size:16px; display:none; margin:10px 0 0 20px; &:before, &:after{ content:''; position:absolute; width:20px; left:0; top:50%; } &:before{ height:16px; margin-top:-8px; border-top:solid 2px #fff; border-bottom:solid 2px #fff; } &:after{ height:2px; margin-top:-1px; background:#fff; } } .menu-close{ position:absolute; right:15px; top:15px; width:20px; height:20px; display:none; &:before, &:after{ content:''; position:absolute; height:2px; right:0; left:0; top:50%; margin-top:-1px; background:#000; } &:before{ -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); } &:after{ -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg); } } #info .phones{ padding-left:20px; position:relative; span{ position:absolute; left:0; top:50%; margin-top:-10px; } } #footer div{ max-width:100%; } center{ max-width:100%; display:block; &>ymaps{ &>ymaps{ max-width:100%; } max-width:100%; } } .product-filter-col-main{ text-align:right; } .product-filter{ overflow:hidden; .limit, .sort{ float:none; display:inline-block; margin:0; padding:0 10px 15px; } #search{ margin-bottom:15px; white-space:nowrap; .button-search, input{ display:inline-block; vertical-align:middle; } input{ margin-right:10px; } } } .product-filter-main{ margin:0 -10px; } // #colorbox{ // width:650px!important; // height:auto!important; // left:50%!important; // margin-left:-325px!important; // padding:0!important; // } // #cboxWrapper{ // padding:0!important; // width:100%!important; // height:auto!important; // position:static!important; // &>div{ // position:relative; // padding:0 14px; // &:first-child{ // height:14px; // } // &:last-child{ // height:43px; // } // } // } // #cboxContent, // #cboxLoadedContent{ // width:100%!important; // height:auto!important; // float:none!important; // } // #cboxTopLeft, // #cboxTopCenter, // #cboxTopRight, // #cboxBottomLeft, // #cboxBottomCenter, // #cboxBottomRight{ // position:absolute; // float:none!important; // } // #cboxTopLeft, // #cboxTopCenter, // #cboxTopRight{ // top:0; // } // #cboxTopLeft, // #cboxBottomLeft{ // left:0; // } // #cboxTopcCenter, // #cboxBottomCenter{ // left:14px; // right:14px; // width:auto!important; // } // #cboxTopRight, // #cboxBottomRight{ // right:0; // } // #cboxBottomLeft, // #cboxBottomCenter, // #cboxBottomRight{ // bottom:0; // } // #cboxMiddleLeft, // #cboxMiddleRight{ // height:auto!important; // top:0; // bottom:0; // position:absolute; // } // #cboxMiddleLeft{ // left:0; // } // #cboxMiddleRight{ // right:0; // } // #cboxPrevious, // #cboxNext, // #cboxClose, // #cboxSlideshow, // #cboxTitle{ // z-index:2; // } #cboxClose, #cboxNext, #cboxSlideshow, #cboxPrevious{ border:0; cursor:pointer; } [id*=fast_order_form] input{ max-width:100%; } .product-info{ .clearfix; padding-left:280px; .left{ display:inline-block; float:left; width:280px; margin:0 0 0 -280px; padding:0 15px; } .right{ display:inline-block; float:left; width:100%; margin:0!important; } #product-description{ dl{ padding-right:15px; } dd{ margin:0; width:100%; } } } #product-price{ position:static; } #vkshare0{ a{ height:auto!important; } } .vkontakte{ width:auto; float:none; margin-right:0; padding-right:15px; } #cboxLoadedContent{ img{ max-width:100%; height:auto!important; } } .footer-link, .contacts-link{ color:inherit; .t(.2s); font-size:inherit; text-decoration:none; &:hover{ color:#38B0E3; } } .portfolio-link{ display:inline-block; width:250px; margin:10px; img{ max-width:100%; margin:0; float:none; display:block; } } #product-price{ min-width:430px; } .main-slider{ padding:0 30px; } .main-slide a{ width:140px; // height:140px; display:block; margin:auto; text-align:center; color:#fff; text-decoration:none;; img{ // -o-object-fit:cover; // object-fit:cover; display:block; max-width:100%; margin:0 auto 5px; } } .slick-arrow{ position:absolute; font-size:0; width:20px; height:20px; top:50%; margin-top:-10px; z-index:1; border:0; background:none; cursor:pointer; border-top:solid 3px #fff; outline:none; } .slick-prev{ border-left:solid 3px #fff; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg); left:15px; } .slick-next{ border-right:solid 3px #fff; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); right:15px; } .recall{ display:inline-block; position:relative; font-size:12px; padding:0 5px; } .recall-link{ color:#38B0E3; text-decoration:underline; cursor:pointer; padding:2px 5px; .usn; white-space:nowrap; &:hover{ text-decoration:none; } } .recall-body{ position:absolute; right:0; top:100%; padding:15px; width:200px; background:rgba(255,255,255,.9); color:#000; margin-top:10px; display:none; z-index:66; &.active{ display:block; } &:before{ content:''; position:absolute; right:10px; bottom:100%; border-bottom:solid 10px rgba(255,255,255,.9); border-left:solid 10px transparent; border-right:solid 10px transparent; } } .header-row{ font-size:0; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; margin:0 -10px; } .header-col{ display:inline-block; vertical-align:middle; padding:0 10px; font-size:12px; } #info .address, #info .phones{ float:none; } .form-title{ text-align:center; margin-bottom:10px; } .form-block{ margin-bottom:10px; } .input{ width:100%; height:30px; padding:0 10px!important; border:solid 1px #ccc; background:##F8F8F8; .br(3px); } .submit{ width:100%; height:30px; background:#169432; border:solid 1px #ccc; .br(3px); .t(.2s); color:#fff; cursor:pointer; outline:none; &:hover{ background:darken(#169432, 10%); } } .form-sent{ display:none; text-align:center; p{ margin:0; } p+p{ margin-top:5px; } } .form.sent{ .form-body{ display:none; } .form-sent{ display:block; } }