/****************************************************************************
Color Picker Style Sheet

Created by Christian Web Programming

Copyright &copy; 2009-2010 by James E. Pettis

July 17, 2010
/****************************************************************************/


/****************************************************************************
Fonts
/****************************************************************************/
.Arial
	{
	font-family: 'arial', 'helvetica', 'arial mt', 'arial unicode ms', 'nimbus sans l', 'univers', sans-serif;
	}

.ArialBlack
	{
	font-family: 'arial black', 'gadget', sans-serif;
	}

.ArialNarrow
	{
	font-family: 'arial narrow', 'helvetica condensed', 'univers condensed', sans-serif;
	}

.ComicSans
	{
	font-family: 'comic sans ms', sans-serif;
	}

.Impact
	{
	font-family: 'impact', 'charcoal', sans-serif;
	}

.Lucida
	{
	font-family: 'lucida sans unicode', 'lucida grande', sans-serif;
	}

.Tahoma
	{
	font-family: 'tahoma', 'geneva', sans-serif;
	}

.Trebuchet
	{
	font-family: 'trebuchet ms', 'helvetica', sans-serif;
	}

.Verdana
	{
	font-family: 'verdana', 'geneva', sans-serif;
	}

.Courier
	{
	font-family: 'courier new', 'courier', monospace;
	}

.Georgia
	{
	font-family: 'georgia', 'new century schoolbook', 'nimbus roman no9 l', serif;
	}

.Times, .DDField input
	{
	font-family: 'times new roman', 'times', serif;
	}


/****************************************************************************
Font sizes
/****************************************************************************/
.Size3
	{
	font-size: 200%;
	}

.Size2
	{
	font-size: 159%;
	}

.Size1, .HorizontalRadioButtons label, div.ProgressBar
	{
	font-size: 126%;
	}
/****************************************************************************
end Font sizes
/****************************************************************************/


/****************************************************************************
Borders
/****************************************************************************/

/* Raised Border */
div.ProgressBar
	{
	border-style: solid;
	border-color: #FFFFFF #999999 #999999 #FFFFFF;
	}
/****************************************************************************
end Borders
/****************************************************************************/


/****************************************************************************
(Theme Sample Areas style)
/****************************************************************************/
div#aPB, div#bPB
	{
	border: solid .2em;
	border-color: #FFFFFF #DDDDDD #DDDDDD #FFFFFF;
	margin: .5em  auto;
	width: 41em;
	}

div#aTSD, div#bTSD
	{
	padding: .5em;
	}

div#aTSIH, div#bTSIH
	{
	padding-bottom: .6em;
	}

div#aTSIHIA, div#aTSDTAI, div#aTSDTAO, div#bTSIHIA, div#bTSDTAI, div#bTSDTAO
	{
	border-style: solid;
	border-width: .2em;
	display: inline-block;
	padding: .2em;
	text-align: center;
	width: 45%;
	}

div#ColorTable
	{
	padding-bottom: 1em;
	}

div#ColorTable h3, div#ColorTable th
	{
	color: #808080;
	}
/****************************************************************************
end (Theme Sample Areas style)
/****************************************************************************/




/****************************************************************************
.DDField
/***************************************************************************/
.DDField
	{
	background-color: #FFFFFF;
	border-color: #666666 #999999 #999999 #666666;
	border-style: solid;
	border-width: .2em;
	color: #000000;
	display: inline-block;
	padding: 0 0 0 .2em;
	text-align: left;
	white-space: nowrap;
	width: 11.4em;
	}

.DDField span
	{
	background-color: #E0E0E0;
	border-color: #999999 #666666 #666666 #999999;
	border-style: solid;
	border-width: .1em;
	color: #000000;
	display: inline-block;
	float: right;
	height: 1.8em;
	text-align: center;
	width: .95em;
	}

.DDField span span
	{
	border-style: none;
	float: none;
	font-size: 64%;
	height: auto;
	position: relative;
	top: .2em;
	width: auto;
	}

.DDField input
	{
	border-width: 0;
	color: #000000;
	display: inline-block;
	font-size: 126%;
	height: 1.43em;
	margin: 0;
	vertical-align: middle;
	width: 7.7em;
	}
/****************************************************************************
end .DDField
/***************************************************************************/


/****************************************************************************
.DDList
/***************************************************************************/
.DDList
	{
	background-color: #FFFFFF;
	border-color: #666666 #999999 #999999 #666666;
	border-style: solid;
	border-width: 0 .2em .2em .2em;
	color: #000000;
	margin: 0;
	position: absolute;
	overflow: auto;
	text-align: left;
	top: 2.4em;
	visibility: hidden;
	width: 11.7em;
	z-index: 1;
	}

.DDList li
	{
	margin: 0;
	padding-left: .2em;
	}

.DDList li:hover
	{
	background-color: #585858;
	color: #FFFFFF;
	}

.DDList li div
	{
	display: table-cell;
	height: 1.8em;
	vertical-align: middle;
	}

.DDList li span
	{
	font-size: 126%;
	}

.DDList .GroupTitle, .DDList li.GroupTitle:hover
	{
	background-color: #000000;
	color: #FFFFFF;
	font-style: italic;
	font-weight: bold;
	text-align: right;
	}
/****************************************************************************
end .DDList
/***************************************************************************/


.FontDDList
	{
	margin: auto;
	position: relative;
	width: 11.2em;
	}




div.HyperlinkHex
	{
	font-style: italic;
	padding-right: .6em;
	margin-top: 1.8em;
	text-align: right;
	width: 6.4em;
	}

div.HyperlinkName
	{
	margin-top: .2em;
	position: absolute;
	}

div.SampleArea
	{
	margin-top: 1em;
	}


/****************************************************************************
div.ProgressBar
/****************************************************************************/
div.ProgressBar
	{
	border-width: .2em;
	background-color: #CCCCCC;
	color: #000000;
	margin: .5em auto;
	padding: .2em;
	text-align: center;
	width: 20.4em;
	}

div.ProgressBar div.Container
	{
	border-color: #000000;
	border-style: solid;
	border-width: .1em;
	height: 1em;
	margin: .2em auto;
	text-align: left;
	width: 20em;
	}

div.ProgressBar div.Progress
	{
	background-color: #00FF00;
	height: 100%;
	width: 0;
	}
/****************************************************************************
end div.ProgressBar
/****************************************************************************/


/****************************************************************************
div.Tile
/****************************************************************************/
div.Tile
	{
	border-style: solid;
	border-width: .1em;
	margin-bottom: .1em;
	}

div.Tile .Small
	{
	font-family: 'arial', 'helvetica', sans-serif;
	font-size: 90%;
	}

div.Tile .RadioButtons
	{
	padding: .1em;
	position: absolute;
	visibility: hidden;
	}

div.Tile .ToggleSection
	{
	border-top-width: 1em;
	border-top-style: solid;
	padding: .1em;
	}

div.Tile .ColorName span
	{
	position: absolute;
	}

div.Tile input
	{
	margin: 0;
	padding: 0;
	width: 1em;
	}
/****************************************************************************
end div.Tile
/****************************************************************************/


/****************************************************************************
fieldset.Fonts
/****************************************************************************/
fieldset.Fonts
	{
	margin: 0 auto;
	width: 60em;
	}

fieldset.Fonts tr.Light
	{
	background-color: #4F4F4F;
	}

fieldset.Fonts table
	{
	font-size: 126%;
	margin-left: 0;
	width: 100%;
	}

fieldset.Fonts th
	{
	color: #FFFFFF;
	padding: .2em .5em;
	}

fieldset.Fonts tbody th
	{
	font-weight: normal;
	}

fieldset.Fonts th.Radio
	{
	width: 3em;
	}

fieldset.Fonts td
	{
	text-align: center;
	vertical-align: middle;
	}

fieldset.Fonts td.Left
	{
	text-align: left;
	}
/****************************************************************************
end fieldset.Fonts
/****************************************************************************/


fieldset.HorizontalRadioButtons
	{
	padding-bottom: .4em;
	}

fieldset.HorizontalRadioButtons input
	{
	margin: 0;
	padding: 0;
	}

fieldset.HorizontalRadioButtons span
	{
	display: inline-block;
	}

fieldset.HorizontalRadioButtons td, fieldset.HorizontalRadioButtons span
	{
	padding: .5em .6em .2em .6em;
	}

fieldset.HorizontalRadioButtons span.H4
	{
	padding: 0;
	}

fieldset.Multiline input
	{
	float: left;
	margin-top: .3em;
	margin-right: .1em;
	}

fieldset.Multiline label
	{
	float: left;
	text-align: left;
	}


/****************************************************************************
fieldset.ThemeColors
/****************************************************************************/
fieldset.ThemeColors
	{
	margin: 0;
	}

fieldset.ThemeColors table
	{
	font-size: 126%;
	}

fieldset.ThemeColors th
	{
	color: #FFFFFF;
	}

fieldset.ThemeColors td.Blue
	{
	padding-right: .2em;
	}

fieldset.ThemColors th, fieldset.ThemColors th
	{
	width: 1.9em;
	}

fieldset.ThemeColors .InputFields input
	{
	width: 1.9em;
	}

fieldset.ThemeColors input
	{
	font-size: 100%;
	margin: 0;
	text-align: right;
	}
/****************************************************************************
end fieldset.ThemeColors
/****************************************************************************/


/****************************************************************************
table.Color
/****************************************************************************/
table.Color th, table.Color td
	{
	padding: 0;
	padding-right: .1em;
	}

table.Color th
	{
	font-size: 126%;
	font-weight: bold;
	text-align: center;
	vertical-align: bottom;
	}

table.Color td
	{
	width: 4.6em;
	}
/****************************************************************************
end table.Color
/****************************************************************************/

table.Times td
	{
	text-align: right;
	}

table.Times .Green
	{
	color: #80FF80;
	}

table.Times .Yellow
	{
	color: #F0F020;
	}

table.Times .Red
	{
	color: #FF8080;
	}

table.ThemeColors th
	{
	width: 1px;
	}

ul.FontListBox
	{
	display: inline-block;
	height: 3em;
	width: 9em;
	}

