#options_panel {width:210px; position:fixed; left: -214px; top: 10px; margin-left: 0; z-index:9999; box-shadow: 1px 1px 10px #000; -webkit-box-shadow:  1px 1px 10px #000; -moz-box-shadow : 1px 1px 10px #000;  }
#options_panel h3 { width: 39px; height: 155px; position: absolute; top:50px; right: -39px; margin: 0;  cursor: pointer; background:transparent url(../../img/wrench.png) no-repeat center center;}
#options_panel h3 span {margin:5px 0 0 8px;}
#options_panel .Settings { font-size:24px; text-transform: uppercase; color:#666666;}
#options_panel .options { background-color:#fff; padding:13px;}
#options_panel h5 {text-transform: capitalize;}
#options_panel h5, #options_panel .options { color:#666;}

#options_panel select {width:100%; font-size:10px; text-transform:uppercase; color:#ccc; background:#f1f1f1; border-top:2px solid #e5e5e5; border-left:2px solid #e5e5e5; outline:none !important; height: 35px; }
#options_panel input[type=text] {width:50px; font-size:10px; text-transform:uppercase; color:#b1b1b1; background:#fff; padding:2px; border:px solid #c6c6c6; border-radius: 3px; outline:none !important; height:17px; vertical-align:top; }

#options_panel .dark_light_demo {list-style: none;margin: 0;padding: 0;}
#options_panel .dark_light_demo li {cursor: pointer; float: left; height: 28px; margin: 2px; width: 85px;  text-align:center; padding-top: 5px; font-weight: 600;}

#options_panel .style_demo {list-style: none;margin: 0;padding: 0;}
#options_panel .style_demo li { background-color:#f1f1f1; border: 1px solid #dcdcdc; color:#7c7c7c; cursor: pointer; float: left; height: 28px; margin: 2px; width: 85px;  text-align:center; font-weight: 600;}
#options_panel .style_demo li a:hover , #options_panel .style_demo li a { color:#7c7c7c; height:30px; display:block; padding-top:5px; }

#options_panel .color_suggestions {list-style: none; margin: 0;padding: 0; }
#options_panel .color_suggestions li {cursor: pointer; float: left; height: 32px; margin: 2px; width: 32px;}

#options_panel .note {margin-top:10px;}

#options_panel .color_picker_box { float:right;}
#options_panel  .color_picker_title { float:left; font-size: 11px; color: #b1b1b1; padding: 2px 0; font-weight: 500;}
#options_panel td { padding: 12px 0; border-bottom: 1px solid #cfcfcf;}
#options_panel .last { padding: 20px 0 10px 0; border-bottom: none;}


#options_panel .color_suggestions .allstar { background: transparent url(../../img/32/allstar.png) center no-repeat;}
#options_panel .color_suggestions .darkallstar { background: transparent url(../../img/32/darkallstar.png) center no-repeat;}
#options_panel .color_suggestions .cupcake { background: transparent url(../../img/32/cupcake.png) center no-repeat;}
#options_panel .color_suggestions .autumn { background: transparent url(../../img/32/autumn.png) center no-repeat;}
#options_panel .color_suggestions .sunrise { background: transparent url(../../img/32/sunrise.png) center no-repeat;}
#options_panel .color_suggestions .redsky { background: transparent url(../../img/32/redsky.png) center no-repeat;}
#options_panel .color_suggestions .pureblood { background: transparent url(../../img/32/pureblood.png) center no-repeat;}
#options_panel .color_suggestions .valentine { background: transparent url(../../img/32/valentine.png) center no-repeat;}
#options_panel .color_suggestions .clarity { background: transparent url(../../img/32/clarity.png) center no-repeat;}
#options_panel .color_suggestions .clarity2 { background: transparent url(../../img/32/clarity2.png) center no-repeat;}
#options_panel .color_suggestions .vividsea { background: transparent url(../../img/32/vividsea.png) center no-repeat;}
#options_panel .color_suggestions .rain { background: transparent url(../../img/32/rain.png) center no-repeat;}
#options_panel .color_suggestions .darkforest { background: transparent url(../../img/32/darkforest.png) center no-repeat;}
#options_panel .color_suggestions .greenmile { background: transparent url(../../img/32/greenmile.png) center no-repeat;}
#options_panel .color_suggestions .ruby { background: transparent url(../../img/32/ruby.png) center no-repeat;}


/*-----------------------------------------------------------------------------------*/
/*	Demo Navigation
/*-----------------------------------------------------------------------------------*/

.demo_navigation{
float:left;
width:180px;
}

.demo_navigation li {
background:#f1f1f1 url(../../img/demo_ico.png) right no-repeat;
border-top:1px solid #e5e5e5;  
border-left:1px solid #e5e5e5;
display:inline;
float:left;
position:relative;
width:100%;
}

.demo_navigation li a {
width:100%;
color:#999;
display:block;
font-size:12px;
font-weight: bold;
margin-top:10px;
padding:0 7px 7px;
text-decoration:none
}

.demo_navigation .sfHover a,.demo_navigation li:hover a {
 float:left
}

.demo_navigation > ul > li.current-menu-item,.demo_navigation > ul > li.current-menu-parent {
border-bottom:3px solid #ff9c00
}

.demo_navigation > ul > li.current-menu-item a,.demo_navigation > ul > li.current-menu-parent a {
float:left
}

.demo_navigation li ul {	
width:100%;
display:block;
left:-1px;
position:absolute;
visibility:hidden;
z-index:9999;
}

.demo_navigation li:hover ul {
visibility:visible
}

.demo_navigation li ul li {
background-image:none;
border-top:none;
border-left:none;
display:block;
float:none;
font-weight:300;
height:35px;
margin:0;
}

.demo_navigation li ul li:last-child {
border:none
}

.demo_navigation li ul li a {  
border-top:1px solid #e5e5e5;  
border-left:1px solid #e5e5e5;
float:none!important;
line-height:35px;
margin:0;
padding:0 3.6842% 0 7.3684%;
width:88.9474%
}

.demo_navigation li ul li a:hover {
color:#5f5d5d!important
}

.demo_navigation li ul li ul {
left:auto;
padding-top:0;
right:-100%;
top:0;
visibility:hidden!important
}

.demo_navigation li ul li:hover ul {
visibility:visible!important
}