
#options_panel{ width:220px; height:100%; position:fixed; left:-188px; top:0;  z-index:500;}
#options_panel_content_wrap{width:150px; padding:10px 20px 10px; float:left; background:url(../img/theme/options_bg.png) repeat-y right; height:100%;
-moz-border-bottom-right-radius:20px;
-webkit-border-bottom-right-radius:20px;
}
#options_panel_content{width:150px; margin:0 auto;  float:left; font-size:10px; }
#options_panel_content h3{margin: 0 0 10px;}
#options_panel_content p{color:#777; margin:0 0 6px 0; text-transform:uppercase; font-size:10px;}
#options_panel_btn{ width:50px; height:50px; background:url(../img/theme/cogwheel.png) no-repeat; position:absolute; bottom:0; left:50%;}
#options_panel #close{display:block; position:absolute; top:12px; right:45px; height:30px; width:30px; background:url(../img/theme/close.png);}
#options_panel #openPanel{display:block; position:absolute; top:100px; right:0px; height:200px; width:32px; background:url(../img/theme/options.png) no-repeat right center;}
#options_panel .one-fifth{margin:0 0 8px;}
#options_panel h6 {margin:0 0 4px 0;}
#options_panel h6 span{display:block;}
#options_panel select{margin:0 0 6px 0;}
/* DEMO ONLY */

#config{position:fixed; width:100px;  display:block; left:100%; top:0px; margin-left:-200px; z-index:100;}
#config .trigger{width:120px; background-color:#fff; color:#333;}
#config .toggle_container{width:170px; padding:10px;}

.selector_wrap{padding:4px 10px 4px 0px; float:left; clear:none; margin:0 0 4px; width:44px;}
.selector_text{float:left; text-transform:uppercase; font-size:10px; margin-top:4px; }

.colorSelector {
	position: relative;
	width: 40px;
	height: 24px;
	margin-right:8px;
	float:left;
	
}
.colorSelector div {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 38px;
	height: 24px;
	/*background: url(lib/img/colorpicker/select.png) center;*/
}



.colorpicker {
	width: 356px;
	height: 176px;
	overflow: hidden;
	position: absolute;
	z-index:999;
	background: url(../img/colorpicker/colorpicker_background.png);
	font-family: Arial, Helvetica, sans-serif;
	display: none;
}
.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(../img/colorpicker/colorpicker_overlay.png);
}
.colorpicker_color div div {
	position: absolute;
	top: 0;
	left: 0;
	width: 11px;
	height: 11px;
	overflow: hidden;
	background: url(../img/colorpicker/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(../img/colorpicker/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[type=text] {
	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: 11px;
}
.colorpicker_hex {
	position: absolute;
	width: 72px;
	height: 22px;
	background: url(../img/colorpicker/colorpicker_hex.png) top;
	left: 212px;
	top: 142px;
}
.colorpicker_hex input[type=text] {
	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(lib/img/colorpicker/colorpicker_rgb_r.png);
	top: 52px;
	left: 212px;
}
.colorpicker_rgb_g {
	background-image: url(lib/img/colorpicker/colorpicker_rgb_g.png);
	top: 82px;
	left: 212px;
}
.colorpicker_rgb_b {
	background-image: url(../img/colorpicker/colorpicker_rgb_b.png);
	top: 112px;
	left: 212px;
}
.colorpicker_hsb_h {
	background-image: url(../img/colorpicker/colorpicker_hsb_h.png);
	top: 52px;
	left: 282px;
}
.colorpicker_hsb_s {
	background-image: url(../img/colorpicker/colorpicker_hsb_s.png);
	top: 82px;
	left: 282px;
}
.colorpicker_hsb_b {
	background-image: url(../img/colorpicker/colorpicker_hsb_b.png);
	top: 112px;
	left: 282px;
}
.colorpicker_submit {
	position: absolute;
	width: 22px;
	height: 22px;
	background: url(../img/colorpicker/colorpicker_submit.png) top;
	left: 322px;
	top: 142px;
	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;
}

