/* GENERAL Formatting Section 
*****************************/
html
{
    height: 100%;
    width: 100%;
}
body
{
    font-family: Calibri, Lucida Sans, Tahoma, Verdana, Arial;
    font-size: 1.0em;
    background-color: white;
    color: Black;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    height: 100%;
    width: 100%;
}
table
{
    vertical-align: top;
    clear: both;
    margin: 1px 1px 1px 1px
}
a
{
    color:#559966;
    text-decoration: none;
    font-size: 1em;
}
a:hover { color: #8B0000; }
h1
{
    border-bottom: 1px solid #ddd; /*background:white;*/
    color: #777;
    clear: both;
    padding: 0.1em;
    margin: 0px 0px 0px 0px;
}
h2
{
    color: #559966;
    background-color: Transparent; /*border-bottom: solid 0.05em #eee;*/
    width: 100%;
}
h3
{
    color: #ff7128;
    border-bottom: solid 0.05em #ff7128;
    width: 100%;
    line-height: 1em;
}
h4
{
    color: #777;
    font-size:small;
}    
h5
{
    color:Black;
    font-size:small;
    font-style:normal;
}  

    
/* WIZARD Formatting Section 
*****************************/
.wizTable
{
    width: 750px;
    height: 300px;
    vertical-align: top;
}
.wizStepStyle
{
    background-color: #f4f4f4;
    vertical-align: top;
    padding: 1em 1em 1em 1em;
    width: 100%;
}
.wizButton
{
    background-color: #8E1327;
    border: solid 1px #f6daff;
    color: #f6daff;
    padding: 0.4em 0.4em 0.4em 0.4em;
}
.wizSide
{
    background-color: #333333;
    vertical-align: top;
    width: 200px;
}
.wizHidden
{
    display: none;
}
.wizLink
{
    color: #eee;
    clear: both;
    padding-left: 0.4em;
    background-color: Transparent;
}
a.wizLink:link
{
    color: #eee;
}
.wizSelectedLink
{
    background-color: #8E1327;
    color: #eee;
    margin: 0, auto, 0, auto;
    font-weight: bold;
    border-left: solid 0.2em #f6daff;
    padding-left: 0.2em;
}
.validationWarning
{
    background-color: #FBEAEA;
    color: #cc0000;
    border: solid 0.2em #EFD5D5;
    margin: 1em, auto, 1em, auto;
    padding: 0.4em 0.4em 0.4em 0.4em;
    font-weight: bold;
    font-size: 0.9em;
    clear: both;
}
.wizardInstructions
{
    margin:10,10,30,30;
    clear: both;
    display: block;
}
/* Date Picker 
************************/
.datePicker
{
    font-size: small;
    font-family: Verdana, Tahoma, Arial;
    background-color:#ffffff;
}
.datePickerDay
{
    font-size: small;
    width: 1.0em;
    padding: 0.1em 0.4em 0em 0.4em;
    background-color:#ffffff;
}
.datePickerDayDisabled
{
    background-color: #eee;
    font-size: small;
    width: 2em;
}
.datePickerDayHeader, .datePickerMonthHeader
{
    background-color: #bbccaa;
    color: #000;
}

.datePickerDaySelected
{
    font-weight: bold;
    background-color: #ccc;
    color: #666;
    font-size: small;
    font-family: Verdana;
}
/* Panels 
************************/
.contentPanel
{
    background: white url(  "../../images/tm2back.png") repeat-x;
    color: Black;
    float:left;
    padding:0px 10px 10px 10px;
    width:100%;
}
.footer
{
    background-color: #f4f4f4;
    bottom: 0;
    border-top: solid 1px #eee;
    width: 100%;
    font-size: 0.7em;
    color: #555;
    clear: both;
}

.formDiv
{
    display: block;
    clear: both;
    width: 100%;
}
.formLabel
{
    width: 130px;
    display: -moz-inline-block;
    display: inline-block;
}
.customerDetails
{
    background-color: #f4f4f4;
    padding: 5px 5px 5px 5px;
    margin: 5px 5px 5px 2px;
    border: solid 3px #eee;
      width: 80%;
}
.customerDetailsHeader
{
    background-color: #f4f4f4;
    padding: 5px 5px 5px 5px;
    margin: 5px 5px 5px 2px;
    color: Black;
    border: solid 3px #eee;
    width: 80%;

}

.locationDetails
{
    background-color: #f4f4f4;
    font-size:small;
}
.locationDetailsHeader
{

    color: Black;
}


/* TABS *
*********/
#tabsB
{
    float: left;
    width: 100%;
    background: #f4f4f4;
    font-size: 93%;
    line-height: normal;
    border-top: 1px solid #ddd;
}
#tabsB ul
{
    margin: 0;
    padding: 10px 10px 0 10px;
    list-style: none;
}
#tabsB li
{
    display: inline;
    margin: 0;
    padding: 0;
}
#tabsB a
{
    float: left;
    background: url(  "../../images/tableftB.gif" ) no-repeat left top;
    margin: 0;
    padding: 0 0 0 4px;
    text-decoration: none;
}
#tabsB a span
{
    float: left;
    display: block;
    background: url(  "../../images/tabrightB.gif" ) no-repeat right top;
    padding: 5px 15px 4px 6px;
    color: #336644;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsB a span
{
    float: none;
}
/* End IE5-Mac hack */
#tabsB a:hover span
{
    color: #000;
}
#tabsB a:hover
{
    background-position: 0% -42px;
}
#tabsB a:hover span
{
    background-position: 100% -42px;
}

#tabsB #current a
{
    background-position: 0% -42px;
}
#tabsB #current a span
{
    background-position: 100% -42px;
}
/* Appointment Row 
*/
.rowImage
{
    display: inline-block;
    clear: none;
    float: left;
    padding-right: 1em;
}
.rowPractitioner
{
    width: 300px;
    display: inline-block;
    clear: none;
    float: left;
}

.rowTime
{
    width: 300px;
    display: inline-block;
    float: left;
    padding-bottom:1em;
}
.rowStatus
{
    width: 100px;
    display: inline-block;
    float: left;
}
.rowCancel
{
    border: solid 1px #ccc;
    background: #d4d4d4;
    color: Blue;
    display: block;
    clear: both;
    width: 100%;
    height: 100%;
   

}
.rowCancel:hover
{
    border: solid 1px #ccc;
    background: #333333;
    color: White;
    display: block;
    clear: both;
    width: 100%;
    height: 100%;
}
.rowAppt
{
    padding: 0.4em 0.4em 0.4em 0.4em;
    margin: 0 0.4em 0.6em 0.4em;
    background-color: #f4f4f4;
    border: solid 1px #eee;
    float: left;
    clear: both;
    width: 750px;
}

/* Customer Result Row */
.rowCust
{
    padding: 0.1em 0.1em 0.1em 0.1em;
    background-color: white;
    border-bottom: solid 1px #eee;
    float: left;
    clear: both;
    width: 660px;
    display: block;
}

.rowCustC
{
    color: Blue;
    display: block;
    width: 200px;
    float: left;
    
}
.rowCustC:hover
{
    background: #333333;
    color: White;
}
.rowDOB 
{
    display: block;
    width: 120px;
    float:left;
}
.rowAddress
{
    display: block;
    width: 100%;
    clear:both;
    float: left;
    color:#555;
    font-size:0.8em;
}

.bookingSummary 
{
    padding:0 0 0 0;
    margin: 0 0 0 0;
    width:95%;
    border-left:solid 1px #ccc;
    border-right:solid 1px #ccc;
}
.bookingSummary th 
{
    border-left:solid 1px #333333;
    border-right:solid 1px #333333;
    background-color:#333333;
    text-align:left;
    color:#ffffff;
}

.bookingSummary td 
{
    background-color:#ffffff;
    border-bottom:solid 1px #ccc;
    padding:0.5em 0.1em 0.5em 0.1em;
    vertical-align:top;
}

.logInMessage 
{
    margin-left:2em;
     padding: 0.2em 1 0.2.em 1em;
     display:block ;  
}

.tdLabel
{
    color:#555;
    font-size:0.8em;
    vertical-align:top;
    width:12em;
}

.grEmphasis 
{
    color: #559966;
   font-weight:bold;
   font-size:1.2em;
}

.appointmentNotes 
{
    width:450px;
    font-family:Calibri, Lucida Sans, Tahoma, Verdana, Arial;
}

.diaryRadioButtonList 
{
    font-size:0.8em;
}

.diaryTodayLink
{ 
display:block;
background: #eee url(../../images/calendar.png) no-repeat 1px 1px;
background-color:#eee;
border:1px solid #ccc;
padding: 3px 0px 3px 30px;
vertical-align:top;
}

.diaryTodayLink:hover {
background-color:#ddd;
}