.paneloptions { display:block;}
.opendemo { display:none;}
#opendemo { opacity:1;}

#demopanel {
	width:100px;
	position:fixed;
	top:0;
	left:0;
	z-index:8000;
	margin: 62px 2px 2px 2px;
	padding:10px;
	border:1px solid #111;
	background: #fff;
	}
	
#demopanel .demo_background { margin: 10px 0 0 0; }
	
#demopanel .demo_toggle { position:absolute; right:-38px; top:-2px; cursor:pointer;}
	
#demopanel a {color:#7d7d7d; text-decoration:none;}
#demopanel a:hover {color:#111; text-decoration:none;}

#demopanel h2 { font-size:14px; font-weight:bold; color:#444; margin:0 0 20px 0;padding:0;}		
#demopanel h3 { font-size:12px; font-weight:bold; letter-spacing:-1px; color:#444; margin:10px 0 5px 0;padding:0;}
#demopanel h4 { font-size:12px; font-weight:bold; color:#464646; margin:0;padding:0;}

#demopanel ul.default { list-style:none; font-size:11px; margin:10px 0 0 0;padding:0;}
#demopanel ul.skin { list-style:none; font-size:11px; width:50%; float:left; margin:10px 0 0 0;padding:0;}
#demopanel ul.default li, ul.skin li {  letter-spacing:0; border-bottom:1px dotted #B9B9B9; padding: 5px 0 5px 0;}

#demopanel .selectmenu { margin: 0; width: 100px; font-size:11px; letter-spacing: 1px; padding: 4px; }
#demopanel .selectmenu option { line-height: 20px; padding: 0 0 0 4px; }

#demopanel #demobutton { padding:2px; width:100px; margin:20px 0 0 0; font-size:12px; letter-spacing:1px;}

#demopanel .colorselector_big { margin: 10px 0 0 0; border:2px solid #444; width:60px; height: 20px;}
#demopanel .colorselector_small { margin: 10px 0 0 0; border:2px solid #444; width:60px; height: 20px;}



#demopanel .demo_pattern { display:block; padding:6px; width:6px; height:6px; border:1px solid #bbbbbb; float:left; margin: 0 5px 5px 0;}
#demopanel .demo_pattern:hover {display:block; border:1px solid #7d7d7d;}
#demopanel .demo_pattern:focus {display:block; border:1px solid #000;}
#demopanel #pattern1-png { background: url(../../images/backgrounds/thumbnails/pattern1.png) repeat; }
#demopanel #pattern2-png { background: url(../../images/backgrounds/thumbnails/pattern2.png) repeat; }
#demopanel #pattern3-png { background: url(../../images/backgrounds/thumbnails/pattern3.png) repeat; }
#demopanel #pattern4-png { background: url(../../images/backgrounds/thumbnails/pattern4.png) repeat; }
#demopanel #pattern5-png { background: url(../../images/backgrounds/thumbnails/pattern5.png) repeat; }
#demopanel #pattern6-png { background: url(../../images/backgrounds/thumbnails/pattern6.png) repeat; }
#demopanel #pattern7-png { background: url(../../images/backgrounds/thumbnails/pattern7.png) repeat; }
#demopanel #pattern8-png { background: url(../../images/backgrounds/thumbnails/pattern8.png) repeat; }
#demopanel #pattern9-png { background: url(../../images/backgrounds/thumbnails/pattern9.png) repeat; }
#demopanel #pattern10-png { background: url(../../images/backgrounds/thumbnails/pattern10.png) repeat; }
#demopanel #pattern11-png { background: url(../../images/backgrounds/thumbnails/pattern11.png) repeat; }
#demopanel #pattern12-png { background: url(../../images/backgrounds/thumbnails/pattern12.png) repeat; }
#demopanel #pattern13-png { background: url(../../images/backgrounds/thumbnails/pattern13.png) repeat; }
#demopanel #pattern14-png { background: url(../../images/backgrounds/thumbnails/pattern14.png) repeat; }
#demopanel #pattern15-png { background: url(../../images/backgrounds/thumbnails/pattern15.png) repeat; }
#demopanel #pattern16-png { background: url(../../images/backgrounds/thumbnails/pattern16.png) repeat; }
#demopanel #pattern17-png { background: url(../../images/backgrounds/thumbnails/pattern17.png) repeat; }
#demopanel #pattern18-png { background: url(../../images/backgrounds/thumbnails/pattern18.png) repeat; }
#demopanel #pattern19-png { background: url(../../images/backgrounds/thumbnails/pattern19.png) repeat; }
#demopanel #pattern20-png { background: url(../../images/backgrounds/thumbnails/pattern20.png) repeat; }
#demopanel #pattern21-png { background: url(../../images/backgrounds/thumbnails/pattern21.png) repeat; }
#demopanel #darkwood-jpg { background: url(../../images/backgrounds/thumbnails/darkwood.png) repeat; }
#demopanel #wood-jpg { background: url(../../images/backgrounds/thumbnails/wood.png) repeat; }
#demopanel #sand-jpg { background: url(../../images/backgrounds/thumbnails/sand.png) repeat; }
#demopanel #metal1-jpg { background: url(../../images/backgrounds/thumbnails/metal1.png) repeat; }
#demopanel #metal2-jpg { background: url(../../images/backgrounds/thumbnails/metal2.png) repeat; }
#demopanel #grains1-jpg { background: url(../../images/backgrounds/thumbnails/grains1.png) repeat; }
#demopanel #rainbow-jpg { background: url(../../images/backgrounds/thumbnails/rainbow.png) repeat; }
#demopanel #paint1-jpg { background: url(../../images/backgrounds/thumbnails/paint1.png) repeat; }
#demopanel #paint2-jpg { background: url(../../images/backgrounds/thumbnails/paint2.png) repeat; }
#demopanel #paint3-jpg { background: url(../../images/backgrounds/thumbnails/paint3.png) repeat; }
#demopanel #paint4-jpg { background: url(../../images/backgrounds/thumbnails/paint4.png) repeat; }