/** * EMThemes * * @license commercial software * @copyright (c) 2012 Codespot Software JSC - EMThemes.com. (http://www.emthemes.com) */
.colorpicker{width:356px;height:176px;overflow:hidden;position:absolute;background:url(../images/variation/colorpicker_background.png);font-family:Arial,Helvetica,sans-serif;display:none;z-index:9999;}
.colorpicker_color{width:150px;height:150px;left:14px;top:13px;position:absolute;background:#f00;overflow:hidden;cursor:crosshair;}
.colorpicker_color div{position:absolute;top:0;left:0;width:150px;height:150px;background:url(../images/variation/colorpicker_overlay.png);}
.colorpicker_color div div{position:absolute;top:0;left:0;width:11px;height:11px;overflow:hidden;background:url(../images/variation/colorpicker_select.gif);margin:-5px 0 0 -5px;}
.colorpicker_hue{position:absolute;top:13px;left:171px;width:35px;height:150px;cursor:n-resize;}
.colorpicker_hue div{position:absolute;width:35px;height:9px;overflow:hidden;background:url(../images/variation/colorpicker_indic.gif) left top;margin:-4px 0 0 0;left:0px;}
.colorpicker_new_color{position:absolute;width:60px;height:30px;left:213px;top:13px;background:#f00;}
.colorpicker_current_color{position:absolute;width:60px;height:30px;left:283px;top:13px;background:#f00;}
.colorpicker input{background-color:transparent;border:1px solid transparent;position:absolute;font-size:10px;font-family:Arial,Helvetica,sans-serif;color:#898989;top:4px;right:11px;text-align:right;margin:0;padding:0;height:14px;}
.colorpicker_hex{position:absolute;width:72px;height:22px;background:url(../images/variation/colorpicker_hex.png) top;left:212px;top:142px;}
.colorpicker_hex input{right:6px;}
.colorpicker_field{height:22px;width:62px;background-position:top;position:absolute;}
.colorpicker_field span{position:absolute;width:12px;height:22px;overflow:hidden;top:0;right:0;cursor:n-resize;}
.colorpicker_rgb_r{background-image:url(../images/variation/colorpicker_rgb_r.png);top:52px;left:212px;}
.colorpicker_rgb_g{background-image:url(../images/variation/colorpicker_rgb_g.png);top:82px;left:212px;}
.colorpicker_rgb_b{background-image:url(../images/variation/colorpicker_rgb_b.png);top:112px;left:212px;}
.colorpicker_hsb_h{background-image:url(../images/variation/colorpicker_hsb_h.png);top:52px;left:282px;}
.colorpicker_hsb_s{background-image:url(../images/variation/colorpicker_hsb_s.png);top:82px;left:282px;}
.colorpicker_hsb_b{background-image:url(../images/variation/colorpicker_hsb_b.png);top:112px;left:282px;}
.colorpicker_submit{position:absolute;
/*width: 22px;*/
/*height: 22px;*/
/*background: url(../images/variation/colorpicker_submit.png) top;*/
left:293px;top:143px;
/*overflow: hidden;*/}
.colorpicker_focus{background-position:center;}
.colorpicker_hex.colorpicker_focus{background-position:bottom;}
.colorpicker_submit.colorpicker_focus{background-position:bottom;}
.colorpicker_slider{background-position:bottom;}
#demotool_variation{left:-391px;}
.btn-toggle{background:url( ../images/variation/close-open.png) no-repeat scroll 0 0 transparent!important;display:block;position:fixed;left:0;z-index:22;text-indent:-999px;top:258px;width:47px;height:47px;display:block;text-indent:-99999px;border:#cecece 1px solid;border-left:none;}
#demotool_variation{border:#cecece 1px solid;background:#fff;width:390px;z-index:22;position:absolute;top:0;left:-100%}
#demotool_variation .copyright{background:#e5e5e5;padding:8px 15px;color:#7F7F7F;font:12px Tahoma,Arial,Helvetica,sans-serif;clear:both;float:left;margin:15px 0 0 0;width:360px;}
#demotool_variation .copyright a{font-weight:bold;color:#878686}
.demotool-title{background:url(../images/variation/bg_var.png) repeat-x;height:31px;font:bold 12px Tahoma,Arial,Helvetica,sans-serif;color:#fff;line-height:30px;padding:0 15px;margin-bottom:6px;}
.content-title{background:url(../images/variation/bg_bottom_title.png) repeat-x bottom center #fff;padding-bottom:8px;cursor:pointer;}
.content-title span{color:#ba0014;font:bold 12px Tahoma,Arial,Helvetica,sans-serif;padding:2px 15px 8px;display:block;}
.demotool-content{font:12px/1.35 Roboto,Arial,Helvetica,sans-serif;}
.demotool-content .desc{padding:5px 0 5px 9px;background:url(../images/icons.png) -2px -582px no-repeat;color:#878686;font:italic 10px/1.35 Arial,Helvetica,sans-serif;}
.demotool-content .desc em{font:italic 10px/1.35 Arial,Helvetica,sans-serif;}
.demotool-content #em_variation_google_font_preview{margin-bottom:0;}
.demotool-content .col-1 .desc{padding-bottom:0;color:#878686;}
.demotool-content .box{border:#e0e0e0 1px solid;border-width:0 0 1px 0;margin:0 15px;float:left;clear:both;width:360px;padding:0 0 20px;}
.demotool-content .box.last{border-bottom:none;}
.demotool-content .box.first{padding:9px 0 14px 0;}
.demotool-content .box .title{font:bold 11px Tahoma,Arial,Helvetica,sans-serif;color:#000;text-transform:uppercase;cursor:default;}
.demotool-content .box .title .name_title{float:left;margin-top:2px;}
.demotool-content .box .title .box-tgl{float:right;background:url(../images/variation/var_close.png) no-repeat scroll 0 0 transparent;width:19px;height:19px;text-indent:-99999px;cursor:pointer;margin-right:10px;}
.demotool-content .box.close .title .box-tgl{background:url(../images/variation/var_show.png) no-repeat scroll 0 0 transparent;}
.demotool-content .box .content{clear:both;}
.demotool-content .box .content .row{margin-left:0;margin-right:0}
.demotool-content a.btn-reset,.demotool-content a.btn-apply{display:block;height:32px;margin:15px 0 0 15px;text-indent:-999px;float:left;}
.demotool-content a.btn-reset{background:url(../images/variation/btn_reset.png) no-repeat scroll 0 0 transparent;width:78px;}
.demotool-content a.btn-apply{background:url(../images/variation/btn_apply.png) no-repeat scroll 0 0 transparent;width:97px;}
.demotool-content .box .content .col-1:first-child{margin-left:0;}
.demotool-content .box .content .col a:hover{text-decoration:none;}
.demotool-content .box .content .input{overflow:hidden;}
.demotool-content .box .content .input a{display:inline-block;float:left;}
.demotool-content .box .content .input a:hover img{border:2px solid #000000}
.demotool-content .box .content .input a.selected img{border:2px solid #000000}
.demotool-content .box .content .input a img{border:2px solid #ffffff}
.demotool-content .box .content .col{float:left;}
.demotool-content .box .content .col-1{width:112px;margin-left:12px;}
.demotool-content .box .content .col .input.input_font{border:0 none;float:left;margin:0;padding:6px 2px;min-height:21px;background:url(../images/variation/bg_select_font.png) no-repeat scroll 0 0 transparent;width:360px;}
.demotool-content .box .content .col .input select{width:362px;border:1px solid #DDDDDD;height:auto;}
.demotool-content .box .content .col .input select#em_box_wide{-webkit-appearance:menulist}
.demotool-content .box .content .col .input select#em_variation_google_font option{border-top:1px solid #f0e7e7;padding:3px 4px;}
.demotool-content .box .content .col .input select#em_variation_google_font option:first-child{border-top:none;}
.demotool-content .box .content .row .label,.demotool-content .box .content .col select{font:12px Tahoma,Arial,Helvetica,sans-serif;color:#000;border:none;background:none;background-color:transparent;-webkit-appearance:none;white-space:normal;text-align:left;}
.demotool-content .box .content .row .label{padding:14px 0 8px;display:inline-block}
.demotool-content .box .content select option{padding-right:0;}
.demotool-content .box .content .col .input input{height:30px;border:#e1e1e1 1px solid;background:#fff;padding:0 5px!important;color:#000;font-size:11px;line-height:30px;width:350px;font:12px Tahoma,Arial,Helvetica,sans-serif;}
.demotool-content .box .content .col-1 .input input{width:100px;}
@media screen and (-webkit-min-device-pixel-ratio:0){.demotool-content .box .content .col-1 .input.input_font{background:url(../images/variation/bg_select_font_1.png) no-repeat scroll 0 0 transparent;width:165px;}}
.qrcode{position:fixed;top:304px;left:0;z-index:21}
.qrcode li{width:49px;}
.qrcode li a span{display:block;width:47px;height:47px;background:url(../images/i_mobile.png) no-repeat scroll 0 0 transparent;text-indent:-999px;top:307px;width:47px;height:47px;text-indent:-99999px;border:#cecece 1px solid;border-left:none;border-top:none;}
.qrcode li a img{max-width:none!important;border:1px solid #CECECE;padding:20px;background:#fff;z-index:99;}
/*Color*/
.color_variation .btn_color_variation{background:url(../images/colorvariation/skin-picker.png) no-repeat scroll 0 0 transparent;position:fixed;left:0;text-indent:-999px;top:212px;z-index:23;width:47px;height:47px;display:block;border:1px solid #CECECE;box-shadow:0 0 10px #999999;border-left:none;}
.color_variation .colordiv{position:absolute;left:23%;top:10%;z-index:999;background:#F6F6F6;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;/* border radius */-webkit-box-shadow:0 0 15px rgba(0,0,0,.3);-moz-box-shadow:0 0 15px rgba(0,0,0,.3);box-shadow:0 0 15px rgba(0,0,0,.3);/* box shadow */webkit-background-clip:padding-box;/* smoother borders with webkit */}
.adapt-2.color_variation .colordiv{left:16%;}
.adapt-1 .color_variation .colordiv{left:11%;}
.color_variation .colordiv .btn_color_close{background:url(../images/btn_popup-close.png) no-repeat scroll 0 0 transparent;height:38px;width:38px;text-indent:-99999px;display:block;text-align:left;position:absolute;top:-20px;right:-18px;}
.color_variation .slider_container{background-color:transparent;border:none;margin:0;}
.demotool-content .box .content .col .input input#wide_full{border:0;float:left;width:auto;height:auto;margin:2px 5px 0 0;}
#bg_fade_color{background-color:#000;left:0px;margin:0px;padding:0px;position:fixed;top:0px;width:100%;z-index:998;height:1000px;}
.demotool-content .btn-primary{margin-left:15px;margin-top:10px}