/* CONTENTS
----------------------------------------------- 
Author: Rosie Sturman

01 - BASIC/HTML TAGS
02 - COLOURS
03 - STRUCTURE
04 - HEADER
05 - NAVIGATION
06 - MAIN
07 - FOOTER
08 - MAINBODY
09- SIDEBARS
10 - BOXSTYLEONE
12 - BUTTON
13 - MISC

*/


body {
	margin: 0;
	padding: 0;
	font-size: x-small; /* for IE5/Win */
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: small; /*for compliant browsers*/
	font-family: Georgia, serif;
	background: #d6f1f0;
	text-align: center; /*margin: auto fix for IE6*/
	overflow-x: hidden;
}

html>body { /* be nice to Opera */
	font-size: small;
}

/* BASIC/HTML TAGS
----------------------------------------------- */
	
h1 {
	font-size: 180%;
	margin: 0;
	padding: 5px 0 15px 0;
	color: #b9c532;
	font-weight: bold;
}

	
h2 {
	font-size: 150%;
	margin: 0;
	padding: 5px 0 10px 0;
	color: #b9c532;
	font-weight: bold;
}
	
h3 {
	font-size: 120%;
	margin: 0;
	padding: 5px 0 10px 0;
	color: #b9c532;
	font-weight: bold;
	letter-spacing: 0.05em;
}

h4 {
	font-size: 120%;
	margin: 0;
	padding: 0 0 10px 0;
	color: #595959;
}

p {
	font-size: 90%;
	margin: 0;
	padding: 0 0 20px 0;
	color: #595959;
}

	
a {	
	margin: 0;
	padding: 0;
	font-size: 90%;
	color: #02a1c8; 
	font-weight: normal;
	text-decoration: underline;
}

a:hover {text-decoration: none;}
p a {font-size: 100%;}

ul {color: #666; font-size: 90%;}
ol {color: #666; font-size: 90%;}
	
/*---------------------------------------------*/
em {font-style: normal;}
strong {font-weight: bold;}

.clear {clear: both;}
.left {float: left;}
.right {float: right;}
.altAlign {text-align: right;}

.mini {font-size: 80%;}

a img {border: none;}

em.textHide {display: none;}

.padd {float: left; padding: 10px;}
.paddH {float: left; padding: 0 10px;}
.paddR {float: left; padding: 0 10px 0 0;}
.paddL {float: left; padding: 0 0 0 10px;}
.paddV {float: left; padding: 10px 0;}


hr {
	clear: both;
	float: left; 
	margin: 30px 0;
	padding: 0;
	width: 100%;
	border: none;
	color: #595959;
	background-color: #595959;
	height: 1px;
}

/*---------------------------------------------*/


/* COLOURS
----------------------------------------------- */
.turquoise {background: #21b1ad;}
	
/*---------------------------------------------*/



/* STRUCTURE
------------------------------------------------ */
.wrap {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
}

#header.wrap {padding: 0 0 10px 0; background: url(../Images/PNGs/navTop.png) repeat-x 0 bottom;}
#mainNav.wrap {background: #21b1ad;}
#main.wrap {padding: 10px 0 0 0; background: #f4fbfb url(../Images/PNGs/navBottom.png) repeat-x 0 top;}
#footer.wrap {border-top: 1px solid #d6dcdc; border-bottom: 1px solid #d6dcdc;}
#footerTwo.wrap {background: url(../Images/PNGs/gradientThree.png) repeat-x 0 0;}


.wrapInner {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 900px;
	text-align: left;/*margin: auto fix for IE6*/
}

/* HEADER 
------------------------------------------------ */
#header.wrap .wrapInner {z-index: 90;}

/* NAVIGATION 
------------------------------------------------ */
#mainNav.wrap .wrapInner {z-index: 90;}

#mainNav ul {
	float: left;
	margin: 0;
	padding: 0;
	width: 900px;
	list-style: none;
}

#mainNav ul li {
	float: left;
	display: inline;
	margin: 0;
	padding: 0;
}

#mainNav ul li.selected {}

#mainNav ul li a {
	float: left; 
	padding: 0; 
	color: #FFF; 
	text-decoration: none; 
	font-size: 110%;
	font-weight: bold;
}

#mainNav ul li a em{
	float: left; 
	padding: 10px 12px; 
	cursor: pointer; cursor: hand;
}

#mainNav ul li.selected a, #mainNav ul li a:hover {color: #21b1ad; background: url(../Images/navRight.gif) no-repeat right 0;}
#mainNav ul li.selected a em, #mainNav ul li a:hover em {background: url(../Images/navLeft.gif) no-repeat 0 0;}


/* MAIN
------------------------------------------------ */
#main.wrap .wrapInner {z-index: 80; padding-top: 10px; background: url(../Images/gradientTwo.gif) repeat-y 0 0;}

/* FOOTER
------------------------------------------------ */
#footer.wrap .wrapInner {z-index: 90; position: relative; padding: 10px 0 25px 0;}
#footer p {}
#footer a {color: #595959;}

#footerTwo.wrap .wrapInner {z-index: 90; position: relative; padding: 10px 0 25px 0;}
#footerTwo p {}
#footerTwo a {color: #595959; text-decoration: none;}
	
/* MAINBODY
------------------------------------------------ */
	
#mainBody {
	z-index: 90;
	position: relative;
	float: left;
	margin: 0 20px 30px 0;
		display: inline; /*to fix double margin in IE6*/ 
	padding: 0;
	width: 540px;
}

#sidebarOne {
	z-index: 90;
	position: relative;
	float: right;
	margin: 0 0 30px 20px;
		display: inline; /*to fix double margin in IE6*/ 
	padding: 0 0 20px 0;
	width: 320px;
	border-bottom: 1px solid #595959;
}
	
/* SIDEBARS
------------------------------------------------ */
#content {}

#sidebarTwo {
	z-index: 90;
	position: relative;
	float: left;
	margin: 15px 0 0 0;
		display: inline; /*to fix double margin in IE6*/ 
	padding: 5px 0 20px 0;
	width: 540px;
	border-bottom: 1px solid #595959;
}


/* BOXSTYLEONE
------------------------------------------------ */

.boxStyleOne{
	position: relative;
	float: left;
	margin: 0;
		display: inline; /*to fix double margin in IE6*/ 
	padding: 0 0 15px 0; /*padding instead of margin for ie*/
}

.boxStyleOne .leftSide{
	float: left;
	margin: 0;
	padding: 0;
	
	background: url(../Images/PNGs/leftSide.png) repeat-y 0 0;
}

.boxStyleOne .leftSide .rightSide{
	float: left;
	margin: 0;
	
	background: url(../Images/PNGs/rightSide.png) repeat-y right 0;
}

.boxStyleOne .leftSide .rightSide .gradient{
	float: left;
	margin: 0 10px;
	padding: 20px;
	background: url(../Images/PNGs/gradientOne.png) repeat-x 0 bottom;
}


#mainBody .boxStyleOne .leftSide .rightSide .gradient{width: 480px;} /*fix in ie6 css*/
#sidebarOne .boxStyleOne .leftSide .rightSide .gradient{width: 260px;} /*fix in ie6 css*/
#content .boxStyleOne .leftSide .rightSide .gradient{width: 480px;} /*fix in ie6 css*/
#sidebarTwo .boxStyleOne .leftSide .rightSide .gradient{width: 480px;} /*fix in ie6 css*/


/* corners ------------------------------------------------ */
span.cornerOne {position: absolute; top: 0; left: 0; z-index: 50; float: left; height: 15px; width: 100%; background: url(../Images/PNGs/TL.png) no-repeat 0 0; font-size: 0.0px; /*to fix height in IE6*/}
span.cornerTwo {position: absolute; top: 0; right: 0; z-index: 50; float: left; height: 15px; width: 15px; background: url(../Images/PNGs/TR.png) no-repeat 0 0; font-size: 0.0px; /*to fix height in IE6*/}
span.cornerThree{position: absolute; bottom: 0; left: 0; z-index: 50; float: left; height: 25px; width: 100%; background: url(../Images/PNGs/BL.png) no-repeat 0 0; font-size: 0.0px; /*to fix height in IE6*/}
span.cornerFour {position: absolute; bottom: 0; right: 0; z-index: 50; float: left; height: 25px; width: 15px; background: url(../Images/PNGs/BR.png) no-repeat 0 0; font-size: 0.0px; /*to fix height in IE6*/}

/* text ------------------------------------------------ */
.boxStyleOne h1, .boxStyleOne h2 {
	margin-bottom: 10px;
	font-weight: bold;
}
.boxStyleOne h2 a {}
.boxStyleOne h2 a:hover {}

.boxStyleOne h3, .boxStyleOne h4, .boxStyleOne p{}


/* BUTTON
------------------------------------------------ */
a.button {float: left; margin: 0; padding: 0; width: 140px; text-align: center; font-weight: normal; cursor: pointer; cursor: hand; background: url(../Images/buttonBottom.gif) no-repeat 0 bottom;}
a.button.right {float: right;}
a.button em{float: left; margin: 0; padding: 10px 10px 12px 10px ; width: 120px; background: url(../Images/buttonTop.gif) no-repeat 0 0;}

a.button.short {width: 100px; background: url(../Images/buttonBottom2.gif) no-repeat 0 bottom;}
a.button.short em{width: 80px; background: url(../Images/buttonTop2.gif) no-repeat 0 0;}

/* MISC
------------------------------------------------ */

.logo {
	position: relative;
	top: 15px;
	left: -64px;
	float: left;
	margin: 0;
		display: inline; /*to fix double margin in IE6*/ 
	padding: 0;
	height: 133px;
	width: 427px;
	background: url(../Images/PNGs/logo.png) no-repeat 0 0;
}

.siteBy {
	float: right;
	margin: 0;
	padding:0 10px 0 0;
}

.siteBy a {
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
}

.daf {
	z-index: 100;
	position: absolute;
	top: 100px;
	left: -473px;
	height: 1101px;
	width: 463px;
	background: url(../Images/PNGs/daff.png) no-repeat 0 0;
}

/* BOOK NOW
------------------------------------------------ */
#bookNow.boxStyleOne{float: right; margin: 0; background: #FFF;}

#bookNow.boxStyleOne .leftSide{background: url(../Images/PNGs/leftSide2.png) repeat-y 0 0;}
#bookNow.boxStyleOne .leftSide .rightSide{background: url(../Images/PNGs/rightSide2.png) repeat-y right 0;}
#bookNow.boxStyleOne span.cornerThree{background: url(../Images/PNGs/BL2.png) no-repeat 0 0;}
#bookNow.boxStyleOne span.cornerFour {background: url(../Images/PNGs/BR2.png) no-repeat 0 0;}
#bookNow.boxStyleOne .gradient{padding: 10px 10px 8px 10px; width: 280px;} /*fix in ie6 css*/

#bookNow h2 {margin: 0; padding: 0; font-size: 190%;}
#bookNow a {font-weight: bold; text-decoration: none;}
#bookNow p {float: left; padding: 0 35px 15px 0; width: 245px; text-align: right; font-weight: bold; font-size: 100%;}
#bookNow p.tell {background: url(../Images/tell.gif) no-repeat right 0;}
#bookNow p.email {background: url(../Images/email.gif) no-repeat right 0;}
#bookNow p.email a{color: #595959;}



/* WELCOME
------------------------------------------------ */
.welcome {float: left; margin: 15px 0 30px 0; padding: 0 0 20px 0; border-bottom: 1px solid #595959;}
.welcome h1 {font-size: 120%;}
.welcome h1 em {font-size: 200%;}
.welcome h1 span {font-size: 140%; color: #595959;}


/* EGG
------------------------------------------------ */
#egg.boxStyleOne{margin-right: 15px; background: url(../Images/egg.jpg) no-repeat 0 0;}
#egg.boxStyleOne .leftSide .rightSide .gradient{height: 69px; width: 49px;} /*fix in ie6 css*/

/* MENU
------------------------------------------------ */
#menu.boxStyleOne{background: url(../Images/coffee.jpg) no-repeat 10px 10px;}
#menu.boxStyleOne .leftSide .rightSide .gradient{padding-left: 100px; width: 180px;} /*fix in ie6 css*/

/* MAP
------------------------------------------------ */
#map.boxStyleOne{margin-right: 15px; background: url(../Images/map.gif) no-repeat 0 0;}
#map.boxStyleOne .leftSide .rightSide .gradient{height: 97px; width: 77px;} /*fix in ie6 css*/

/* GOOGLEMAP
------------------------------------------------ */
#googleMap.boxStyleOne{}
#googleMap.boxStyleOne .leftSide .rightSide .gradient{padding: 0; width: 520px;} /*fix in ie6 css*/

/* PHOTO
------------------------------------------------ */
.photo {
	float: left;
	width: 533px;
	height: 381px;
	font-size: 0px;
}
.photo img{position: relative; z-index: 10; width: 533px; height: 381px;}
.photo span{position: absolute; z-index: 50; float: left; width: 533px; height: 381px; background: url(../Images/PNGs/photo.png) no-repeat 0 0;}


/* SITEMAP
------------------------------------------------ */

ul.sitemap {
	float: left;
	margin: 0;
	padding: 10px 0 0 0;
	list-style: none;
}
ul.sitemap li {padding: 0 0 15px 0; font-size: 120%;}