body{
  font-size: 11pt;
  font-family: "Arial", "Verdana", "Tahoma", sans-serif;
  color: black;
  background-color: rgb(230,230,210);
  text-align: center;
  padding: 2px;
  margin: 0px;
}
#ccontent{
  border: 1px groove black;
  width: 900px;
  margin: 0px auto;
  text-align: left;
  background-color: rgb(230,240,210);
}
#option{
  display: block;
  border: 1px solid gray;
  min-height: 315px !important;
  height: auto !important;
  text-align: left;
  padding: 5px 10px;
}
#option #elements{
  width: 49%;
  display: block;
  border: 1px solid gray;
  float: left;
}
#option #picker{
  display: block;
  width: 49%;
  padding: 5px;
  min-height: 300px !important;
  border: 1px solid gray;
  float: right;
}
#option .choice{
  border-right: 2px solid gray;
  margin: 0px 10px 0px 0px;
}
#option label{
  display: block;
  margin: 1px;
  padding: 2px;
  border-bottom: 1px solid green;
  border-left: 3px solid green;
}
#option label a{
  border: 1px solid gray;
  padding: 1px 5px;
  margin: 1px 3px;
  background-color: rgb(90,220,90);
  text-decoration: none;
}
#option label a:hover{
  background-color: rgb(200,200,100);
}
#visual{
  display: block;
  border: 1px solid gray;
  min-height: 300px;
  text-align: left;
  background-color: white;
}
#visual form{
  background-color: white;
}
#visual label, #visual p{
  display: block;
  border: none;
  margin: 2px;
  padding: 2px;
}


.indicator
{
	width: 8px;
	height: 18px;
	background-color: #FF9900;
	position: absolute;
	font-size: 1px;
	overflow: hidden;
	border: none;
}
.slider
{
  clear: both;
	width: 263px;
	height: 18px;
  margin: 5px 0px 5px 70px;
	/*background-image: url(slider_back.jpg);*/
	position: relative;
	border-bottom: 2px groove gray;
}
#indicator_red{
	/*background-image: url(indicator1.gif);*/
  background-color: red;
}
#indicator_green{
	/*background-image:url(indicator2.gif);*/
	background-color: green;
}
#indicator_blue{
	/*background-image:url(indicator3.gif);*/
	background-color: blue;
}



#colorPicker
{
  clear: both;
  float: left;
	position: relative;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
}
#color
{
	position: absolute;
	height: 192px;
	width: 192px;
	background-color: #FF0000;
	background-image: url(images/pickerbg.png);
	background-repeat: no-repeat;
	background-position: center;
	top: 0px;
	left: 0px;
}
#colorIndic
{
	position: absolute;
	width: 11px;
	height: 11px;
	background-image: url(images/select.gif);
}
#hue
{
	position: absolute;
	top: 3px;
	left: 200px;
	width: 18px;
	height: 186px;
	background-image: url(images/hue.png);
}
#hueIndic
{
	position:absolute;
	background-image: url(images/color_indic.gif);
	width: 18px;
	height: 7px; 
}
#colorCurrent
{
	width: 60px;
	height: 60px;
	border: 2px solid #999;
	position: absolute;
	left: 240px;
	top: 8px;
}
#colorValues
{
	position: absolute;
	left: 240px;
	top: 80px;
}
#colorValues input
{
	font-size: 11px;
	padding: 1px;
}
#oldColor
{
	position: absolute;
	background-color: #fff;
	top: 50%;
	height: 50%;
	width: 100%;
}
#rgbR, #rgbG, #rgbB
{
	width: 20px;
}
#hex
{
	width: 40px;
}