/***************************************************************************************/
/*  TobagoBeachHouse.com - CSS layout 
/***************************************************************************************/

html, body, p, h1, h2, h3, h4, h5, h6, ul, li, ol, form, fieldset, table, tr, td {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: top; 
}
	
body {
	background-color: #369;
	color: #003F60;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align: left;
	font-size: 11px;
	line-height: 16px;
}

/***************************************************************************************/
/*  MAIN DIVS
/***************************************************************************************/

#outer {
	width: 800px;
	background-color: #FFF;
	margin: 15px auto 10px auto;
	border: 4px ridge #F4F4F4;
	border-top: 1px solid #FFF;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	border-left: 1px solid #FFF;
}

#topban {
	width: 800px;
	height: 175px;
	background-image: url(../images/topban.jpg);
}

/***************************************************************************************/
/*  NAVIGATION BAR
/***************************************************************************************/

#navbar {
	width: 800px;
	height: 30px;
	background-image: url(../images/navbar.jpg);
	background-repeat: no-repeat;
}

#navbar ul
{
	list-style: disc;
	list-style-image: url(../images/starfish.gif);
	list-style-position: outside;
	padding-left: 150px;
	margin: 0;
}

#navbar li {
	background: url(../images/starfish.gif) left center no-repeat;
	display: inline;
	float: left;
	padding: 0 17px 0 19px;
}

#navbar a, #navbar a:visited {
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #069;
	text-transform: uppercase;
	font-weight: bold; 
	font-size: 11px;
}
	
#navbar a:hover, #navbar a:active, #navbar a:focus{
	color: #F0F;
}
	
/***************************************************************************************/
/*  LAYOUT DIVS
/***************************************************************************************/

#leftsidebar {
	float: left;
	width: 150px;
	height: 320px;
	background-image: url(../images/sidebar.jpg);
	background-repeat: no-repeat;
}	

/***************************************************************************************/
/*  PHOTOGRAPH SIDEBAR
/***************************************************************************************/

#photobar {
	float: left;
	width: 220px;
	padding: 15px 0 10px 30px;
}

#photobar img {
	border: 3px double #999999;
	margin: 0px;
	padding: 0px;
}

#photobar img.enlarge { border: 0px none; }

#photobar a, #photobar a:visited {
	font-size: 8px;
	color: #999999;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
}

#photobar a:hover { color: Fuchsia; }

#photobar a.enlarge, #photobar a.enlarge:visited {
		display: block;
		width: 50px;
		background: url(../images/min.gif) no-repeat top left;
		margin: 0px;
		padding: 0px;
} 

#photobar a.enlarge:hover {
		background: url(../images/max.gif) no-repeat top left;
} 

#photobar p { 
	margin-bottom: 9px;
		line-height: 1em;
}

/***************************************************************************************/
/*  BOTTOM BANNER
/***************************************************************************************/

#bottom {
	clear: left;
	width: 800px;
	height: 60px;
	background-image: url(../images/botban.jpg);
	background-repeat: no-repeat;
}

#bottom p {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #D3D3D3;
	text-align: center;
	padding-top: 35px;
}

#bottom a, #bottom a:visited {
	color: #D3D3D3;
	text-decoration: none;
}

#bottom a:hover { color: Fuchsia; }

/***************************************************************************************/
/*  MAIN CONTENT
/***************************************************************************************/

#content {
	float: left; 
	width: 400px;
	text-align: justify;
	padding-bottom: 10px;
}

#content p, #calendar p {
	text-align: justify;
	margin: 12px 0px 12px 0px;
}

#content h1, #calendar h1 {
	font-family: "Times New Roman", Times, serif;
	font-size: 24px;
	color: #069;
	font-weight: bold;
	text-align: left;
	margin: 18px 0px 18px 0px;
}


/***************************************************************************************/
/*  HYPERLINKS	
/***************************************************************************************/

#content a, #calendar a {
	color: #CC00CC;
	text-decoration: none;
}

#content a:visited, #calendar a:visited { color: #9933CC; }
#content a:hover, #content a:active, #content a:focus
#calendar a:hover, #calendar a:active, #calendar a:focus  { color: #00CCFF; }


/***************************************************************************************/
/*  IMAGES
/***************************************************************************************/

#content img.logo {
	border: 0px none;
} 

#content .photoright {
	float: right;
	margin-left: 15px;
	margin-bottom: 12px;
}

#content .photoleft {
	float: left;
	margin-right: 15px;
	margin-bottom: 12px;
}

#content .noborder {
	border: 0px none; 
}
	
/***************************************************************************************/
/*  FONTS
/***************************************************************************************/

#content .f09 { font-size: 9px;  }
#content .f10 { font-size: 10px; }
#content .f11 { font-size: 11px; }
#content .f12 { font-size: 12px; }
#content .f13 { font-size: 13px; }
#content .f14 { font-size: 14px; }
#content .f15 { font-size: 15px; }
#content .f16 { font-size: 16px; }
#content .f18 { font-size: 18px; }

#content .lh  { line-height: 1em; }
#content .lh2 { line-height: 1.2em; }

/***************************************************************************************/
/*  FORMATTING
/***************************************************************************************/

#content .bd { font-weight: bold;  }
#content .it { font-style: italic; }

/***************************************************************************************/
/*  COLOURS
/***************************************************************************************/

#content .black  { color: #000; }
#content .blue   { color: #003F60; }
#content .red    { color: #F00; }
#content .white  { color: #FFF; }

/***************************************************************************************/
/*  MARGINS
/***************************************************************************************/

#content .mt00  { margin-top: 0;     }
#content .mt03  { margin-top: 3px;   }
#content .mt06  { margin-top: 6px;   }
#content .mt09  { margin-top: 9px;   }
#content .mt12  { margin-top: 12px;  }
#content .mt18  { margin-top: 18px;  }
#content .mt24  { margin-top: 24px;  }
#content .mt36  { margin-top: 36px;  }
#content .mt50  { margin-top: 50px;  }
#content .mt100 { margin-top: 100px; }
#content .mt200 { margin-top: 200px; }

#content .mb00  { margin-bottom: 0;    }
#content .mb06  { margin-bottom: 6px;  }
#content .mb09  { margin-bottom: 9px;  }
#content .mb12  { margin-bottom: 12px; }
#content .mb24  { margin-bottom: 24px; }
#content .mb36  { margin-bottom: 36px; }

#content .ml10  { margin-left: 10px; }
#content .ml15  { margin-left: 15px; }
#content .ml25  { margin-left: 25px; }
#content .ml35  { margin-left: 35px; }
#content .ml50  { margin-left: 50px; }

#content .w15 { width: 15px;}

/***************************************************************************************/
/*  ALIGNMENT
/***************************************************************************************/

#content .centre {
	text-align: center;
	margin-left: auto;
	margin-right: auto; 
}

#content .ac { text-align: center; }
#content .al { text-align: left;   }
#content .ar { text-align: right;  }
#content .aj { text-align: justify;}

#content .vm { vertical-align: middle; }
#content .vt { vertical-align: top;    }
#content .vb { vertical-align: bottom; } 

/***************************************************************************************/
/*  IMAGES
/***************************************************************************************/

#content table {
	text-align: center;
	width: 100%;
	background-color: #8BB3DA;
}

#content tr {
	background-color: #8BB3DA;
}

/***************************************************************************************/
/*  LISTS
/***************************************************************************************/

#content ul { margin: 0px 0 0px 25px; }
	
#content li {
	margin: 3px 0 3px 0;
}

/***************************************************************************************/
/*  ENQUIRY FORM
/***************************************************************************************/

#content p.form {
	margin: 4px 0 0 0;
	padding: 0;
}

#content form {
	margin: 12px 0 12px 0; 
	padding: 10px;
	border: 3px double Silver;
}

#content form p {
   	clear: both;
		text-align: left;
}

#content form p label {
   display: inline;
   float: left;
   width: 115px;
   margin: 0;
   text-align: left;
   padding: 0 10px 0 0;
}

#content form p input, form p textarea, form p select {
   margin: 0;
   padding: 0;
}

/***************************************************************************************/
/*  MISCELLANEOUS
/***************************************************************************************/

.clearit {
	clear: both;
	height: 1px;
	overflow: hidden;				/* IE hack */
}

hr {
	color: #039;
	height: 1px;
	margin-bottom: 0px;
	margin-top: 12px;
	width: 250px;
	text-align: center;
}

#banner1 {
/*	background-color: #E3ACAC; 
	color: #9B3737; */
	background-color: #02387e;
	color:		white;
	font-weight: bold;
	margin: 18px auto 18px auto;
	padding: 5px 15px 5px 15px;
	text-align: center;
	width: 250px;
}
/***************************************************************************************/
/*  PHOTO ENLARGEMENTS
/***************************************************************************************/

#photos {
	float: left; 
	width: 615px;
	text-align: center;
	padding-bottom: 10px;
}

#photos img { border: 1px solid #069; }

#photos p {
	text-align: center;
	margin: 6px 0 6px 0;
}

/***************************************************************************************/
/*  AVAILABILITY CALENDAR PAGES
/***************************************************************************************/

#calendar {
	float: left; 
	width: 615px;
	text-align: justify;
	padding-bottom: 10px;
}

#calendar table.calendar {
	border: none;
	table-layout: fixed;
	width: 565px; 
}

#calendar table.calendar td,
#calendar table.calendar-white td { padding: 0px; }
	
#calendar table.calendar-white {
	border: 0px none;
	table-layout: fixed;
	margin: 10px;
}

#calendar td.cal-blue {
	background-color: #69C;
	color: #FFF; 
	font-weight: bolder; 
	text-align: center;
	vertical-align: middle;
}

#calendar td.cal-white {
	border-right: 5px solid #69C;
	border-bottom: 5px solid #69C;
}

#calendar td.cal-right {
	text-align: left;
	vertical-align: top;
	width: 10px;
	background: url(../images/cal-right.gif) repeat-y;
}

#calendar td.cal-bottom {
	height: 10px;
	text-align: left;
	vertical-align: top;
	background: url(../images/cal-bottom.gif) repeat-x;
}

#calendar td.cal-botrt {
	width: 10px;
	height: 10px;
	vertical-align: top;
	background: url(../images/cal-botRt.gif) no-repeat;
}

#calendar img.calendar { vertical-align: top; }

#calendar a.plain, #calendar a.plain:visited {
	color: #CC00CC;
	text-decoration: none;
}

#calendar a.plain:hover { color: #00CCFF; }

#calendar .ac   { text-align: center; }
#calendar .mt24 { margin-top: 24px; }
#calendar .vm   { vertical-align: middle; }
#calendar .links{ font-size: 15px; font-weight: bold; text-align: center; margin: 24px 0 24px 0; }

.version {
	background-color: transparent;
	color: #FFFFFF;
	font-size: 8px;
	margin-top: 18px;
	text-align: center;
}

p.seologo {
	border:						0px none;
	margin-top:					250px;
	text-align: 				center;
}

p.seologo img {
	border:						0px none;
	margin:						20px;
	vertical-align: 			middle;
}

.ac {
	text-align:					center;
}