/* CSS Document !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! DO NOT CHANGE MY CSS LAYOUT!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/

body {margin: 0; padding: 0; background-color: #606777; background-image: url(images/head.gif); background-repeat: repeat-x; color: #5B5B5C; font-size: 12px; font-family: Helvetica, Arial;}
a img {border: 0;}
a {color: #222129;}
h1, h2, h3, h4 {margin: 0; padding: 0;}
hr {border: 0; margin: 15px 0 15px 0; border-top: 5px solid #C4C4C4; height: 1px; clear: both;}
p {line-height: 20px; margin: 10px 0 10px 0; /*text-align: justify;*/}
table, td, tr, button {font-size: 12px; font-family: Helvetica, Arial;}
textarea {font-size: 12px; font-family: Helvetica, Arial;}

#frame {width: 940px; margin: 0 auto 0 auto;}

/* HEADER AREA */

#header {width: 940px; height: 85px; padding: 70px 0 0 0; /*background-color:yellow;*/}

#nav {float: right; margin: 18px 0 0 0;}
#nav td {}
#nav a {color: #fff; text-decoration: none; background-color: #444f60; display: block; line-height: 32px;}
#nav a:hover {color: #B6C2D2;}

#nav ul {margin: 0; padding: 0;}
#nav li {list-style: none; margin: 0; padding: 0; float: left; height: 32px; line-height: 32px; vertical-align: middle; background-color: #444f60;}
#nav li a {color: #fff; text-decoration: none;}

.logo {margin: 8px 0 0 0;}

/* SPLASH AREA */

#splash {float: left; width: 940px; height: 300px; border-top: 1px solid #fff;}
#splashnav {}

.splashbut {float:left;}
.splashbut h1 {font-size: 18px; margin: 10px 0 10px 0;}

.butt1 {background-image: url(images/tab-left-off.gif); background-repeat: repeat-x; /*background-color: pink;*/ width:273px; display: block; height: 101px; padding: 5px 20px 0 20px; text-decoration: none;}
.butt1:hover {background-image: url(images/tab-left-on.gif); color: #fff;}

.butt2 {background-image: url(images/tab-mid-off.gif); background-repeat: repeat-x; /*background-color: yellow;*/ width:274px; display: block; height: 101px; padding: 5px 20px 0 20px; text-decoration: none;}
.butt2:hover {background-image: url(images/tab-mid-on.gif); color: #fff;}

.butt3 {background-image: url(images/tab-right-off.gif); background-repeat: no-repeat; width:273px; display: block; height: 101px; padding: 5px 20px 0 20px; text-decoration: none;}
.butt3:hover {background-image: url(images/tab-right-on.gif); color: #fff;}

/* CONTENT AREA */

#content {float: left;width: 900px; padding: 20px; background-color: white; clear: both; /*text-align: justify;*/}
#content h1 {font-size: 22px; color: #1E2632;}
#content h1 a {text-decoration: none;}
#content h2 {font-size:19px; margin: 20px 0 20px 0; color: #1E2632;}
#content h3 {font-size:16px; margin: 20px 0 20px 0; color: #1E2632;}
#content li a {color: #5B5B5C;}

.intros { float:left; width: 273px; margin: 0 0 20px 0;}
.intros h1 {margin: 0 0 20px 0; color: #1E2632; font-size: 18px;}
.intros li {margin: 0 0 15px 20px; font-size: 13px; list-style-image: url(images/notebook.png);}
button {margin: 0 0 20px 0; /*background-image: url(images/butt.gif); font-weight: bold; background-repeat: none; width: 165px; height: 38px; border: 0; cursor: pointer; color: #fff; padding: 0 0 0 20px; text-align: left;*/}

.flickimg {float:left;margin: 4px;}

.introspace {margin: 0 40px 0 40px;}
.gmap {margin: 20px 0 20px 0;}
.opening {font-size: 14px;}

#leftcol {width: 610px; float: left; /*background-color: Fuchsia;*/}
#leftcol li {margin: 5px 0 5px 25px;}

/* SUBNAV AREA */

#subnav {float: right; margin: 6px 0 0 40px; width: 250px; /*background-color: Lime;*/}
#subnav h2 {margin: 0 0 20px 0;}
#subnav ul {margin: 0; padding: 0;}
#subnav li {margin: 0; padding: 0; list-style: none; padding: 10px 0 10px 0; border-bottom: 1px dashed #ccc; text-transform: uppercase; font-weight: bold;}
#subnav a {text-decoration: none; color: #1E2632;}
#subnav a:hover {text-decoration: underline;}

/* SOCIAL MEDIA AREA */

#social {float: left; width: 940px; height: 80px; background-image: url(images/footer.gif); background-repeat: repeat-x;}
#social a {color: #fff; text-decoration: none;}
#social a:hover {text-decoration: underline;}
#social table {width: 100%; margin: 20px 20px 0 20px;}

/* FOOTER AREA */

#footer {float: left; width: 940px; padding: 20px 0 20px 0; color: #fff; }
#footer a {color: #fff; text-decoration: underline; font-weight: bold;}
#footer a:hover {text-decoration: none;}
#footer span {float: right;}

/* CONTACT FORM */

.contact {font-weight: bold;}
.contact input {width: 350px; padding-left: 5px;}
.contact textarea {width: 350px; height: 200px; font-size: 13px;padding-left: 5px;}


/* SPEC */

.spec {margin-top: 20px;}
.spec td {padding-right: 10px;}

/* OTHER SHIII */

.left {float: left;}
.right {float: right;}

.margleft {margin-left: 20px;}
.margright {margin-right: 20px;}
.margtop {margin-top: 20px;}
.margbot {margin-bottom: 20px;}


.tel {font-size: 16px; font-weight: bold;}

/* CALENDAR */
/*
.calendar {background-color: #222129; width: 0; margin: 10px; float: left;}
.calendar td {background-color: #fff; padding: 2px; text-align: center;}

.key {float: right;}
.key table {width: 0; margin: 0; padding: 0;}

#calendar table.month{
	width: 145px;
	float: left;
	background-color: #222129;
}
.monthheader{
	line-height: 21px;
	text-align: center;
	background-color: #222129; 
	vertical-align: middle;
	font-weight: bold;
	color: white;
}
#calendar tr.header {
	font-weight: bold;
	color: black;
}
#calendar td.today {
	font-weight: bold;
	background-image: url(images/today.jpg);
	color: white;
	vertical-align: middle;
	height: 20px;
}
#calendar td.public {
	font-weight: bold;
	background-color: #7E3B33;
	color: #fff;
	vertical-align: middle;
	height: 20px;
}
#calendar td.booked {
	
	background-color: #FFCC00;
	color: #6D6F71;
	vertical-align: middle;
	height: 20px;
}
#calendar td.bookedstart {
	
	background-image: url(images/booked_start.jpg);
	color: #6D6F71;
	vertical-align: middle;
	height: 20px;
}
#calendar td.bookedend {
	
	background-image:  url(images/booked_end.jpg);
	color: #6D6F71;
	vertical-align: middle;
	height: 20px;
}
#calendar td.available {
	color: #6D6F71;
	background-color: #Fff;
	vertical-align: middle;
	height: 20px;
}
#calendar td.booked a, #calendar td.public a, #calendar td.today a{
	color: white;
	text-decoration: none;
}
#calendar td.booked a:hover, #calendar td.public a:hover, #calendar td.today a:hover{
	color: white;
	text-decoration: underline;
}
#calendar a{
	color: #6D6F71;
	text-decoration: none;
}
#calendar a:hover{
	color: #6D6F71;
	text-decoration: underline;
}
*/
.error
{
    border: 2px solid red;
    width:37px;
}

fieldset {margin: 20px 0 20px 0; padding: 15px 15px 0 15px;  border: 1px solid #C4C4C4;}
fieldset p {margin: 0 0 15px 0; padding: 0; font-size: 14px;}
fieldset input {margin: 0 0 20px 0;}
legend {font-size: 18px; font-weight: bold; color: #1E2632; padding: 0 5px 0 5px;}


#booking {/*background-color: Red;*/}
#booking label {font-size: 13px; font-weight: bold; width: 180px; display: block; margin: 2px 0 2px 0;}
#booking input, #booking select, #booking textarea {width: 400px; margin: 2px 0 2px 0;}
#booking textarea {height: 260px;}
#booking td {vertical-align: top;}


.gallerythumb {padding: 4px; float: left; border: 2px solid #C4C4C4; width: 75px; height:75px; margin: 10px 10px 0px 0px;}
.gallerythumb:hover {border: 2px solid #C4C4C4; background-color: #C4C4C4;}


.sitemap li {margin: 5px 0 5px 25px;}

/* FRM VALIDATION*/
.red{border: solid 1px red; }