/* 
##################################################################
 T2 Flex E-Business Stylesheet

 Wrap all rules applicable to our code in #t2container
 #t2container contains all of our code. this wrapper 
 prevents our styles from modifying customerland elements

 last modified 02/09/2007
##################################################################
*/

/* ############################################################### */
/* general body settings. You'll almost certainly want to modify the background-color property */
body
{
	background-color: #fff;
	color: #000;
	border-collapse: collapse;
	font-size: 90%;
	font-family: helvetica,arial,sans-serif;
	vertical-align: middle;
}

/* #### IF the customer's layout is forcing form elements (usually the buttons) down below the left-side content
   UNCOMMENT THE FOLLOWING RULE */
/* body #t2content { display:block; float:left; } */


/* ############################################################### */
/* generic, common styles */
#t2container .smallertext { font-size:.9em; }
#t2container ul.navigation { list-style:none; margin:1em 0; padding:0; }

/* ############################################################### */
/* anchor styles */
#t2container a,
#t2container a:link { color: #006; }
#t2container a:visited { color: #006; }
#t2container a:hover { color: #006; }
#t2container a:active { color: #006; }
#t2container .menulink { text-align: left; text-decoration: none; line-height:1.3em; border: 0px;}
#t2container .menulink:hover { text-decoration:underline; }

/* ############################################################### */
/* titles, instructions, and errors */
#t2container .headerContainer { margin:.25em 0; line-height:1.3em; }
#t2container .header { display: block; color: #000;	font-weight: bold; text-align: left; font-size:1.2em; }
#t2container .headerinst { display: block; font-style: italic; text-align: left; } 
#t2container .error { color: #c00; font-style: italic; display: block; text-align: left; font-weight:bold; }
#t2container .waitmessage { display: none; color: Red; text-align: center; }

#t2container .groupbox
{
	
	color: black;
	border-right: black thin groove;
	border-top: black thin groove;
	border-left: black thin groove;
	border-bottom: black thin groove;
	background-color: #eaeae7;
	text-decoration: none;
	padding-right: 3px;
	padding-left: 3px;
	padding-bottom: 5px;
	padding-top: 3px;
}

#t2container .groupbox_right
{
	float: right;
	width: 49%;
	color: black;
	border-right: black thin groove;
	border-top: black thin groove;
	border-left: black thin groove;
	border-bottom: black thin groove;
	background-color: #eaeae7;
	text-decoration: none;
	padding-right: 3px;
	padding-left: 3px;
	padding-bottom: 5px;
	padding-top: 3px;
}

#t2container .groupbox_left
{
	float: left;
	width: 49%;
	color: black;
	border-right: black thin groove;
	border-top: black thin groove;
	border-left: black thin groove;
	border-bottom: black thin groove;
	background-color: #eaeae7;
	text-decoration: none;
	padding-right: 3px;
	padding-left: 3px;
	padding-bottom: 5px;
	padding-top: 3px;
}

#t2container .announcement
{
	display: block;
	color: red;
	border-right: red thin solid;
	border-top: red thin solid;
	font-size: 18px;
	border-left: red thin solid;
	border-bottom: red thin solid;
	background-color: transparent;
	text-decoration: none;
	padding-right: 3px;
	padding-left: 3px;
	padding-bottom: 3px;
	cursor: help;
	padding-top: 3px;
}

#t2container .breadcrumb
{
	text-decoration: none;
	font-size: small;
	color: blue;
	font-family: Arial;
	width: 100%;
}

#t2container .configlink
{
	text-align: right;
	display: block;
	color: red;
	border-right: blue thin solid;
	border-top: blue thin solid;
	font-size: 12px;
	border-left: blue thin solid;
	border-bottom: blue thin solid;
	background-color: transparent;
	text-decoration: none;
	padding-right: 3px;
	padding-left: 3px;
	padding-bottom: 3px;
	padding-top: 3px;
}

/* Styles for the admin pages */
#t2container .qualifiers
{
	text-align: left;
	vertical-align: top;
	border-right: thin solid;
	border-top: thin solid;
	border-left: thin solid;
	border-bottom: thin solid;
	padding-left: 20px;
}

#t2container .floatingAdminControlsLeft
{
	float: left;
}

#t2container .floatingAdminControlsRight
{
	text-align: left;
	vertical-align: top;
	border-right: thin solid;
	border-top: thin solid;
	border-left: thin solid;
	border-bottom: thin solid;
	float: right;
	
}
#t2container .adminbutton { width: 90px; }
#t2container .adminbuttonnarrow { width: 45px; }

/* ############################################################### */
/* table styles (data) */
#t2container .tableGlobal
{ 
	/* edit the border width (0px) to create a border around the global table */
	border:1px solid #999; 
	color:#000; 
	background-color:#fff; 
	width:100%; 
	font-size:.9em; 
	border-collapse:collapse; 
	margin:1em 0;
}
#t2container .tableGlobal td
{
	padding: .05em .2em;
	vertical-align: top;
}
#t2container .tableActionColumn { color: #c00; text-align: center; }
#t2container .tableDataColumn { text-align: left; }
#t2container .tableHeader { text-align: left; color:#fff; background-color:#333; font-weight:bold; }
#t2container .tableLightHeader { text-align: left; color:#fff; background-color:#999; font-weight:bold; }
#t2container .tableLightBlueHighlight
{
	text-align: left;
	color: #fff;
	background-color: #c3c3ff;
	font-weight: bold;
}
#t2container .tableBlueHighlight
{
	text-align: left;
	color: #fff;
	background-color: Blue;
	font-weight: bold;
}
#t2container .tableLightGreenHighlight
{
	text-align: left;
	color: #fff;
	background-color: #44ff44;
	font-weight: bold;
}
#t2container .tableGreenHighlight
{
	text-align: left;
	color: #fff;
	background-color: Green;
	font-weight: bold;
}
#t2container .tableHeader a { color:#fff; font-weight:bold; }
#t2container .tableFooter { text-align: left; color:#fff; background-color:#333; font-weight:bold; }
#t2container .tableOddRow { background-color:#eee; }
#t2container .tableEvenRow { background-color:#dcdcdc; }
#t2container .tableOddRow-err { background-color:#eee; color: Red; }
#t2container .tableEvenRow-err { background-color:#dcdcdc; color: Red; }
#t2container .tableBreak { background-color: #ff0000; height: 1px; }
#t2container .tableSpace { background-color: #ffffff; height: 6px; }
#t2container .tableHighlight { background-color: #ffcccc; font-weight:bold; }
#t2container .tableHighlight-err { background-color: #ffcccc; font-weight:bold; color: Red;}
#t2container .tableSuperGroup { background-color: #ff0000; font-weight:bold; color: White;}
#t2container .tableGroup { background-color: #add6f7; font-weight:bold; color: black;}


/* ############################################################### */
/* datalist (rowlike structured label:data output) used on receipt pages and the like */
#t2container .datalist { line-height:1.75em; font-size:1em; overflow:hidden; _height:1%; }
#t2container .datalist div { clear:left; }
#t2container .datalist br { display:none; }
#t2container .datalist span { margin:0; padding:0; display:block; height:1.75em; line-height:inherit; font-size:inherit; }
#t2container .datalist span.label { clear:left; float:left; width:11em;  }
#t2container .datalist span.data { margin-left:11em; width:auto; }

/* ############################################################### */
/* FORM LAYOUT */

/* 
A FEW NOTES ABOUT FORMS:

group similar fields within fieldsets.

these fieldsets can be given a class of "leftLabel" or "rightLabel".
if you have checkboxes or radio buttons and you want the label placed to the RIGHT of the input element,
use "rightLabel". Otherwise, use "leftLabel".

put each row of elements in a div with a class of "row". 
I'd love to do away with this but IE7 introduced ANOTHER float-clearing bug which I haven't yet resolved.

*/

/* debugging styles */
/*
#t2container fieldset { background-color:#0ff; border:1px dotted #0ff; }
#t2container div.row { background-color:#ff0; }
#t2container label { border:1px solid #f00; }
#t2container span { border:1px solid #0f0; }
#t2container input { border:1px solid #00f; }
#t2container .datalist span.label { background-color:#ddd; }
#t2container .datalist span.data { background-color:#ccc; }
*/

/* common form elements */
#t2container form fieldset { border-width:0; text-indent:0; line-height:1.5em; margin:.5em 0 .5em 0; padding:.5em 0; }
#t2container form fieldset legend { font-weight:bold; font-size:.9em; margin:0 0 0 -.5em; padding:0; } /* -.5em margin is for ie */
#t2container form fieldset.rightLabel legend span.requiredmark,
#t2container form fieldset.leftLabel legend span.requiredmark  { display:inline; float:none; }
#t2container form div.requirement { clear:left; font-size:x-small; text-transform:uppercase; line-height:1.5em; margin:.75em 0; }
#t2container form div.requirement span.requiredmark { font-size:1.25em; font-weight:bold; }
#t2container form span.requiredmark { color:#a00; }
#t2container form .labelHorizontalDivider { display:block; clear:both; text-align:left; padding-left:11em; line-height:2em; font-weight:bold; }

/* fieldsets with labels to the right of inputs (checkboxes and radio buttons, primarily) */
/* to flush these elements to the left of the screen, set the fieldset class to "rightLabel flushleft" */
#t2container form fieldset.rightLabel { /*clear:left;*/ overflow:hidden; _height:1%; }
#t2container form fieldset.rightLabel .row { clear:left; padding-bottom:.5em; }
#t2container form fieldset.rightLabel br { display:none; }
#t2container form fieldset.rightLabel span.requiredmark,
#t2container form fieldset.rightLabel span.validator { padding-left:.25em; display:block; float:left; line-height:1.5em; }
#t2container form fieldset.rightLabel .input, 
#t2container form fieldset.rightLabel label.label { float:left; margin:0; padding:0; display:block; line-height:1.5em; }
#t2container form fieldset.rightLabel .input { height:1.5em; width:2em; padding-left:11em; padding-right:.5em; text-align:right; }
#t2container form fieldset.rightLabel .input input { vertical-align:middle; }
#t2container form fieldset.rightLabel label.label { width:auto; }
#t2container form fieldset.flushLeft .input { padding-left:0 !important; }

/* fieldsets with labels to the left of inputs */
#t2container form fieldset.leftLabel { /*clear:left;*/ line-height:1.5em; font-size:1em; }
#t2container form fieldset.leftLabel .row { clear:left; padding-bottom:.5em; }
#t2container form fieldset.leftLabel br { display:none; }
#t2container form fieldset.leftLabel span.requiredmark,
#t2container form fieldset.leftLabel span.validator  { padding-left:.1em; display:block; float:left; margin:.25em 0; line-height:inherit; }
#t2container form fieldset.leftLabel label.label,
#t2container form fieldset.leftLabel .cmdButton,
#t2container form fieldset.leftLabel .input { vertical-align:middle; float:left; margin:0; padding:0; display:block; line-height:inherit; }
#t2container form fieldset.leftLabel label.label { width:11em; margin:.25em 0; }
#t2container form fieldset.leftLabel .input { font-size:inherit; height:1.15em; font-size:inherit; padding:.15em 0; margin:.4em .25em 0 0; }
#t2container form fieldset.leftLabel select.input { height:auto; padding:0; } 
#t2container form fieldset.leftLabel .cmdButton { vertical-align:baseline; margin-right:.5em; font-size:.8em; padding:0 !important;}

/* calendar layout; related to button layout */
#t2container form .calendarContainer
{
	margin: .5em 0 .5em 0;
	text-align: center;
	padding: .25em .5em;
}
#t2container form .calendarLeft
{
	width: 48%;
	text-align: right;
	float: left;
}
#t2container form .calendarRight
{
	width: 48%;
	text-align: left;
	float: right;
}

/* button layout */
#popConfirmationWrapper .button,
#t2container form .button,
#t2container form .cmdButton { width:10em; text-align:center; font-weight:bold; background:#ccc; color:#000; font-size:.95em; }

#t2container form .buttonContainer,
#t2container form .buttonContainer-left,
#t2container form .buttonContainer-center { margin: .5em 0 .5em 0; text-align:center; clear:left; }

#t2container form .buttonContainer-left { margin-left:0; text-align:left; } 
#t2container form .buttonContainer-indent { margin:.5em 0 .5em 11em; text-align:left; } 
#t2container form .buttonContainer-center { margin-left:0; text-align:center; } /* this is actually the default. no need to specify this class instead of just "buttonContainer" */

#t2container form .buttonContainer .button,
#t2container form .buttonContainer-left .button,
#t2container form .buttonContainer-center .button { padding:.25em .5em; }

/* ############################################################### */
/* basic styling for different form field types */
/* will only apply to browsers supporting css2 attribute selectors */
#t2container form select[name] { border:1px inset #333; background:#f0f0f0; min-width:3em; }
#t2container form input[type="text"],
#t2container form input[type="password"] { border:1px inset #666; background:#f0f0f0; padding:.1em; min-width:12em; }
#t2container form textarea[name] { border:1px inset #333; background:#f0f0f0; padding:.15em; height:10em; width:24em; min-width:12em; font: .9em helvetica,arial,sans-serif; margin-top:.25em; display:block; }
#popConfirmationWrapper input[type="button"],
#t2container form input[type="button"],
#t2container form input[type="submit"] { font-weight:bold; }
#t2container form input[type="reset"] { font-weight:bold; }

/* ############################################################### */
/* shnazzy dynamic highlighting stuff */
/* will only apply to browsers supporting css2 attribute/pseudo-selectors */
#t2container form input[type="text"]:hover,
#t2container form input[type="password"]:hover,
#t2container form select[name]:hover,
#t2container form textarea[name]:hover { background:#f5f5dc; }

#t2container form input[type="text"]:focus,
#t2container form input[type="password"]:focus,
#t2container form select[name]:focus,
#t2container form textarea[name]:focus { background:#f9f9f9; }

#popConfirmationWrapper input[type="button"]:hover,
#t2container form input[type="button"]:hover,
#t2container form input[type="submit"]:hover { border-color:#262; background:#262; color:#fff; }

#popConfirmationWrapper input[type="button"]:focus
#t2container form input[type="button"]:focus,
#t2container form input[type="submit"]:focus { border-style:inset; }

#popConfirmationWrapper input[type="button"].warning:hover,
#t2container form input[type="reset"]:hover,
#t2container form input[type="button"].warning:hover,
#t2container form input[type="button"]#cmdBack:hover { border-color:#900; background:#900; color:#fff; }

/* ############################################################### */
/* specifics for particular forms/pages */

/* add some margin to the footer text on the citation receipt and citation confirmation pages */
#t2container form#CitationReceiptForm span#lblReceiptFooter { margin:1em 0; }
#t2container form#CitationConfirmForm span#lblFooterInst { margin:1em 0; }


/* from cory lindley's thickbox */
	#popConfirmationWrapper { 
		display:none; 
		position:absolute; 
		z-index:101; 
		top:0; 
		margin:0; 
		/*
		// we don't need the transparency
		background-color:#000;
		filter:alpha(opacity=60);
		-moz-opacity:0.6;
		opacity:0.6;
		*/
	}
	#popConfirmationDialog {
		display:none;
		position: absolute;
		background: #f6f6f6;
		z-index: 102;
		color:#000;
		padding:0;
		border:2px double #333;
		text-align:left;
	}
	#popConfirmationTitle 
	{
		display:block;
		background:#333;
		color:#fff;
		font-weight:bold;
		text-align:left;
		padding:.25em;
		margin:0;
	}
	/* end thickbox code */
	#popConfirmationDialogMsg { padding:1em; }
	#confirmDialogButtonOk { float:left; cursor:pointer; margin:1em;}
	#confirmDialogButtonCancel { float:right; cursor:pointer; margin:1em; }
	


#configColumn td
{
	text-align:left;
	width:12em;
	padding-right: .5em;	
}

#configColumn td .checkbox
{
	text-align:center;	
	padding-right: .5em;		
}

#configColumn .lblspan
{
	text-align:left;
	width:12em;
	mid-width:12em;
	padding-right: .5em;	
}

#configColumn .hide
{
	display:none;
}