@charset "utf-8";
/* position */
.fl{float:left}
.fr{float:right}
.fn{float:none}
.db{display:block}
.dt{display:table}
.di{display:inline}
.dn{display:none}
.dib{display:inline-block}
.ofh{overflow:hidden}
.ofa{overflow:auto}
.ofv{overflow:visible}
.ofs{overflow:scroll}
.overflows{overflow-y:auto;overflow-x:hidden}
.cl{clear:left}
.cr{clear:right}
.cb{clear:both}
.ps{position:static}
.pr{position:relative}
.pa{position:absolute}
.pf{position:fixed}
.read-only {background-color:#eee !important}
.tablef{table-layout:fixed !important}
.tal{text-align:left !important}
.tar{text-align:right !important}
.tac{text-align:center !important}
.vat{vertical-align:top !important}
.vam{vertical-align:middle !important}
.vab{vertical-align:bottom !important}
/* commend */
.nolne {border:none !important}
.bl_nolne {border-left:none !important}
.bt_nolne {border-top:none !important}
.bt_nolne .first th,
.bt_nolne .first td {border-top:none !important}
.br_nolne {border-right:none !important}
.bb_nolne {border-bottom:none !important}
.bd{border:1px solid #ddd !important}
.bt{border-top:1px solid #ddd !important}
.br{border-right:1px solid #ddd !important}
.bb{border-bottom:1px solid #ddd !important}
.bl{border-left:1px solid #ddd !important}
.dt_line{border-bottom:1px dotted #cccccc !important}
.rbar{cursor:s-resize}
.cur,.curp{cursor:pointer;}
.center{margin:0 auto}
.tlauto{display:table;margin-left:auto}
.trauto{display:table;margin-right:auto}
.tcauto{display:table;margin-left:auto;margin-right:auto}
.wauto{width:auto !important}
.hauto{height:auto !important}
.wfull{width:100%}
.hfull{height:100%}
.whalf{width:50%}
.hhalf{height:50%}
.mp0{margin:0 !important;padding:0 !important}
.m0{margin:0 !important}
.p0{padding:0 !important}
.b0{border:0 !important}
.casket{float:left;display:block;_display:inline;overflow:hidden}
.italic{font-style:italic !important}
.nowrap{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tn{text-decoration:none !important}
.tu{text-decoration:underline !important}
.to{text-decoration:overline !important}
.tl{text-decoration:line-through !important}
.ti{text-decoration:lighter !important}
.ti9{text-indent:-9999em}
.list0{background-color:#ffffff !important}
.list1{background-color:#f8f8f8 !important}
.list2{background-color:#f4f4f4 !important}
.bc_input{background-color:#F7F4F6 !important}
.tb_bg{background-color:#cecece !important}
.lsnone{letter-spacing:0 !important}
.ls05{letter-spacing:-0.05em !important}
.bg_red{background-color:#ff0000;color:#fff;border:0 !important}
.bg_blue{background-color:#0000FF;color:#fff;border:0 !important}
.bg_ff6{background-color:#ff6699 ;color:#fff;border:0 !important} /* 빨강 계열 */
.bg_5cd{background-color:#5cd5a8;color:#fff;border:0 !important} /* 녹색 계열*/
.bg_b66{background-color:#b666d5;color:#fff;border:0 !important} /* 보라 계열*/
.bg_fea{background-color:#fea316;color:#fff;border:0 !important} /* 노랑 계열*/
.bg_3f6{background-color:#3f6afe;color:#fff;border:0 !important} /* 파랑 계열*/
.bg_848{background-color:#848484;color:#fff;border:0 !important} /* 회색 계열*/
.lh1{line-height:1em !important}
.lh4{line-height:1.4em !important}
.lh6{line-height:1.6em !important}
.normal{font-weight:normal !important}
.bold{font-weight:600; !important}
.bbold{font-weight:800; !important}
.fs11 {font-size:11px !important;}
.fs12 {font-size:12px !important;}
.fs13 {font-size:13px !important;}
.fs14 {font-size:14px !important;}
.fs15 {font-size:15px !important;}
.fs16 {font-size:16px !important;}
.fs18 {font-size:18px !important;}
.fs20 {font-size:20px !important;}
.fs22 {font-size:22px !important;}
.fs25 {font-size:25px !important;}
.fs28 {font-size:28px !important;}
/* font color */
.fc_wht{color:#ffffff !important} /* 흰색 */
.fc_blk{color:#000000 !important} /* 검정 */
.fc_red{color:#ec0e03 !important} /* 빨강기본 */
.fc_e01{color:#e01818 !important} /* 빨강2 */
.fc_green{color:#008000 !important} /* 녹색기본 */
.fc_107{color:#6b8f13 !important} /* 녹색 */
.fc_197{color:#197fe0 !important} /* 파랑1 */
.fc_2a6{color:#2a62b1 !important} /* 파랑2 */
.fc_000{color:#0000ff !important} /* 파랑3 */
.fc_blue{color:#0000ff !important} /* 파랑기본 */
.fc_08b{color:#00008B !important} /* 다크블루 */
.fc_fffb{color:#fffbac !important} /* 노랑 */
.fc_fff3{color:#fff300 !important} /* 밝은노랑 */
.fc_255{color:#ffa500 !important} /* 주황1 */
.fc_eb7{color:#eb7c06 !important} /* 주황2 */
.fc_e06{color:#e06c04 !important} /* 주황3 */
.fc_ee5{color:#ee5f4a !important} /* 주황4 */
.fc_214{color:#d6d6d6 !important} /* 회색1 */
.fc_125{color:#7d7d7d !important} /* 회색2 */
.fc_137{color:#898989 !important} /* 회색3 */
.fc_90{color:#5a94c5 !important}
.fc_only-Hangul {-webkit-ime-mode:active;-moz-ime-mode:active;-ms-ime-mode:active;ime-mode:active;}
.fc_only-Alphabet {-webkit-ime-mode:disabled;-moz-ime-mode:disabled;-ms-ime-mode:disabled;ime-mode:disabled;}
.fc_not-Hangul {-webkit-ime-mode:inactive;-moz-ime-mode:inactive;-ms-ime-mode:inactive;ime-mode:inactive;}
/* margin */
.mart0 {margin-top:0px !important}
.mart1 {margin-top:1px !important}
.mart2 {margin-top:2px !important}
.mart3 {margin-top:3px !important}
.mart4 {margin-top:4px !important}
.mart5 {margin-top:5px !important}
.mart6 {margin-top:6px !important}
.mart7 {margin-top:7px !important}
.mart8 {margin-top:8px !important}
.mart9 {margin-top:9px !important}
.mart10 {margin-top:10px !important}
.mart11 {margin-top:11px !important}
.mart12 {margin-top:12px !important}
.mart13 {margin-top:13px !important}
.mart14 {margin-top:14px !important}
.mart15 {margin-top:15px !important}
.mart16 {margin-top:16px !important}
.mart17 {margin-top:17px !important}
.mart19 {margin-top:19px !important}
.mart20 {margin-top:20px !important}
.mart21 {margin-top:21px !important}
.mart22 {margin-top:22px !important}
.mart23 {margin-top:23px !important}
.mart24 {margin-top:24px !important}
.mart25 {margin-top:25px !important}
.mart26 {margin-top:26px !important}
.mart27 {margin-top:27px !important}
.mart28 {margin-top:28px !important}
.mart29 {margin-top:29px !important}
.mart30 {margin-top:30px !important}
.mart35 {margin-top:35px !important}
.mart40 {margin-top:40px !important}
.mart45 {margin-top:45px !important}
.mart50 {margin-top:50px !important}
.mart55 {margin-top:55px !important}
.mart65 {margin-top:65px !important}
.mart80 {margin-top:80px !important}
.marr1 {margin-right:1px !important}
.marr2 {margin-right:2px !important}
.marr3 {margin-right:3px !important}
.marr4 {margin-right:4px !important}
.marr5 {margin-right:5px !important}
.marr6 {margin-right:6px !important}
.marr7 {margin-right:7px !important}
.marr8 {margin-right:8px !important}
.marr9 {margin-right:9px !important}
.marr10 {margin-right:10px !important}
.marr11 {margin-right:11px !important}
.marr12 {margin-right:12px !important}
.marr13 {margin-right:13px !important}
.marr14 {margin-right:14px !important}
.marr15 {margin-right:15px !important}
.marr20 {margin-right:20px !important}
.marr30 {margin-right:30px !important}
.marr35 {margin-right:35px !important}
.marr40 {margin-right:40px !important}
.marr50 {margin-right:50px !important}
.marb0 {margin-bottom:0px !important}
.marb1 {margin-bottom:1px !important}
.marb2 {margin-bottom:2px !important}
.marb3 {margin-bottom:3px !important}
.marb4 {margin-bottom:4px !important}
.marb5 {margin-bottom:5px !important}
.marb6 {margin-bottom:6px !important}
.marb7 {margin-bottom:7px !important}
.marb8 {margin-bottom:8px !important}
.marb9 {margin-bottom:9px !important}
.marb10 {margin-bottom:10px !important}
.marb11 {margin-bottom:11px !important}
.marb12 {margin-bottom:12px !important}
.marb13 {margin-bottom:13px !important}
.marb14 {margin-bottom:14px !important}
.marb15 {margin-bottom:15px !important}
.marb20 {margin-bottom:20px !important}
.marb25 {margin-bottom:25px !important}
.marb30 {margin-bottom:30px !important}
.marb40 {margin-bottom:40px !important}
.marb50 {margin-bottom:50px !important}
.marb60 {margin-bottom:60px !important}
.marb99 {margin-bottom:99px !important}
.marb200 {margin-bottom:200px !important}
.marl0 {margin-left:0px !important}
.marl1 {margin-left:1px !important}
.marl2 {margin-left:2px !important}
.marl3 {margin-left:3px !important}
.marl4 {margin-left:4px !important}
.marl5 {margin-left:5px !important}
.marl6 {margin-left:6px !important}
.marl7 {margin-left:7px !important}
.marl8 {margin-left:8px !important}
.marl9 {margin-left:9px !important}
.marl10 {margin-left:10px !important}
.marl11 {margin-left:11px !important}
.marl12 {margin-left:12px !important}
.marl13 {margin-left:13px !important}
.marl14 {margin-left:14px !important}
.marl15 {margin-left:15px !important}
.marl16 {margin-left:16px !important}
.marl17 {margin-left:17px !important}
.marl18 {margin-left:18px !important}
.marl19 {margin-left:19px !important}
.marl20 {margin-left:20px !important}
.marl25 {margin-left:25px !important}
.marl30 {margin-left:30px !important}
.marl45 {margin-left:45px !important}
.marl50 {margin-left:50px !important}
.marl55 {margin-left:55px !important}
.marl60 {margin-left:60px !important}
.marl65 {margin-left:65px !important}
.marl70 {margin-left:70px !important}
.marl80 {margin-left:80px !important}
.marl90 {margin-left:90px !important}
.marl100 {margin-left:100px !important}
.marl110 {margin-left:110px !important}
/* padding */
.pad50 {padding:5px 0px !important}
.pad55 {padding:5px 5px !important}
.pad510 {padding:5px 10px !important}
.pad70 {padding:7px 0px !important}
.pad77 {padding:7px 7px !important}
.padt1 {padding-top:1px !important}
.padt2 {padding-top:2px !important}
.padt3 {padding-top:3px !important}
.padt4 {padding-top:4px !important}
.padt5 {padding-top:5px !important}
.padt6 {padding-top:6px !important}
.padt7 {padding-top:7px !important}
.padt8 {padding-top:8px !important}
.padt9 {padding-top:9px !important}
.padt10 {padding-top:10px !important}
.padt11 {padding-top:11px !important}
.padt12 {padding-top:12px !important}
.padt13 {padding-top:13px !important}
.padt14 {padding-top:14px !important}
.padt15 {padding-top:15px !important}
.padt18 {padding-top:18px !important}
.padt20 {padding-top:20px !important}
.padt22 {padding-top:22px !important}
.padt25 {padding-top:25px !important}
.padt30 {padding-top:30px !important}
.padt31 {padding-top:31px !important}
.padt33 {padding-top:33px !important}
.padt100 {padding-top:100px !important}
.padt150 {padding-top:150px !important}
.padt170 {padding-top:170px !important}
.padt185 {padding-top:185px !important}
.padr1 {padding-right:1px !important}
.padr2 {padding-right:2px !important}
.padr3 {padding-right:3px !important}
.padr4 {padding-right:4px !important}
.padr5 {padding-right:5px !important}
.padr6 {padding-right:6px !important}
.padr7 {padding-right:7px !important}
.padr8 {padding-right:8px !important}
.padr9 {padding-right:9px !important}
.padr10 {padding-right:10px !important}
.padr15 {padding-right:15px !important}
.padr20 {padding-right:20px !important}
.padr40 {padding-right:40px !important}
.padb1 {padding-bottom:1px !important}
.padb2 {padding-bottom:2px !important}
.padb3 {padding-bottom:3px !important}
.padb4 {padding-bottom:4px !important}
.padb5 {padding-bottom:5px !important}
.padb6 {padding-bottom:6px !important}
.padb7 {padding-bottom:7px !important}
.padb8 {padding-bottom:8px !important}
.padb9 {padding-bottom:9px !important}
.padb10 {padding-bottom:10px !important}
.padb15 {padding-bottom:15px !important}
.padb20 {padding-bottom:20px !important}
.padb30 {padding-bottom:30px !important}
.padb50 {padding-bottom:50px !important}
.padb60 {padding-bottom:60px !important}
.padl1 {padding-left:1px !important}
.padl2 {padding-left:2px !important}
.padl3 {padding-left:3px !important}
.padl4 {padding-left:4px !important}
.padl5 {padding-left:5px !important}
.padl6 {padding-left:6px !important}
.padl7 {padding-left:7px !important}
.padl8 {padding-left:8px !important}
.padl9 {padding-left:9px !important}
.padl10 {padding-left:10px !important}
.padl11 {padding-left:11px !important}
.padl12 {padding-left:12px !important}
.padl13 {padding-left:13px !important}
.padl14 {padding-left:14px !important}
.padl15 {padding-left:15px !important}
.padl20 {padding-left:20px !important}
.padl23 {padding-left:23px !important}
.padl27 {padding-left:27px !important}
.padl29 {padding-left:29px !important}
.padl30 {padding-left:30px !important}
.padl48 {padding-left:48px !important}
.padl60 {padding-left:60px !important}
.padl225 {padding-left:225px !important}
/* 테이블 그리드 */
.w10 {width:10px !important}
.w13 {width:13px !important}
.w14 {width:14px !important}
.w15 {width:15px !important}
.w20 {width:20px !important}
.w25 {width:25px !important}
.w30 {width:30px !important}
.w40 {width:40px !important}
.w50 {width:50px !important}
.w55 {width:55px !important}
.w60 {width:60px !important}
.w65 {width:65px !important}
.w70 {width:70px !important}
.w73 {width:73px !important}
.w80 {width:80px !important}
.w90 {width:90px !important}
.w100 {width:100px !important}
.w110 {width:110px !important}
.w115 {width:115px !important}
.w116 {width:116px !important}
.w120 {width:120px !important}
.w130 {width:130px !important}
.w140 {width:140px !important}
.w149 {width:149px !important}
.w150 {width:150px !important}
.w160 {width:160px !important}
.w170 {width:170px !important}
.w180 {width:180px !important}
.w190 {width:190px !important}
.w200 {width:200px !important}
.w220 {width:220px !important}
.w250 {width:250px !important}
.w300 {width:300px !important}
.w312 {width:312px !important}
.w325 {width:325px !important}
.w350 {width:350px !important}
.w460 {width:460px !important}
.w467 {width:467px !important}
.w470 {width:470px !important}
.w480 {width:480px !important}
.w500 {width:500px !important}
.w520 {width:520px !important}
.w550 {width:550px !important}
.w610 {width:610px !important}
.w754 {width:754px !important}
.w910 {width:910px !important}
.w964 {width:964px !important}
.w975 {width:975px !important}
.w1010 {width:10%; !important}
.w1020 {width:20%; !important}
.w1030 {width:30%; !important}
.w1040 {width:40%; !important}
.w1050 {width:50%; !important}
.w1060 {width:60%; !important}
.w1070 {width:70%; !important}
.w1080 {width:80%; !important}
.w1090 {width:90%; !important}
.w1092 {width:92%; !important}
.w1095 {width:95%; !important}
.w1096 {width:96%; !important}
.w1097 {width:97%; !important}
.w1098 {width:98%; !important}
.w1099 {width:99%; !important}
.w1000 {width:100%; !important}
.h10 {height:10px !important}
.h13 {height:13px !important}
.h14 {height:14px !important}
.h15 {height:15px !important}
.h20 {height:20px !important}
.h25 {height:25px !important}
.h30 {height:30px !important}
.h35 {height:35px !important}
.h40 {height:40px !important}
.h50 {height:50px !important}
.h55 {height:55px !important}
.h60 {height:60px !important}
.h65 {height:65px !important}
.h70 {height:70px !important}
.h73 {height:73px !important}
.h80 {height:80px !important}
.h90 {height:90px !important}
.h300 {height:300px !important;}
/* 적용방법
참조 : https://www.html-code-generator.com/css/radio-button-checkbox.php no.1 Preview
*/ /*
*/
.onoffRadio {
background: #cfe7fa;
background: -moz-linear-gradient(top, #cfe7fa 0%, #6393c1 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cfe7fa), color-stop(100%, #6393c1));
background: -webkit-linear-gradient(top, #cfe7fa 0%, #6393c1 100%);
background: -o-linear-gradient(top, #cfe7fa 0%, #6393c1 100%);
background: -ms-linear-gradient(top, #cfe7fa 0%, #6393c1 100%);
background: linear-gradient(top, #cfe7fa 0%, #6393c1 100%);
border: 1px solid #6393c1;
-moz-border-radius: 40px;
-webkit-border-radius: 40px;
border-radius: 40px;
-moz-box-shadow: inset 1px 1px 0px rgba(255, 255, 255, .5), inset -1px -1px 0px rgba(0, 0, 0, .5);
-webkit-box-shadow: inset 1px 1px 0px rgba(255, 255, 255, .5), inset -1px -1px 0px rgba(0, 0, 0, .5);
box-shadow: inset 1px 1px 0px rgba(255, 255, 255, .5), inset -1px -1px 0px rgba(0, 0, 0, .5);
cursor: pointer;
display: inline-block;
font: 15px Arial, Verdana, Geneva, sans-serif;
line-height: 41px;
padding-right: 20px;
}
.onoffRadio:hover .inner {
opacity: .5;
}
.onoffRadio input {
display: none;
}
.onoffRadio input:checked + .outer .inner {
opacity: 1;
}
.onoffRadio .outer {
background: #2989d8;
background: -moz-radial-gradient(center, ellipse cover, #2989d8 0%, #101354 99%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #2989d8), color-stop(99%, #101354));
background: -webkit-radial-gradient(center, ellipse cover, #2989d8 0%, #101354 99%);
background: -o-radial-gradient(center, ellipse cover, #2989d8 0%, #101354 99%);
background: -ms-radial-gradient(center, ellipse cover, #2989d8 0%, #101354 99%);
background: radial-gradient(center, ellipse cover, #2989d8 0%, #101354 99%);
border: 1px solid black;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
display: block;
float: left;
height: 20px;
margin: 10px;
width: 20px;
}
.onoffRadio .inner {
background: #e4f5fc;
background: -moz-radial-gradient(center, ellipse cover, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #e4f5fc), color-stop(50%, #bfe8f9), color-stop(51%, #9fd8ef), color-stop(100%, #2ab0ed));
background: -webkit-radial-gradient(center, ellipse cover, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
background: -o-radial-gradient(center, ellipse cover, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
background: -ms-radial-gradient(center, ellipse cover, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
background: radial-gradient(center, ellipse cover, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
display: block;
height: 14px;
margin: 3px;
opacity: 0;
-moz-transition: opacity .5s;
-webkit-transition: opacity .5s;
-o-transition: opacity .5s;
transition: opacity .5s;
width: 14px;
}
/* 적용방법
참조 : https://www.html-code-generator.com/css/radio-button-checkbox.php no.27 Preview
*/ /*
*/
.onoffswitch {
position: relative;
width: 90px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
margin: 0px auto;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
display: block;
overflow: hidden;
cursor: pointer;
border: 2px solid #666666;
border-radius: 5px;
}
.onoffswitch-inner {
width: 200%;
margin-left: -100%;
-moz-transition: margin 0.3s ease-in 0s;
-webkit-transition: margin 0.3s ease-in 0s;
-o-transition: margin 0.3s ease-in 0s;
transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before,
.onoffswitch-inner:after {
float: left;
width: 50%;
height: 30px;
padding: 0;
line-height: 30px;
font-size: 16px;
color: white;
font-family: Trebuchet, Arial, sans-serif;
font-weight: bold;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.onoffswitch-inner:before {
content: "ON";
padding-left: 10px;
background-color: #6194FD;
color: #FFFFFF;
}
.onoffswitch-inner:after {
content: "OFF";
padding-right: 10px;
background-color: #F8F8F8;
color: #666666;
text-align: right;
}
.onoffswitch-switch {
width: 35px;
margin: 0px;
background: #FFFFFF;
border: 2px solid #666666;
border-radius: 5px;
position: absolute;
top: 0;
bottom: 0;
right: 51px;
-moz-transition: all 0.3s ease-in 0s;
-webkit-transition: all 0.3s ease-in 0s;
-o-transition: all 0.3s ease-in 0s;
transition: all 0.3s ease-in 0s;
background-image: -moz-linear-gradient(center top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 100%);
background-image: -webkit-linear-gradient(center top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 100%);
background-image: -o-linear-gradient(center top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 100%);
background-image: linear-gradient(center top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 100%);
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
right: 0px;
}
/* 적용방법
참조 : https://www.html-code-generator.com/css/radio-button-checkbox.php no.2 Preview
*/ /*
*/
#sliderLabel {
border: 1px solid #a2a2a2;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
cursor: pointer;
display: block;
height: 30px;
overflow: hidden;
position: relative;
width: 100px;
display: inline-block;
}
#sliderLabel input {
display: none;
}
#sliderLabel input:checked + #slider {
left: 0px;
}
#slider {
left: -50px;
position: absolute;
top: 0px;
-webkit-transition: left .25s ease-out;
-moz-transition: left .25s ease-out;
-o-transition: left .25s ease-out;
-ms-transition: left .25s ease-out;
transition: left .25s ease-out;
}
#sliderOn,
#sliderBlock,
#sliderOff {
display: block;
font-family: arial, verdana, sans-serif;
font-weight: bold;
height: 30px;
line-height: 30px;
position: absolute;
text-align: center;
top: 0px;
}
#sliderOn {
background: #3269aa;
background: -webkit-linear-gradient(top, #3269aa 0%, #82b3f4 100%);
background: -moz-linear-gradient(top, #3269aa 0%, #82b3f4 100%);
background: -o-linear-gradient(top, #3269aa 0%, #82b3f4 100%);
background: -ms-linear-gradient(top, #3269aa 0%, #82b3f4 100%);
background: linear-gradient(top, #3269aa 0%, #82b3f4 100%);
color: white;
left: 0px;
width: 54px;
}
#sliderBlock {
background: #d9d9d8;
background: -webkit-linear-gradient(top, #d9d9d8 0%, #fcfcfc 100%);
background: -moz-linear-gradient(top, #d9d9d8 0%, #fcfcfc 100%);
background: -o-linear-gradient(top, #d9d9d8 0%, #fcfcfc 100%);
background: -ms-linear-gradient(top, #d9d9d8 0%, #fcfcfc 100%);
background: linear-gradient(top, #d9d9d8 0%, #fcfcfc 100%);
border: 1px solid #a2a2a2;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
height: 28px;
left: 50px;
width: 50px;
}
#sliderOff {
background: #f2f3f2;
background: -webkit-linear-gradient(top, #8b8c8b 0%, #f2f3f2 50%);
background: -moz-linear-gradient(top, #8b8c8b 0%, #f2f3f2 50%);
background: -o-linear-gradient(top, #8b8c8b 0%, #f2f3f2 50%);
background: -ms-linear-gradient(top, #8b8c8b 0%, #f2f3f2 50%);
background: linear-gradient(top, #8b8c8b 0%, #f2f3f2 50%);
color: #8b8b8b;
left: 96px;
width: 54px;
}
.ui-tooltip, .arrow:after {
background: black;
border: 2px solid white;
}
.ui-tooltip {
padding: 10px 20px;
color: white;
border-radius: 20px;
font: bold 14px "Helvetica Neue", Sans-Serif;
text-transform: uppercase;
box-shadow: 0 0 7px black;
}
.arrow {
width: 70px;
height: 16px;
overflow: hidden;
position: absolute;
left: 50%;
margin-left: -35px;
bottom: -16px;
}
.arrow.top {
top: -16px;
bottom: auto;
}
.arrow.left {
left: 20%;
}
.arrow:after {
content: "";
position: absolute;
left: 20px;
top: -20px;
width: 25px;
height: 25px;
box-shadow: 6px 5px 9px -9px black;
transform: rotate(45deg);
}
.arrow.top:after {
bottom: -20px;
top: auto;
}