/*
--------------------------------------------
Elements
--------------------------------------------
*/
INPUT.cpinput
{
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: WindowText;
	background-color: Window;
	cursor: text;
}
DIV.cpdiv
{
	position: absolute;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: ButtonText;
	cursor: default;
	/*overflow: hidden;*/
}
BUTTON.cpbutton
{
	position: absolute;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: ButtonText;
	cursor: default;
	background-color:ButtonFace;	
}
/*
--------------------------------------------
Buttons
--------------------------------------------
*/
#btnOK
{
	top: 220px;
	left: 320px;
	border: 1px solid #000000;
	width: 60px;
	height: 20px;
}
#btnCustom
{
	top: 53px;
	left: 411px;
	color: ButtonText;
	border: 1px solid #000000;
	width: 60px;
	height: 20px;
}
#btnCancel
{
	top: 248px;
	left: 320px;
	color: ButtonText;
	border: 1px solid #000000;
	width: 60px;
	height: 20px;
}
#btnWebSafeColor
{
	border-style: none;
	border-width: 0px;
	background-image: url(../images/colorpicker/WebSafe.gif);
	width: 11px;
	height: 12px;
	left: 383px;
	top: 49px;
}
#btnPrintSafeColor
{
	border: 1px none #000000;
	background-image: url(../images/colorpicker/PrintSafe.gif);
	width: 13px;
	height: 13px;
	left: 382px;
	top: 14px;
}
/*
--------------------------------------------
Basic Controls
--------------------------------------------
*/
#lblSelectColorMessage
{
	top: 10px;
	left: 10px;
}
#pnlOldColor
{
	top: 45px;
	left: 317px;
	border-left: 1px solid black;
	border-bottom: 1px solid black;
	border-right: 1px solid black;
	background-color: #00013A;
	width: 60px;
	height: 34px;
	z-index: 2;
}
#pnlOldColorBorder
{
	top: 45px;
	left: 316px;
	border-left: 1px solid ThreeDShadow;
	border-bottom: 1px solid ThreeDHighlight;
	border-right: 1px solid ThreeDHighlight;
	width: 62px;
	height: 35px;
	z-index: 1;
}
#pnlNewColor
{
	background-color: #2729AD;
	top: 11px;
	left: 317px;
	border-left: 1px solid black;
	border-top: 1px solid black;
	border-right: 1px solid black;
	width: 60px;
	height: 34px;
	z-index: 2;
}
#pnlNewColorBorder
{
	top: 10px;
	left: 316px;
	border-left: 1px solid ThreeDShadow;
	border-top: 1px solid ThreeDShadow;
	border-right: 1px solid ThreeDHighlight;
	width: 62px;
	height: 35px;
	z-index: 1;
}
#chkOnlyWebColors
{
	top: 279px;
	left: 10px;
	width: 13px;
	height: 13px;
	cursor: default;
}
#lblOnlyWebColors
{
	top: 279px;
	left: 28px;
}
#pnlWebSafeColor
{
	top: 66px;
	left: 383px;
	width: 12px;
	height: 12px;
	border: 1px solid black;
	background-color: #333399;
	z-index: 2;
}
#pnlWebSafeColorBorder
{
	top: 65px;
	left: 382px;
	width: 14px;
	height: 14px;
	border-left: 1px solid ThreeDShadow;
	border-top: 1px solid ThreeDShadow;
	border-right: 1px solid ThreeDHighlight;
	border-bottom: 1px solid ThreeDHighlight;
	z-index: 1;
}
#pnlPrintSafeColor
{
	top: 32px;
	left: 383px;
	width: 12px;
	height: 12px;
	border: solid 1px black;
	background-color: #363F9A;
	z-index: 2;
}
#pnlPrintSafeColorBorder
{
	top: 31px;
	left: 382px;
	width: 14px;
	height: 14px;
	border-left: 1px solid ThreeDShadow;
	border-top: 1px solid ThreeDShadow;
	border-right: 1px solid ThreeDHighlight;
	border-bottom: 1px solid ThreeDHighlight;
	z-index: 1;
}
#pnlVerticalPosition
{
	width: 35px;
	height: 11px;
	background-image: url(../images/colorpicker/VerticalPosition.gif);
	left: 274px;
	top: 93px;
	overflow:hidden;
}
#pnlGradientPosition
{
	width: 11px;
	height: 11px;
	background-image: url(../images/colorpicker/GradientPositionLight.gif);
	left: 205px;
	top: 89px;
	z-index: 98;
	overflow:hidden;
}
/*
--------------------------------------------
Gradient
--------------------------------------------
*/
#pnlGradient_Top
{
	top: 12px;
	left: 12px;
	height: 256px;
	width: 256px;
	z-index: 99;
	cursor: url(images/dropper.ani), pointer;
}

#pnlGradient_Background2
{
	top: 11px;
	left: 11px;
	height: 256px;
	width: 256px;
	z-index: 100;
	border: 1px solid black;
}
#pnlGradient_Background1
{
	top: 10px;
	left: 10px;
	height: 258px;
	width: 258px;
	z-index: 101;
	border: solid 1px;
	border-top-color: ThreeDShadow;
	border-left-color: ThreeDShadow;
	border-bottom-color: ThreeDHighlight;
	border-right-color: ThreeDHighlight;
	cursor: url(images/dropper.ani), pointer;
}
/*
--------------------------------------------
Vertical Bar
--------------------------------------------
*/
#pnlVertical_Top
{
	top: 12px;
	left: 282px;
	height: 256px;
	width: 19px;
	z-index: 98;
	cursor: url(images/dropper.ani), pointer;
}

#pnlVertical_Background2
{
	top: 11px;
	left: 281px;
	height: 256px;
	width: 19px;
	z-index: 4;
	border: 1px solid black;
}
#pnlVertical_Background1
{
	top: 10px;
	left: 280px;
	height: 258px;
	width: 21px;
	z-index: 5;
	border: 1px solid black;
	border-top-color: ThreeDShadow;
	border-left-color: ThreeDShadow;
	border-bottom-color: ThreeDHighlight;
	border-right-color: ThreeDHighlight;	
}




/*
--------------------------------------------------------
Color Mode: Hue / Saturation / Brightness (HSB)
--------------------------------------------------------
*/
#pnlSpectrum_Background
{
	top: 12px;
	left: 282px;
	height: 256px;
	width: 19px;
	background-color: red;
	background-image:url(../images/colorpicker/spectrum.png);
	z-index: 3;	
}
#pnlSpectrum_RedMagenta
{
	top: 12px;
	left: 282px;
	height: 42px;
	width: 19px;
	/*background-color: #ff00ff;*/
	z-index: 5;
	/*filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, startY=0, finishY=100, startX=0, finishX=0); */
}
#pnlSpectrum_MagentaBlue
{
	top: 54px;
	left: 282px;
	height: 43px;
	width: 19px;
	/*background-color: #ff00ff;*/
	z-index: 5;
	/*filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, startY=0, finishY=100, startX=0, finishX=0); */
}
#pnlSpectrum_Blue
{
	top: 54px;
	left: 282px;
	height: 86px;
	width: 19px;
	/*background-color: #0000ff;*/
	z-index: 4;
}
#pnlSpectrum_BlueCyan
{
	top: 97px;
	left: 282px;
	height: 43px;
	width: 19px;
	/*background-color: #00ffff;*/
	z-index: 5;
	/*filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, startY=0, finishY=100, startX=0, finishX=0); */
}
#pnlSpectrum_CyanGreen
{
	top: 140px;
	left: 282px;
	height: 43px;
	width: 19px;
	/*background-color: #00ffff;*/
	z-index: 5;
	/*filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, startY=0, finishY=100, startX=0, finishX=0); */
}
#pnlSpectrum_Green
{
	top: 140px;
	left: 282px;
	height: 86px;
	width: 19px;
	/*background-color: #00ff00;*/
	z-index: 4;
}
#pnlSpectrum_GreenYellow
{
	top: 183px;
	left: 282px;
	height: 43px;
	width: 19px;
	/*background-color: #ffff00;*/
	z-index: 5;
	/*filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, startY=0, finishY=100, startX=0, finishX=0); */
}
#pnlSpectrum_YellowRed
{
	top: 226px;
	left: 282px;
	height: 42px;
	width: 19px;
	/*background-color: #ffff00;*/
	z-index: 5;
	/*filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, startY=0, finishY=100, startX=0, finishX=0); */
}
#pnlGradient_Black
{
	top: 12px;
	left: 12px;
	height: 256px;
	width: 256px;
	/*background-color: Black;*/
	/*filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, startY=100, finishY=0, startX=0, finishX=0); */
	background-image:url(../images/colorpicker/cp_black.png);
	z-index: 5;
}
#pnlGradient_White
{
	top: 12px;
	left: 12px;
	height: 256px;
	width: 256px;
	/*background-color: White;*/
	/*filter: Alpha(Opacity=100, FinishOpacity=0, Style=1, startX=0, finishX=100, startY=0, finishY=0);*/ 
	background-image:url(../images/colorpicker/cp_white.png);
	z-index: 4;
}
#pnlGradient_Hue
{
	top: 12px;
	left: 12px;
	height: 256px;
	width: 256px;
	background-color: #0006FF;
	z-index: 3;
}
#lblHSB_Hue
{
	top: 119px;
	left: 334px;
}
#txtHSB_Hue
{
	top: 115px;
	left: 348px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblUnitHSB_Hue
{
	top: 117px;
	left: 380px;
	font-size: 10pt;
}
#lblHSB_Saturation
{
	top: 144px;
	left: 334px;
}
#txtHSB_Saturation
{
	top: 140px;
	left: 348px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblUnitHSB_Saturation
{
	top: 143px;
	left: 382px;
}
#lblHSB_Brightness
{
	top: 169px;
	left: 334px;
}
#txtHSB_Brightness
{
	top: 165px;
	left: 348px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblUnitHSB_Brightness
{
	top: 168px;
	left: 382px;
}
/*
--------------------------------------------------------
Color Mode: Red / Green / Blue (RGB a.k.a. additive)
--------------------------------------------------------
*/
#lblRGB_Red
{
	top: 105px;
	left: 317px;
}
#txtRGB_Red
{
	top: 102px;
	left: 330px;
	border: 1px solid #000000;
	width: 45px;
	height: 18px;
}
#lblRGB_Green
{
	top: 130px;
	left: 317px;
}
#txtRGB_Green
{
	top: 127px;
	left: 330px;
	border: 1px solid #000000;
	width: 45px;
	height: 18px;
}
#lblRGB_Blue
{
	top: 155px;
	left: 317px;
}
#txtRGB_Blue
{
	top: 152px;
	left: 330px;
	border: 1px solid #000000;
	width: 45px;
	height: 18px;
}
/*
--------------------------------------------------------
Color Mode: Luminancy a/b (Lab)
--------------------------------------------------------
*/
#lblLab_Luminancy
{
	top: 119px;
	left: 419px;
}
#txtLab_Luminancy
{
	top: 115px;
	left: 433px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblLab_A
{
	top: 144px;
	left: 419px;
}
#txtLab_A
{
	top: 140px;
	left: 433px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblLab_B
{
	top: 169px;
	left: 419px;
}
#txtLab_B
{
	top: 165px;
	left: 433px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
/*
--------------------------------------------------------
Color Mode: Cyan / Magenta / Yellow / Black (CMYK a.k.a. Subtractive)
--------------------------------------------------------
*/
#lblCMYK_Cyan
{
	top: 198px;
	left: 410px;
	text-align: right;
	width: 20px;
}
#txtCMYK_Cyan
{
	top: 195px;
	left: 433px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblUnitCMYK_Cyan
{
	top: 198px;
	left: 467px;
}
#lblCMYK_Magenta
{
	top: 223px;
	left: 410px;
	text-align: right;
	width: 20px;
}
#txtCMYK_Magenta
{
	top: 220px;
	left: 433px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblUnitCMYK_Magenta
{
	top: 223px;
	left: 467px;
}
#lblCMYK_Yellow
{
	top: 248px;
	left: 410px;
	text-align: right;
	width: 20px;
}
#txtCMYK_Yellow
{
	top: 245px;
	left: 433px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblUnitCMYK_Yellow
{
	top: 248px;
	left: 467px;
}
#lblCMYK_Black
{
	top: 273px;
	left: 410px;
	text-align: right;
	width: 20px;
}
#txtCMYK_Black
{
	top: 270px;
	left: 433px;
	border: 1px solid #000000;
	width: 27px;
	height: 18px;
}
#lblUnitCMYK_Black
{
	top: 273px;
	left: 467px;
}
/*
--------------------------------------------------------
Color Mode: Hex (Hex values of RGB a.k.a. HTML Color value)
--------------------------------------------------------
*/
#lblHex
{
	top: 180px;
	left: 320px;
}
#txtHex
{
	top: 177px;
	left: 330px;
	border: 1px solid #000000;
	width: 45px;
	height: 16px;
}