/* Class Public*/
#userpanels { position:fixed; right:-5px; top:20px; font-size: 12px !important; z-index: 9999;  border:1px solid #ccc; background: #FFF; font-family: arial !important;}
#userpanels #toggle { width:31px; height:31px; position: absolute; left:-31px; top:-2px; background:url(img/userpanel.png) top left; }
#userpanel {position: relative; width: 145px;}
#userpanel .us_rows  { border-bottom:1px dashed #ccc; padding:5px 0 10px 0; margin: 0 10px;}
#userpanel .us_label { text-transform: capitalize; color:#666; font-size: 15px !important; display: block; margin-bottom: 10px;}
#userpanel select { width: 120px;}

/*Layout Style*/
#userpanel .paramrow label img { border:1px solid #ccc; float: left; margin: 3px;}
#userpanel .paramrow label img:hover { border-color:#fda219}
#userpanel .paramrow label.active img { border-color:#fda219}


/*Theme color*/
#userpanel .temp_color  .list .paramrow label {border: 1px solid #ccc; padding: 2px; float: left;  margin:3px;}
#userpanel .temp_color  .list .paramrow label:hover,
#userpanel .temp_color  .list .paramrow label.active { border-color: #fda219;}

#userpanel span.color-list { width: 18px; height: 18px;   float: left; text-indent: -999em; font-size: 0; color: #fff; }


.hidden {display: none;}


#userpanel .bt-bottom{ text-align:center; padding:10px 0; border:0; }
#userpanel .bt-panels { background:url(img/bg-bt.png) repeat-x; border:0; padding:1px 5px 2px; color:#666; margin:0 5px; cursor: pointer;}

.rtl #userpanels { direction:rtl;}
.rtl #userpanels { right: auto; }
.rtl #userpanels #toggle {left: auto !important; right: -31px !important; background-position: bottom left; }