/* Note: LabelTextBox, LabelTextBoxNumeric and LabelCalendar all derive from the base LabelControlBase class 
* Because they are composite controls you can use use the object heirarchy to define control styles. They also
* include the required field validators if required is set to true. */
.tps-LabelTextBox { clear: both; padding: 2px 0; }


.tps-LabelTextBox > div:first-child /* label and required mark group */
{
    float: left;
    _font-weight: normal;
	_text-align: left;
}

* html .tps-LabelTextBox div
{
    float: left;
    _font-weight: normal;
	_text-align: left;
}

.tps-LabelTextBox > div:first-child > span /* required mark */
{
    color: #c00;
    margin-right: 3px;
    float: right;
	border: solid 1px transparent; /* To make Forefox3.x render an empty floated tag with width */
}

* html .tps-LabelTextBox div span /* required mark */
{
    color: #c00;
    margin-right: 3px;
    float: right;
}

.tps-LabelTextBox label { color: #333; } /* label text */
.tps-LabelTextBox input { border: solid 1px #7f9db9; margin-right: 0.5em; vertical-align: middle; width: 20em; }
.tps-LabelTextBox.Large input { width: 45em; } 
.tps-LabelTextBox.postal-code input { width: 3em; }
.tps-LabelTextBox.height-weight input { width: 1.75em; }
.tps-LabelTextBox .Watermark
{
    color: #666;
}
.tps-LabelTextBox > span.ReadOnly /* read-only text data */
{
    color: #000 !important; /* override "> span" styles applied to validation message */
    vertical-align: middle;
}
.tps-LabelTextBox > span /* valdiation message */
{
    color: #c00 !important; /* override asp:validator inline styles */
    vertical-align: middle;
}

.tps-LabelTextBox.LabelSeparateLine  label { float: none; } 
.tps-LabelTextBox.LabelSeparateLine  input { margin-left: 0px; } 

.tps-LabelTextBox.Watermark  { color: gray; } 
.tps-LabelTextBox.MultiLine textarea { float: left; height: 8em; min-width: 35em; }
.tps-LabelTextBox.MultiLine.Small textarea { height: 8em; min-width: 15em; }

/* For use as an inline element only (no label)*/
.label-data .tps-LabelTextBox,
.label-data .tps-LabelDropDownList.Container
{
    clear: none;
    display: inline;
    margin: 0;
    padding: 0 !important;
}

.label-data .tps-LabelTextBox > div:first-child,
.label-data .tps-LabelDropDownList.Container .label
{
    display: none;
}

* html .label-data .tps-LabelTextBox div,
* html .label-data .tps-LabelDropDownList.Container .label
{
    display: none;
}

.tps-LabelTextBox.Numeric input:first-child { font-size: 13px !important; text-align: right; width: 3.5em !important; }
.tps-LabelTextBox.Numeric input[type="text"]
{
    border: solid 1px #7f9db9;
    padding: 2px;
}

.tps-LabelTextBox.HyperLink a:hover { color: #9933AA; }
.tps-LabelTextBox.HyperLink a:visited { text-decoration: underline; }

.ReadOnly { }


/*------------------------------------------------------------
DROPDOWN LIST
------------------------------------------------------------*/
/* Note: LabelDropDownList is a different control because it subclasses off DropDownList. So explicit class must be defined for 
* each nested container unlike the LabelControlBase derived controls which is a composite control and an object hierarchy could 
* be used in that case. 
* The control includes the required marker but not the required field validator since it is not a composite control  */
.tps-LabelDropDownList.Container { clear: both; /*margin: 0;*/ padding: 2px 0; }
.tps-LabelDropDownList.Container .label
{
    float: left;
    _font-weight: normal;
	_text-align: left;
}
.tps-LabelDropDownList.Container .required { color: #C00; float: right; margin-right: 3px; }
.tps-LabelDropDownList.Container .label-text { color: #333; }
.tps-LabelDropDownList.Container .data { float: left; /*vertical-align: middle; ADD BACK IN AFTER DDL VALIDATION IS BUILT IN*/ }
.tps-LabelDropDownList select { margin-right: 0.5em; vertical-align: middle;  }


/*------------------------------------------------------------
CHECKBOX LIST
------------------------------------------------------------*/
/* Note: LabelCheckBoxList is a different control because it subclasses off CheckBoxList. So explicit class must be defined for 
* each nested container unlike the LabelControlBase derived controls which is a composite control and an object hierarchy could 
* be used in that case.
* The control includes the required marker but not the required field validator since it is not a composite control  */

/*.tps-LabelCheckBoxList.label { width: 5em; margin-right: 1em; text-align: right; float: left; display: block; font-weight: bold;  color: #666; } */
.tps-LabelCheckBoxList { margin-bottom: 10px; }
.tps-LabelCheckBoxList > span.other {}
.tps-LabelCheckBoxList > span.other > input { margin-left: 7px; }
.tps-LabelCheckBoxList > input { margin-left: 5px; width: 100px; }
/* TODO: need class and style to target "other" textbox inside a CheckBoxList's table */


/*Modal Popup control sytles*/
.modalBackground
{
	background-color: #000;
	filter: alpha(opacity=60);
	opacity: 0.6;
}


/* Note: all these changes made to css are transitional during development and will be refactored by Adam later */
.hidden
{
	display: none; 	
}