/************************************/
/*	BASE SETTINGS					*/
/************************************/ 
* { margin:0; padding:0; }

BODY {
	TEXT-ALIGN: center;
	MARGIN: 0px;
	PADDING: 0px;
	FONT-FAMILY: Georgia, Arial, Helvetica, Tahoma, Verdana, Sans-Serif;
	FONT-SIZE: 10pt;
background-color:#FBF7D2;
	}


#bbhead img { margin:0; padding:0; text-align:center; }

* html #menu-band ul ul a, * html #menu-band ul ul a: visited { width: 150px;w\idth: 128px; }
* html #menu-band ul ul { top: 27px;t\op: 28px; }

#ha-head {background-color:#295AA5;margin:0;height:80px;padding:0;TEXT-ALIGN: left;}
#ha-head h1 {color:white;margin:0 0 0 25px;padding-top:20px;font-family: Trebuchet MS,Arial,sans-serif;}

#tmenu { padding: 0; margin:0 auto; width:801px; height:29px; font:bold 10.5pt Trebuchet MS, Arial, sans-serif; color: white; border-right:1px solid #D564DA; text-align:left; background-color: #B301B9; }
#tmenu a { color:white; }

#menu-band { margin:0; background-color:#B301B9; height:29px; }
#menu-band ul { padding:0;margin:0;list-style-type:none;}
#menu-band ul ul { width:149px; font: normal 9pt Georgia, Times Mew Roman, serif; }
#menu-band li { float:left;position:relative;}
#menu-band a, #menu-band a:visited { border-left:1px solid #D564DA; border-right:0px solid #D564DA; border-top:1px solid #D564DA; border-bottom:1px solid #D564DA; display:block;text-decoration:none; color:#fff; height:27px; line-height:26px; padding-left:15px }
#menu-band ul ul { visibility:hidden;position:absolute;height:0;top:28px;left:0;border-top:1px solid #D564DA;}
#menu-band table { position:absolute; top:0; left:0; border-collapse:collapse;}
#menu-band ul ul a, #menu-band ul ul a:visited {background:#B301B9; color:#ffffff; height:auto; line-height:1em; padding:4px 15px; width:128px;border-width:0 1px 1px 1px;}
#menu-band a:hover, #menu-band ul ul a:hover{color:#fff; background:#C000C6;text-decoration:underline;}
#menu-band ul li:hover ul,
#menu-band ul a:hover ul{visibility:visible; }
#menu-band ul :hover ul ul{visibility:hidden;}
#menu-band ul :hover ul :hover ul{ visibility:visible;}


#footer {background-color:#014EB2; border-top: 3px solid #88AF06;color:white;}

#footerb {width:801px;text-align:center;padding:20px 0 30px 0;margin:0 auto;}
#footerb h3 { font-size:13pt; font-family: Trebuchet MS,Arial,sans-serif; color:white; font-weight:bold; padding:20px 0 5px 0; }
#footerb h3 a  { color:white; text-decoration:none; }
#footerb p { font-size:11pt; font-family: Georgia, Times New Roman, serif; color:white; font-weight:normal; padding:5px 0 5px 0; }
#footerb span { font-size:8pt; }
#footerb a { color:white; }
#footerb a:hover, #footer a:active { color:#EB7BEF; }

#ha {
	TEXT-ALIGN: left;
	WIDTH: 100%;

	PADDING: 20px 0 0 0;
	MARGIN: 0 auto;
	background: #F9F6FF url('http://www.fantasticmassage.com/images/spa-bg.gif') repeat-x top left;
	min-height: 500px;
	_height: 500px;
	}
/* for Internet Explorer */
/*\*/
* html #ha {
min-height: 100%;
}
/**/

#ha P {
	MARGIN: 2px 0px 4px 0px;
	}
#ha A {
	BORDER: 0px;
	MARGIN: 0px;
	PADDING: 0px;
	COLOR: #0066FF;
	TEXT-DECORATION: underline;
	}
#ha A:hover {
	COLOR: #B301B9;
	TEXT-DECORATION: none;
	}
#ha FORM {
	PADDING: 0px;
	MARGIN: 0px;
	}
#ha FORM STRONG {
	COLOR: #FF3366;
	}
#ha LABEL, #ha .form_label {
	DISPLAY: block;
	PADDING: 2px;
	MARGIN-LEFT: 5px;
	FONT-STYLE: italic;
	WIDTH: auto;
	}
#ha .formControlHelp {
	DISPLAY: block;
	PADDING: 2px;
	FONT-SIZE: 8pt;
	COLOR: #404040;
	}
#ha INPUT.readonly, #ha INPUT[disabled], #ha SELECT[disabled] {
	BACKGROUND-COLOR: #EEEEEE;
	}
#ha FIELDSET {
	MARGIN: 5px;
	PADDING: 5px;
	}
#ha FIELDSET A {
	WIDTH: auto;
	}
#ha H2 {
	FONT-SIZE: 16pt;
	MARGIN: 4px 0px 4px 0px;
	PADDING: 6px;
	COLOR: #225FB1;
	font-family: Trebuchet MS,Arial,sans-serif;
	}
#ha H3 {
	FONT-SIZE: 12pt;
	MARGIN: 4px 0px;
	PADDING: 4px 0px;
	COLOR: #225FB1;
	font-family: Trebuchet MS,Arial,sans-serif;
	}
#ha H4 {
	FONT-SIZE: 10pt;
	MARGIN: 2px 0px 2px 0px;
	COLOR: #333333;
	}
/************************************************/
/*	END OF BASE SETTINGS						*/
/************************************************/

/************************************************/
/*	LAYOUT AND DIMENSIONS SETTINGS				*/
/************************************************/
#ha #menu {
	FLOAT: left;
	WIDTH: 170px;
	PADDING: 0px;
	MARGIN: 0 5px;
	}
#ha #content {
	BORDER: #dcc8fb 1px solid;
	FLOAT: none;
	WIDTH: auto;
	MARGIN: 0px 5px 0px 190px;
	PADDING: 5px 10px 5px 10px;
	}
/* for Internet Explorer */
/*\*/
* html #ha #content{
height: 100%;
}
/**/
/************************************************/
/*	END OF LAYOUT AND DIMENSIONS SETTINGS		*/
/************************************************/

/************************************************/
/*	MENU										*/
/************************************************/
#ha #menu {
	border: 1px solid #BDADD4;
	BACKGROUND-COLOR: #FBF7D2;
	}
#ha #menu UL {
	LIST-STYLE-TYPE: none;
	MARGIN: 5px 0px 10px 5px;
	PADDING: 0px;
	BORDER-TOP: #dcc8fb 1px solid;
	}
#ha #menu LI {
	MARGIN: 5px 0px;
	}
#ha #menu LI A {
	COLOR: #0066FF;
	BORDER: 0px;
	PADDING: 4px;
	}
#ha #menu LI A:hover {
	BACKGROUND-COLOR: #F6FFD9;
	TEXT-DECORATION: underline;
	color:#B301B9;
	}
/************************************************/
/*	END OF MENU									*/
/************************************************/

/************************************************/
/*	ACTION BAR									*/
/************************************************/
#ha .actionBar {
	PADDING: 4px;
	HEIGHT: 1.2em;
	COLOR: #FFFFFF;
	border:1px solid #DCC8FB;
	BACKGROUND-COLOR: white;
	}
#ha .actionBar A {
	PADDING: 2px 4px 2px 4px;
	COLOR: #0066FF;
font-weight:bold;
	}
#ha .actionBar A:hover {
	TEXT-DECORATION: underline;
	COLOR: #B301B9;
	
	}
/************************************************/
/*	END OF ACTION BAR							*/
/************************************************/

/************************************************/
/*	BUTTON BAR									*/
/************************************************/
#ha .buttonBar {
	PADDING: 4px;
	MARGIN: 5px 0px 15px 0px;
	border:1px solid #DCC8FB;
	BACKGROUND-COLOR: white;
	}
#ha .buttonBar A {
	PADDING: 2px 5px 2px 5px;
	MARGIN: 2px;
	COLOR: #0066FF;
	BORDER: #999999 0px solid;
	TEXT-DECORATION: none;
	}
#ha .buttonBar A:hover {
	TEXT-DECORATION: underline;
	COLOR: #B301B9;
	
	}
#ha .buttonBar .deleteAction {
	COLOR: #FF3366;
	}
/************************************************/
/*	END OF BUTTON BAR							*/
/************************************************/

/************************************************/
/*	CONTROL PANE								*/
/************************************************/
#ha #controlPane {
	BORDER: #BDADD4 1px solid;
	PADDING: 2px;
	MARGIN: 0px 0px 10px 0px;
	BACKGROUND-COLOR: #FFFFCC;
	}
#ha #controlPane UL {
	LIST-STYLE-TYPE: none;
	MARGIN: 0px;
	PADDING: 0px;
/*	THIS CLEARS THE INNER LIs */
	overflow: hidden;
	width: 100%;
	}
#ha #controlPane LI {
	LIST-STYLE-TYPE: none;
	DISPLAY: block;
	FLOAT: left;
	MARGIN: 0px 10px 0px 0px;
	PADDING: 5px;
	}
/************************************************/
/*	END OF CONTROL PANE							*/
/************************************************/

/************************************************/
/*	MONTH CALENDAR								*/
/************************************************/
#ha .monthCalendar {
	WIDTH: 300px;
	border:1px solid #DCC8FB;
	BACKGROUND-COLOR: white;
	PADDING: 10px;
	MARGIN: 10px 0px;
	TEXT-ALIGN: center;
	}
#ha .monthCalendar .week {
	WIDTH: 280px;
	OVERFLOW: auto;
	PADDING: 0px;
	MARGIN: 0px auto;
	}
#ha .monthCalendar .day {
	FLOAT: left;
	WIDTH: 40px;
	PADDING: 0px;
	MARGIN: 0px;
	TEXT-ALIGN: center;
	BORDER: #CCCCCC 0px solid;
	}
#ha .monthCalendar .day DIV {
	PADDING: 0px;
	MARGIN: 0px;
	FONT-SIZE: 14px;
	LINE-HEIGHT: 30px;
	TEXT-ALIGN: center;
	}
#ha .monthCalendar .day .dayName {
	FONT-WEIGHT: bold;
	}
#ha .monthCalendar .day A {
	COLOR: #000000;
	}
#ha .monthCalendar .arrows {
	TEXT-ALIGN: center;
	WIDTH: 30px;
	BORDER: #FF8000 1px solid;
	}
#ha .monthCalendar .arrows A {
	TEXT-DECORATION: none;
	}
#ha .monthCalendar .arrows A:hover {
	TEXT-DECORATION: none;
	}
#ha .monthCalendar .legend {
	TEXT-ALIGN: left;
	}
#ha .monthCalendar .legend .day {
	WIDTH: 120px;
	}
#ha .monthCalendar .legend .day DIV {
	FONT-SIZE: 12px;
	}
/************************************************/
/*	END OF MONTH CALENDAR						*/
/************************************************/

/************************************************/
/*	MONTH CALENDAR COLORS						*/
/************************************************/
#ha .monthCalendar .workingDay {
	BACKGROUND-COLOR: #CCFF99;
	}
#ha .monthCalendar .nonWorkingDay {
	BACKGROUND-COLOR: #DDDDDD;
	}
#ha .monthCalendar .staffVacation {
	BACKGROUND-COLOR: #AAAAAA;
	}
#ha .monthCalendar .highlight {
	BACKGROUND-COLOR: #FF0000;
	}
/************************************************/
/*	END OF MONTH CALENDAR COLORS				*/
/************************************************/

/************************************************/
/*	WORKING HOURS LAYOUT						*/
/************************************************/
#ha .dayHours {
	WIDTH: auto;
	OVERFLOW: auto;
	border:1px solid #DCC8FB;
	BACKGROUND-COLOR: white;
	PADDING: 5px 10px;
	TEXT-ALIGN: left;
	MARGIN: 10px 0px;
	}
#ha .dayHours .row {
	WIDTH: 100%;
	OVERFLOW: auto;
	PADDING: 0px;
	MARGIN: 0px auto;
	}
#ha .dayHours .timeSlot {
	FLOAT: left;
	WIDTH: 40px;
	PADDING: 0px;
	MARGIN: 0px;
	}
#ha .dayHours .timeSlot DIV {
	PADDING: 5px 0px;
	MARGIN: 1px;
	FONT-SIZE: 12px;
	LINE-HEIGHT: 16px;
	TEXT-ALIGN: center;
	}
#ha .dayHours .timeSlot DIV A {
	COLOR: #000000;
	MARGIN: 0px;
	PADDING: 0px;
	}
#ha .dayHours .legend .timeSlot {
	WIDTH: 100px;
	}
#ha .dayHours .legend .timeSlot DIV {
	FONT-SIZE: 12px;
	}
/************************************************/
/*	END OF WORKING HOURS LAYOUT					*/
/************************************************/

/************************************************/
/*	WORKING HOURS STATUS COLORS					*/
/************************************************/
#ha .dayHours .free {
	BACKGROUND-COLOR: #CCFF99;
	}
#ha .dayHours .booked {
	BACKGROUND-COLOR: #CC9933;
	}
#ha .dayHours .pending {
	BACKGROUND-COLOR: #FF8000;
	}
#ha .dayHours .partiallyBooked {
	BACKGROUND-COLOR: #99CC66;
	}
#ha .dayHours .na {
	BACKGROUND-COLOR: #DDDDDD;
	}
#ha .dayHours .vacation {
	BACKGROUND-COLOR: #AAAAAA;
	}
#ha .dayHours .highlight {
	BACKGROUND-COLOR: #FF9900;
	}
/************************************************/
/*	END OF WORKING HOURS STATUS COLORS			*/
/************************************************/

/************************************************/
/*	APPOINTMENT STATUS IN LIST COLORS 			*/
/************************************************/
#ha .appointmentStatus_Accepted {
	BACKGROUND-COLOR: #CC9933;
	COLOR: #EEEEEE;
	}
#ha .appointmentStatus_Pending {
	BACKGROUND-COLOR: #FF8000;
	COLOR: #EEEEEE;
	}
/************************************************/
/*	END OF APPOINTMENT STATUS IN LIST COLORS 	*/
/************************************************/