@import '../css/font-awesome.min.css';
@import '../js/fancybox/jquery.fancybox.css';
@import '../js/ui/jquery-ui.min.css';
@import '../js/selectBoxIt/jquery.selectBoxIt.css';
@import 'vars.less';
@import 'functions.less';
@color_white:#ffffff;
@color_black:#000000;
@color_gray:#cccccc;
@color_red:#e03c42;
@color_green:#4fad51;
//@font_base:Calibri,Candara,Segoe,"Segoe UI",Optima,Arial,sans-serif;
@font_base: Arial, Helvetica, sans-serif;
*{
font-size:1em;
font-family:@font_base;
}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,
kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,label,legend,caption{
border:0px;
margin:0px;
outline:0px;
padding:0px;
}
html,body{
margin:0px;
padding:0px;
width:100%;
height:100%;
}
html{
overflow-y:scroll;
}
body{
margin:0;
padding:0;
font-family:@font_base;
font-size:14px;
line-height:18px;
color:@color_text;
-ms-text-size-adjust:100%;
-moz-text-size-adjust:100%;
-webkit-text-size-adjust:100%;
}
a{
color:@color_link;
text-decoration:underline;
&:hover{
text-decoration:none;
}
}
article{
p{
margin-bottom:10px;
text-align:justify;
}
ul,ol{
margin-left:20px;
margin-bottom:10px;
}
h1,h2,h3{
margin-bottom:10px;
line-height:1.2em;
}
h1{
font-size:28px;
}
h2{
font-size:24px;
}
h3{
font-size:20px;
}
table{
margin-bottom:10px;
border-collapse:collapse;
}
}
input[type=text],input[type=password],input[type=email],textarea{
border:1px solid @color_gray;
font-family:@font_base;
&:focus{
outline:none;
border-color:@color_link;
}
}
input[type=submit],input[type=button],button{
background:@color_link;
height:auto;
line-height: 36px;
padding:0 20px;
border:2px solid @color_link;
cursor:pointer;
color:@color_white;
text-transform:uppercase;
-webkit-appearance:none;
outline:none;
.border_radius(20px);
&:hover{
background:@color_white;
color: @color_link;
}
}
.page_title{
margin-bottom: 50px;
padding: 7px 0;
padding-left: 35px;
border-left: 4px solid @color_link;
h1,.h1{
line-height: 28px;
font-size: 22px;
font-weight: bold;
}
.article {
line-height: 19px;
margin-top: 5px;
}
}
.clear{
clear:both;
}
.left{
float:left;
}
.right{
float:right;
}
.mess_err{
color:@color_red;
font-weight:bold;
}
.mess_ok{
color:@color_green;
font-weight:bold;
}
.wrap{
width:@width_wrap;
margin:0 auto;
position:relative;
}
#body{
position:absolute;
top:0;
left:0;
width:100%;
min-height:100%;
height:auto;
}
header{
position:relative;
padding-top:20px;
.header {
display: flex;
align-items: flex-start;
justify-content: space-between;
#logo{
float:left;
margin-right:50px;
margin-bottom: 20px;
}
.info {
width:calc(~"100% - 114px");
float: right;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
.button_zvonok {
a {
background: @color_link;
color: #fff;
text-decoration: none;
text-transform: uppercase;
font-weight: 600;
padding: 10px 20px;
&:hover {
box-shadow:0 0 5px @color_link;
}
}
}
&>div {
margin-right: 2%;
&:last-child {
margin-right:0;
}
}
.address h6 {
font-size: 12px;
line-height: 20px;
}
.phone {
display: inline-block;
box-sizing: border-box;
a.zvonok {
font-size: 12px;
line-height: 23px;
font-weight: bold;
text-decoration: underline;
&:hover {
text-decoration:none;
}
}
i {
float: left;
width: 45px;
height: 45px;
text-align: center;
line-height: 45px;
background-color: @color_link;
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
font-size: 15px;
color: @color_white;
box-sizing: border-box;
margin-right: 15px;
}
.text {
display: table-cell;
box-sizing: border-box;
height: 45px;
vertical-align: middle;
line-height: 20px;
}
a {
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
.mail {
display: inline-block;
box-sizing: border-box;
i {
float: left;
width: 45px;
height: 45px;
text-align: center;
line-height: 45px;
background-color: @color_link;
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
font-size: 15px;
color: @color_white;
box-sizing: border-box;
margin-right: 15px;
}
.text {
display: table-cell;
box-sizing: border-box;
height: 45px;
vertical-align: middle;
line-height: 20px;
a {
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
}
.time {
display: inline-block;
box-sizing: border-box;
i {
float: left;
width: 45px;
height: 45px;
text-align: center;
line-height: 45px;
background-color: @color_link;
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
font-size: 15px;
color: @color_white;
box-sizing: border-box;
margin-right: 15px;
}
.text {
display: table-cell;
box-sizing: border-box;
height: 45px;
vertical-align: middle;
line-height: 20px;
}
}
}
}
.menu {
background:@color_link;
.nav {
display: inline-block;
width: 100%;
nav{
//float:left;
display: inline-block;
ul{
li{
display:inline-block;
vertical-align:top;
//position:relative;
line-height:40px;
a{
display:block;
padding:0 20px;
text-decoration:none;
color:@color_white;
text-transform: uppercase;
font-weight: bold;
font-size: 13px;
line-height: 41px;
}
.fa-plus-square-o, fa-minus-square-o {
display: none;
}
&.active a, a:hover{
text-decoration: underline;
}
&:hover {
ul {
overflow: hidden;
max-height: 600px;
display: inline-block;
-webkit-transition-duration: .3s;
-ms-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-timing-function: ease-in;
-ms-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
}
&.active {
ul {
li {
a {
text-decoration: none;
}
}
}
}
ul{
position:absolute;
top:41px;
left:0;
z-index:200;
overflow: hidden;
max-height: 0;
//display: table;
background: @color_white;
width: 980px;
box-sizing: border-box;
box-shadow: 0 0 20px rgba(0,0,0,.15);
li{
display:table-cell;
position: relative;
width: 25%;
box-sizing: border-box;
border-left: 1px solid #ebebeb;
line-height: 28px;
padding-bottom: 10px;
.photo {
text-align: center;
display: block;
line-height: 0;
margin-top: 20px;
}
&:first-child {
border-left: none;
}
&.active {
a {
color: @color_link;
}
ul {
li {
a {
color: @color_text;
&:hover {
color: @color_link;
}
}
&.active {
a {
color: @color_link;
}
}
}
}
}
a{
color: @color_text;
box-sizing: border-box;
text-decoration: none;
padding: 10px 20px;
line-height: 20px;
&:hover {
color: @color_link;
}
}
ul {
position: relative;
display:inline-block;
top:0;
box-sizing: border-box;
box-shadow: none;
width: 100%;
li {
width: 100%;
box-sizing: border-box;
display:inline-block;
padding: 0 20px;
line-height: 20px;
a {
text-transform: none;
box-sizing: border-box;
font-weight: normal;
padding: 5px 0;
position: relative;
padding-left: 10px;
&:before {
content: "\f105";
font-family: FontAwesome;
display: inline-block;
position: absolute;
top:4px;
left: 0;
}
}
ul {
display: none!important;
}
}
}
}
}
&:hover{
ul{
display:block;
}
}
}
}
}
.search {
float:right;
form {
box-sizing: border-box;
position: relative;
margin: 7px 0 5px 0;
input[type=text] {
padding: 5px;
width: 200px;
padding: 5px 40px 5px 10px;
}
button {
font-size: 13px;
color: #919191;
background-color: transparent;
position: absolute;
right: 0;
top: 0;
border-left: 1px solid #e8e8e8;
height: 28px;
padding: 0 10px;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
border-bottom: none;
border-right: none;
border-top: none;
line-height: 18px;
}
}
}
}
}
}
#middle{
height:auto;
position:relative;
padding-bottom:245px;
padding-top:20px;
}
#left{
float:left;
width:@width_left;
}
#content{
float:right;
//width:@width_content;
width: calc(~"100% - 280px");
position:relative;
padding:0;
}
#right{
float:right;
width:@width_right;
margin-left:20px;
}
.block{
.title{
font-size:2em;
margin-bottom:20px;
font-weight:700;
}
&.block_2 {
.slides .slides_container .slide a {
text-decoration: none;
display: flex;
align-items: center;
justify-content: flex-start;
span {
max-width: 50%;
display: block;
&.name {
font-size: 23px;
font-weight: 900;
line-height: 30px;
margin-bottom: 20px;
}
&.more {
display: inline-block;
font-size: 12px;
line-height: 23px;
color: #fff;
text-transform: uppercase;
font-weight: bold;
background: @color_link;
padding: 5px 15px;
border-radius: 15px;
margin-top: 30px;
&:hover {
box-shadow:0 0 5px @color_link;
}
}
}
.content {
width: 50%;
font-size: 14px;
line-height: 23px;
color: #3a3a3a;
}
}
}
&.block_4 {
background:@color_link;
padding: 40px 0 20px;
ul {
list-style: none;
text-align: center;
color: #fff;
overflow: hidden;
li {
display: inline-block;
width: 18%;
float: left;
margin-right: 2.5%;
margin-bottom: 20px;
&:nth-child(5n) {
margin-right:0;
}
.name {
margin: 10px 0;
text-transform: uppercase;
font-weight: bold;
display:flex;
align-items:center;
justify-content:center;
}
}
}
}
&.block_1 {
border: 1px solid #e6e6e6;
.content {
h3 {
font-size: 14px;
line-height: 20px;
margin-bottom: 22px;
font-weight: 600;
padding-bottom: 17px;
border-bottom: 1px solid #e6e6e6;
margin-top: 22px;
padding: 10px;
margin: 0;
background: #fafafa;
}
ul {
list-style: none;
padding: 10px;
li {
position: relative;
i {
position: absolute;
top: 0;
right: 0;
font-size: 14px;
line-height: 18px;
vertical-align: middle;
z-index: 100;
cursor: pointer;
}
&.active {
a {
&:after {
content: '\f00c';
position: absolute;
top: 0;
left: 0;
font-family: FontAwesome;
font-size: 14px;
line-height: 18px;
vertical-align: middle;
}
}
ul {
li {
a {
&:after {
content: '';
}
}
&.active {
a {
&:after {
content: '\f00c';
position: absolute;
top: 0;
left: 0;
font-family: FontAwesome;
font-size: 14px;
line-height: 18px;
vertical-align: middle;
}
}
ul {
display: block;
li {
a {
&:after {
content: '';
}
}
&.active {
a {
&:after {
content: '\f00c';
position: absolute;
top: 0;
left: 0;
font-family: FontAwesome;
font-size: 14px;
line-height: 18px;
vertical-align: middle;
}
}
}
}
}
}
}
}
}
a {
padding-bottom: 5px;
display: inline-block;
width: 100%;
text-decoration: none;
font-size: 13px;
font-weight: bold;
line-height: 13px;
color: @color_text;
position: relative;
&:hover {
color: @color_link;
}
&:before {
content: '';
display: inline-block;
padding: 0;
margin-top: 3px;
margin-right: 12px;
box-sizing: content-box;
width: 9px;
height: 9px;
border: 1px double #ccc;
margin-bottom: 6px;
vertical-align: middle;
}
}
ul {
padding: 0 10px;
li {
a {
font-weight: normal;
&:after {
content: '';
}
}
ul {
display: none;
}
}
}
}
}
}
}
&.block_6 {
.content > ul {
list-style: none;
overflow: hidden;
text-align:center;
li {
width: 23%;
margin-right: 2.5%;
display: inline-block;
float: left;
margin-bottom:30px;
&:nth-child(4n) {
margin-right:0;
}
a {
text-decoration: none;
font-size: 18px;
line-height: 28px;
font-weight: bold;
span {
display:block;
&.img {
display: flex;
align-items: center;
justify-content: center;
border: 2px solid @color_link;
padding: 20px;
box-sizing: border-box;
height: 190px;
margin-bottom: 15px;
img {
max-width: 100%;
}
}
}
}
}
}
}
&.block_3 {
/*.content {
ul {
display: flex;
flex-wrap: wrap;
margin: 20px 0;
margin-left: -30px;
li {
display: flex;
width: 100%;
padding-left: 30px;
box-sizing: border-box;
.items {
border: 1px solid #ddd;
margin-bottom: 30px;
width: 100%;
padding-bottom: 20px;
.items_left {
display: inline-block;
width: 300px;
float: left;
box-sizing: border-box;
.item {
.photo {
padding: 30px;
a {
img {
width: 100%;
}
}
}
.name {
text-align: center;
a {
text-decoration: none;
color: @color_text;
h2 {
font-size: 15px;
line-height: 15px;
font-weight: 600;
text-transform: uppercase;
margin-bottom: 0;
}
&:hover {
color: @color_link;
}
}
}
}
ul {
display: inline-block;
width: 100%;
margin-left:0;
margin-bottom: 0;
padding: 0 30px;
li {
display: inline-block;
width: 100%;
border: 0;
padding: 0;
margin-bottom: 5px;
a {
text-decoration: none;
h3 {
font-size: 14px;
line-height: 18px;
margin-bottom: 0;
}
&:hover {
text-decoration: underline;
}
}
}
}
}
.items_text {
display: inline-block;
width: calc(~"100% - 330px");
float: right;
box-sizing: border-box;
padding: 30px;
p,ul,ol {
margin-bottom: 10px;
}
ul {
margin:0;
display: block;
margin-left: 30px;
margin-bottom: 10px;
list-style: disc;
li {
display: list-item;
padding-left: 0;
}
}
}
}
}
}
}*/
.owl-theme .owl-nav {
position: absolute;
top: 50%;
left: -20px;
right: -20px;
width: auto;
margin-top: -20px;
}
.owl-theme .owl-nav [class*=owl-] {
background: @color_link;
width: 40px;
height: 40px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
padding: 0;
position: absolute;
top:0;
margin: 0;
font-weight: 100;
&.owl-prev {
left:0;
}
&.owl-next {
right:0;
}
}
.content > ul {
list-style:none;
li {
display: flex;
align-items: flex-start;
justify-content: flex-start;
position:relative;
margin-bottom:100px;
&:nth-child(even):before {
background: #ebebeb;
content: '';
position: absolute;
top: -50px;
left: -50px;
right: -50px;
bottom: -50px;
z-index: 0;
}
.photo {
max-width: 250px;
margin-right: 40px;
z-index:1;
}
.text {
min-width: calc(~"100% - 290px");
max-width: 100%;
z-index:1;
.name {
font-size: 20px;
line-height: 28px;
text-transform: uppercase;
font-weight: bold;
margin-bottom: 15px;
a {
text-decoration:none;
}
}
.article {
font-size: 16px;
line-height: 28px;
max-height:84px;
overflow:hidden;
}
.more {
font-size: 16px;
line-height: 28px;
margin-top: 10px;
}
.childs {
width:100%;
margin-top: 30px;
.item {
background-image:url(../images/bg-item-childs.jpg);
height: 205px;
background-size: cover;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
box-sizing: border-box;
a {
font-size: 14px;
line-height: 18px;
color: #3f3f3f;
text-decoration: none;
font-weight: bold;
text-align: center;
span.img {
height:130px;
display:flex;
align-items:center;
justify-content:center;
}
img {
max-height: 130px;
width: auto;
max-width: 130px;
height: auto;
margin: 0 auto;
}
}
}
}
}
}
}
}
}
.rows{
text-align:center;
.item{
display:inline-block;
vertical-align:top;
.photo,.name{
margin-bottom:15px;
}
.photo{
position:relative;
.date{
position:absolute;
z-index:20;
background:fade(@color_link,70%);
color:@color_white;
padding:10px;
left:0;
top:20px;
}
}
.date{
font-size:12px;
line-height:14px;
margin-bottom:10px;
}
.name{
font-size:18px;
line-height:20px;
a{
text-decoration:none;
color:@color_text;
&:hover{
color:@color_link;
}
}
}
.more{
a{
display:inline-block;
border:1px solid @color_link;
text-transform:uppercase;
line-height:40px;
padding:0 35px;
text-decoration:none;
&:hover{
color:@color_white;
background:@color_link;
}
}
}
}
}
footer{
position:absolute;
background:#fafafa ;
bottom:0;
height:205px;
width:100%;
border-top: 1px solid #eeeeee;
.footer {
margin: 30px 0 40px;
.top, .bottom {
display: flex;
align-items: center;
justify-content: space-between;
}
.bottom {
margin-top:30px;
a {
text-transform: uppercase;
color: @color_text;
text-align: right;
font-size: 10px;
line-height: 20px;
letter-spacing: 1px;
}
}
#logo_2 {
text-align: center;
}
nav {
text-align: center;
ul {
list-style: none;
display: inline-block;
li {
display: inline-block;
i {
display: none;
}
&:after {
content: '|';
color: #bdbdbd;
padding: 0 10px;
}
a {
color: @color_text;
text-decoration: none;
&:hover {
color: @color_link;
}
}
&.active {
a {
color: @color_link;
}
}
}
}
}
}
}
.form{
width:400px;
margin:0 auto;
td{
padding-bottom:4px;
}
input[type=text],input[type=email],input[type=password],textarea{
width:100%;
margin-bottom:7px;
box-sizing:border-box;
}
input[type=text],input[type=email],input[type=password]{
padding:0 10px;
height:40px;
}
input[type=text]#captcha{
width:70px;
text-align:center;
}
input[type=submit]{
float:right;
}
textarea{
padding:10px;
resize:none;
}
sup{
color:@color_red;
font-size:12px;
}
}
.pages{
padding:20px 0px;
ul{
list-style:none;
text-align:center;
li{
display:inline-block;
vertical-align:top;
margin:0 5px;
a,span{
display:inline-block;
padding:5px;
border-bottom:2px solid transparent;
}
a{
text-decoration:none;
}
span,a:hover{
color:@color_text;
border-color:@color_link;
}
}
}
}
.popup_page{
padding:40px;
}
#color_changer{
li{
cursor:pointer;
border:1px solid @color_text;
display:inline-block;
width:20px;
height:20px;
margin:0 5px 5px 0;
vertical-align:top;
&.active{
border:1px solid @color_red;
}
}
}
#back_top{
position:fixed;
bottom:50px;
right:50px;
z-index:999;
background:@color_link;
opacity:0.7;
.transition(1s);
.border_radius(50%);
&:hover{
opacity:1;
}
a{
width:50px;
height:50px;
line-height:50px;
display:block;
text-align:center;
font-size:25px;
color:@color_white;
}
}
.termins{
.termins_letter{
font-size:1.5em;
line-height:1.6em;
font-weight:bold;
}
.termins_letter_container{
margin-bottom:1.5em;
.termin_item{
width:30%;
float:left;
padding-bottom:0.4em;
}
}
}
.compare_table{
width:100%;
border-collapse:collapse;
table-layout:fixed;
tr{
td{
padding:7px;
border-bottom:1px dashed @color_gray;
border-right:1px dashed @color_gray;
&:last-child{
border-right:0px;
}
}
}
.photo{
position:relative;
a{
text-decoration:none;
}
.delete_from_compare{
display:block;
position:absolute;
right:10px;
top:10px;
background:@color_link;
color:@color_white;
.border_radius;
padding:2px 4px;
}
}
.name{
font-weight:bold;
text-transform:uppercase;
a{
text-decoration:none;
&:hover{
text-decoration:underline;
}
}
}
.param{
font-weight:bold;
}
}
.gallery{
ul{
list-style:none;
li{
float:left;
width:200px;
height:200px;
overflow:hidden;
position:relative;
margin:0 20px 20px 0;
a{
span{
display:none;
width:200px;
height:200px;
position:absolute;
top:0;
left:0;
background:fade(@color_black,40%);
font-size:70px;
line-height:200px;
text-align:center;
i{
color:@color_white;
}
}
&:hover{
span{
display:block;
}
}
}
&:nth-child(5n){
margin-right:0px;
}
}
}
}
.articles{
.item{
margin-bottom:20px;
.photo{
float:left;
width:200px;
}
.text{
width:770px;
float:right;
}
.name{
font-size:18px;
line-height:20px;
margin-bottom:10px;
font-weight:bold;
a{
text-decoration:none;
&:hover{
text-decoration:underline;
}
}
}
.date{
color:@color_gray;
font-size:12px;
}
}
}
aside{
.article_item{
.article_item_photo,.article_item_text{
float:none;
width:100%;
}
}
}
.tabs{
.tabs_navigation{
ul{
list-style:none;
li{
display:inline-block;
vertical-align:top;
border:1px solid @color_link;
color:@color_link;
height:40px;
line-height:40px;
padding:0 20px;
cursor:pointer;
&.active{
background:@color_link;
color:@color_white;
cursor:default;
}
}
}
}
.tabs_content{
.tab{
display:none;
&.active{
display:block;
}
}
}
}
.form_messages{
margin-bottom:20px;
textarea{
width:100%;
resize:vertical;
height:100px;
}
}
.messages{
.message_item{
padding:10px;
border:1px solid @color_gray;
margin-bottom:20px;
.info{
font-weight:bold;
margin-bottom:5px;
span{
font-style:italic;
font-weight:normal;
}
}
}
.message_new{
background:fade(@color_red,20%);
}
.message_item_sys{
margin-left:70px;
}
.message_item_user{
margin-right:70px;
}
}
.catalog_limit{
a{
display:inline-block;
vertical-align:top;
.border_radius(14px);
margin:0 2px;
line-height:32px;
padding:0 15px;
background:@color_gray;
text-decoration:none;
color:@color_text;
&.active,&:hover{
color:@color_white;
background:@color_text;
}
}
}
.catalog_sort{
a{
display:inline-block;
vertical-align:top;
padding-left:15px;
color:@color_text;
text-decoration:none;
&.active,&:hover{
color:@color_link;
}
}
}
.pricelist{
margin:0 60px;
.name{
padding:7px 20px;
background:fade(@color_gray,50%);
font-size:22px;
line-height:24px;
cursor:pointer;
color:@color_link;
&:hover,&.active{
color:@color_text;
}
i{
float:right;
}
&+.data{
display:none;
}
}
.data{
margin-bottom:10px;
.name{
font-size:18px;
line-height:20px;
}
.items{
table{
width:100%;
border-collapse:collapse;
tr{
td{
padding:7px 20px;
&:last-child{
text-align:right;
}
}
&:nth-child(even){
background:fade(@color_gray,50%);
}
}
}
}
}
}
.filters{
.filter{
margin-bottom:15px;
float: left;
margin-right: 20px;
label {
padding: 7px 0;
display: inline-block;
}
.name{
display:block;
font-size:22px;
line-height:24px;
margin-bottom:10px;
}
.range{
margin-bottom:10px;
.ui-slider-horizontal{
border-radius:0 !important;
height:4px !important;
background:@color_gray !important;
}
.ui-slider-range{
background:@color_link;
}
.ui-slider-handle{
background:@color_gray !important;
border-radius:50% !important;
width:14px !important;
height:14px !important;
top:-5px !important;
border:0 !important;
}
}
.left,.right{
font-size:14px;
line-height:20px;
input[type=text]{
width:60px;
height:20px;
text-align:center;
padding:0;
}
}
.vars{
label{
display:block;
}
}
}
.submit{
text-align:right;
}
}
.version_desktop,.version_mobile{
text-align:center;
background:@color_gray;
line-height:40px;
text-transform:uppercase;
a{
color:@color_text;
text-decoration:none;
&:hover{
color:@color_link;
}
}
}
.questions{
.item{
margin-bottom:20px;
.question{
font-size:18px;
line-height:20px;
font-weight:700;
&.full{
padding-left:30px;
position:relative;
cursor:pointer;
i{
position:absolute;
top:0;
left:0;
}
&.active,&:hover{
color:@color_link;
}
&+.answer{
display:none;
}
}
}
.answer{
padding-top:10px;
padding-left:30px;
}
}
}
.bc_wrap {
padding: 12px 0;
border-bottom: 1px solid #eeeeee;
border-top: 1px solid #eeeeee;
background-color: #fafafa;
.bc {
span {
font-size: 13px;
line-height: 13px;
a {
text-decoration: none;
&:hover {
span {
color: @color_link;
}
}
span {
color:#696969;
}
}
}
}
}
.photo_razdel {
float: left;
margin: 0 20px 20px 0;
width: 290px;
img {
width: 100%;
}
}
.delivery {
.announce {
float: left;
width: 50%;
padding-right: 20px;
box-sizing: border-box;
}
.text {
float: left;
width: 50%;
padding-left: 20px;
box-sizing: border-box;
}
.announce, .text {
.title {
margin-left: 10px;
font-size: 20px;
padding: 20px 0 20px 20px;
border-bottom: 1px solid #eeeeee;
margin-bottom: 20px;
}
}
}
.contacts {
display: inline-block;
width: 100%;
margin-bottom: 30px;
.form_contacts {
float: left;
display: inline-block;
box-sizing: border-box;
width: 65%;
padding-right: 20px;
.form {
width: 100%;
table {
width: 100%;
input[type=submit] {
float: left;
max-width: 250px;
width: 100%;
font-size: 13px;
line-height: 36px;
font-weight: bold;
}
}
}
}
.contacts_text {
float: right;
display: inline-block;
box-sizing: border-box;
width: 35%;
padding-left: 20px;
line-height: 22px;
.info {
.info_title {
font-weight: 600;
font-size: 13px;
line-height: 1.3;
text-transform: uppercase;
margin: 10px 0;
}
a {
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
}
.form_contacts, .contacts_text {
.title {
margin-left: 10px;
font-size: 20px;
padding: 20px 0 20px 20px;
border-bottom: 1px solid #eeeeee;
margin-bottom: 20px;
}
}
}
.selectboxit-container {
.selectboxit {
border-radius: 0;
background-color: #fafafa;
background-image: none;
}
.selectboxit-list {
border-radius: 0;
}
}
.brand_items {
display: flex;
flex-wrap: wrap;
margin-left: -30px;
.brand_item {
display: flex;
width: 25%;
padding-left: 30px;
padding-bottom: 30px;
box-sizing: border-box;
.brand_item_block {
border: 1px solid #ddd;
display: block;
width: 100%;
.brand_item_photo {
display: table;
width: 100%;
height: 100px;
text-align: center;
vertical-align: middle;
a {
display: table-cell;
width: 100%;
height: 100px;
text-align: center;
vertical-align: middle;
img {
}
}
}
.brand_item_text {
display: inline-block;
width: 100%;
.article_item_name {
text-align: center;
font-weight: 700;
}
.article_item_more {
text-align: center;
a {
width: 100%;
display: inline-block;
padding: 15px 0;
margin-top: 10px;
background: #FAFAFA;
border-top: 1px solid #ebebeb;
font-size: 13px;
color: @color_text;
text-decoration: none;
&:hover {
color: @color_link;
}
}
}
}
}
}
}
.catalog {
margin-top: 40px;
&.search_catalog {
.item {
width: 23%;
margin-right: 2%;
float: left;
padding: 20px;
border: 1px solid #ebebeb;
box-sizing: border-box;
&:nth-child(4n) {
margin-right:0;
}
.photo {
float: none;
padding: 0;
width: 100%;
margin-bottom: 20px;
a {
display: flex;
align-items: center;
justify-content: center;
}
}
.text {
width: 100%;
text-align: center;
}
}
}
.item {
margin-bottom: 40px;
padding-bottom: 20px;
border-bottom: 1px solid #ebebeb;
.photo {
float: left;
padding-right: 40px;
display: inline-block;
}
.text {
display: inline-block;
width: calc(~"100% - 240px");
.art {
margin: 5px 0;
span {
font-weight: bold;
}
}
.name {
a {
color: #3d3d3d;
text-decoration: none;
font-size: 17px;
line-height: 20px;
h2 {
font-size: 17px;
line-height: 20px;
}
}
}
.brand {
font-weight: bold;
margin: 10px 0;
a {
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
.more {
margin-top: 20px;
a {
display: inline-block;
max-width: 120px;
width: 100%;
font-size: 11px;
line-height: 26px;
font-weight: bold;
background: #666;
height: auto;
padding: 0 20px;
cursor: pointer;
color: @color_white;
text-transform: uppercase;
text-align: center;
text-decoration: none;
border: 2px solid #666;
&:hover {
background: @color_white;
color: #666;
}
}
}
}
}
}
.detail_catalog {
.photo {
display: inline-block;
width: 45%;
margin-right:5%;
box-sizing: border-box;
float: left;
.main_photo {
}
.photos {
}
.owl-carousel {
.owl-item {
img {
max-width: 100%;
width: auto;
margin: 0 auto;
}
}
&#owl1_obj {
padding: 5px;
box-sizing: border-box;
border: 1px solid #d6d6d7;
}
&#owl2_obj {
margin: 20px 0;
padding: 0 30px;
box-sizing: border-box;
.owl-nav {
position: absolute;
top: 50%;
left: 5px;
right: 5px;
margin-top: -15px;
.owl-prev, .owl-next {
position: absolute;
top: 0;
background: transparent;
padding: 0;
margin: 0;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
img {
max-height:100%;
}
}
.owl-prev {
left:0;
}
.owl-next {
right:0;
}
}
}
}
}
.text {
display: inline-block;
width: 50%;
box-sizing: border-box;
float: left;
.page_title {
h1 {
font-size: 20px;
font-weight: normal;
line-height: 25px;
margin-bottom: 15px;
}
}
.art {
margin: 10px 0;
span {
font-weight: bold;
}
}
.brand {
font-weight: bold;
margin: 10px 0;
a {
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
.order {
margin: 20px 20px 0 0;
float: left;
a {
padding: 0 30px;
line-height: 40px;
border-radius: 25px;
font-size:15px;
}
&.quest {
a {
background: #b3b3b5;
border-color: #b3b3b5;
&:hover {
background:transparent;
color:#b3b3b5;
}
}
}
}
}
}
.tabs{
display:inline-block;
margin-top: 40px;
width: 100%;
}
.tabs > div{
padding:20px;
border: 1px solid #d6d6d7;
position: relative;
top: -4px;
display: inline-block;
box-sizing: border-box;
width: 100%;
h2 {
font-size: 18px;
}
ul {
list-style: disc;
margin-left: 30px;
li {
margin: 0;
padding: 0;
cursor: none;
display: list-item;
float: none;
background: none;
color: @color_text;
text-transform: none;
font-weight: normal;
border-left: 0;
border-top: 0;
border-right: 0 !important;
&:hover {
background: none;
color: @color_text;
border-top: none;
border-left: none;
}
}
}
table {
width: 100%;
overflow-x: auto;
display: inline-block;
tbody {
display: table;
width: 100%;
}
tr {
th {
text-align: left;
}
th, td {
padding: 8px;
border-top: 1px solid #ddd;
}
&:first-child {
th, td {
border-top: 0;
}
}
}
}
}
.tabs ul{
margin:0px;
padding:0px;
display: inline-block;
width: 100%;
}
/*.tabs ul:after{
content:"";
display:block;
clear:both;
height:5px;
background:#46c765;
}*/
.tabs ul li{
margin:0px;
padding:0px;
cursor:pointer;
display:block;
float:left;
padding:10px 15px;
background:@color_white;
color:@color_text;
text-transform: uppercase;
font-weight: 600;
border-left: 1px solid #d6d6d7;
border-top: 1px solid #d6d6d7;
&:last-child {
border-right: 1px solid #d6d6d7;
}
}
.tabs ul li.active, .tabs ul li.active:hover {
background: @color_link;
color:@color_white;
text-transform: uppercase;
font-weight: 600;
border-top: 1px solid @color_link;
border-left: 1px solid @color_link;
&:last-child {
border-right: 1px solid @color_link;
}
}
.tabs ul li:hover{
background:#656565;
color: @color_white;
border-top: 1px solid #656565;
border-left: 1px solid #656565;
}
.top-menu, .opener,.left-top-menu {
display: none;
}
.subcats {
display: flex;
flex-wrap: wrap;
margin-left: -30px;
.item {
display: flex;
width: 25%;
padding-left: 30px;
padding-bottom: 30px;
box-sizing: border-box;
.item_block {
border: 1px solid #ddd;
display: table;
width: 100%;
.photo {
display: table;
width: 100%;
//height: 100px;
text-align: center;
vertical-align: middle;
a {
display: table-cell;
width: 100%;
height: 100px;
text-align: center;
vertical-align: middle;
img {
width: 100%;
}
}
}
.name {
display: inline-block;
width: 100%;
text-align: center;
padding: 0 5px;
box-sizing: border-box;
a {
width: 100%;
display: inline-block;
padding: 15px 0;
background: #FAFAFA;
border-top: 1px solid #ebebeb;
font-size: 13px;
color: #3d3d3d;
text-decoration: none;
&:hover {
color: #0075ad;
}
}
}
}
}
}
@media (max-width: 1190px) {
* {
box-sizing: border-box;
}
body, #body {
min-width: 100%;
}
.wrap {
width: 100%;
padding: 0 20px;
box-sizing: border-box;
}
header {
.header {
position: relative;
.info {
display: none;
}
}
.menu {
display: none;
}
}
.opener{
display: inline-block;
position: absolute;
top:0;
right:0;
color:@color_text;
font-size:1em;
text-align:center;
cursor:pointer;
text-transform: uppercase;
}
.opener + ul{
display:none;
}
.opener i {
font-size:2em;
margin: 5px 0;
}
.left-top-menu {
display: block;
}
.top-menu {
display: none;
overflow-y: scroll !important;
background-color: rgba(90, 90, 90, 0.9);
height: calc(~"100vh");
position: fixed;
top: 0;
left: 0;
z-index: 10000;
padding-right: 10px;
.title {
color: @color_white;
text-transform: uppercase;
font-size: 20px;
line-height: 20px;
padding: 10px 20px;
}
ul {
li {
border-top: 1px solid rgba(235, 235, 235, 0.07);
position: relative;
padding-right: 10px;
a {
color: @color_white;
text-decoration: none;
display: block;
padding: 10px 20px;
position: relative;
&:hover {
color: #e5b81d;
}
i {
position: relative;
top: 0;
font-size: 14px;
}
}
i {
color: @color_white;
position: absolute;
right: 0;
top: 10px;
cursor: pointer;
font-size: 20px;
&:hover {
color: #e5b81d;
}
}
&.active {
a {
color: #e5b81d;
}
ul {
li {
a {
color: @color_white;
&:hover {
color: #e5b81d;
}
}
&.active {
a {
color: #e5b81d;
}
ul {
li {
a {
color: @color_white;
&:hover {
color: #e5b81d;
}
}
&.active {
a {
color: #e5b81d;
}
}
}
}
}
}
}
}
ul {
display: none;
padding-left: 10px;
li {
.photo {
display: none;
}
}
}
}
}
}
}
@media (max-width: 1050px) {
.brand_items .brand_item {
width: 33.3333%;
}
.subcats .item {
width: 33.3333%;
}
}
@media (max-width: 950px) {
ul.bxslider li a .name {
font-size: 34px !important;
line-height: 34px !important;
}
.contacts .form_contacts, .contacts .contacts_text {
float: none;
width: 100%;
padding-right: 0;
padding-left: 0;
}
}
@media (max-width: 850px) {
#content {
width: 100%;
}
#left {
width: 100%;
}
.brand_items .brand_item {
width: 25%;
}
.subcats .item {
width: 25%;
}
}
@media (max-width: 750px) {
.block.block_3 .content ul li {
width: 100%;
margin-bottom: 30px;
.items {
.item {
.photo {
text-align: center;
img {
max-width: 300px;
}
}
}
}
}
ul.bxslider li a .name {
font-size: 28px !important;
padding: 10px !important;
line-height: 28px !important;
}
.delivery .announce, .delivery .text {
float: none;
width: 100%;
padding-right: 0;
padding-left: 0;
}
.brand_items .brand_item {
width: 33.3333%;
}
.subcats .item {
width: 33.3333%;
}
.block.block_3 .content ul li .items .items_left {
width: 100%;
}
.block.block_3 .content ul li .items .items_text {
width: 100%;
}
.relative{
.catalog{
display:block !important;
.item{
width:100% !important;
margin-bottom:15px !important;
}
}
}
}
@media (max-width: 650px) {
.block.block_6 .content > ul li {
width:48%;
margin-right:4%;
&:nth-child(2n) {
margin-right:0;
}
}
.block.block_4 ul li {
width: 49%;
float: none;
box-sizing: border-box;
margin-right: 0;
display: inline-grid;
.photo img {
max-width: 100%;
}
}
.block.block_3 .content > ul li {
display:block;
margin-bottom:40px;
.photo {
max-width:100%;
width:100%;
margin-right:0;
margin-bottom:20px;
a {
display:flex;
align-items:center;
justify-content:center;
img {
max-height:200px;
width:auto;
}
}
}
.text {
width:100%;
min-width:100%;
}
}
.block.block_3 .content > ul li .text .childs .item a {
overflow:hidden;
}
.block.block_3 .content > ul li:nth-child(even):before {
display:none;
}
footer {
.footer {
nav {
display: none;
}
}
}
ul.bxslider li a .name {
font-size: 24px !important;
padding: 5px !important;
line-height: 24px !important;
}
.photo_razdel {
float: none;
width: 100%;
margin:20px 0;
}
.catalog .item .photo, .catalog .item .text {
float: none;
width: 100%;
}
.catalog .item .photo {
text-align: center;
}
.detail_catalog .photo, .detail_catalog .text {
float: none;
width: 100%;
}
.detail_catalog .photo {
text-align: center;
.main_photo {
img {
width: 100%;
}
}
}
.tabs ul li {
font-size: 10px;
}
.tabs > div {
.videowrapper {
position: relative;
padding-bottom: 56.25%;
padding-top: 25px;
height: 0;
video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}
}
.brand_items .brand_item {
width: 50%;
}
.subcats .item {
width: 50%;
}
}
@media (max-width: 450px) {
.block.block_6 .content > ul li a span.img {
height:120px;
}
.block.block_2 .slides .slides_container .slide a:after {
position:absolute;
content:'';
top:0;
left:0;
width:100%;
height:100%;
background:rgba(255,255,255,0.3);
}
.block.block_2 .slides .slides_container .slide a .wrap {
z-index:2;
span, .content {
max-width:100%;
}
.content {
width:100%;
}
}
ul.bxslider li a .name {
font-size: 20px !important;
padding: 5px !important;
line-height: 20px !important;
top: 10px !important;
right: 10px !important;
}
.page_title h1, .page_title .h1 {
font-size: 20px;
line-height: 20px;
}
.tabs ul li {
padding: 5px 5px;
}
.brand_items .brand_item {
width: 100%;
}
.subcats .item {
width: 100%;
}
}
.popup_content {
.contacts {
.form_contacts {
width: 100%;
.form {
max-width:400px;
}
}
}
}
.order {
margin: 20px 0;
//text-align: center;
a {
color: @color_white;
background: @color_link;
text-transform: uppercase;
padding: 0 30px;
text-decoration: none;
font-size: 18px;
line-height: 36px;
font-weight: 400;
display: inline-block;
border: 2px solid @color_link;
border-radius: 20px;
&:hover {
background: @color_white;
color: @color_link;
}
}
}
.text_announce {
margin-top: 30px;
}
.slides .next, .slides .prev {
margin-top:-22px;
width:12px;
height:44px;
background:none;
&:hover {
background:none;
}
}
.slides .prev {
margin-left:-22px;
}
.slides .next {
margin-right:-22px;
}
#slides_2, #slides_2 .slides_container, #slides_2 .slides_container .slide {
max-width:100%;
}
article.page-404 {
nav.navbar-404 ul {
display: flex;
align-items: center;
justify-content: space-around;
margin: 0;
list-style: none;
border: 1px solid #0075ad;
border-left: 0;
border-right: 0;
margin-top: 15px;
li {
i {
display:none;
}
a {
text-transform: uppercase;
text-decoration: none;
line-height: 40px;
&:hover {
text-shadow: 0 0 1px rgb(0, 117, 173);
}
}
}
}
.search {
margin-bottom:20px;
form {
box-sizing: border-box;
position: relative;
width:250px;
input[type=text] {
padding: 5px;
width: 200px;
padding: 5px 40px 5px 10px;
}
button {
font-size: 13px;
color: #919191;
background-color: transparent;
position: absolute;
right: 0;
top: 0;
border-left: 1px solid #e8e8e8;
height: 28px;
padding: 0 10px;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
border-bottom: none;
border-right: none;
border-top: none;
line-height: 18px;
}
}
}
}
div.cookie {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background: rgba(0, 0, 0, .5);
z-index: 999999999;
display: none;
align-items: center;
justify-content: center;
padding: 10px;
p {
color: #fff;
margin: 0;
margin-right: 20px;
}
a {
display: block;
padding: 10px;
background: #fff;
text-decoration: none;
&:hover {
background:@color_link;
color:#fff;
}
}
}
.relative {
margin-top: 50px;
.catalog {
display: flex;
align-items: flex-start;
justify-content: space-between;
.item {
margin: 0;
padding: 20px 10px;
width: 23%;
box-sizing: border-box;
border: 1px solid #d6d6d7;
.photo {
width: 100%;
margin: 0 auto;
text-align: center;
padding: 0;
margin-bottom: 20px;
display:flex;
align-items:center;
justify-content:center;
}
.text {
width: 100%;
text-align: center;
}
}
}
}