/** * html5doctor.com Reset Stylesheet v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) * Richard Clark (http://richclarkdesign.com) * http://cssreset.com */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
background:transparent;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{
display:block;
}
ul{
list-style:none;
}
a{
margin:0;
padding:0;
font-size:100%;
background:transparent;
text-decoration: none;
color: inherit;
}
table{
border-collapse:collapse;
border-spacing:0;
}
input[type="text"], input[type="email"], input[type="submit"], input[type="button"], textarea{-webkit-appearance: none; font-family: Arial, Helvetica, sans-serif; border-radius: 0;}
input[type="submit"], input[type="button"]{cursor: pointer;}
input[type="text"], input[type="email"], textarea{background-color: #fff; color: #000; font: 13px/30px 'Open sans', sans-serif; font-weight: 300; border: 1px solid #acc3d1; padding: 0 6px; height: 30px;}
input[type="text"]:focus, input[type="email"]:focus, textarea:focus{outline: none; border-color: #799bb0;}
textarea{padding: 0; height: auto;}
/* custom radio/select */
.checkbox, .radio{width: 20px; height: 20px; padding: 0; margin: 0; background: url(../images/checkbox.gif) no-repeat; display: inline-block; cursor: pointer;}
.radio{background: url(../images/radio.png) no-repeat;}
.select-container{position: relative; display: inline-block; vertical-align: top; width: 100%;}
select.styled{height: 100% !important; left: 0;}
.customSelect{border: 1px solid #acc3d1; color: #000; line-height: 100%; font-size: 13px; padding: 0 10px 0 0; display: block !important;
background-color: #fff;}
.customSelectInner{padding: 9px 23px 8px 9px; background: url("../images/arrow-custom-select.gif") no-repeat right center; display: block !important; width: auto !important; font-weight: 300; font-size: 14px;}
.btn-add{background: url("../images/icon-add.gif") 0 0; border: none; height: 25px; width: 25px; cursor: pointer; margin: 0; padding: 0; display: inline-block; vertical-align: top;}
input.btn, button.btn{outline: none; border: none; cursor: pointer; margin: 0;}
.btn-blue28, .btn-blue52{height: 28px; line-height: 28px; padding: 0 10px; font-size: 13px; color: #fff; background-color: #899ba6; display: inline-block; vertical-align: top;}
input.btn-blue28, button.btn-blue28{font: 13px 'Open sans', sans-serif; font-weight: 400; color: #fff;}
button.btn-blue28{line-height: 26px;}
.btn-blue28:hover, .btn-blue52:hover{background-color: #96a8b3;}
.btn-blue52{height: 52px; line-height: 52px;}
.btn-calendar{background: url("../images/icon-calendar.gif") no-repeat center center; width: 21px; height: 22px; border: none; cursor: pointer; padding: 0;}
h1, h2, h3, h4, h5, h6, p{margin: 0.5em 0; padding: 0;}
img{max-width: 100%; height: auto;}
/* =========================== Layout styles =================== */
/* ============================================================= */
.container1{max-width: 1100px; margin: 0 auto; font-size: 1em;}
body{color: #000; font: 14px 'Open sans', sans-serif; font-weight: 300; padding: 0 0 20px 0;}
#left{width: 26.818181818181825%; float: left; padding: 86px 0 0; font-size: 1em;}
#left > .inner{padding-right: 20.67796610169492%;}
#right{width: 73.18181818181818%; float: right;}
#header{text-align: right; margin-bottom: 36px;}
#logo img{width: 76.92%;}
#lang{text-align: right; padding: 20px 0 0 0;}
#lang li{display: inline; margin: 0 0 0 16px;}
#lang .active a{font-weight: 400;}
#lang a{font-size: 1.143em;}
.menu-container{margin-bottom: 52px;}
#main-menu{text-align: right;}
#main-menu > li{margin: 0 0 4px;}
#main-menu > li > a{font-weight: 300; font-size: 1.643em/*23px*/;}
#main-menu .active > a{background: url(../images/arrow-submenu.gif) no-repeat right 9px; padding-right: 25px; font-weight: 600;}
#main-menu ul{padding: 13px 0 9px 0; display: none;}
#main-menu li li{margin: 0 0 6px;}
#main-menu li li a{color: #899ba6; font-weight: 300; font-size:1.286em /*18px*/; padding-right: 25px;}
#main-menu li li.active a{font-weight: 300; background-position: right 6px; text-decoration: underline;}
#main-menu > .active >ul{display: block;}
#main-menu a:hover, #left .contact a, #lang a:hover, #lang .active a{text-decoration: underline;}
#left .contact{font-size: 1.143em/*16px*/; text-align: right; margin: 0 0 10px;}
#left .contact span{display: block;}
#left .contact a:hover{text-decoration: none;}
#slider-container{position: relative;}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav{position: absolute; z-index: 7980; top: 25px; right: 25px;}
.nivo-controlNav a{cursor: pointer; display: block; background: url(../images/pager.png) 0 -11px; width: 11px; height: 11px; text-indent: -9999px; margin: 0 0 5px 0;}
.nivo-controlNav a.active, .nivo-controlNav a:hover{background-position: 0 0;}
.btn-blu-L, .btn-red-L {
background-color: #899ba6;
float: left;
font-size: 1.928em/*27px*/;
font-weight: 300;
line-height: 120%;
margin: 0;
position: relative;
text-align: center;
transition: background-color 0.1s ease-in-out 0s;
-webkit-transition: background-color 0.1s ease-in-out 0s;
width: 50%;
}
#large-btns{font-size: 1em;}
.btn-blu-L a, .btn-red-L a{color: #fff; display: block; padding: 23px 4% 22px;}
.btn-red-L{background-color: #800303;}
.btn-blu-L:hover{background-color: #798b96;}
.btn-red-L:hover{background-color: #600000;}
.btn-blu-L .icon, .btn-red-L .icon{content: ''; position: absolute; z-index: 8000; bottom: 100%; right: 0; left: 0; margin: 0 auto 17px auto; width: 40px; height: 40px; background: url("../images/icon-eur.png");}
.btn-red-L .icon{background: url("../images/icon-question.png");}
#header-img img{display: block;}
#content{padding: 50px 6.211180124223602%; border: 1px solid #dbe1e4; border-top: none; font-size: 1em;}
#content > h1{margin-bottom: 20px;}
.product-list{padding: 30px 0;}
.product-list ul{font-size: 0; margin-left: -5.547652916073969%;}
.product-list li{display: inline-block; vertical-align: top; margin: 0 0 20px 5.256064690026954%; width: 28.032345013477095%;}
.product-list img, .product-list a, .product-list2 img, .product-list2 a{display: block; margin: 0 auto;}
.product-list .thumb{border: 1px solid #dbe1e4; padding: 13px; margin-bottom: 22px;}
.product-list .title{font-size: 14px; font-weight: 400; margin: 0; text-transform: uppercase; text-align: center;}
.product-list li:hover .thumb{border-color: #c0c6c9;}
.product-list2{padding: 20px 0;}
.product-list2 ul{font-size: 0; margin-left: -3.413940256045519%;}
.product-list2 li{display: inline-block; vertical-align: top; margin: 0 0 15px 3.301237964236589%; width: 21.59559834938102%;}
.product-list2 .thumb{margin-bottom: 10px;}
.product-list2 .title{font-size: 13px; font-weight: 300; margin: 0; text-align: center;}
/* calculator styles */
#price-calc-wrap, #price-calc-form{padding: 1px 0;}
.calc-block.bordered{border: 1px solid #acc3d1; margin-bottom: 9px;}
.calc-block .title{font-size: 14px; font-weight: 600; margin: 0;}
.calc-block input[type="text"], input[type="email"]{height: 25px; line-height: 25px;}
.calc-block.inline .title, .calc-block.inline .col, .calc-block.inline input[type="text"], .calc-block.inline input[type="email"], .calc-block.inline label, .calc-block.inline .label-after{display: inline-block; vertical-align: middle;}
.calc-block.reg-pad{padding: 9px 21px 5px;}
.calc-block.inline .title, .calc-block.inline .col{margin: 0 20px 5px 0;}
.calc-block.inline label, .calc-block.inline .label-after{padding: 0 0 0 5px;}
.calc-block.inline .title label{padding: 0;}
.calc-block.inline input[type="text"], .calc-block.inline input[type="email"]{width: 66px;}
/* calc1 */
#calc1{margin: 0 0 0px;}
#calc1 .col{float: left; width: 33.28591749644381%;}
#calc1 .col2{width: 15.5049786628734%; margin: 0 2.48933143669986%;}
#calc1 .col3{float: right; width: 46.23044096728307%; background-color: #899ba6; color: #fff;}
#calc1 .col3 p{font-size: 12px; color: #fff; margin: 0; line-height: 120%; padding: 12px 25px 11px;}
#calc1 .row{margin: 0 0 6px;}
#calc1 .row:first-child{margin-bottom: 7px;}
/* calc2 */
#calc2{margin: 0 0 20px; padding:5px;}
#calc2 .left, #calc2 .right{float: left; width: 46.79943100995733%; position: relative;}
#calc2 .right{width: 52.91607396870555%;}
#calc2 .arrow{position: absolute;}
#arrow-left{bottom: 9%; left: 32%;}
#arrow-left2{bottom: 18.5%; right: 18%;}
#arrow-right{bottom: 18.5%; left: 42%;}
#arrow-right2{top: 46%; right: 11.5%;}
.arrow-left{width: 8px; height: 15px; display: block; background: url("../images/arrow-left1.gif");}
.arrow-top{width: 15px; height: 8px; display: block; background: url("../images/arrow-up1.gif");}
#calc2 .arrow-top.active{background-image: url("../images/arrow-up2.gif");}
.hover-special .arrow{background-image: url("../images/arrow-up2.gif"); cursor: default;}
#calc2 .arrow-left.active{background-image: url("../images/arrow-left2.gif");}
.padding1{padding: 16px;}
/* calc3 */
#calc3{padding: 16px;}
#calc3 .title{margin-bottom: 15px;}
#calc3 table{width: 100%; margin: 0 0 15px;}
#calc3 td{padding: 3px 5px 3px 5px; vertical-align: middle; text-align: center; /*border-bottom: 1px solid #acc3d1;*/ line-height: 120%;}
#calc3 .head td.noborder{border-bottom: none; padding-left: 0; padding-right: 0;}
#calc3 .head .oddbcolor{border-bottom: 1px solid #dbe1e4;}
#calc3 .arrow, #calc4 .arrow{display: inline-block;}
#calc3 .field1{width: 66px}
#calc3 .field2{width: 94px}
#calc3 .checkbox{position: relative; top: 3px;}
/*#calc3 p{margin: 0; font-size: 13px;}*/
#calc3 .btn-blue28{vertical-align: baseline; margin: 0 5px; font-weight: 400;}
#calc3 li{display: inline-block; vertical-align: top; margin: 0 30px 20px 0;}
/* calc4 */
#calc4{padding: 15px 16px 0px 21px;}
#calc4 li{display: inline-block; vertical-align: top; margin: 0 30px 20px 0;}
#calc4 .title{margin: 0 0 15px;}
#calc4 .sub-title{font-size: 14px; font-weight: 300; margin: 0 0 6px;}
#calc4 .radio, #calc4 label, #calc6 label{display: inline-block; vertical-align: top; cursor: pointer;}
#calc4 .radio{margin: 12px 0 0 7px;}
#calc4 label{padding: 0 0 0 11px;}
/* calc6 */
#calc6{padding: 5px 5px 0px 5px;}
#calc6 table{width: 100%; margin: 0 0 15px;}
#calc6 td{padding: 3px 3px 3px 3px; vertical-align: middle; line-height: 120%;}
#calc6 .head td.noborder{border-bottom: none; padding-left: 0; padding-right: 0;}
#calc6 .head .oddbcolor{border-bottom: 1px solid #dbe1e4;}
#calc6 li{display: inline-block; vertical-align: top; margin: 0 25px 10px 0;}
#calc6 .title{margin: 0 0 15px;}
#calc6 .sub-title{font-size: 14px; font-weight: 300; margin: 0 0 6px;}
#calc6 label{padding: 0 4px 0 0;}
#calc6 input[type="text"]{width: 34px;}
/* calc7 */
#calc7 .indent{margin-left: 25px;}
/* calc8 */
#calc8 .row{display: inline;}
/* calc10 */
#calc10{background-color: #f3f3f3; padding: 15px 21px;}
#calc10 .title{margin-bottom: 10px;}
#calc10 > .left, #calc10 > .right{width: 41.722%; float: left;}
#calc10 > .right{width: 55.278%; margin-left: 2%; text-align: right;}
/*#calc10 table, #calc11 table{width: 100%;}*/
#calc10 td{vertical-align: middle; line-height: 120%; padding: 0 0 5px 0;}
#calc10 .gap-b{padding-bottom: 17px;}
#calc10 td .left, #calc10 td .right, #calc10 .radio, #calc10 td label{display: inline-block; vertical-align: top;}
#calc10 td .left, #calc10 td .right{margin: 5px 15px 0 0;}
#calc10 td .left label, #calc10 td .right label{padding: 0 5px 0 0; cursor: pointer;}
#calc10 .customSelect{padding: 6px 10px 6px 9px;}
#calc10 .customSelectInner{padding: 0 23px 0 0; height: 13px; overflow: hidden;}
#calc10 > .right label{cursor: pointer;}
#calc10 > .right .last-child{text-align: left;}
#calc10 > .right input{background-color: #fffdd5; border-color: #acc3d1; width: 67px; margin-right: 7px;}
/* calc11 */
#calc11{padding: 18px 21px 15px 21px;}
#calc11 .title{margin: 0 0 14px;}
#calc11 > .left, #calc11 > .right{width: 55.6%; float: left;}
#calc11 > .left{padding: 3px 1% 0 0;}
#calc11 > .right{width: 43.4%;}
#calc11 input[type="text"].datepicker{width: 56px;}
#calc11 .row{margin: 0 0 10px;}
#calc11 button, #calc11 label, #calc11 .checkbox, #calc11 .col, #calc11 > .right input{display: inline-block; vertical-align: middle;}
#calc11 button{position: relative; top: -2px;}
#calc11 > .left label{cursor: pointer; padding: 0 2px 0 0;}
#calc11 .checkbox, #calc11 input[type="text"], #calc11 input[type="email"]{margin: 0 4px;}
#calc11 > .right table{border-left: 1px solid #c8d7e1;}
#calc11 > .right{text-align: right;}
#calc11 > .right input{width: 130px;}
#calc11 > .right td{padding: 0 0 7px 7px;}
#calc11 .txtarea-wrap{clear: both; margin: 0 0 15px;}
#calc11 .txtarea-wrap label{display: block; margin: 0 0 5px;}
#calc11 textarea{width: 97%; min-height: 62px; padding: 5px 1%; line-height: 130%;}
#calc11 .submit-wrap{text-align: center; padding:0px 0;}
#calc11 .submit-wrap input[type="submit"]{font-size: 25px;}
#footer:before{background: url("../images/stars.gif") no-repeat center 0; content: ''; position: absolute; z-index: 1; bottom: 100%; right: 0; left: 0; margin: 0 auto; border-bottom: 1px solid #d9d9d9; width: 91px; height: 19px;}
#footer{position: relative; padding: 32px 0 0; margin: 55px 0 0; text-align: center;}
#footer p{margin: 0;}
#kivenkovaa-laatua{width: 192px; height: 17px; display: inline-block; vertical-align: top; text-indent: -9999px; background: url("../images/kivenkovaa-laatua.gif") no-repeat center 0;}
/* ======================= article styles ====================== */
/* ============================================================= */
h1, #article h1{color: #000; font-size: 2.357em/*33px*/; font-weight: 400; margin: 0 0 15px; line-height: 120%;}
#article{font-size: 1em; font-weight: 300; color: #000; padding: 6px 0;}
#article h2, #article h3, #article h4 {
color: #000;
font-size: 18px;
font-weight: 600;
line-height: 110%;
margin: 0 0 10px;
}
#article h3{font-size: 18px; color: #800303;}
#article h4{font-size: 17px;}
#article b{font-weight: 700;}
#article h1{font-size: 25px; margin: 0 0 15px 0; font-weight: 400; color: #000;}
#article ul{padding-left: 4px;}
#article li{margin-bottom: 5px !important; margin-top: 5px !important;}
#article ul li{padding: 0px 0 0 13px; margin: 0; background: url("../images/article-list-style.gif") no-repeat left 7px;}
#article ul ol li{background: none; padding: 0 0 0 0;}
#article ol ul li{padding: 0px 0 0 13px;}
#article ol{padding: 0 0 0 22px;}
#article ol ol{padding: 0 0 0 20px;}
#article ol li{padding: 0; margin: 0;}
#article table{border-collapse: collapse; margin: 2em 0; width: 100%;}
#article table, #article td, #article th{border: 1px solid #e2dfdf;}
#article td, #article th{padding: 8px 10px;}
#article th{text-align: left; font-weight: 600; color: #272626; background-color: #f7f4f4;}
#article table.noborder, #article table.noborder td, #article table.noborder th{border: none;}
#article caption{color: #fff; background-color: #2d0014; text-align: left; padding: 5px 8px;}
#article table p{margin: 0;}
#article p{margin: 0 0 20px 0;}
#article a{text-decoration: underline; color: #000;}
#article a:hover{text-decoration: none;}
#article img{}
img.floatLeft{float: left; margin: 0 3.25em 2em 0;}
img.floatRight{float: right; margin: 0 0 2em 3.25em;}
.files-list{padding: 5px 17px; margin: 0 0 12px 0;}
/* gallery */
.gallery{padding: 20px 0;}
.gallery ul{font-size: 0; margin-left: -1.991465149359886%;}
.gallery li{display: inline-block; vertical-align: top; margin: 0 0 20px 1.95258019525802%; width: 31.38075313807531%;}
.gallery img{display: block; margin: 0 auto;}
.gallery .title{display: block; padding: 10px 0 5px 0; font-size: 13px; font-weight: 300; line-height: 125%;}
/* article-list */
.article-list{padding: 0 17px;}
.article-list li{border-bottom: 1px solid #e2dfdf; padding: 0 0 12px 50px; margin: 0 0 20px 0; background: url("../images/blackdot.png") no-repeat 17px 8px;}
.article-list .title{font-size: 15px; font-weight: 400; margin: 0 0 10px 0;}
.article-list p{font-size: 14px; font-weight: 300; margin: 0 0 10px 0;}
/* accordion */
#accordion{font-size: 14px; margin: 0 0 10px 0;}
#accordion .title{margin: -1px 0 0 0; color: #272626; padding: 1px; font-weight: 400; font-size: 14px; border: 1px solid #e2dfdf; cursor: pointer; position: relative;}
#accordion .ui-icon{background: url("../images/arrows-9x5.gif") no-repeat 0 0; width: 9px; height: 5px; position: absolute; top: 15px; right: 15px;}
#accordion .ui-state-active .ui-icon{background-position: 0 -5px;}
#accordion .title .inner{background-color: #f7f4f4; display: block; padding: 6px 35px 5px 10px;}
#accordion .ui-state-active .inner{background-color: transparent;}
#accordion .content{font-weight: 300; font-size: 13px; padding:10px;}
#products .gallery ul{margin: 0 0 0 -1.022727272727273%;}
#products .gallery li{margin: 0 0 28px 1.012373453318335%; width: 23.84701912260967%;}
/* open sans */
.light{font-weight: 300;}
.normal{font-weight: 400;}
.semibold{font-weight: 600;}
.bold{font-weight: 700;}
.bold{font-weight: bold;}
.file{display: inline-block; text-decoration: none !important; color: #272626 !Important; padding: 8px 0 7px 26px; line-height: 98%;}
.file.pdf{background: url(../images/icon-pdf.gif) no-repeat left center;}
.file.doc{background: url(../images/icon-doc.gif) no-repeat left center;}
.file.jpg{background: url(../images/icon-jpg.gif) no-repeat left center;}
.file.png{background: url(../images/icon-png.gif) no-repeat left center;}
.file.xls{background: url(../images/icon-xls.gif) no-repeat left center;}
.file.ppt{background: url(../images/icon-ppt.gif) no-repeat left center;}
.alignCenter{text-align: center;}
.underline{text-decoration: underline;}
div.clear{clear:both; height:0px; font-size:0px; line-height:0px;}
.floatLeft{float:left;}
.floatRight{float:right;}
.error,
.success,
.warning,
.msg-success,
.msg-fail{color: #fff; text-align: center; margin: 10px 0; padding: 6px; background: #44b544; font-weight: 400;}
.msg-fail, .error{background: #d23b3b;}
.warning{background:#F90;}
/* ======================= media queries ======================= */
/* ============================================================= */
@media screen and (max-width: 1100px){
#left{font-size: 0.85em;}
h1, #article h1{font-size: 2.1em;}
#left{width: 23%;}
#left > .inner{padding-right: 16%;}
#right{width: 77%;}
#content{padding: 50px 4.7%;}
}
@media screen and (max-width: 1000px){
body, .product-list .title{font-size: 13px;}
#content > h1{margin-bottom: 10px;}
#main-menu .active > a{background-position: right 6px;}
#content{padding: 50px 4.7% 20px 4.7%;}
.product-list{padding: 20px 0;}
.product-list .thumb{margin-bottom: 12px;}
#price-calc-wrap .customSelectInner, #price-calc-wrap input[type="text"]{font-size: 13px;}
#calc11 .submit-wrap input[type="submit"]{font-size: 22px;}
}
@media screen and (max-width: 900px){
.form-container2 .form-name{font-size: 19px;}
.btn-blu-L, .btn-red-L{font-size: 1.7em;}
.btn-blu-L a, .btn-red-L a{padding: 17px 4% 16px;}
.btn-blu-L .icon, .btn-red-L .icon {
background-size: 32px auto;
width: 32px;
height: 32px;
margin-bottom: 15px;
}
#left{font-size: 0.8em; padding-top: 36px;}
#left > .inner{padding: 0 10% 0 0;}
#content{padding: 40px 3% 20px;}
.menu-container{margin-bottom: 22px;}
#main-menu ul{padding: 6px 0 1px;}
#main-menu li li a{padding-right: 18px;}
#main-menu li li.active a, #main-menu .active > a{background-size: auto 12px; background-position: right 7px; padding-right: 18px;}
#main-menu li li.active a{background-position: right 5px;}
#calc1 .col3 p{padding: 12px 15px 11px;}
#calc11 .submit-wrap{padding: 10px 0;}
#calc11 .submit-wrap input[type="submit"] {
font-size: 20px;
height: 40px;
line-height: 40px;
}
.article-list .title{font-size: 14px;}
.article-list p{font-size: 12px;}
}
@media screen and (max-width: 840px){
.container1{width: 96%;}
#left, #right {
float: none;
width: auto;
}
#left{padding: 20px 0 0; margin-bottom: 20px; border-bottom: 1px solid #dbe1e4;}
#left .contact {
margin: 0;
position: absolute;
right: 0;
top: -2px;
}
#lang {
padding: 0;
position: absolute;
right: 0;
top: 38px;
}
#left .contact span {
background: url("../images/arrow-custom-select.gif") no-repeat left center / 10px auto;
padding: 0 0 0 18px;
}
#left .contact .inner {
background-color: #fff;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
display: none;
margin: 8px 0 0;
padding: 0 10px 6px;
position: absolute;
right: -10px;
z-index: 10;
}
#left > .inner{padding: 0; position: relative;}
#header {
margin-bottom: 18px;
text-align: left;
}
#logo img{width: 165px;}
.menu-container{margin-bottom: 12px;}
#content{padding: 15px 0;}
#main-menu{text-align: left;}
#main-menu > li {
display: inline-block;
margin: 0 7px 4px 0;
vertical-align: top;
position: relative;
}
#main-menu > li > a{display: block; padding-bottom: 6px;}
#main-menu ul {
background-color: #fff;
box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.15);
display: none;
left: 0;
padding: 7px 12px 4px 12px;
position: absolute;
top: 100%;
width: 150px;
z-index: 8000;
}
#main-menu > .active > ul{display: none;}
#main-menu > .hover > ul{display: block;}
#main-menu > li > a{font-size: 1.45em;}
#main-menu .active > a{padding-right: 13px; background-position: right 5px;}
#content{border: none; padding: 25px 0;}
}
@media screen and (max-width: 700px){
#logo img{width: 155px;}
#left .contact{font-size: 11px;}
#main-menu > li > a{font-size: 13px;}
#main-menu li li.active a, #main-menu .active > a {
background-position: right 6px;
background-size: auto 7px;
padding-right: 9px;
}
#main-menu li li.active a{background-position: right 7px;}
.btn-blu-L, .btn-red-L{font-size: 1.5em;}
#calc10 .customSelect{padding: 0 10px 0 0;}
#price-calc-wrap .customSelectInner, #price-calc-wrap input[type="text"]{font-size: 12px;}
#price-calc-wrap .customSelectInner {
background-size: 11px auto;
padding: 7px 23px 6px 8px;
}
}
@media screen and (max-width: 640px){
.calc-block .title{font-size: 13px;}
#calc5 .title{margin-bottom: 11px;}
#calc5 .title, #calc5 .col, #calc9 .title, #calc9 .col{display: block;}
#calc7 .indent{margin-left: 0;}
#calc8 .row {
display: block;
padding: 3px 0;
}
#calc5 .col, #calc9 .col{margin-bottom: 9px;}
#calc9 .col label{padding: 0 5px 0 0;}
#calc10 table, #calc11 table{width: auto;}
#calc10 > .right label{padding-right: 10px;}
#calc10 > .left{margin-bottom: 18px; float: none; width: auto;}
#calc10 > .right{margin-left: 0; float: none; width: auto; text-align: left;}
#calc11{padding: 28px 21px 15px;}
#calc11 .title{margin-bottom: 18px;}
#calc11 > .left, #calc11 > .right {
float: none;
margin: 0 0 29px;
width: auto;
}
#calc11 > .left{padding: 0;}
#calc11 > .right table {
border-left: none;
text-align: left;
}
#calc11 .submit-wrap input[type="submit"] {
font-size: 17px;
height: 33px;
line-height: 32px;
}
#calc11 .submit-wrap{text-align: left;}
}
@media screen and (max-width: 570px){
.btn-blu-L, .btn-red-L{font-size: 1.2em;}
.btn-blu-L .icon, .btn-red-L .icon {
background-size: 25px auto;
height: 25px;
margin-bottom: 9px;
width: 25px;
}
.btn-blu-L a, .btn-red-L a{padding: 10px 4% 12px;}
#price-calc-wrap input[type="text"] {
height: 21px;
line-height: 21px;
}
.calc-block.reg-pad{padding: 9px 12px 5px;}
#calc3 .arrow, #calc4 .arrow{display: none;}
#calc2 .left, #calc2 .right {
float: none;
width: auto;
}
#calc2 .arrow{display: none;}
/*
#arrow-left {
bottom: 7%;
left: 39%;
}
#arrow-left2 {
bottom: 17%;
right: 31%;
}
#arrow-right {
bottom: 16%;
left: 45%;
}
#arrow-right2{right: 24%;}*/
#calc2 img {
display: block;
margin: 0 auto;
}
#calc3 .btn-blue28 {
font-size: 11px;
height: 23px;
line-height: 23px;
margin: 6px 0 0;
padding: 0 8px;
}
#calc3 input[type="text"]{font-size: 11px; padding: 0 4px; height: 19px; line-height: 19px;}
#calc3 td{font-size: 11px; padding: 6px 5px 5px;}
#calc3 .field1{width: 48px;}
#calc3 .field2{width: 74px;}
.btn-add {
background-size: 18px auto;
height: 18px;
width: 18px;
}
#calc3{padding: 12px;}
#calc4, #calc6{padding: 15px 12px 2px 12px;}
#calc6{padding-bottom: 7px;}
#calc4 .radio{margin-top: 6px;}
#calc4 img{width: 45px;}
#calc6 li{margin: 0 18px 6px 0;}
#calc10{padding: 13px 12px;}
#calc11{padding: 11px 12px 5px;}
#calc11 .title{margin-bottom: 11px;}
}
@media screen and (max-width: 475px){
#left .contact{top: 0;}
#logo img{width: 142px;}
#content{padding: 5px 0;}
#price-calc-wrap .customSelectInner {
background-size: 9px auto;
font-size: 11px;
padding: 4px 17px 4px 7px;
}
#header-img{margin: 0 0 10px;}
h1, #article h1{font-size: 1.5em;}
.product-list{padding: 10px 0;}
.product-list .thumb{padding: 6px;}
.product-list2 .title{line-height: 120%; font-size: 11px;}
#calc1 .col1{padding: 0 3% 0 0; width: 68%;}
#calc1 .col2 {
margin: 0;
width: 29%;
}
#calc1 .col3 {
clear: both;
float: none;
width: auto;
}
#calc3 td {
font-size: 10px;
padding: 6px 0 5px;
}
#calc3 input[type="text"] {
font-size: 10px;
padding: 0 3px;
}
#calc3 .field1{width: 37px;}
#calc3 .field2{width: 64px;}
.btn-add {
background-size: 14px auto;
height: 14px;
width: 14px;
}
#article h2, #article h3, #article h4{font-size: 15px;}
#article h4{font-size: 14px;}
}
@media screen and (max-width: 320px){
body, .product-list .title{font-size: 12px;}
#lang {
padding: 20px 0 0;
position: static;
text-align: center;
}
#lang li{margin: 0 8px;}
#left .contact {
top: 16px;
line-height: 122%;
font-size: 10px;
}
#calc3 td{padding: 2px 0 2px;}
.calc-block.inline input[type="text"]{width: 45px;}
.calc-block.inline .title, .calc-block.inline .col{margin: 0 5px 5px 0;}
#calc11 .row{margin-bottom: 15px;}
#main-menu{text-align: center;}
#main-menu > li{display: block; margin: 0; padding: 4px 0;}
#main-menu > li > a, #lang a{font-size: 12px;}
#main-menu > .active > a{background: none; padding: 0;}
#main-menu > li > a{padding: 0;}
#main-menu li li a, #main-menu li li.active a{padding: 0 7px;}
#main-menu ul{right: 0; margin: 0 auto; width: 216px;}
.product-list2 .thumb{margin-bottom: 6px;}
.form-container2 .buttons{margin-top: 28px;}
.buttons input{font-size: 12px; line-height: 29px; height: 30px; padding: 0 8px;}
}
/* ======================== clearfix =========================== */
/* ============================================================= */
/* Force Element To Self-Clear its Children */
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */
.upload-btn-wrapper {
position: relative;
overflow: hidden;
display: inline;
}
.btn {
height: 28px;
line-height: 28px;
padding: 0 10px;
font-size: 13px;
color: #fff;
background-color: #899ba6;
display: inline-block;
vertical-align: top;
}
.upload-btn-wrapper input[type=file] {
font-size: 100px;
position: absolute;
left: 0;
top: 0;
width:100px;
opacity: 0;
background-color:#FF9;
}