@charset "utf-8";
#calc{margin-bottom:20px;background:#eee url(../images/best/shadow.gif) repeat-x;border:1px solid #EBEBEB;border-radius:3px;width:698px;position:relative;padding-top:9px}

#calc .stepbar{width:680px;margin:0px auto;height:50px;background:url(../images/calc/stepbar.png) 0 100% repeat-x;margin-bottom:10px}
#calc .stepbar div{height:50px;float:left;position:relative;z-index:1}
#calc .stepbar div b,
#calc .stepbar div i{position:absolute;height:100%;width:100%;top:0px;left:0px;z-index:1;font:bold 14px/50px Arial, sans-serif;text-transform:uppercase;text-indent:41px;color:#fff}
#calc .stepbar div i{z-index:2}
#calc .stepbar div b{background:url(../images/calc/stepbar.png) 100% 0px no-repeat;font:32px/50px Arial, sans-serif;color:#65CBFF;text-indent:13px}
#calc .stepbar .two b,
#calc .stepbar .tri b{text-indent:33px}
#calc .stepbar .one{width:221px}
#calc .stepbar .two{width:249px;margin-left:-20px}
#calc .stepbar .two i,
#calc .stepbar .tri i{background:url(../images/calc/stepbar.png) 0px 0px no-repeat;text-indent:61px}
#calc .stepbar .tri{width:250px;margin-left:-20px}
#calc .stepbar .active{height:50px;background:url(../images/calc/stepbar.png) 0px -150px repeat-x;z-index:2}
#calc .stepbar .active b{background-position:100% -100px;color:#fff}
#calc .stepbar .two.active i,
#calc .stepbar .tri.active i{background-position:0px -50px}
#calc .stepbar .tri b{background:none}

#calc .step{background:#fff;border:1px solid #DFDFDF;border-top:none;width:680px;margin:auto;overflow:hidden}
#calc .step .row{border-bottom:1px dotted #C9C9C9;padding:20px 23px}
#calc .step .row h2{color:#6BBF17;font:bold 14px Arial, sans-sefif;text-transform:uppercase;margin-bottom:3px;position:relative;z-index:2}
#calc .step .sizes{height:30px;width:657px;padding-left:2px;padding-top:13px}
#calc .step .sizes div{height:30px;float:left;position:relative;width:194px;margin-right:25px}
#calc .step .sizes s{text-decoration:none;display:block;height:16px;line-height:16px;margin:4px 5px; border:1px solid #fff;text-indent:2px;white-space:nowrap;width:50px;overflow:hidden}
#calc .step .sizes i{position:relative;float:left;background:url(../images/calc/step.png) no-repeat;display:block}
#calc .step .sizes .x i{width:40px;height:36px;background-position:-90px 0px}
#calc .step .sizes .y i{width:46px;height:30px;background-position:-40px -36px}
#calc .step .sizes .z i{width:45px;height:30px;background-position:-45px 0px}
#calc .step .sizes label{float:right;height:28px;margin-top:1px;position:relative;display:block}
#calc .step .sizes b{font-size:14px;font-weight:normal;display:block;float:left;position:relative;line-height:28px;padding-right:5px}
#calc .step .sizes u{float:left;display:block;width:80px;height:26px;border:1px solid #bfbfbf;font-size:14px;text-decoration:none;line-height:26px;position:relative;z-index:1;background:url(../images/calc/arr.gif) 64px 11px no-repeat}
#calc .step .sizes select{width:82px;height:28px;border:1px solid #bfbfbf;z-index:2;background:#fff;position:absolute;right:0px;top:1px;filter:alpha(opacity=0);opacity:0}
#calc .step .sizes select:focus + u,#calc .step .sizes u.focus{border-color:#F90;box-shadow:0px 0px 2px #F90}
#calc .step .sizes select:focus + u s,#calc .step .sizes u.focus s{border:#C60 1px dotted;background-color:#39F;color:#fff}
#calc .step .row .text{color:#333;font-size:13px;line-height:16px;font-style:italic}
#calc .step .row.alone{border:none}
#calc .step .el{border-bottom:1px dotted #BEBEBE;font-size:14px;line-height:16px;color:#000;min-height:16px;padding:6px 0px 7px;text-shadow:1px 1px 0px rgba(255,255,255,.2);position:relative}
#calc .step .el b{font-weight:normal}
#calc .step .el i{color:#333}
#calc .step .el u{text-decoration:none;position:absolute;right:0}
#calc .step .alone .price{font-size:20px;color:#000;text-align:right;height:41px;line-height:50px}
#calc .step .alone .price b{color:#135387}

#calc .step .split{height:40px;width:630px;padding-top:13px}
#calc .step .split label{cursor:pointer}
#calc .step .split .disable input,
#calc .step .split .disable b,
#calc .step .split .disable i{opacity:.6;filter:alpha(opacity=60)}
#calc .step .split .disable label{cursor:default}
#calc .step .split div{height:30px;float:left;position:relative;width:210px}
#calc .step .split i{position:relative;float:left;background:url(../images/calc/step.png) no-repeat;display:block;margin-right:10px}
#calc .step .split b{float:left;display:block;width:115px;margin:7px 10px 0 0;font-size:14px;color:#333;font-weight:normal;line-height:16px}
#calc .step .split .radio{float:left;margin:6px 5px 0px 0px;display:block}
#calc .step .split .cant i{width:40px;height:30px;background-position:0px -36px}
#calc .step .split .large i{width:45px;height:33px;background-position:0px -0px}
#calc .step .split .small i{width:40px;height:30px;background-position:-86px -36px}
#calc .step .temp{height:25px}
#calc .step .temp label{display:block;float:left;width:310px;line-height:25px}
#calc .step .temp label i{font-style:normal}
#calc .step .count{height:28px;padding-top:13px}
#calc .step .count i{font-size:14px;font-style:normal;color:#333;float:left;height:28px;line-height:28px;display:block;width:185px}
#calc .step .count .input{width:120px;height:28px;float:left}
#calc .step .count .plus,
#calc .step .count .minus{width:15px;height:15px;background:url(../images/calc/plusminus.gif) 0px 0px no-repeat;cursor:pointer;float:left;margin:7px 6px 0px}
#calc .step .count .minus{background-position:0px 100%}
#calc .step .count .text{float:left;display:block;width:60px;height:14px;padding:6px 0px;border:1px solid #c1c1c1;margin:0px;text-align:center;color:#135386;font:14px/14px Arial}
#calc .step .count.disable i,
#calc .step .count.disable .minus,
#calc .step .count.disable .text,
#calc .step .count.disable .plus{opacity:.6;filter:alpha(opacity=60)}
#calc .button{height:43px;padding-left:20px;background:url(../images/calc/button.png) 0px -86px no-repeat;display:inline-block;zoom:1;*display:inline;text-decoration:none;color:#fff;cursor:pointer}
#calc .button i{display:block;height:43px;background:url(../images/calc/button.png) 100% 0px no-repeat;padding-right:20px}
#calc .button.next i{background-position:100% -43px;padding-right:39px}
#calc .button b{display:block;height:43px;background:url(../images/calc/button.png) 0px -129px repeat-x;font:italic 15px/41px Arial, sans-serif;text-shadow:1px 1px 0px rgba(0,0,0,.2)}
#calc .button.next b{padding-right:9px}
#calc .button:hover{background-position:0px -258px}
#calc .button:hover i{background-position:100% -172px}
#calc .button:hover.next i{background-position:100% -215px}
#calc .button:hover b{background-position:0px -301px}
#calc .button:active,#calc .button.active{background-position:0px -430px !important}
#calc .button:active i,#calc .button.active i{background-position:100% -344px !important}
#calc .button:active.next i,#calc .button.active.next i{background-position:100% -387px !important}
#calc .button:active b,#calc .button.active b{background-position:0px -473px !important;line-height:45px}
#calc .step .end{height:84px;border-bottom:1px solid #C1C1C1;text-align:center}
#calc .step .end .button{margin-top:19px}
#calc .info{text-align:center;padding:21px 0px 12px}
#calc .info h2{color:#69BF15;font:bold 17px Arial, sans-serif;text-transform:uppercase;padding-bottom:3px}
#calc .info h2 sup{color:#135387;font:11px Arial, sans-serif;vertical-align:top}
#cacl .info .note{color:#333;font-size:13px;line-height:15px}
#calc .info .note b{font-weight:normal;color:#135387}
#calc .info .note sup{font-size:10px;vertical-align:text-top}

#calc .products{padding-bottom:9px}
#calc .product{height:181px;width:680px;margin:auto;border:#DFDFDF 1px solid;border-top:none;position:relative;z-index:1;background:#fff;margin-bottom:8px}
#calc .product .cheked{position:absolute;z-index:2;width:680px;bottom:0px;left:0px;z-index:2;border-bottom:1px solid #C1C1C1;height:72px;background:url(../images/calc/product.png) 100% 100% no-repeat}
#calc .product:hover .cheked,#calc .product.current .cheked{background-position:100% 0px}
#calc .product .border{position:relative;z-index:1;border:3px solid #fff;width:636px;height:156px;padding:19px 19px 0px}
#calc .product:hover .border,#calc .product.current .border{border-color:#6BC017}
#calc .product .photo{height:150px;width:150px;overflow:hidden;margin-right:19px;margin-left:3px;float:left}
#calc .product .photo img{height:150px;width:150px}
#calc .product .text{overflow:hidden}
#calc .product .text h3{font:18px/20px Arial, sans-serif;color:#135387;margin-bottom:9px;overflow:hidden;text-overflow:ellipsis;width:330px;white-space: nowrap;max-height:40px}
#calc .product .text h3:hover{white-space:normal}
#calc .product .text li,#calc .product .text ul{list-style:none;display:block}
#calc .product .text ul{font-size:13px;color:#333;line-height:18px;margin-bottom:8px}
#calc .product .text ul b{color:#000;font-weight:normal}
#calc .product .text dl{color:#333;font-size:13px;line-height:18px;margin-bottom:8px}
#calc .product .text dt{float:left;margin-right:4px;display:inline;color:#333;}
#calc .product .text dd{display:block;color:#000;font-weight:bold}
#calc .product .price{position:absolute;z-index:2;right:15px;top:15px;font:bold 24px/24px Arial, sans-serif;color:#FF6500}
#calc .product .cheked label{cursor:pointer;position:absolute;right:10px;top:20px;height:32px;background:url(../images/calc/cheked.png) 0px -35px no-repeat;width:87px;padding-left:43px}
#calc .product:hover .cheked label,#calc .product.current .cheked label{background-position:0px -67px}
#calc .product .cheked b{color:#135387;font:bold 14px/32px Arial, sans-serif;text-shadow:1px 1px 0px rgba(255,255,255,.2);background:url(../images/topbar/dotted.gif) 0px 100% repeat-x}
#calc .product:hover .cheked b,#calc .product.current .cheked b{color:#fff;background-image:url(../images/calc/dotted.gif)}
#calc .product .cheked input{position:absolute;width:41px;height:32px;top:0px;left:0px;opacity:.0;filter:alpha(opacity=0);cursor:pointer;z-index:2}
#calc .product .cheked i{display:none;width:36px;height:35px;background:url(../images/calc/cheked.png) no-repeat;position:absolute;z-index:1;top:-11px;left:10px}
#calc .product.current .cheked i{display:block}
#calc .product .cheked input:checked + i{display:block}
#calc .final .product .cheked{background:none}
#calc .final .product .border{border-color:#fff}
#calc .sum h2{color:#69BF15;font:bold 17px Arial, sans-serif;text-transform:uppercase;padding-bottom:8px;text-align:center}
#calc .sum .row{border-top:1px dotted #BEBEBE;font-size:13px;line-height:16px;color:#333;min-height:16px;padding:6px 0px 7px;text-shadow:1px 1px 0px rgba(255,255,255,.2);position:relative}
#calc .sum .row.caption{color:#000;font-size:14px;border-top:1px solid #000}
#calc .sum .row:first-child{border-top:none}
#calc .sum .row b{font-weight:normal}
#calc .sum .row i{font-style:normal;position:absolute;right:0}
#calc .sum .rows{margin:0px 35px;border-bottom:3px solid #135487}
#calc .sum .price{margin:0px 35px;font-size:20px;color:#000;text-align:right;height:51px;line-height:50px}
#calc .sum .price b{color:#135387}
#calc .go{padding-bottom:28px;height:43px;width:630px;margin:auto;overflow:hidden}
#calc .go .buy{margin-top:3px;display:block;float:left;height:36px;padding-left:33px;background:url(../images/calc/buy.png) 0px -0px no-repeat;text-decoration:none;color:#fff;cursor:pointer}
#calc .go .buy i{display:block;height:36px;background:url(../images/calc/buy.png) 100% -36px no-repeat;padding-right:15px}
#calc .go .buy b{display:block;height:36px;background:url(../images/calc/buy.png) 0px -72px repeat-x;font:italic 15px/34px Arial, sans-serif;text-shadow:1px 1px 0px rgba(0,0,0,.2);padding:0px 10px}
#calc .go .buy:hover{background-position:0px -108px}
#calc .go .buy:hover i{background-position:100% -144px}
#calc .go .buy:hover b{background-position:0px -180px}
#calc .go .buy:active,#calc .go .buy.active{background-position:0px -216px !important}
#calc .go .buy:active i,#calc .go .buy.active i{background-position:100% -252px !important}
#calc .go .buy:active b,#calc .go .buy.active b{background-position:0px -288px !important;line-height:38px}
#calc .go .nextstep{display:block;float:right}

#calc .arg{position:relative;z-index:1}

#calc .arg .splitsystem{height:0px;left:-23px;bottom:-20px;width:680px;overflow:hidden;position:relative;z-index:2}
#calc .arg .selectsize{height:50px;background:#EBF1F4;position:relative;padding:0px 23px;border-top:1px solid #D2DEE4;margin-top:5px}
#calc .arg .selectsize .arr{width:9px;height:6px;background:url(../images/calc/agr.gif) no-repeat;position:absolute;top:-6px;left:262px}
#calc .arg .selectsize .text{float:left;font-size:13px;color:#333;line-height:50px;font-style:normal}
#calc .arg .select{height:28px;width:82px;float:left;position:relative;padding-top:9px;margin:0px 10px}
#calc .arg .select s{text-decoration:none;display:block;height:16px;line-height:16px;margin:4px 5px; border:1px solid #fff;text-indent:2px;white-space:nowrap;width:50px;overflow:hidden}
#calc .arg .select label{float:right;height:28px;margin-top:1px;position:relative;display:block}
#calc .arg .select u{float:left;display:block;width:80px;height:26px;border:1px solid #bfbfbf;font-size:14px;text-decoration:none;line-height:26px;position:relative;z-index:1;background:#fff url(../images/calc/arr.gif) 64px 11px no-repeat}
#calc .arg .select select{width:82px;height:28px;border:1px solid #bfbfbf;z-index:2;background:#fff;position:absolute;right:0px;top:1px;filter:alpha(opacity=0);opacity:0}
#calc .arg .select select:focus + u,#calc .arg .select u.focus{border-color:#F90;box-shadow:0px 0px 2px #F90}
#calc .arg .select select:focus + u s,#calc .arg .select u.focus s{border:#C60 1px dotted;background-color:#39F;color:#fff}

#calc .arg .change{height:73px;position:relative;z-index:1}
#calc .arg .change label{cursor:pointer}
#calc .arg .change i{height:100px;position:absolute;width:107px;background:url(../images/calc/agr.jpg);left:6px;top:-7px;z-index:1}
#calc .arg .change div{position:relative;height:34px;float:left;width:197px;z-index:1;padding-top:34px}
#calc .arg .change input{position:relative;z-index:2;line-height:18px}
#calc .arg .change b{position:relative;z-index:2;font-size:14px;font-weight:normal;line-height:18px;margin-left:90px}
#calc .arg .change .two i{width:67px;background:url(../images/calc/agr.jpg) 100% 0px;left:14px}
#calc .arg .change .two{}
#calc .arg .change .two input{}
#calc .arg .change .two b{margin-left:55px}
#calc .arg .change input:checked + b{color:#135387}
#calc .arg .change .current b{color:#135387}

#calc .feedback{width:630px;margin:auto}
#calc .feedback h2{color:#69BF15;font:bold 17px Arial, sans-serif;text-transform:uppercase;padding-bottom:8px;text-align:center;padding-top:20px}
#calc .feedback .form label{display:block}
#calc .feedback .form .field{width:298px;height:16px;border:1px solid #ccc;margin-bottom:6px;font-size:14px;line-height:16px;padding:5px}
#calc .feedback .form .message{width:618px;height:84px;border:1px solid #ccc;padding:6px 5px;font-size:14px}
#calc .feedback .form i{font-size:12px;color:#333;display:block;margin-bottom:2px}
#calc .feedback .form b{color:#f00;vertical-align:top;font-weight:normal}
#calc .feedback .form u{font-size:12px;color:#666;display:block;text-decoration:none;font-style:italic;margin-top:4px}
#calc .feedback .send{text-align:center;padding:22px 0px 30px;height:43px}
#calc .feedback .send .button b{padding:0 20px}