/*
	Cyclomedia.Controls
	
	default css styles, 
	
	these are wired up to match the asp.net server tags, i.e.
	
	<cm:TexBox /> -> .cm_TextBox

*/


/*
	Three standard widths corresponding to each Control's Size
	setting of Thin,Norm and Wide, respectively, override these if you wish
*/
.C__Thin
{
	width: 75px;
}

.C__Norm
{
	width: 150px;
}

.C__Wide
{
	width: 400px;
}

/*
	invalid image placed next to each control during validation phase
*/
img.CC_Invalid
{
	vertical-align: top;	/* for textareas */
	/* margin: 2px;	for prettyness */
}


/*
	Chan.Controls.DropDown

*/
select.CC_DropDown
{
	width:				150px;
	border:				1px solid #666;
}

select.CC_DropDown option
{
	margin-right:		1em;
}


/*
	Chan.Controls.Button
*/

input.CC_Button
{
	padding:			1px;
	border:				1px solid #333;
	background-color: 	#dddddd;				/* Light Grey - Contact Button */
	/*height:				1.75em;*/
	font-size:			12px;
	cursor:pointer;								/* hand - Firefox insists on not using "hand" - make sense of that if you can */
}

/*
	Chan.Controls.TextBox
*/

input.CC_TextBox,
input.CC_Numeric,
input.CC_Password,
textarea.CC_TextBox
{
	padding:			1px;
	border:				1px solid #666;
	background-color:	#FFFFFF;	/* white */
	/*height:				1.75em;*/
	text-align:			left;
	font-size:			1em;
}

input.CC_Numeric
{
	text-align:			right;
}


textarea.CC_TextBox
{
	font-family:		Verdana, Arial, Helvetica, sans-serif;
	/*width:				300px;*/
	height:				110px;
}


/*
	Chan.Controls.Date
*/

input.CC_Date_DD,
input.CC_Date_MM
{
	padding:			1px;
	text-align:			right;
	border:				1px solid #666;
	width: 3em;
}

input.CC_Date_YYYY
{
	padding:			1px;
	text-align:			right;
	border:				1px solid #666;
	width: 3em;	
}

select.CC_Date_MM
{
	border:				1px solid #666;
	width: 4em;	
}





/*
	Chan.Controls.Grid
*/


table.CC_Grid
{
	border-collapse: collapse;
	border-top: 1px solid #999;
	border-left: 1px solid #999;
}

table.CC_Grid th,
table.CC_Grid td
{
	border-bottom: 1px solid #999;
	border-right: 1px solid #999;			
}

/*
	default column widths only need applying to the header row
*/
table.CC_Grid th
{
	width: 10em;
}



/*
	first Child is left-hand column of row numbers
*/
table.CC_Grid tr:first-child
{		
	width: 2em;
}

/*

*/
td.CC_Grid_TD_Edit
{
	background-color: green;
}

td.CC_Grid_TD_Edit input
{
	background-color: yellow;
}



/*
	TabPanel
*/
div.CC_TabPanel
{

}

div.CC_TabBody
{
	border: 1px solid #999;
	padding: 5px;
}

div.CC_TabHeader
{
	padding: 0 10px;
	position: relative;
}

div.CC_TabHeader input
{
	background-color: #ccc;
	border: 1px solid #999;
	outline: none;
	position: relative;
	top: 1px;
	cursor: pointer;
}

div.CC_TabHeader input.CC_Tab_Selected
{
	border-bottom: 1px solid #fff;
	background-color: #fff;
}

div.CC_TabHeader input.CC_Tab_Disabled
{
	cursor: default;
}




/*
	Panel or ImagePanel with Scroll ability
*/


table.C__Scroll
{
	margin: 	0;
	padding: 	0;
	width: 		100%;
	height: 	100%;
	/*border-collapse: collapse;*/
}

table.C__Scroll td
{
	margin: 	0;
	padding: 	0;	
	width: 		100%;
	height: 	100%;
	/*border-collapse: collapse;*/
}

/*table.C__Scroll tr
{
	height: 0;
}*/

table.C__Scroll th
{
	margin: 	0;
	padding: 	0;
	width: 		0;
	height: 	0;
	/*border-collapse: collapse;
	background-color:red;*/
}

div.C__Scroll_Outer
{
	position: 	relative;
	width: 		100%;
	height: 	100%;
}

div.C__Scroll_Inner
{
	position:	absolute;
}




table.C__Scroll th
{
	background-position: center;
	background-repeat: no-repeat;
	cursor: 	pointer;
	_cursor: 	hand;
	width: 		0;
	height: 	0;
}

	div.CC_ImagePanel .CC_Image
	{
		display: 	block;
		margin: 	5px;
	}

	/*
		the outer div
	*/
	div.CC_ImagePanel
	{
		/*display: inline-block;*/
		position: relative;
		
		/*background-color: #FF9;*/
	}

	
	input.CC_Image
	{
		cursor: pointer;
	}


	div.CC_ImagePanel input,
	div.CC_ImagePanel img
	{
		border: 2px solid white;
		padding: 2px;
	}


	/*div.CC_ImagePanel .Selected
	{
		border-color: #009;
	}
	*/


	/*
		a table represents the dropdown
	*/
	table.CC_DropDownPanel
	{
		/*background-color: #F99;*/
		
		width: 100%;
		/*height: 100%;*/
		border: 1px solid #666;
		border-collapse: collapse;
	}

	table.CC_DropDownPanel td,
	table.CC_DropDownPanel th
	{
		/*background-color: #9FF;*/
		
		text-align: center;
		vertical-align: middle;
		border: 1px solid #666;
		padding: 0;
	}

	table.CC_DropDownPanel th
	{
		/*background-color: #FF9;*/
		
		cursor:	pointer;
		background-image: url(SS0.gif);
		background-position: center;
		background-repeat: no-repeat;	
	}

	/*table.CC_DropDownPanel th:hover
	{
		background-image: url(SS1.gif);
	}*/



	/*
		The dropdown list itself
	*/
	div.CC_DropDownPanel
	{
		width: 100%;
		text-align: center;
		overflow: auto;
		/*height: 96px;*/
	}

	div.CC_DropDownPanel input:hover
	{
		border-color: #999;
	}