.color-dialog
{
	width: 325px;
	height: auto;
	border: 1px solid #969696;
	border-color: #969696 #7b7b7b #7b7b7b #969696;
	background: #fff;
	padding:0px 0px 4px 0px;
	font-size: 11px;
}
.dialog-title
{
	width: 100%;
	height: 20px;
	background: #fff url("../images/art/colorPicker/dialog/horizontal.png") repeat-x;
}
.dialog-title a
{
	cursor: default;
	float: right;
	width: 16px;
	height: 16px;
	text-decoration: none;
	background: transparent url("../images/art/colorPicker/dialog/static.png") no-repeat;
	margin: 2px;
}
.dialog-title a:hover
{
	background-position: 0px -16px;
}
.dialog-title a:active
{
	background-position: 0px -32px;
	outline: none;
}
.dialog-title a:focus
{
	outline: none;
}
.dialog-title a span
{
	display: none;
}

.dialog-footer
{
	 width: 315px;
	 height: 40px;
	 padding: 0px;
	 margin: 0px 4px;
	 background: #d6d6d6;
	 border: 1px solid #fff;
	 border-color: #fff #9d9da1 #9d9da1 #ededed;
}
.dialog-footer #chip
{
	float: left;
	width: 225px;
	height: 21px;
	border: 1px solid #fff;
	border-color: #9d9da1 #fff #fff #9d9da1;
	margin: 8px 0px 0px 9px;
}
.dialog-footer #hex
{
	float: left;
	width: 58px;
	height: 21px;
	border: 1px solid #fff;
	border-color: #9d9da1 #fff #fff #9d9da1;
	background: #fff;
	color: #333;
	line-height: 21px;
	margin: 8px 0px 0px 5px;
	padding: 0px 0px 0px 4px;
}

.dialog-tabs
{
	height: 20px;
	background: #fff;
	margin: 0px 4px;
}
.dialog-tabs a
{
	cursor: default;
	float: left;
	height: 19px;
	border: 1px solid #0f0;
	line-height: 19px;
	padding: 0px 12px;
	color: #666;
	border-color: #fff #9d9da1 #fff #ededed;
	border-top: none;
	background: #d6d6d6;
	text-decoration:none;
}
.dialog-tabs a:hover
{
	background: #ddd;
	color: #777;
}
.dialog-tabs a.dialog-tab-selected
{
	float: left;
	height: 19px;
	border: 1px solid #fff;
	line-height: 19px;
	padding: 0px 12px;
	border-color: #fff #ccc #ededed #f1f1f1;
	border-top: none;
	color: #333;
	background: #ededed;
}
.dialog-tabs a span
{
	padding: 0px 3px;
}

.dialog-content
{
	padding: 0;
	margin: 0px 4px;
}
.dialog-content .dialog-page
{
	width: 315px;
	height: 275px;
	background: #ededed;
	border: 1px solid #ededed;
	border-color: #ededed #ccc #ccc #ededed;
}

.colorpicker
{
	margin: 9px 0 10px 9px;
}
.colorpicker-plane
{
	border: 1px solid #999;
	border-color: #999 #fff #fff #999;
}

.trackCssClass 
{
	border: 1px solid #999;
	border-color: #999 #fff #fff #999;
	cursor: default !important; 
}
.gripCssClass 
{ 
	width:34px !important;
	height:9px !important;
	background:transparent url("../images/art/colorPicker/slider/static.png") no-repeat !important;
	cursor: n-resize !important; 
}
.gripCssClass:hover 
{ 
	background-position: 0px -9px !important;
}
a.gripCssClass:active,
a.gripCssClass:focus 
{ 
	outline:none !important; 
}

#GridPage .dialog-page
{
	height:200px !important;
}
.color-grid
{
	padding: 8px;
	margin: 0;
	z-index: 999999 !important;
	height: 184px;
}
.color-swatches
{
	width: 100%;
	height: 184px;
}
.color-swatch 
{
	border: 1px solid #999;
	border-color: #999 #fff #fff #999;
	cursor: default;
	overflow: hidden;
	padding: 0;
	margin: 0;
}
.color-swatch-hover 
{ 
	border: 1px solid #999;
	cursor: default;
	overflow: hidden;
	padding: 0;
	margin: 0;
}
.color-swatch-active 
{ 
	border: 1px solid #333;
	cursor: default;
	overflow: hidden;
	padding: 0;
	margin: 0;
}