/* Theme Name: site Author: Dmitriy Grand Author URI: http://artgrand.net Version: 1.0 */ html { margin: 0; padding: 0; } body { background: #fff; color: #333; font-size:14px; margin: 0px; padding: 0px; font-family: 'Montserrat', sans-serif; } .welcome, h1, h2, h3, h4, h5, h6 { color: #636E75; margin-top: 0px; margin-bottom: 20px; font-size: 32px; font-weight: normal; text-shadow: 0 0 1px rgba(0, 0, 0, .01);} h1, h2, h3, h4, h5, h6{ font-weight:normal;} h1{ font-size:25px;} h2{ font-size:23px;} h3{ font-size:20px;} h4{ font-size:18px;} h5{ font-size:16px;} h6{ font-size:14px;} /*clear*/ .clr { clear: both; height:0px; font-size:0px;} .clrl{ clear:left; height:0px; font-size:0px;} .clrr{ clear:right; height:0px; font-size:0px;} /**/ .transition, .headMenu ul.mainMenu li a, .mainPic .wrapPic .electrical:hover, .mainPic .wrapPic .metall:hover, .mainPic .wrapPic .mechanical:hover{ -webkit-transition: background 2ms ease; -moz-transition: background 2ms ease; -ms-transition: background 2ms ease; -o-transition: background 2ms ease; transition: background 2ms ease;} :focus{ outline:none;} ::-moz-selection { background: #ab0404; color: #fff; text-shadow: none;} ::selection { background: #ab0404; color: #fff; text-shadow: none;} /*radius*/ .rad2, .header .currency .currentlyOption a{} .rad3, .header .currency , .header .currency .currentlyOption, .filter-option label small, .featured .featuredContent .featProduct .image, #product-filter .button-filtr, #trackbar, .product-grid .image, .title .product-filter .productSort, .pagination .links a , .pagination .links b, input[type='text'], input[type='password'], textarea { -webkit-box-sizing: border-box; box-sizing: border-box; } .headMenu ul.mainMenu li a, .header .phone .fullContact, .jcarousel-skin-opencart .jcarousel-container, a.button, input.button{} .rad10 {} .rad_circle { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -khtml-border-radius: 50%;} .htabs a /* rad 3 top left*/{-moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -khtml-border-top-left-radius:3px;} .htabs a /* rad 3 top right*/{-moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; -khtml-border-top-right-radius:3px;} .header .currency .currentlyOption , #selecteds .cancel-large /* rad 3 bottom left*/{-moz-border-radius-bottomleft: 3px; webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px; -khtml-border-bottom-left-radius:3px;} .header .currency .currentlyOption , #selecteds .cancel-large /* rad 3 bottom right*/{-moz-border-radius-bottomright: 3px; webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; -khtml-border-bottom-right-radius:3px;} .header .search .searchInput, .header .cart .cartHeading /* rad 5 top left*/{-moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; border-top-left-radius: 5px; -khtml-border-top-left-radius:5px;} .header .search .button-search , .header .cart .cartContent, .header .cart .cartHeading /* rad 5 top right*/{-moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-top-right-radius: 5px; -khtml-border-top-right-radius:5px;} .header .search .searchInput, .header .cart .cartContent /* rad 5 bottom left*/{-moz-border-radius-bottomleft: 5px; webkit-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px; -khtml-border-bottom-left-radius:5px;} .header .search .button-search, .header .cart .cartContent /* rad 5 bottom right*/{-moz-border-radius-bottomright: 5px; webkit-border-bottom-right-radius: 5px; border-bottom-right-radius: 5px; -khtml-border-bottom-right-radius:5px;} /* rad 5 top left*/ .headMenu {-moz-border-radius-topleft: 5px; -webkit-border-top-left-radius: 5px; border-top-left-radius: 5px; -khtml-border-top-left-radius:5px;} /* rad 5 top right*/ .headMenu {-moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; border-top-right-radius: 5px; -khtml-border-top-right-radius:5px;} /* rad 5 bottom left*/ {-moz-border-radius-bottomleft: 5px; webkit-border-bottom-left-radius: 5px; border-bottom-left-radius: 5px; -khtml-border-bottom-left-radius:5px;} /* rad 5 bottom right*/ {-moz-border-radius-bottomright: 5px; webkit-border-bottom-right-radius: 5px; border-bottom-right-radius: 5px; -khtml-border-bottom-right-radius:5px;} p { margin-top: 0px; margin-bottom: 20px; } a, a:visited { color: #0b6aa1; text-decoration: underline; cursor: pointer; outline:none;} a:hover { text-decoration: none; } img { border: none; } form { padding: 0; margin: 0; display: inline;} hr { background: #fff; border:none; border-bottom:1px solid #E7E7E7; } input[type='text'], input[type='password'], textarea { background: #fff; border: 1px solid #ddd; padding: 8px 15px; outline: none; margin-left: 0px; margin-right: 0px; color:#333; -webkit-box-shadow: 0 10px 10px -7px rgba(0,0,0,0.1) inset; -moz-box-shadow : 0 10px 10px -7px rgba(0,0,0,0.1) inset; -o-box-shadow : 0 10px 10px -7px rgba(0,0,0,0.1) inset; box-shadow : 0 10px 10px -7px rgba(0,0,0,0.1) inset; } input[type='text']:focus, input[type='password']:focus, textarea:focus { } select { background: #F8F8F8; border: 1px solid #CCCCCC; padding: 2px; outline:none;} label { cursor: pointer;} .wrap{ width:1400px; text-align: left; margin: 0 auto; } .paddingPage{ font-size: 14px; } .wrapHeader{ background:#FFF;} .wrapHeadserShadow{ border-bottom:1px solid #d9d9d9;} .wrapContent{background:#FFF ;} .cranFon{} .wrapFooter{ background: #fafafa; } .wrapHome{ width:1400px; text-align:left; padding:0px 0px 50px 0px;} .wrapHome:after{ content:''; display: block; height: 0; clear: both; } .partners-diler{ margin: 5vh 0 0 0; } .partners-diler h2{ color:#333; text-transform:uppercase; margin: 0 15px 30px 0; font-size: 28px; font-weight: 900; position: relative; text-align: center; } .partners-diler h2:before{ content:''; display: block; width: 100%; height: 1px; background-color: #ccc; position: absolute; top: 50%; left: 0; } .partners-diler h2 span{ display: inline-block; position: relative; z-index: 2; background-color: #fff; padding: 0 20px; } .partners-diler .diler-wrap{ padding: 20px 0; } .partners-diler .diler-wrap:after{ content:''; display: block; height: 0; clear: both; } .partners-diler .diler-item{ width:50%; float: left;} .partners-diler .diler-pic a{} .partners-diler .diler-pic{ padding: 0 20px; display: block; max-width: 250px; margin: 0 auto; } .partners-diler .diler-pic img{ width: 100%; } .header-inner{ float: right; } .header-inner:after{ content:''; display: block; height: 0; clear: both; } /*head*/ .header{} .header .logo{ display:block; height:85px; width:205px; padding:15px 15px 0px 15px; float:left; text-decoration:none; color:#333; font-size:10px; line-height: 10px; } .header .logo:hover{ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; filter: alpha(opacity=85); -moz-opacity: 0.85; -khtml-opacity: 0.85; opacity: 0.85;} .header .logo img{ display:block;} /*search*/ .header .search{ width:600px; height:72px; padding:28px 0px 0px 0px; float:left; } .header .search .button-search { background: #e3e3e3 url(../image/button1.jpg) 0px 0px repeat-x; color:#656565; text-shadow:1px 1px 0px #fff; width: 90px; line-height:38px; height: 38px; text-align:center; border: 1px solid #d4d4d4; cursor: pointer; float:right;} .header .search .button-search:hover{ background-position: 0px -10px;} .header .search .searchInput { background: #FFF; height:40px; padding:0px 5px 0px 20px ; color:#7c7c7c; border: 1px solid #d4d4d4; overflow: hidden; border-style: solid; border-color:#d4d4d4; border-width:1px 0px 1px 1px; width: 100%; -webkit-box-shadow : 1px 5px 6px -5px #D4D4D4 inset; -moz-box-shadow : 1px 5px 6px -5px #D4D4D4 inset; -o-box-shadow : 1px 5px 6px -5px #D4D4D4 inset; box-shadow : 1px 5px 6px -5px #D4D4D4 inset; -webkit-box-sizing: border-box; box-sizing: border-box; } /*login block*/ .header .search .input-search{ overflow: hidden; } .header .login{ width:160px; height:70px; padding:30px 0px 0px 20px; float:left;} /*profile*/ .header .profile{ height:17px; background: url(../image/man.png) 10px 2px no-repeat; padding:0px 0px 0px 30px;} .header .profile a{ color:#3d3d3d; text-decoration:none;} .header .profile a:hover{ text-decoration:underline;} .header .profile .exit{ display: inline-block; width:17px; height:17px; background: url("../image/filter/cancel-small.png") no-repeat 3px 2px ; text-decoration:none; } .header .profile .exit:hover{ background-position:3px -20px; text-decoration:none;} /*.header .*/ .header .cart{ position:relative; height:22px;} .header .cart a{ color:#3d3d3d; text-decoration:none; } .header .cart .image a{ display: block; max-width: 50px; } .header .cart .image a img{ width: 100%; } .header .cart a:hover{ text-decoration:underline;} .header .cart .cartHeading{ color:#3d3d3d; background: url(../image/items.png) 10px 6px no-repeat; padding:0px 0px 0px 29px; border:1px solid transparent; position:relative; z-index:5;} .header .cart .cartHeading .openCart{ display:block; padding:4px 0px 0px 0px ;} .header .cart .selected{ background-color:#FFFFFF; border-color:#EEEEEE; border-style: solid; border-width:1px 1px 0px 1px;} .header .cart .cartContent .empty{ text-align:center; padding:60px 0px 0px 0px;} .header .cart .cartContent{ display:none; position:absolute; width:400px; z-index:4; top: 18px; left:0px; padding: 8px; min-height: 150px; border: 1px solid #EEEEEE; background: #FFF; -webkit-box-shadow : 0 3px 5px -4px #515151 ; -moz-box-shadow : 0 3px 5px -4px #515151 ; -o-box-shadow : 0 3px 5px -4px #515151 ; box-shadow : 0 3px 5px -4px #515151 ;} /*phone*/ .header .phone{ width:240px; height:100px; float:left; position:relative; color:#515151; cursor: pointer;} .header .phone{ color:#242424; font-size:25px; height:30px; line-height:28px; } .header .phone span{ color:#ac0505; font-size:14px; height:14px; display: block; line-height: 1em;} .header .phone .pic{width:139px; height:137px; background: url(../image/phone2.png) center center no-repeat; position:absolute; right:-25px; top:0px; z-index:1;} .header .phone .fullContact{ background:#f0f0f0 url(../image/phone_fion.jpg) top left repeat-x; padding:65px 14px 14px 14px; border:1px solid #ebebeb; width:175px; position:absolute; z-index:2; top: 15px; left:5px; display:none; -webkit-box-shadow : 0 3px 5px -4px #515151 ; -moz-box-shadow : 0 3px 5px -4px #515151 ; -o-box-shadow : 0 3px 5px -4px #515151 ; box-shadow : 0 3px 5px -4px #515151 ;} .header .phone .contactHover{ height:44px; position:absolute; z-index:3; top:31px; left:0px; padding:0px 0px 0px 50px; background: url(../image/slide_down.png) 22px 20px no-repeat} .header .phone .selected{ background-image: url(../image/slide_up.png)} .header .phone .skype{ padding:15px 0px 5px 0px; font-size: 14px;} .header .phone .maps{ padding:5px 0px 2px 15px; background: url(../image/picker.png) 0px 8px no-repeat; font-size: 14px;} .header .phone .hr{ height:0px; border-top:1px solid #dcdcdc; border-bottom:1px solid #fff;} .header .phone a{ color:#515151; } .header .phone a:hover{ color:#333; } /*currency*/ .header .currency { float:right; margin:16px 55px 0px 0px; width: 62px; height:25px; border:1px solid #333; background:#212228 url(../image/currencies.jpg) repeat-x top left; position:relative; z-index:1; -webkit-box-shadow : 0px 1px 0 #515151 inset; -moz-box-shadow : 0px 1px 0 #515151 inset; -o-box-shadow : 0px 1px 0 #515151 inset; box-shadow : 0px 1px 0 #515151 inset; } .header .currency .currently { height:22px; width:52px; padding:3px 0px 0px 10px; color:#878787; text-shadow:1px 0px 0px #1b1b1c; cursor:pointer; background: url(../image/currently.png) no-repeat 43px 11px ;} .header .currency .currentlyOption { display:none; width:48px; position:absolute; left:-1px; top:0px; z-index:2; background:#3c3c3c; border-color:#333; border-style:solid; border-width: 0px 1px 1px 1px; padding: 7px ; -webkit-box-shadow : 3px 3px 12px -5px #333 inset; -moz-box-shadow : 3px 3px 12px -5px #333 inset; -o-box-shadow : 3px 3px 12px -5px #333 inset; box-shadow : 3px 3px 12px -5px #333 inset;} .header .currency .currentlyOption a{ display:block; padding:4px 0px 4px 10px; color:#878787; text-shadow:1px 0px 0px #1b1b1c; } .header .currency .currentlyOption a:hover{ color:#a4a4a4; background:#333;} /*head menu*/ .headMenu{ background:#333 /*url(../image/top_menu.jpg) repeat-x top left*/; clear: both;} .headMenu:after{ content:''; display: block; clear: both; height: 0; } .headMenu ul.mainMenu{ margin:0px; padding:14px 60px 14px 14px; display:block; } .headMenu ul.mainMenu:after{ content:''; display: block; clear: both; height: 0; } .headMenu ul.mainMenu li{ float:left; display:block; list-style:none; position: relative;} .headMenu ul.mainMenu li a.dealers_partners{ background: rgba(179,207,20,1); background: -moz-linear-gradient(top, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(179,207,20,1)), color-stop(100%, rgba(131,183,26,1))); background: -webkit-linear-gradient(top, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); background: -o-linear-gradient(top, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); background: -ms-linear-gradient(top, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); background: linear-gradient(to bottom, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3cf14', endColorstr='#83b71a', GradientType=0 ); } .headMenu ul.mainMenu li a.dealers_partners:hover{ background: rgba(179,207,20,1); background: -moz-linear-gradient(bottom, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); background: -webkit-gradient(left bottom, left bottom, color-stop(0%, rgba(179,207,20,1)), color-stop(100%, rgba(131,183,26,1))); background: -webkit-linear-gradient(bottom, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); background: -o-linear-gradient(bottom, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); background: -ms-linear-gradient(bottom, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); background: linear-gradient(to top, rgba(179,207,20,1) 0%, rgba(131,183,26,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3cf14', endColorstr='#83b71a', GradientType=0 ); } .headMenu ul.mainMenu li a.site_all_products{ background: rgb(62,62,62); background: -moz-linear-gradient(0deg, rgba(62,62,62,1) 0%, rgba(103,103,103,1) 100%); background: -webkit-linear-gradient(0deg, rgba(62,62,62,1) 0%, rgba(103,103,103,1) 100%); background: linear-gradient(0deg, rgba(62,62,62,1) 0%, rgba(103,103,103,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3e3e3e",endColorstr="#676767",GradientType=1); } .headMenu ul.mainMenu li a.site_sale{ background: rgb(128,0,238); background: -moz-linear-gradient(180deg, rgba(128,0,238,1) 0%, rgba(61,0,113,1) 100%); background: -webkit-linear-gradient(180deg, rgba(128,0,238,1) 0%, rgba(61,0,113,1) 100%); background: linear-gradient(180deg, rgba(128,0,238,1) 0%, rgba(61,0,113,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8000ee",endColorstr="#3d0071",GradientType=1); } .headMenu ul.mainMenu li a.site_sale:hover{ background: rgb(128,0,238); background: -moz-linear-gradient(0deg, rgba(128,0,238,1) 0%, rgba(61,0,113,1) 100%); background: -webkit-linear-gradient(0deg, rgba(128,0,238,1) 0%, rgba(61,0,113,1) 100%); background: linear-gradient(0deg, rgba(128,0,238,1) 0%, rgba(61,0,113,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8000ee",endColorstr="#3d0071",GradientType=1); } .headMenu ul.mainMenu li a.red_bg{ background: rgb(218,50,50); background: -moz-linear-gradient(180deg, rgba(218,50,50,1) 0%, rgba(171,2,2,1) 100%); background: -webkit-linear-gradient(180deg, rgba(218,50,50,1) 0%, rgba(171,2,2,1) 100%); background: linear-gradient(180deg, rgba(218,50,50,1) 0%, rgba(171,2,2,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#da3232",endColorstr="#ab0202",GradientType=1); } .headMenu ul.mainMenu li a.red_bg:hover{ background: rgb(218,50,50); background: -moz-linear-gradient(0deg, rgba(218,50,50,1) 0%, rgba(171,2,2,1) 100%); background: -webkit-linear-gradient(0deg, rgba(218,50,50,1) 0%, rgba(171,2,2,1) 100%); background: linear-gradient(00deg, rgba(218,50,50,1) 0%, rgba(171,2,2,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#da3232",endColorstr="#ab0202",GradientType=1); } .headMenu ul.mainMenu li.facebook-ico{ float: right; } .headMenu ul.mainMenu li.facebook-ico a{ display: block; max-width: 24px; padding: 5px; } .headMenu ul.mainMenu li.facebook-ico a img{ width: 100%; display: block; } .headMenu ul.mainMenu li a{ color:#fff; text-decoration:none; text-transform:uppercase; display:block; padding:8px 12px 8px 12px; margin: 0 5px 0 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .headMenu ul.mainMenu li ul{ display: none; position: absolute; left: 0; top: 100%; z-index: 2; background-color: rgba(62,62,62,1); padding: 10px; border-radius: 0 3px 3px 3px; -webkit-box-shadow: 0px 3px 0px #DDDDDD; -moz-box-shadow: 0px 3px 0px #DDDDDD; box-shadow: 0px 3px 0px #DDDDDD; } .headMenu ul.mainMenu li:hover ul{ display: block; } .headMenu ul.mainMenu li ul li{ display: block; white-space: nowrap; } .headMenu ul.mainMenu li ul li a{ border-color: transparent; } .headMenu ul.mainMenu li ul li a:hover{ text-decoration: underline; } /*mainPic*/ .mainPic{ background: url(../image/header.jpg) no-repeat top center; position: relative; margin: 0 0 50px 0;} .mainPic .wrapPic{ height: 400px; position:relative;} .mainPic .wrapPic .mechanical span, .mainPic .wrapPic .metall span, .mainPic .wrapPic .electrical span{ font-size:30px; display:block; line-height:20px;} .mainPic .wrapPic .electrical:hover{ color:#0b6aa1;} .mainPic .wrapPic .metall:hover{ color:#0b6aa1;} .mainPic .wrapPic .mechanical:hover{ color:#0b6aa1;} .mainPic .wrapPic .header-pic-menu{ padding: 42px 0 0 0; display: inline-block; position: relative; } .mainPic .wrapPic .sertf-logo{ position: absolute; top: 50px; right: -180px;} .mainPic .wrapPic .sertf-logo span{ display: inline-block; max-width: 60px; } .mainPic .wrapPic .sertf-logo span:nth-child(1){} .mainPic .wrapPic .sertf-logo span:nth-child(2){} .mainPic .wrapPic .sertf-logo span:nth-child(3){} .mainPic .wrapPic .sertf-logo span img{ width: 100%; display: block;} .mainPic .wrapPic .header-title{ font-size: 22px; font-weight: 700; color: #333; padding: 0 0 30px 0; } .mainPic .wrapPic .header-title span{ display: inline-block; padding: 10px 20px; font-weight: 900; color: #fff; text-transform: uppercase; -webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; background: #af0c0c; background: -moz-linear-gradient(left, #af0c0c 0%, #bb3131 100%); background: -webkit-linear-gradient(left, #af0c0c 0%,#bb3131 100%); background: linear-gradient(to right, #af0c0c 0%,#bb3131 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af0c0c', endColorstr='#bb3131',GradientType=1 ); } .mainPic .wrapPic .header-navigation{ padding: 0; margin: 0;} .mainPic .wrapPic .header-navigation li{ list-style: none; } .mainPic .wrapPic .header-navigation li a{ font-size: 18px; text-transform: uppercase; color: #333; display: inline-block; text-decoration: none; padding: 20px 0; vertical-align: middle; } .mainPic .wrapPic .header-navigation li span.header-navigation-ico{ max-width: 40px; display: inline-block; margin: 0 20px 0 0; vertical-align: middle; } .mainPic .wrapPic .header-navigation li span.header-navigation-ico img{ width: 100%; } .mainPic .wrapPic .header-navigation li a:hover{ text-decoration: underline; } /*footer*/ .footer{ padding: 50px 0 0 0; position: relative; } .footer-module-empty .footer:before{ background-position: 200px 20px; background-size: 450px auto;} .footer #carousel-wrap{ padding:20px; margin-bottom: 20px; border: 1px solid #EEEEEE; background-color: #fff; } .footer .columnBlock{ } .footer .columnBlock:after{ content:''; display: block; height: 0; clear: both; } .footer .columnBlock .column{ width: 25%; float:left; padding: 0 20px 0 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .footer .columnBlock .column ul{ margin:0px; padding:0 15px 0 0;} .footer .columnBlock .column ul li{ list-style:none;} .footer .columnBlock .column ul li a{ display:block; padding:3px 0px; text-decoration: none; color:#474747; text-shadow:1px 1px 0px #ededed;} .footer .columnBlock .column ul li a:hover{ text-decoration:underline; color:#666666;} .footer .columnBlock .column ul li a.facebook-link{ background-color: #385898; color: #fff; padding: 10px; display: inline-block; font-size: 16px; font-weight: 700; color: #fff; text-shadow: none; } .footer .columnBlock .column ul li a.facebook-link img{ max-width: 16px; display: inline-block; margin: 0 5px 0 0; } .footer .columnBlock .copy{ clear:both; border-top:1px dotted #8e8e8e; padding:20px 0px; margin:30px 0px 0px 0px; color:#525252; font-size: 12px; } .footer .columnBlock .copy a{color:#525252; text-shadow:1px 1px 0px #ededed; text-decoration:none;} .footer .columnBlock .copy a:hovet{ } .footer .columnBlock .copy .art{ background: url(../image/art.png) no-repeat 5px 5px; display:block; width:80px; padding: 0px 0px 0px 50px; float:right; font-size:11px;} .footer .columnBlock .copy .art span{ display:block; font-size:12px; line-height:10px;} .footer .columnBlock h6{ text-transform:uppercase; color:#2e2e2e; text-shadow:1px 1px 0px #ededed; font-weight: 700; padding: 0 15px 0 0;} /* layout */ #container { background:#fff; width:1400px; position: relative; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; align-content: stretch; } #container:after{ content: ''; height: 0; display: block; clear: both; } #column-left { width: 350px; margin: 0 30px 0 0; min-width: 350px; border-right: 1px solid #e8e8e8; -webkit-box-sizing: border-box; box-sizing: border-box; } #column-left #column-left-inner{ position: relative; z-index: 1; } #column-right { background:#fafafa; border-left:1px solid #e0e0e0; } #column-right #column-right-inner{position: relative; z-index: 2; } #column-right:before{ content:''; display: block; background: #fafafa; width: 179px; height: 100%; position: absolute; right: 0; top: 0; bottom: 0; border-left: 1px solid #e0e0e0;} #content { min-height: 400px; -webkit-box-flex: 1; flex-grow: 1; } #content-inner{ padding: 30px 0; } #column-left + #column-right + #content, #column-left + #content {} #column-right + #content {} #facebook-block{ max-width: 500px; background: url(../image/loading.gif) no-repeat center bottom; } #facebook-block .facebook-title{ background-color: #385898; color: #fff; padding: 10px 15px; display: inline-block; font-size: 16px; font-weight: 700; margin: 0 0 30px 0; text-transform: uppercase; text-decoration: none; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; align-items: stretch; align-content: stretch; } #facebook-block .facebook-title span{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; align-items: center; align-content: stretch; } #facebook-block .facebook-title img{ max-width: 20px; display: block; margin: 0 10px 0 0; } #facebook-block .facebook-title .facebook-link{ text-transform: lowercase; font-size: 12px; padding: 10px; text-decoration: underline; } #facebook-block .facebook-title .facebook-link:hover{ text-decoration: none; } /*left Category Menu*/ .leftCategoryMenu{} .leftCategoryMenuTitle{ font-weight: 700; font-size: 22px; padding: 30px 0 10px 0; } .leftCategoryMenuMobile{ padding: 10px 20px; color: #fff; cursor: pointer; display: none; background: #0b6aa1; background: rgb(0,153,207); background: -moz-linear-gradient(90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); background: -webkit-linear-gradient( 90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); background: linear-gradient( 90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0099cf",endColorstr="#0b6aa1",GradientType=1); } .leftCategoryMenuMobile:before{ content:'≡ '; font-size: 30px; display: inline-block; margin: 0 10px 0 0;} .leftCategoryMenuMobile.mobile-menu-show:before{ content: '× ';} .leftCategoryMenuTitle:after{ content:''; display: block; width: 150px; height: 1px; background-color: #e8e8e8; margin-top: 10px;} .leftCategoryMenu > ul{ padding:0px; margin:0px;} .leftCategoryMenu > ul li{ list-style:none;} .leftCategoryMenu > ul li a{ display:block; padding:10px 55px 10px 16px; text-decoration:none; position: relative; overflow: hidden; } .leftCategoryMenu > ul > li > a{ padding: 5px 15px 5px 0; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; justify-content: flex-start; align-items: center; align-content: stretch; } .leftCategoryMenu > ul > li > a:before{ content:''; display: inline-block; width: 50px; height: 50px; background-position: center center; background-repeat: no-repeat; background-size: 100% auto; margin: 0 15px 0 0; } .leftCategoryMenu > ul > li.categoryid-121 > a:before{ background-image: url(../image/packing-machine.svg); } .leftCategoryMenu > ul > li.categoryid-120 > a:before{ background-image: url(../image/manometercom.svg); } .leftCategoryMenu > ul > li.categoryid-60 > a:before{ background-image: url(../image/gears.svg); } .leftCategoryMenu > ul > li.categoryid-125 > a:before{ background-image: url(../image/warning.svg); } .leftCategoryMenu > ul > li.categoryid-122 > a:before{ background-image: url(../image/machine.svg); } .leftCategoryMenu > ul > li.categoryid-126 > a:before{ background-image: url(../image/tools.svg); } .leftCategoryMenu > ul > li.categoryid-61 > a:before{ background-image: url(../image/switch.svg); } .leftCategoryMenu > ul > li.categoryid-105 > a:before{ background-image: url(../image/loader.svg); } .leftCategoryMenu > ul li a:hover{ color:#000; } .leftCategoryMenu > ul > li ul { padding:0px; margin: 15px 0 15px 0; padding: 20px 0; display: none; background-color: #fafafa; } .leftCategoryMenu > ul > li li { list-style:none;} .leftCategoryMenu > ul > li li:hover{} .leftCategoryMenu > ul > li li a{ display:block; color: #787878; padding:5px 10px 5px 60px; text-decoration:none;} .leftCategoryMenu > ul > li li a:hover{ color:#fff; background: #444;} .leftCategoryMenu > ul > li a.active { font-weight: bold; } .leftCategoryMenu > ul > li li a.active:before { content:''; display: block; width: 6px; height: 6px; position: absolute; right: 15px; top: 50%; margin: -3px 0 0 0; background-color: transparent; border-right: 2px solid #555; border-top: 2px solid #555; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); } .leftCategoryMenu > ul > li li a:after{ content:''; display: block; width: 4px; height: 4px; position: absolute; left: 45px; top: 50%; margin: -2px 0 0 0; border-radius: 5px; background-color: #999; } .leftCategoryMenu > ul > li a.active + ul { display: block;} /*custom_form*/ span.checkbox, span.radio { display: inline-block; cursor: pointer; width: 17px; height: 17px; margin:0px 10px 5px 0px; vertical-align:middle;} span.checkbox { background: url(../image/form_check_white.png) no-repeat; } span.radio {background: url(../image/form_radio_white.png) no-repeat; } span.select { position: absolute; width: 158px; height: 21px; padding: 0 24px 0 8px; color: #fff; background: url(./img/select.png) no-repeat; overflow: hidden; } .filter span.checkbox { background: url(../image/form_check_black.png) no-repeat; } .filter span.radio {background: url(../image/form_radio_black.png) no-repeat; } /*slideshow*/ .category_module .slideshow-module { margin: 0 auto; max-width: 1020px; } .category_module .slideshow-module .swiper-container-horizontal>.swiper-pagination-bullets, .category_module .slideshow-module .swiper-pagination-custom, .swiper-pagination-fraction{ bottom: 20px; } .category_module .slideshow-module .swiper-container-horizontal>.swiper-pagination-bullets, .category_module .slideshow-module .swiper-pagination-custom, .category_module .slideshow-module .swiper-pagination-fraction{ color: #fff; } .category_module .slideshow-module .swiper-pagination-bullet-active{ background-color: #fff; } .category_module .slideshow-module .swiper-button-next{ right: -50px;} .category_module .slideshow-module .swiper-button-prev{ left: -50px; } .category_module .slideshow-module:hover .swiper-button-next{ right: 0;} .category_module .slideshow-module:hover .swiper-button-prev{ left: 0; } .category_module .slideshow-module .swiper-button-next, .category_module .slideshow-module .swiper-button-prev{ margin-top: -35px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .category_module .slideshow-module .swiper-button-prev, .category_module .slideshow-module .swiper-container-rtl .swiper-button-next, .category_module .slideshow-module .swiper-button-next, .category_module .slideshow-module .swiper-container-rtl .swiper-button-prev{ padding: 10px; background-color: rgba(51,51,51,0.5); border-radius:3px; } .category_module .slideshow-module .swiper-slide a{ display: block; } .category_module .slideshow-module .swiper-slide img{ width: 100%; display: block; } .footer-module{ padding: 0 0 20px 0; position: relative; z-index: 2;} .footer-module h2{ font-size: 16px; color: #333; font-weight: 700; text-transform: uppercase; } /*carousel-wrap*/ #carousel-wrap {} #carousel-wrap .swiper-container-horizontal>.swiper-pagination-bullets, #carousel-wrap .swiper-pagination-custom, #carousel-wrap .swiper-pagination-fraction{ color: #fff; } #carousel-wrap .swiper-pagination-bullet-active{ background-color: #fff; } #carousel-wrap .swiper-button-next{ right: -50px;} #carousel-wrap .swiper-button-prev{ left: -50px; } #carousel-wrap:hover .swiper-button-next{ right: 0;} #carousel-wrap:hover .swiper-button-prev{ left: 0; } #carousel-wrap .swiper-button-next, #carousel-wrap .swiper-button-prev{ margin-top: -25px; height: 26px; background-size: 20px auto; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #carousel-wrap .swiper-button-prev, #carousel-wrap .swiper-container-rtl .swiper-button-next, #carousel-wrap .swiper-button-next, #carousel-wrap .swiper-container-rtl .swiper-button-prev{ padding: 10px; background-color: rgba(51,51,51,0.5); border-radius:3px; } #carousel-wrap .swiper-slide a{ display: block; } #carousel-wrap .swiper-slide img{ width: 100%; display: block; } #carousel-wrap .swiper-button-prev, #carousel-wrap .swiper-container-rtl .swiper-button-next, #carousel-wrap .swiper-button-next, #carousel-wrap .swiper-container-rtl .swiper-button-prev{ padding: 10px; background-color: rgba(51,51,51,0.5); border-radius:3px; } #carousel-wrap .swiper-slide a{ display: block; padding: 0 15px; } #carousel-wrap .swiper-slide img{ width: 100%; display: block; } /*featured*/ .featured{ margin: 0 -15px; padding: 0 0 50px 0; } .featured:after{ content:''; height: 0; display: block; clear: both; } .featured .featuredHeading{ color:#080a14; text-transform:uppercase; margin: 0 15px 30px 15px; font-size: 18px; font-weight: 700; position: relative; } .featured .featuredHeading:before{ content:''; border-bottom:1px solid #efefef; height: 0; position: absolute; left:180px; top: 50%; right: 0; } .featured .featuredHeading .featuredHeadingTitle{ display: inline-block; position: relative; z-index: 2; padding: 0 30px 0 0; } .featured .featuredContent .featProduct{ float:left; width:25%; } .featured .featuredContent .featProduct:nth-child(4n+1){ clear: both; } .featured .featuredContent .featProduct .image{ padding:3px; background:#f0f0f0; margin: 0 15px;} .featured .featuredContent .featProduct .image img{ width: 100%; display: block; } .featured .featuredContent .featProduct .image:hover{ background:#e3e3e3;} .featured .featuredContent .featProduct .image a{border:1px solid #d3d8dc; display: block; background:#FFFFFF; text-align:center; overflow:hidden;} .featured .featuredContent .featProduct .image img{ border:none;} .featured .featuredContent .featuredEnd{ margin:0px !important; } .featured .featuredContent .featProduct .code { font-weight:300; color:#8a8a8a; text-align:center; font-style:italic; padding:10px 0px; margin: 0 15px; overflow:hidden;} .featured .featuredContent .featProduct .name { font-weight:600; color:#0b6aa1; text-transform:uppercase; text-align:center; margin: 0 15px;} .featured .featuredContent .featProduct .name a{ color:#0b6aa1; text-decoration:none;} .featured .featuredContent .featProduct .name a:hover{ color:#0b6aa1;} #maps{ margin: 0; position: relative;} #maps iframe{ width: 100%; height: 400px; margin: 0; display: block; } #maps .maps-block{ text-align: left; position: absolute; top: 0; left: 0; color: #fff; background: rgb(0,153,207); padding: 50px; background: -moz-linear-gradient(90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); background: -webkit-linear-gradient(90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); background: linear-gradient(90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0099cf",endColorstr="#0b6aa1",GradientType=1); } #maps .maps-block .maps-title{ display: inline-block; font-size: 28px; font-weight: 900; text-transform: uppercase; white-space:nowrap; padding: 0 0 15px 0; } #maps .maps-block .maps-address{ } /*notification*/ #notification{position: fixed; left: 0px; top: 0px; width: 100%; z-index: 10; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; filter: alpha(opacity=85); -moz-opacity: 0.85; -khtml-opacity: 0.85; opacity: 0.85;} .success, .warning, .attention, .information { padding: 10px 10px 10px 33px; color: #555555;} .success { background: #EAF7D9 url(../image/success.png) 10px center no-repeat; border-bottom: 1px solid #BBDF8D;} .warning { background: #FFD1D1 url(../image/warning.png) 10px center no-repeat; border-bottom: 1px solid #F8ACAC;} .attention { background: #FFF5CC url(../image/attention.png) 10px center no-repeat; border-bottom: 1px solid #F2DD8C;} .success .close, .warning .close, .attention .close, .information .close { float: right; padding-top: 4px; padding-right: 4px; cursor: pointer;} .mini-cart-info table { border-collapse: collapse; width: 100%; margin-bottom: 5px; } .mini-cart-info td { color: #333; vertical-align: top; padding: 10px 5px; border-bottom: 1px solid #EEEEEE; } .mini-cart-info .image img { border: 1px solid #EEEEEE; text-align: left; } .mini-cart-info .name small { color: #666; } .mini-cart-info .quantity { text-align: right; } .mini-cart-info td.total { text-align: right; } .mini-cart-info .remove { text-align: right; } .mini-cart-info .remove img { cursor: pointer; } .mini-cart-total { text-align: right; } .mini-cart-total table { border-collapse: collapse; display: inline-block; margin-bottom: 5px; } .mini-cart-total td { color: #333; padding: 4px; } /*===header===*/ #header{ background: #0b6aa1; padding: 20px; background: rgb(0,153,207); background: -moz-linear-gradient(90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); background: -webkit-linear-gradient(90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); background: linear-gradient(90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0099cf",endColorstr="#0b6aa1",GradientType=1); } .current-page #header{ background: #0b6aa1 url(../image/head.jpg) no-repeat center center; background-size: cover; } #header #header-top{ background-color: #fff; margin: 0 auto; max-width: 1600px; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; align-items: stretch; align-content: stretch; -webkit-box-shadow: 0px 8px 15px rgba(0,0,0,0.2); -moz-box-shadow: 0px 8px 15px rgba(0,0,0,0.2); box-shadow: 0px 8px 15px rgba(0,0,0,0.2); } #header #header-top #header-left, #header #header-top #header-right{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; align-items: center; align-content: stretch; } #header #header-top #logo a{ padding: 10px 30px; font-size: 20px; color: #333; text-decoration: none; text-transform: uppercase; font-weight: 900; font-style: italic; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; justify-content: flex-start; align-items: center; align-content: center; } #header #header-top #logo img{ display: block; max-width: 50px; margin: 0 15px 0 0; } #header #header-top #header-nav ul{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; justify-content: flex-start; align-items: center; align-content: center; } #header #header-top #header-nav ul li{ list-style: none; position: relative; } #header #header-top #header-nav ul li a{ display: block; padding: 10px; text-decoration: none; font-weight: 600; color: #333; } #header #header-top #header-nav ul li a:hover{ background: #0b6aa1; color: #fff; } #header #header-top #header-nav ul li ul{ display: none; background-color: #fff; z-index: 2; position: absolute; top: 100%; left: 0; padding: 0; margin: 0; width: 200px; -webkit-box-shadow: 0px 8px 15px -5px rgba(0,0,0,0.2); -moz-box-shadow: 0px 8px 15px -5px rgba(0,0,0,0.2); box-shadow: 0px 8px 15px -5px rgba(0,0,0,0.2);} #header #header-top #header-nav ul li ul li{ padding: 0; margin: 0; } #header #header-top #header-nav ul li ul li a{ font-weight: 400;} #header #header-top #header-nav ul li:hover ul{ display: block;} #header #header-top #header-search{ position: relative; margin: 0 40px 0 0; width: 200px; height: 33px; } #header #header-top #header-search input{ width: 100%; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #header #language{ padding: 0 10px 0 0; } #header #language img{ cursor: pointer; } #header #header-top #header-search .button-search{ position: absolute; right: 0; top: 0; width: 33px; height: 33px; text-indent: 999px; overflow: hidden; background: url(../image/search.svg) no-repeat center center; cursor: pointer; -webkit-background-size: 50% auto; -moz-background-size: 50% auto; background-size: 50% auto; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #header #header-top #header-search .header-search-inner{ position: absolute; top: 0; right: 0; height: 33px; width: 200px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #header #header-top #header-search.header-search-show{} #header #header-top #header-search.header-search-show .header-search-inner{ width: 950px; top: -10px; } #header #header-top #header-search.header-search-show .header-search-inner input{ font-size: 20px; padding: 12px 15px; } #header #header-top #header-search.header-search-show .header-search-inner .button-search{ width: 49px; height: 49px; } #header #header-top #header-phone{ } #header #header-top #header-phone a{ display: block; font-weight: 700; color: #fff; text-decoration: none; vertical-align: middle; background-color: #ffbb12; color: #fff; padding: 35px; background: rgb(255,176,17); background: -moz-linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); background: -webkit-linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); background: linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); } .current-page #header #header-top #header-phone a { background: #0b6aa1;} #header #header-top #header-phone a:before{ content:''; display: inline-block; width: 20px; height: 20px; vertical-align: middle; margin: 0 15px 0 0; background: url(../image/phone.svg) no-repeat center center; cursor: pointer; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; background-size: 100% auto; } #header #header-top #header-phone a span{ font-weight: 300; } #header .header-title{ font-size: calc(1.8vw + 1.8vh + 1vmin); font-weight: 700; line-height: 100%; padding: 9vh 0; color: #fff; font-style: italic; text-shadow: 5px 5px 20px rgba(0,0,0,0.2); } #header .header-title b{ display: block; font-weight: 900; text-transform: uppercase; } #header .header-title .header-title-span{ background-color: #f5ba31; background-color: transparent; display: inline-block; padding: 10px; padding: 0; display: block; } .home-page{ padding: 7vh 0;} .home-page .home-page-inner{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; align-content: center; } .home-page .home-left{ width: 60%; } .home-page .home-right{ width: 40%; padding: 0 0 0 50px; -webkit-box-sizing: border-box; box-sizing: border-box; } .home-page .home-category{ padding: 0 0 2vh 0;} .home-page .home-category ul{ display: block; padding: 0; margin: 0; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; align-content: stretch; } .home-page .home-category ul li{ list-style-type: none; width: 25%; } .home-page .home-category ul li a{ display: block; text-align: center; text-decoration: none; font-weight: 600; color: #333; height: 100%; padding: 2vh 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .home-page .home-category ul li a:hover{ -webkit-box-shadow: 0px 8px 15px #DDDDDD; -moz-box-shadow: 0px 8px 15px #DDDDDD; box-shadow: 0px 8px 15px #DDDDDD; } .home-page .home-category ul li a .home-navigation-ico{ display: block; margin: 0 0 2vh 0; } .home-page .home-category ul li a .home-navigation-ico img{ display: block; margin: 0 auto; max-width: 100px; } #header #cart .checkout { padding: 20px 0; text-align: right; clear: both; } #header #cart .checkout a{ margin: 0 0 0 10px; } #header #cart .checkout a:hover{ text-decoration: none; } #header #cart .empty { padding-top: 50px; text-align: center;} #header #welcome { position: absolute; top: 47px; right: 0px; z-index: 5; width: 298px; text-align: right; color: #999999; } #header .links { position: absolute; right: 0px; bottom: 3px; font-size: 10px; padding-right: 10px; } #header .links a { float: left; display: block; padding: 0px 0px 0px 7px; color: #38B0E3; text-decoration: none; font-size: 12px; } #header .links a + a { margin-left: 8px; border-left: 1px solid #CCC; } /* menu */ #menu { background: #585858; border-bottom: 1px solid #333; height: 37px; margin-bottom: 15px; -webkit-border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -khtml-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px; -webkit-box-shadow: 0px 2px 2px #DDDDDD; -moz-box-shadow: 0px 2px 2px #DDDDDD; box-shadow: 0px 2px 2px #DDDDDD; padding: 0px 5px; } #menu ul { list-style: none; margin: 0; padding: 0; } #menu > ul > li { position: relative; float: left; z-index: 20; padding: 6px 5px 5px 0px; } #menu > ul > li:hover { } #menu > ul > li > a.active { background: #333; } #menu > ul > li > a { font-size: 13px; color: #FFF; line-height: 14px; text-decoration: none; display: block; padding: 6px 10px 6px 10px; margin-bottom: 5px; z-index: 6; position: relative; } #menu > ul > li:hover > a { background: #333; -webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; } #menu > ul > li > div { display: none; background: #FFFFFF; position: absolute; z-index: 5; padding: 5px; border: 1px solid #333; -webkit-border-radius: 0px 0px 5px 5px; -moz-border-radius: 0px 0px 5px 5px; -khtml-border-radius: 0px 0px 5px 5px; border-radius: 0px 0px 5px 5px; background: url('../image/menu.png'); } #menu > ul > li:hover > div { display: table; } #menu > ul > li > div > ul { display: table-cell; } #menu > ul > li ul + ul { padding-left: 20px; } #menu > ul > li ul > li > a { text-decoration: none; padding: 4px; color: #FFFFFF; display: block; white-space: nowrap; min-width: 120px; } #menu > ul > li ul > li > a:hover { background: #333; } #menu > ul > li > div > ul > li > a { color: #FFFFFF; } .breadcrumb { color: #a4a4a4; padding:0 0 20px 0; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; align-items: center; align-content: stretch; } .breadcrumb a { color:#a4a4a4; padding: 0 5px; font-size: 12px; } .breadcrumb a:nth-child(1){ background: url(../image/home.svg) no-repeat center center; display: inline-block; width: 14px; height: 14px; overflow: hidden; padding: 0; margin: 0 5px 0 0; text-indent:999px; background-size: 100% auto; } .required { color: #FF0000; font-weight: bold; } .error { display: block; color: #FF0000; } .help { color: #999; font-size: 10px; font-weight: normal; display: block; } table.form { width: 100%; border-collapse: collapse; margin-bottom: 20px; } table.form tr td:first-child { width: 150px; } table.form > * > * > td { color: #333; } table.form td { padding: 4px; } input.large-field, select.large-field { width: 300px; } table.list { border-collapse: collapse; width: 100%; border-top: 1px solid #DDDDDD; border-left: 1px solid #DDDDDD; margin-bottom: 20px; } table.list td { border-right: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; } table.list thead td { background-color: #EFEFEF; padding: 0px 5px; } table.list thead td a, .list thead td { text-decoration: none; color: #222222; font-weight: bold; } table.list tbody td { vertical-align: top; padding: 0px 5px; } table.list .left { text-align: left; padding: 7px; } table.list .right { text-align: right; padding: 7px; } table.list .center { text-align: center; padding: 7px; } table.radiora { width: 100%; border-collapse: collapse; } table.radio td { padding: 5px; vertical-align: top; } table.radio td label { display: block; } table.radio tr td:first-child { width: 1px; } table.radio tr td:first-child input { margin-top: 1px; } table.radio tr.highlight:hover td { background: #F1FFDD; cursor: pointer; } .pagination{ border-top: 1px solid #EEEEEE; padding: 30px 15px 30px 0px; display: block; clear: both; } .pagination:after{ content:''; display: block; height: 0; clear: both; } .pagination .links { float: left; list-style:none; padding:0px; margin:0px;} .pagination .links li { display:inline-block;} .pagination .links li a{ margin-right:4px;} .pagination .links a { padding:8px 10px; display:inline-block; color: #747474; text-decoration:none; margin: 1px 0; -webkit-box-shadow: 1px 1px 0px 0px #fff; -moz-box-shadow: 1px 1px 0px 0px #fff; box-shadow: 1px 1px 0px 0px #fff; } .pagination .links a:hover{ background: #E3E3E3; color: #666; } .pagination .links b, .pagination .links li a.active { display:inline-block; font-weight: bold; text-decoration: none; color: #269BC6; margin:0px 2px; background:#4d4e4f ; color:#CCCCCC; cursor:default; padding:7px 15px;} .pagination .results { float: right; color:#666666; text-align:right; line-height:12px; } .pagination .results span{ font-size:10px; } /* button */ a.button, input.button { cursor: pointer; color: #FFFFFF; font-size: 16px; cursor: pointer; font-weight: 600; border: none; background: rgb(255,176,17); background: -moz-linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); background: -webkit-linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); background: linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffb011",endColorstr="#ffcf15",GradientType=1); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a.button { display: inline-block; text-decoration: none; padding: 5px 15px ;} input.button { margin: 0; padding: 10px 15px ;} a.button:hover, input.button:hover { background-color: rgb(255,176,17); text-decoration: none; -webkit-box-shadow: 0px 8px 15px -10px #c48508; -moz-box-shadow: 0px 8px 15px -10px #c48508; box-shadow: 0px 8px 15px -10px #c48508; } .buttons { padding: 20px 0px 0px 0px; height:40px;} .buttons .left {float: left; text-align: left;} .buttons .right { float: right; text-align: right;} .buttons .center { text-align: center; margin-left: auto; margin-right: auto;} .htabs { line-height: 16px; } .htabs:after{ content:''; display: block; height: 0; clear: both; } .htabs a { padding: 15px; float: left; font-size: 14px; font-weight: bold; text-align: center; text-decoration: none; color: #333; margin-right: 2px; display: none; } .htabs a.selected { padding-bottom: 7px; background: #FFFFFF; } .tab-content { border-top: 1px solid #DDDDDD; padding: 30px 0; z-index: 2; overflow: auto; line-height:20px;} /* table-attribute */ .tab-content table{ border: 1px solid #ddd; border-collapse: initial; } .tab-content td{ font-size: 14px; border: none !important; font-weight: 400; padding: 7px 10px !important; } .tab-content thead tr{} .tab-content thead tr td{ background-color: #9b9f9e; color: #fff; text-transform: uppercase; font-size: 12px; padding: 15px 0 !important;} .tab-content tr td:first-child{ padding-left: 10px !important; } .tab-content tr td:last-child{ padding-right: 10px !important;} .tab-content tbody{} .tab-content tbody tr{} .tab-content tbody tr td{ background-color: #fffdfa; } .tab-content tbody tr td:nth-child(2n){ background-color: #faf8f5; } .tab-content tbody tr:nth-child(2n) td{ background-color: #f2f0ed; } .tab-content tbody tr:nth-child(2n) td:nth-child(2n){ background-color: #f0eeeb; } .tab-content tbody + tbody{ border: none; } .tab-content tbody + tbody:nth-child(2n) tr td{ background-color: #f2f0ed; } .tab-content tbody + tbody:nth-child(2n) tr td:nth-child(2n){ background-color: #f0eeeb; } /* box */ .box { margin-bottom: 20px;} .box .box-heading { border-bottom: 1px solid #DBDEE1; background: url(../image/background.png) repeat-x; padding: 8px 10px 7px 10px; font-size: 12px; font-weight: bold; line-height: 14px; color: #333;} .box .box-content { padding: 10px;} #column-right ul{ margin:0px; padding:5px 10px;} #column-right ul li{ list-style:none;} #column-right ul li a{ display:block; padding:5px 0px; color:#666; text-shadow:1px 1px 0px #fff;} #column-right ul li a:hover{ color:#333333;} /* box products */ /*.relatedProduct*/ .relatedProduct{ padding: 0 0 20px 0;} .relatedProduct:after{ content:''; display: block; height: 0; clear: both; } .relatedProduct .product-item:nth-child(4){ display: none; } .box-product { width: 100%; overflow: auto; } .box-product > div { width: 130px; display: inline-block; vertical-align: top; margin-right: 20px; margin-bottom: 20px; } #column-left + #column-right + #content .box-product > div { width: 119px; } .box-product .image { display: block; margin-bottom: 0px; } .box-product .image img { padding: 3px; border: 1px solid #E7E7E7; } .box-product .name a { color: #38B0E3; font-weight: bold; text-decoration: none; display: block; margin-bottom: 4px; } .box-product .price { display: block; font-weight: bold; color: #333333; margin-bottom: 4px; } .box-product .price-old { color: #F00; text-decoration: line-through; } .box-product .price-new { font-weight: bold; } .box-product .rating { display: block; margin-bottom: 4px; } /* content */ #content .content { } #content .content .left { float: left; width: 49%; } #content .content .right { float: right; width: 49%;} /* category */ .category-info { overflow: auto; margin-bottom: 20px; padding:30px 20px 0px 0px; max-width: 600px; border-top: 1px solid #EEEEEE; } .category-info .image { float: left; padding: 5px; margin: 0 15px 10px 0; max-width: 100px; border: 1px solid #E7E7E7;} .category-info .image img{ display: block; width: 100%; } .category-list { overflow: auto; margin-bottom: 20px;} .category-list ul { float: left; width: 18%; } .category-list .div a { text-decoration: underline; font-weight: bold; } /* manufacturer */ .manufacturer-info{ overflow:auto;} .manufacturer-list { padding: 5px; overflow: auto; margin-bottom: 20px; } .manufacturer-heading { font-size: 15px; font-weight: bold; padding: 5px 8px; margin-bottom: 6px; } .manufacturer-heading:before{ content:'#'; } .manufacturer-content { padding: 8px; } .manufacturer-list ul { float: left; width: 25%; margin: 0; padding: 0; list-style: none; margin-bottom: 10px; } .manufacturer-list ul li{ padding: 15px; } .manufacturer-list ul li img{width: 100%; max-width: 200px;} .manufacturer-list ul li a{ display: block; text-align: center; } .heading_title_manufac{ max-width: 200px; float: right;} .heading_title_manufac img{ width: 100%; } /* product */ .title{ border-bottom: 1px solid #EEEEEE; margin-bottom:20px;} .title h1{ font-size:28px; color:#0b6aa1; font-weight: 700; } .title .product-filter { float:right; height:40px; position:relative;} .title .product-filter .productSort{ display:block; padding:5px 30px 5px 10px; color:#393939; background: url(../image/sort.png) no-repeat 111px 10px; } .title .product-filter .productSort:hover{ background-color:#f7f7f7; } .title .product-filter .limitBlock{ display:none; background:#f2f2f2; width:613px; right:0px; top:0px; padding:7px 7px 0px 0px; height:33px; position:absolute; z-index:2;} .product-filter .sort b, .product-filter .limit b{ display:inline-block; padding:5px 0px 0px 0px; font-size: 12px; } .product-filter .sort { float: right; color: #333;} .product-filter .limit { margin-left: 15px; float: right; color: #333;} .product-compare { padding-top: 6px; margin-bottom: 25px; font-weight: bold; } .product-compare a { text-decoration: none; font-weight: bold; } .product-list > div { overflow: auto; margin-bottom: 15px; } .product-list .right { float: right; margin-left: 15px; } .product-list > div + div { border-top: 1px solid #EEEEEE; padding-top: 16px; } .product-list .image { float: left; margin-right: 10px; } .product-list .image img { padding: 3px; border: 1px solid #E7E7E7; } .product-list .name { margin-bottom: 3px; } .product-list .name a { color: #38B0E3; font-weight: bold; text-decoration: none; } .product-list .description { line-height: 15px; margin-bottom: 5px; color: #4D4D4D; } .product-list .rating { color: #7B7B7B; } .product-list .price { float: right; height: 50px; margin-left: 8px; text-align: right; color: #333333; font-size: 12px; } .product-list .price-old { color: #F00; text-decoration: line-through; } .product-list .price-new { font-weight: bold; } .product-list .price-tax { font-size: 12px; font-weight: normal; color: #BBBBBB; } .product-list .cart { margin-bottom: 3px; } .product-list .wishlist, .product-list .compare { margin-bottom: 3px; } .product-list .wishlist a { color: #333333; text-decoration: none; padding-left: 18px; display: block; background: url('../image/add.png') left center no-repeat; } .product-list .compare a { color: #333333; text-decoration: none; padding-left: 18px; display: block; background: url('../image/add.png') left 60% no-repeat; } .product-filterSearch{ border-bottom:1px solid #EEEEEE; margin-bottom:20px; padding: 0 0 20px 0; clear: both;} .product-filterSearch:after{ content:''; display: block; height: 0; clear: both; } .product-filterSearch .limit b, .product-filterSearch .sort b{ display:inline-block; padding:4px 4px 0px 0px;} .product-filterSearch .limit{ float:right; padding-left:20px;} .product-filterSearch .sort{ float:right;} .product-grid { margin: 0 -30px 0 0; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; align-content: stretch; } .product-grid-search.product-grid > div.product-item { width: 25%;} .product-grid > div.product-item { width: 33.3333%; display: block; margin-bottom: 30px; padding: 0 30px 0 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .product-grid > div.paddingRight{ } #column-left + #column-right + #content .product-grid > div { width: 125px;} .product-grid .image{ display: block; float:left; width:100%; margin: 0px 0 20px 0px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .product-grid .image img{ width: 100%; display: block; } .product-grid .product-item:hover .image{ -webkit-box-shadow: 0px 8px 15px #DDDDDD; -moz-box-shadow: 0px 8px 15px #DDDDDD; box-shadow: 0px 8px 15px #DDDDDD; } .product-grid .image a{border:1px solid #F2F2F2; display: block; background:#FFFFFF; text-align:center; overflow:hidden;} .product-grid .image img{ border:none; } .product-grid .namePad{} .product-grid .code { font-weight:300; color:#8a8a8a; font-style:italic; padding:0px 0px 10px 0px; overflow:hidden; font-size: 12px; } .product-grid h2.name { font-weight:600; color:#0b6aa1; text-transform:uppercase; font-size:14px; line-height:1em; padding:0px 0px 10px 0px; margin-bottom: 0; } .product-grid h2.name a{ color:#0b6aa1; text-decoration:none;} .product-grid h2.name a:hover{ color:#0b6aa1;} .product-grid .rating { display: block; margin-bottom: 4px; } .product-grid .price { display: block; color: #5a3d48; margin-bottom: 4px;font-weight:300; font-size:14px;} .product-grid .price-old { color: #999; text-decoration: line-through; } .product-grid .price-new { font-weight: bold; } .product-grid .price .price-tax { display: none; } .product-grid .cart { margin-bottom: 3px; } .product-grid .cart a{ display: inline-block; cursor: pointer; color: #FFFFFF; font-size: 16px; cursor: pointer; font-weight: 500; border: none; padding: 10px 20px; text-decoration: none; background: rgb(255,176,17); background: -moz-linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); background: -webkit-linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); background: linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffb011",endColorstr="#ffcf15",GradientType=1); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .product-grid .cart a:hover { background-color: rgb(255,176,17); text-decoration: none; -webkit-box-shadow: 0px 8px 15px -10px #c48508; -moz-box-shadow: 0px 8px 15px -10px #c48508; box-shadow: 0px 8px 15px -10px #c48508; } .product-grid .wishlist, .product-grid .compare { margin-bottom: 3px; } .product-grid .wishlist a { color: #333333; text-decoration: none; padding-left: 18px; display: block; background: url('../image/add.png') left center no-repeat; } .product-grid .compare a { color: #333333; text-decoration: none; padding-left: 18px; display: block; background: url('../image/add.png') left center no-repeat; } /* Product */ .product-info { margin-bottom: 20px; } .product-info:after{ content:''; display: block; height: 0; clear: both; } .product-info > .left { float: left; margin-right: 15px; max-width: 50%; } .product-info > .left:after{ content:''; display: block; height: 0; clear: both; } .product-info > .left + .right { overflow: hidden; } .product-info .description { margin-bottom: 10px; line-height: 20px; font-size: 14px; } .product-info .description span { color: #666;} .product-info .description a { color: #D6D6D6;} .product-info .price { overflow: auto; border-bottom: 1px solid #E7E7E7; padding: 0px 5px 10px 5px; font-size: 15px; font-weight: bold; color: #5A3D48;} .product-info .price-old { color: #999999; text-decoration: line-through;} .product-info .price-new {} .product-info .price-tax { font-size: 12px; font-weight: normal; color: #999;} .product-info .price .reward { font-size: 12px; font-weight: normal; color: #999;} .product-info .price .discount { font-weight: normal; font-size: 12px; color: #4D4D4D;} .product-info .options { border-bottom: 1px solid #E7E7E7; padding: 0px 5px 10px 5px; margin-bottom: 10px; color: #333;} h2.optionsTitle{ font-size:14px;margin:0px; padding:5px; font-weight:bold;} .product-info .option-image { margin-top: 3px; margin-bottom: 10px;} .product-info .option-image label { display: block; width: 100%; height: 100%; } .product-info .option-image img { margin-right: 5px; border: 1px solid #CCCCCC; cursor: pointer; } .product-info .cart { border-bottom: 1px solid #E7E7E7; padding: 10px 5px 10px 5px; margin-bottom: 20px; color: #4D4D4D; overflow: auto; } .product-info .cart div { float: left; vertical-align: middle; } .product-info .cart div > span { padding-top: 7px; display: block; color: #999; } .product-info .cart .minimum { padding-top: 5px; font-size: 11px; color: #999; clear: both; } .product-info .review { color: #4D4D4D; border-top: 1px solid #E7E7E7; border-left: 1px solid #E7E7E7; border-right: 1px solid #E7E7E7; margin-bottom: 10px; } .product-info .review > div { padding: 8px; border-bottom: 1px solid #E7E7E7; line-height: 20px; } .product-info .review > div > span { color: #38B0E3; } .product-info .review .share { overflow: auto; line-height: normal; } .product-info .review .share a { text-decoration: none; } .product-infos{ background-color: #fafafa; padding: 20px; } .product-gallery{} .product-gallery:after{ content:''; display: block; height: 0; clear: both; } .product-gallery .image-item{ width: 16.6666%; float: left; -webkit-box-sizing: border-box; box-sizing: border-box; } .product-gallery .image-item a{ text-decoration: underline; color: #000; } .product-gallery .image-item a:hover{ text-decoration: none; } .product-gallery .image-item a.gallery_magnific{ display: block; border: 1px solid #F2F2F2; margin: 0 15px 15px 0; text-decoration: none; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .product-gallery .image-item a.gallery_magnific:hover{ -webkit-box-shadow: 0px 8px 15px #DDDDDD; -moz-box-shadow: 0px 8px 15px #DDDDDD; box-shadow: 0px 8px 15px #DDDDDD; } .product-gallery .image-item img{ width: 100%; display: block; } .product-gallery .image-item.image-item-main{ width: 50%; border: none; } .product-gallery .image-item.product-infos{ border-bottom: 1px solid #e8e8e8; margin-bottom: 20px; width: 50%; } .product-gallery .image-item.image-item-main a.gallery_magnific{ margin-bottom: 0; } .product-gallery .image-additional{} .product-gallery .product-buy a{ display: inline-block; cursor: pointer; color: #FFFFFF; font-size: 16px; cursor: pointer; font-weight: 700; border: none; padding: 20px 30px; text-decoration: none; background: rgb(255,176,17); background: -moz-linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); background: -webkit-linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); background: linear-gradient(90deg, rgba(255,176,17,1) 0%, rgba(255,207,21,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffb011",endColorstr="#ffcf15",GradientType=1); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .product-gallery .product-buy a:hover { background-color: rgb(255,176,17); text-decoration: none; -webkit-box-shadow: 0px 8px 15px -10px #c48508; -moz-box-shadow: 0px 8px 15px -10px #c48508; box-shadow: 0px 8px 15px -10px #c48508; } .review-list { padding: 10px; overflow: auto; margin-bottom: 20px; border: 1px solid #EEEEEE; } .review-list .author { float: left; margin-bottom: 20px; } .review-list .rating { float: right; margin-bottom: 20px; } .review-list .text { clear: both; } .attribute { border-collapse: collapse; width: 100%; border-top: 1px solid #DDDDDD; border-left: 1px solid #DDDDDD; margin-bottom: 20px; } .attribute thead td, .attribute thead tr td:first-child { color: #333; font-size: 14px; font-weight: bold; background: #F7F7F7; text-align: left; } .attribute tr td:first-child { color: #333; font-weight: bold; text-align: right; width: 20%; } .attribute td { padding: 7px; color: #333; text-align: center; vertical-align: top; border-right: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; } .compare-info { border-collapse: collapse; width: 100%; border-top: 1px solid #DDDDDD; border-left: 1px solid #DDDDDD; margin-bottom: 20px; } .compare-info thead td, .compare-info thead tr td:first-child { color: #333; font-size: 14px; font-weight: bold; background: #F7F7F7; text-align: left; } .compare-info tr td:first-child { color: #333; font-weight: bold; text-align: right; } .compare-info td { padding: 7px; width: 20%; color: #4D4D4D; text-align: center; vertical-align: top; border-right: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; } .compare-info .name a { font-weight: bold; } .compare-info .price-old { font-weight: bold; color: #F00; text-decoration: line-through; } .compare-info .price-new { font-weight: bold; } /*tags*/ .tags{ padding:20px 0px;} /* wishlist */ .wishlist-info table { width: 100%; border-collapse: collapse; border-top: 1px solid #DDDDDD; border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD; margin-bottom: 20px; } .wishlist-info td { padding: 7px; } .wishlist-info thead td { color: #4D4D4D; font-weight: bold; background-color: #F7F7F7; border-bottom: 1px solid #DDDDDD; } .wishlist-info thead .image { text-align: center; } .wishlist-info thead .name, .wishlist-info thead .model, .wishlist-info thead .stock { text-align: left; } .wishlist-info thead .quantity, .wishlist-info thead .price, .wishlist-info thead .total, .wishlist-info thead .action { text-align: right; } .wishlist-info tbody td { vertical-align: top; border-bottom: 1px solid #DDDDDD; } .wishlist-info tbody .image img { border: 1px solid #DDDDDD; } .wishlist-info tbody .image { text-align: center; } .wishlist-info tbody .name, .wishlist-info tbody .model, .wishlist-info tbody .stock { text-align: left; } .wishlist-info tbody .quantity, .wishlist-info tbody .price, .wishlist-info tbody .total, .wishlist-info tbody .action { text-align: right; } .wishlist-info tbody .price s { color: #F00; } .wishlist-info tbody .action img { cursor: pointer; } .login-content { padding-bottom: 20px; overflow: auto;} .login-content .left { float: left; width: 48%; } .login-content .right { float: right; width: 48% } .login-content .left .content, .login-content .right .content { min-height: 190px; } /* orders */ .order-list { margin-bottom: 10px; } .order-list .order-id { width: 49%; float: left; margin-bottom: 2px; } .order-list .order-status { width: 49%; float: right; text-align: right; margin-bottom: 2px; } .order-list .order-content { padding: 10px 0px; display: inline-block; width: 100%; margin-bottom: 20px; border-top: 1px solid #EEEEEE; border-bottom: 1px solid #EEEEEE; } .order-list .order-content div { float: left; width: 33.3%; } .order-list .order-info { text-align: right; } .order-detail { background: #EFEFEF; font-weight: bold; } /* returns */ .return-list { margin-bottom: 10px; } .return-list .return-id { width: 49%; float: left; margin-bottom: 2px; } .return-list .return-status { width: 49%; float: right; text-align: right; margin-bottom: 2px; } .return-list .return-content { padding: 10px 0px; display: inline-block; width: 100%; margin-bottom: 20px; border-top: 1px solid #EEEEEE; border-bottom: 1px solid #EEEEEE; } .return-list .return-content div { float: left; width: 33.3%; } .return-list .return-info { text-align: right; } .return-product { overflow: auto; margin-bottom: 20px; } .return-name { float: left; width: 31%; margin-right: 15px; } .return-model { float: left; width: 31%; margin-right: 15px;} .return-quantity { float: left; width: 31%;} .return-detail {overflow: auto; margin-bottom: 20px;} .return-reason { float: left; width: 31%; margin-right: 15px; } .return-opened { float: left; width: 31%; margin-right: 15px; } .return-opened textarea { width: 98%; vertical-align: top; } .return-captcha { float: left; } .download-list { margin-bottom: 10px; } .download-list .download-id { width: 49%; float: left; margin-bottom: 2px; } .download-list .download-status { width: 49%; float: right; text-align: right; margin-bottom: 2px; } .download-list .download-content { padding: 10px 0px; display: inline-block; width: 100%; margin-bottom: 20px; border-top: 1px solid #EEEEEE; border-bottom: 1px solid #EEEEEE; } .download-list .download-content div { float: left; width: 33.3%; } .download-list .download-info { text-align: right; } /* cart */ .cart-info table { width: 100%; margin-bottom: 15px; border-collapse: collapse; border-top: 1px solid #DDDDDD; border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD; } .cart-info td { padding: 7px; } .cart-info thead td { color: #4D4D4D; font-weight: bold; background: url("../image/button1.jpg") repeat-x 0 0 #E3E3E3; border-bottom: 1px solid #DDDDDD; } .cart-info thead .image { text-align: center; } .cart-info thead .name, .cart-info thead .model, .cart-info thead .quantity { text-align: left; } .cart-info thead .price, .cart-info thead .total { text-align: right; } .cart-info tbody td { vertical-align: top; border-bottom: 1px solid #DDDDDD; } .cart-info tbody .image img { border: 1px solid #DDDDDD; } .cart-info tbody .image { text-align: center; } .cart-info tbody .name, .cart-info tbody .model, .cart-info tbody .quantity { text-align: left; } .cart-info tbody .quantity input[type='image'], .cart-info tbody .quantity img { position: relative; top: 4px; cursor: pointer; } .cart-info tbody .price, .cart-info tbody .total { text-align: right; } .cart-info tbody span.stock { color: #F00; font-weight: bold; } .cart-module > div { display: none; } .cart-total { border-top: 1px solid #DDDDDD; overflow: auto; padding-top: 8px; margin-bottom: 15px; } .cart-total table { float: right; } .cart-total td { padding: 3px; text-align: right; } /* checkout */ .checkout-heading { background: #F8F8F8; border: 1px solid #DBDEE1; padding: 8px; font-weight: bold; font-size: 13px; color: #555555; margin-bottom: 15px; } .checkout-heading a { float: right; margin-top: 1px; font-weight: normal; text-decoration: none; } .checkout-content { padding: 0px 0px 15px 0px; display: none; overflow: auto; } .checkout-content .left { float: left; width: 48%; } .checkout-content .right { float: right; width: 48%; } .checkout-content .buttons { clear: both; } .checkout-product table { width: 100%; border-collapse: collapse; border-top: 1px solid #DDDDDD; border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD; margin-bottom: 20px; } .checkout-product td { padding: 7px; } .checkout-product thead td { color: #4D4D4D; font-weight: bold; background-color: #F7F7F7; border-bottom: 1px solid #DDDDDD; } .checkout-product thead .name, .checkout-product thead .model { text-align: left; } .checkout-product thead .quantity, .checkout-product thead .price, .checkout-product thead .total { text-align: right; } .checkout-product tbody td { vertical-align: top; border-bottom: 1px solid #DDDDDD; } .checkout-product tbody .name, .checkout-product tbody .model { text-align: left; } .checkout-product tbody .quantity, .checkout-product tbody .price, .checkout-product tbody .total { text-align: right; } .checkout-product tfoot td { text-align: right; border-bottom: 1px solid #DDDDDD; } .contact-info { overflow: auto; } .contact-info .left { float: left; width: 48%; } .contact-info .right { float: left; width: 48%; } .operating-contact{ display: inline-block; color: #fff; background-color: #ccc; border-radius: 3px; padding: 5px 10px; margin: 0 0 5px 0;} .operating-contact.operating-output{} .operating-contact.operating-open{ background-color: #690;} .operating-contact.operating-closed{ background-color: #C00;} .icon-soc{ display: inline-block; width: 20px; vertical-align: middle; margin: 0 0 0 10px; } .icon-soc img{ width: 100%; } .sitemap-info { overflow: auto; margin-bottom: 40px; } .sitemap-info .left { float: left; width: 48%; } .sitemap-info .right { float: left; width: 48%; } /* banner */ .banner div { text-align: center; width: 100%; display: none; } .banner div img { margin-bottom: 20px; } /*work ua*/ .workua{ padding: 0; margin: 0; background: url(../image/ajax_loader.gif) no-repeat 50px 50%; min-height:50px; margin-bottom: 30px;} .workua li{ padding: 20px 0; background-color: #fff; list-style: none;} .workua li a{ font-size: 20px; line-height: 25px; } .workua li + li{ padding-top: 0; } .workua li + li:before{ content: ''; display: block; height: 1px; background-color: #ddd; width: 100px; margin-bottom: 20px;} /*certificates-wrap*/ .certificates-wrap{} .certificates-wrap .certificates-row{ width: 100%; } .certificates-wrap .certificates-row:after{ content:''; display: block; height: 0; clear: both; } .certificates-wrap .certificates-item{ width: 50%; float: left;} .certificates-wrap .certificates-item a{ display: block; padding: 15px;} .certificates-wrap .certificates-item img{ width: 100%; } @media (max-width: 1550px) { #header #header-top #header-phone a{ padding: 35px 10px; } } /* responsive */ @media (max-width: 1450px) { #container, .wrapHome, .wrap{ width: 1200px; } .headMenu ul.mainMenu li{ font-size: 12px; } #content{ width: 800px; } #facebook-block{ max-width: 400px; } #header #header-top #header-search{ width: 100px; } #header #header-top #header-search .header-search-inner{ width: 100px; } } @media (max-width: 1350px) { #header #header-top #logo a{ padding: 10px; } #header #header-top #header-nav ul{ padding: 10px; } } @media (max-width: 1250px) { #container, .wrapHome, .wrap{ width: 960px; } body{ font-size:12px; } #header #header-top #logo a{font-size: 16px;} #header #header-top #header-search{ margin-right: 15px; } .current-page #header{ padding: 20px 0; } .header .search{ width: 300px; } .mainPic{ margin: 0 0 30px 0;} .wrapHome{ padding: 0 0 30px 0;} .footer{ padding: 30px 0 0 0;} .featured{ padding: 0 0 30px 0;} #header #header-top #header-nav ul{ padding-left: 0; } #header #header-top #header-search .header-search-inner{ width: 100px; } #header #header-top #header-search.header-search-show .header-search-inner{ width: 380px; } .mainPic{ background-size: auto 300px; background-position: -150px 0; } .mainPic .wrapPic{ height: 350px; } .mainPic .wrapPic .sertf-logo{ right: -106px; top: 18px;} .mainPic .wrapPic .sertf-logo span{ max-width: 50px; } .mainPic .wrapPic .header-title{ padding: 0 0 20px 0;} .mainPic .wrapPic .header-pic-menu{ padding: 10px 0 0 0; } .mainPic .wrapPic .header-title{ font-size: 18px; } .mainPic .wrapPic .header-navigation li a{ padding: 15px 0; font-size: 16px;} .product-grid > div.product-item{ width: 50%; } .title .product-filter .productSort{ background-position: 100px 10px;} .header .phone{ width: 220px; } #column-left{ width: 300px; min-width: 300px; } #content{ width: 650px; } .title h1{ font-size: 22px; } .featured .featuredContent .featProduct .image{ max-width: 200px; margin: 0 auto;} .featured .featuredContent .featProduct{ width: 50%; margin-bottom: 15px; } .featured .featuredContent .featProduct:nth-child(2n+1){ clear: both; } .pagination .results{ float: none; padding: 10px 0 0 0; clear: both; text-align: left; } .footer{ background-size: 300px auto;} .footer-module-empty .footer:before{ background-position: 200px 20px; background-size: 400px auto;} #facebook-block{ max-width: 300px; } } @media (max-width: 1100px) { #header #header-top #header-nav ul li a{padding: 10px 5px;} } @media (max-width: 1000px) { #container, .wrapHome, .wrap{ width: 760px; } .header .logo{ float: none; margin: 0 auto;} .header .phone .pic{ display: none; } .headMenu ul.mainMenu{ padding: 14px;} .product-grid .image{ float: none; width: 100%; max-width: 260px; } .product-grid .namePad{ padding-top: 20px; } .home-page .home-left{ width: 100%; } .home-page .home-right{ width: 100%; padding: 50px 0 0 0; } #header #header-top #header-search{ display: none; } #content .contact-info .content .left{ width: 100%; float: none; } #content .contact-info .content .right{ width: 100%; float: none; max-width: 600px; } .featured .featuredContent .featProduct{ width: 33.3333%;} .featured .featuredContent .featProduct:nth-child(2n+1), .featured .featuredContent .featProduct:nth-child(4n+1){ clear:none; } .featured .featuredContent .featProduct:nth-child(3n+1){ clear: both; } .product-info > .left, .product-info > .left + .right{ width: 100%; float: none; max-width: 100%; margin: 0; } .product-info > .left + .right{ margin: 20px 0 0 0;} .product-info .cart{ margin-bottom: 0; } .relatedProduct{ padding: 0; } .sitemap-info .left, .sitemap-info .right{ float: none; width: 100%;} #content{ width: 400px; } .footer{ } .footer .columnBlock .column{ width: 50%; margin-bottom: 50px; } .footer .columnBlock .column:nth-child(2n+1){ clear: both; } .footer .columnBlock .copy{ margin-top: 0; } #facebook-block{ max-width: 500px; } #header #header-top #logo a{ font-size: 12px;} } @media (max-width: 860px) { #header #header-top #header-nav ul{ -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; } #header .header-title{ padding: 30px; } #header #header-top #header-left, #header #header-top #header-right{ width: 100%; display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; align-items: center; align-content: center; } #header #header-top #header-left #logo{ max-width: 300px; } #header #header-top #header-left #logo a{ padding: 0; } #header #header-top #header-phone a, .current-page #header #header-top #header-phone a{ background: transparent; color: #0b6aa1; padding: 15px; } #header #header-top #header-phone a:before{ background-color: #0b6aa1; width: 10px; height: 10px; border: 5px solid #0b6aa1; } #container{ display: block; border: none; width: auto; padding: 30px; } .product-gallery{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; align-content: flex-start; } .product-gallery .image-item{ order: 2; } .product-gallery .image-item.image-item-main{ margin-bottom: 20px; order:1; width: 100%; } .product-gallery .image-item.product-infos{ order: 3; width: 100%; } #content{ width: 100%; } #column-left{ width: 100%; border: none; padding: 0 0 50px 0; display: none; } .leftCategoryMenuTitle{ display: none; } .leftCategoryMenuMobile{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: -moz-box; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; align-items: center; align-content: center; } } @media (max-width: 768px) { .wrapHome, .wrap{ width: 100%; } .wrapHome{ padding:0; } .headMenu{ border-radius:0; } .headMenu ul.mainMenu{ padding: 10px; } .footer-module h2{ padding: 0 20px; } .header{ position: relative; } .header .logo{ width: 150px; height: auto; padding: 10px 0; position: absolute; left: 20px; top: 10px; } .header .logo img{ width: 100%; } .header-inner{ float: right; width: 100%; margin: 100px 0 0 0; border-top: 1px solid #ddd; } .header .search{ height: auto; padding: 0; float: right; margin: 0 auto; width: 200px; margin: -70px 20px 0 0;} .header .login{ display: block; padding: 10px 0 0 0; margin: 20px 0 0 0;} .header .phone{ height: 80px; display: block; padding: 10px 0 0 0; } .header .phone .contactHover{ padding-right: 10px;} .header .phone .number{ width: auto;} #column-left{ float: none; width: 100%; } #column-left:before{ display: none; } .title .product-filter .limitBlock{ width: 300px; height: auto; padding: 10px;} .product-filter .limit, .product-filter .sort{ float: none; margin: 5px 0; } .home-page .home-category ul li{ width: 50%; } #facebook-block{ max-width: 100%; } #facebook-block > *:not(.facebook-title){ display: none !important; } #facebook-block > .facebook-title{ margin: 0; } .home-page{ padding: 5vh 0 0 0;} .current-page #header{ background: #0b6aa1; background: rgb(0,153,207); background: -moz-linear-gradient(90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); background: -webkit-linear-gradient( 90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); background: linear-gradient( 90deg, rgba(0,153,207,1) 0%, rgba(11,106,161,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0099cf",endColorstr="#0b6aa1",GradientType=1); } .mainPic{ height: auto; padding: 0 20px; background-position: -300px 0; } .featured{ padding: 0 20px;} .header .cart .selected{ background-color: transparent; border-color: transparent;} .header .cart .cartContent{ position: static; width: 300px; } .featured .featuredContent .featProduct .image{ max-width: 100%; margin: 0 10px;} .featured .featuredContent .featProduct{ width: 50%; } .featured .featuredContent .featProduct:nth-child(3n+1){ clear: inherit; } .featured .featuredContent .featProduct:nth-child(2n+1){ clear: both; } .footer .columnBlock{ margin: 0; padding: 0 20px;} .footer .columnBlock{ margin-right: 0; } .footer{ background-image: none; } .partners-diler{ padding: 0 20px;} #maps .maps-block .maps-title{ font-size: 22px; } #maps .maps-block{ padding: 20px; } } @media (max-width: 468px) { .wrapHome, body{ min-width: 300px; } .mainPic{ background: none; } .header .logo{ float: none; margin: 0 auto; position: static; } .header .login{ margin: 0; width: 133px; margin: 20px 0 0 0; position: relative; z-index: 1; } .header-inner{ float: none; margin: 0; padding: 0 20px; border-top: none; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } #header #header-top #header-left #logo{ width: 200px; } #header #header-top #logo a{ font-size: 14px; } .partners-diler h2{ font-size: 20px; } #container{ padding: 20px; } #header .header-title{ padding: 20px;} .header .search{ float: none; clear: both; margin: 0; width: 100%; } .header .phone{ width: 150px; z-index: 3; float: right;} .header .phone .number{ font-size: 20px; } .header .phone .fullContact{ left: auto; right: 0;} .headMenu ul.mainMenu li{ display: block; float: none; } .headMenu ul.mainMenu li a.site_all_products{ display: none;} .headMenu ul.mainMenu li ul{ display: inline-block; position: static; top: auto; left: auto; box-shadow:none; background-color: transparent; padding: 0; } .mainPic .wrapPic .sertf-logo{ position: static; left: auto; top: auto;} .mainPic .wrapPic .sertf-logo span{ max-width: 50px; } .mainPic .wrapPic .header-title span{ font-size: 15px; } .mainPic .wrapPic .header-navigation li span.header-navigation-ico{ max-width: 30px; margin: 0 10px 0 0;} .mainPic .wrapPic .header-navigation li a{ font-size: 14px; } .pagination{ padding: 15px 0;} .product-grid{ margin: 0 -10px 0 0; } .product-grid > div.product-item{ width: 50%; padding: 0 10px 0 0; margin-bottom: 20px; } .category-info .image{ display: none; } .category-info{ padding: 10px 0 0 0;} .header .profile{ padding-left: 20px; background-position: 0px 2px ; } .header .cart .cartHeading{ padding-left: 20px; background-position: 0px 6px ; } .header .phone .contactHover{ padding-left: 30px; background-position: 6px 20px ;} .featured{ padding-bottom: 20px; margin: 0; } .featured .featuredContent .featProduct{ width: 100%; } .featured .featuredContent .featProduct .image{ max-width: 300px; margin: 0 auto;} .footer .columnBlock .column{ width: 100%; padding: 0 0 15px 0;} .footer .columnBlock h6{ padding: 0 0 5px;} } @media (max-width: 360px) { .product-grid > div.product-item{ float: none; width: 100%; } } .site-technical-work{ background: rgb(255,188,0); background: linear-gradient(10deg, rgba(255,188,0,1) 0%, rgba(255,188,0,1) 43%, rgba(0,129,185,1) 44%, rgba(0,129,185,1) 100%); } .site-technical-work span{ display: block; max-width: 1600px; margin: 0 auto; padding: 20px 0; }