/* 
    Document   : etpb-ui-custom.css
    Created on : 30.11.2010, 23:35:27
    Author     : vili
    Description:
        Purpose of the stylesheet follows.
*/

/**
*	Cosmetic Styling for Layout Elements
*/
.ui-layout-pane { 
    border:	0px solid #F00; 
    padding:	0px; 
    overflow:	auto;
    margin: 0px !important;
} 

.ui-header { font-size: 1em !important; background: none !important; border: 0 !important; margin: 0px !important; margin-bottom: 8px !important; margin-top: -2px !important; }
.ui-property { padding: 5px !important;}
.ui-single-prop { display: block !important; margin-bottom: 3px !important; margin-top: 2px !important; white-space: nowrap !important;}

.ui-autocomplete-input { color: #4EC4E2 !important; background: #2C2C2C !important;}

/*.ui-toolbar, .ui-toolbar ul { margin: 0px; display: inline; }
.ui-toolbar li { display: block; margin: 0px;  margin-top: 2px; padding: 0px 10px; float: left; }
.ui-toolbar a { font-weight: bold; }    */

.ui-html-code { color:#4dc4e2; }

.ui-wrapper-footer  { color:#cccccc; font-weight: bold; font-size: 1.1em; }
.ui-wrapper-footer a  { color:#cccccc; font-weight: bold; font-size: 1.1em; }

/* 
 * The state classes are a little bit complex, because of the doubble class bug in IE6
 * The state class looks like this:
 * 
 * .ui-radio-state[-checked][-disabled][-hover] or .ui-checkbox-state[-checked][-disabled][-hover]
 * 
 * Examples:
 * 
 * .ui-radio-state-checked (simply checked) 
 * .ui-radio-state-checked-hover (checked and hovered/focused)
 * .ui-radio-state-hover (unchecked and hovered/focused)
 * 
 * If you donīt have to deal with the doubble class bug of IE6 you can also use the simple ui-checkbox-checked, ui-checkbox-disabled, ui-checkbox-hover state-classnames (or: ui-radio-checked...)
 * and the ui-radio/ui-checkbox role-classnames.
 * 
 */

.ui-radio-state-disabled,
.ui-radio-state-checked-disabled,
.ui-radio-state-disabled-hover,
.ui-radio-state-checked-disabled-hover {
	color: #999;
}


.ui-input-state-disabled
{
	color: #999 !important;
	background: #2C2C2C !important;	
}

.ui-autocomplete-input:disabled
{
	color: #999 !important;
	background: #2C2C2C !important;	
}

span.ui-checkbox,
span.ui-radio {
	display: block;
	float: left;
	width: 16px;
	height: 16px;
	background: url(../images/icon_checkbox.png) 0 -41px no-repeat;	
	padding-left:1px;
}

			
span.ui-helper-hidden {
	display: none;
}

label {
	padding: 2px;
	
}
span.ui-radio-state-hover,
span.ui-checkbox-state-hover {
	background-position: 0 -115px;				
}

span.ui-checkbox-state-checked {
	background-position: 0 -2px;
}

span.ui-checkbox-state-checked-hover {
	background-position: 0 -76px;
}
span.ui-radio-state-checked {
	background-position: 0 -162px;
}

span.ui-radio-state-disabled-hover,
span.ui-radio-state-disabled,
span.ui-checkbox-state-disabled,
span.ui-checkbox-state-disabled-hover
span.ui-radio-state-checked-disabled-hover,
span.ui-radio-state-checked-disabled,
span.ui-checkbox-state-checked-disabled,
span.ui-checkbox-state-checked-disabled-hover
 {
	background-position: 0 -238px;
}

span.ui-radio-state-checked-hover {
	background-position: 0 -201px;
}

.ui-radio-disabled,
.ui-checkbox-disabled {
	opacity: 0.6;
	color: #999 !important;
}