/*/////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
// COMMON
///////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////*/
form {
	padding: 0px;
	margin: 0px;
	border-collapse: collapse;
}

img {
	border: 0px;
}

#pageContainer {
	width: 47.5em;
	margin-left: auto;
	margin-right: auto;
}

#brandBanner {
	height: 2em;
}

#brandBanner div {
	display: block;
	float: left;
	width: 33%;
}

#brandFooter {
	height: 5em;
}

#brandFooter a {
}

#brandFooter div {
	display: block;
	float: left;
	width: 33%;
}

#brandFooterCenter div {
	text-align: center;
	width: auto;
	float: none;
}

#pageCore {
}

#pageCoreControlPanel {
	height: 1.9em;
}

#pageCoreControlPanel div {
	float: left;
	width: 50%;
	padding-top: 0.2em;
}

#pageCoreControlPanelLeft {
	text-align: left;
}

#pageCoreControlPanelLeft input {
	margin-left: 0.2em;
}

#pageCoreControlPanelRight {
	text-align: right;
}

#pageCoreControlPanelRight input {
	margin-right: 0.2em;
}

#sectionInfoPanel {
	padding: 0.2em;
	text-align: center;
}

#introTable {
	width: 100%;
}

#introTable td {
	width: 50%;
	vertical-align: top;
}

.errors {
	padding: 0.2em;
	margin: 0.2em;
}


/*/////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
// SERVICE TIME PANEL
///////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////*/
.serviceTimePanel {
	padding: 0.2em;
	margin: 0.2em;
	width: auto;
}

.serviceTimePanelContainer {
	height: 1.4em;
}

.serviceTimePanelContainer div {
	float: left;
	width: 50%;
}

.serviceTimePanelColumn2 {
	text-align: right;
}

.serviceTimePanelColumn2 span {
	display: block;
	width: 100%;
}

.serviceTimePanelControl {
	text-align: right;
}


/*
.itemPanel {
	padding: 0.2em;
	margin: 0.2em;
	width: auto;
}
*/

.itemTopPanelContainer {
	height: 1.4em;
}


.itemTopPanelColumn1 {
	float: left;
	width: 50%;
}

.itemTopPanelColumn2 {
	text-align: right;
	float: left;
	width: 49%;
}

.itemTopPanelColumn2 span {
	display: block;
/*	width: 100%; */
}


.itemBottomPanelContainer {
	height: 1.6em;
}

.itemBottomPanelContainer div {
/*	float: left; */
	font-style: italic;
}


.itemBottomPanelColumn1 {
	float: left;
	width: 50%;
}

.itemBottomPanelColumn2 {
	text-align: right;
	float: left;
	width: 49%; 
}

.itemBottomPanelColumn2 span {
	display: block;
/*	width: 100%; */
}



/*/////////////////////////////////////////////////////////////////////////////*/
.itemPanel {
	padding: 0.2em;
	margin: 0.2em;
	width: auto;
}

.itemPanelContainer {
	height: 1.4em;
}

.itemPanelContainer div {
	float: left;
	width: 100%;
}


.itemPanelControl {
	text-align: right;
}

/*/////////////////////////////////////////////////////////////////////////////*/


.dateControlPanel {
	height: 1.4em;	
}

.dateControlPanel div {
	float: left;
	width: 33%;
	text-align: center;
}

.currentServicePanel {
	margin-left: 0.2em;
	margin-right: 0.2em;
	width: auto;
	padding: 0.2em;
}

.currentServicePanel div {
	text-align: center;
}

.currentServiceStatsPanel {
	height: 1.4em;
}

.currentServiceStatsPanel div {
	float: left;
	width: 33%;
}

.currentServiceDescriptionPanel {
	
}

#contactInfoContainer table {
	width: 100%;
}

#contactInfoContainer td {
	vertical-align: top;
}
 
.contactInfoSubContainer div {
	margin-left: 1em;
}

.contactInfoSubContainer input {
	width: 80%;
}

.contactInfoSubContainer textarea {
	width: 80%;
}

.contactInfoContainer {
	margin-left: 0.2em;
	margin-right: 0.2em;
}

.contactInfoRow {
	height: 3.0em;
	margin-left: 0.2em;
	margin-right: 0.2em;
}

.contactInfoCell {
	float: left;
	width: 50%;
}


/*/////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
// SELECTOR
///////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////*/
#container {
	width: 47em;
	margin-left: auto;
	margin-right: auto;
}

#scrollContainer {
	overflow: auto;
	height: 19.6em;
}

#selectorHead {
	width: 45.78em;
	margin-left: 0.1em;
}

#selectorHead th {
	width: 10%;
}

#selector {
	width: 45.70em;
	padding: 0px;
	border-collapse: collapse;
	margin-left: 0.2em;
}

#selector td {
	width: 10%;
	height: 1.5em;
	cursor: pointer;
}

/*
#selectedTimeDisplay {
	width: 15.0em;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
*/

/*/////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
// SERVICE TIME PANEL
///////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////*/
#selectorHead th.serviceColumnHeader1, 
#selector td.serviceColumn1 {
	width: 1em;
}

#selectorHead th.itemColumnCheckbox, 
#selector td.itemColumnCheckbox {
	width: 2%;
	text-align: left;
}

#selector td.itemEditColumn {
	width: 5%;
	text-align: left;
}

#selectorHead th.serviceColumnHeader2, 
#selector td.serviceColumn2 {
	width: auto;
}

#selectorHead th.itemColumn, 
#selector td.itemColumn {
	width: auto;
	text-align: left;
}

#selector tr.itemRowHeader {
	text-align: left;
}

#selector tr.hiddenRow {
	display: none;
}

#selectorHead th.serviceColumnHeader3, 
#selectorHead th.serviceColumnHeader4,
#selector td.serviceColumn3, 
#selector td.serviceColumn4 {
	width: 4em;
	text-align: right;
}


/*/////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////
// SCALABLE BUTTONS
///////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////*/
.btn { display: block;}
.btnHidden {display: none; }
.btn, .btnHidden { position: relative; background: #aaa; padding: 5px; float: left; color: #fff; text-decoration: none; cursor: pointer; }
.btn *, .btnHidden * { font-style: normal; background-image: url(../media/btn2.png); background-repeat: no-repeat; display: block; position: relative; }
.btn i, .btnHidden i { background-position: top left; position: absolute; margin-bottom: -5px; top: 0; left: 0; width: 5px; height: 5px; }
.btn span, .btnHidden span { background-position: bottom left; left: -5px; padding: 0 0 5px 10px; margin-bottom: -5px; }
.btn span i, .btnHidden span i { background-position: bottom right; margin-bottom: 0; position: absolute; left: 100%; width: 10px; height: 100%; top: 0; }
.btn span span, .btnHidden span span { background-position: top right; position: absolute; right: -10px; margin-left: 10px; top: -5px; height: 0; }
.btn[class], .btnHidden[class] { background-image: url(../media/shade.png); background-position: bottom; }
* html .btn span, * html .btn i, * html .btnHidden span, * html .btnHidden i { float: left; width: auto; background-image: none; cursor: pointer; }


#editAppointmentsContainer {
	width: 100%;
}