@import url("reset.css");
@import url("fonts.css");
@import url("nav.css");


/* -- Global element styles -- */

body {
	font: 12px/1.8em Arial,Sans-Serif;
	color: #222;
}

h1, h2, h3, h4, h5, h6 {
	color: #267697;
	font: normal 1em/normal Arial, Serif;
	margin: 0 0 20px;
}

h1,h2 {
	font-family: 'Hypatia',Arial,Sans-Serif;
	text-transform: uppercase;
}

h1 {
	font-size: 29px;
	letter-spacing: -1px;
}
h2 {font-size: 22px;}
h3 {font-size: 16px;}
h4 {
	font-size: 14px;
	font-weight: bold;
	color: #6A3A50;
}
h5 {
	font-size: 12px;
	font-weight: bold;
	color: #6A3A50;
}
h6 { font-weight: bold; }
h1 a, h2 a, h3 a, h4 a, h5 a {text-decoration: none;}

p, ul, dl {margin: 20px 0;}
p, ul, dl {margin: 20px 0;}
ol {
	list-style: decimal;
	padding: 0 15px;
	margin: 15px;
}

ul {
	list-style: none;
	margin: 15px;
}

	ul li {
		padding: 0 0 0 15px;
		background: url("/images/blueArrows.gif") left 7px no-repeat;
	}

a {color: #267697;}
a:hover {
	color: #333;
	text-decoration: none;
}

strong, b {
	font-weight: bold;
	color: #6A3A50;
}

.jf {
	font-family: 'JamesFajardo',Arial,Sans-Serif;
	font-size: 60px;
}

.styledBtn {
	display: inline-block;
	padding: 0 0 0 25px;
	height: 20px;
	background: url("/images/buttonStyle.png") left top no-repeat;
	font: 17px/1.3em 'HypatiaSb',Arial,Sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: -1px;
	border: none;
	cursor: pointer;
	color: #6b3953;
	text-align: left;
}

.styledBtn:hover {
	color: #222;
}

#cboxContent #cms-content {
	background: #FFFFFF;
    height: 460px;
    left: 3px;
    padding: 20px;
    position: absolute;
    top: 3px;
    width: 710px;
}

/* -- Global layouts (container, header + footer) -- */

#container, #footer {
	width: 975px;
	margin: 0 auto 20px auto;
}

	#header {
		height: 170px;
		margin: 0 0 20px;
		padding: 0 20px 0 0;
		background: url("/images/headerFade.png") top right repeat-y;
		color: #fff;
		position: relative;
		z-index: 100;
	}
	
		#logo {
			float: left;
			margin: 40px 0 0 20px;
			width: 375px;
			height: 79px;
			display: block;
			background: url("/images/logo.png");
			text-indent: -10001px;
		}
		
		#header a {
			color: #fff;
			text-decoration: underline;
		}
		
		#header a:hover {
			text-decoration: none;
		}
	
		#headerRight {
			margin: 0;
			float: right;
			text-align: right;
			width: 545px;
		}
	
			#headerRight span, #header strong {
				color: #fff;
				font-size: 11px;
			}
			
			#headerRight span.addthis_default_style {
				float: right;
				display: block;
				margin: 5px 0;
				width: 150px;
			}
			
			#headerLinks {
				text-align: left;
				float: left;
				display: block;
				width: 365px;
				margin: 3px 0 5px 25px;
			}
			
			#headerRight strong {
				font: 17px/normal 'HypatiaSb',Arial,Sans-Serif;
				text-transform: uppercase;
				display: inline-block;
				float: right;
				width: 270px;
				margin: 10px 0;
			}
			
			#ownerPhone { clear: right; }
			
			.ie7 #ownerPhone, .ie7 #holidayPhone {
				left: -130px;
				position: relative;
			}
			
				#headerRight strong span {
					display: inline;
					font: 28px/1em 'Hypatia',Arial,Sans-Serif;
					letter-spacing: -2px;
					margin: 0;
				}
			
			#header #callback {
				background: rgba(34,68,126,0.25);
				border-radius: 5px;
				float: right;
				width: 520px;
				height: 36px;
				padding: 9px 0 0;
			}
			
			.no-rgba #callback {
				background: url("/images/callbackBG.png");
			}
			
				#callback strong {
					font: 17px/normal 'HypatiaSb',Arial,Sans-Serif;
					text-transform: uppercase;
					letter-spacing: -1px;
					float: left;
					margin: 5px 10px 0;
				}
			
				#header .pageForm input {
					float: left;
					margin: 0 2px 0 0;
					width: 70px;s
				}
				
				#header .pageForm select {
					float: left;
					font: 11px/1em arial;
					padding: 5px 0;
					width: 122px;
				}
				
				#header .pageForm input.styledBtn {
					width: auto;
					background: url("/images/goBtn.png");
					width: 48px;
					height: 20px;
					text-indent: -10001px;
					margin: 4px 0 0 10px;
				}
				
				#header .pageForm label, #header .pageForm br { display: none }
	
#footerWrap {
	background: url("/images/footerBG.png") center bottom repeat-x;
	padding: 20px 0 0;
}

	#footer {
		height: 500px;
		padding: 0 0 0 20px;
		margin: 0 auto;
		font-size: 11px;
	}
	
		#footer ul {
			margin: 0 20px 50px 0;
			border-right: 1px solid #d6d1cb;
			width: 170px;
			height: 270px;
			float: left;
		}
		
		#footer ul.last-child {
			border: none;
			margin: 0;
		}
		
			#footer li:first-child {
				font: 17px/normal 'HypatiaSb',Arial,Sans-Serif;
				color: #29779b;
				text-transform: uppercase;
				padding: 0;
				margin: 0 0 10px;
				background: none;
			}
			
				#footer li:first-child a {
					color: #267697;
				}
			
			#footer a {
				color: #222;
				text-decoration: none;
			}
			
		#logos {
			margin: 0 0 30px;
			text-align: center;
			padding: 0 90px 0 0;
			clear: both;
		}
		
		#details {
			margin: 0;
			text-align: center;
			line-height: 2em;
		}
		
			#details a {
				text-decoration: underline;
			}
			
			.addthis_default_style  {
				display: inline-block;
				vertical-align: middle;
				margin-right: 10px;
			}
			
/* -- Homepage specific styles -- */


#homeBanner {
	position: relative;
	z-index: 99;
	height: 231px;
	background: url("/images/topBevel.png") left top no-repeat;
	padding: 9px 0 0;
}

	#bannerGallery {
		width: 625px;
		height: 231px;
		position: relative;
		border-right: 1px solid #fff;
		
		-moz-border-radius: 0 0 0 5px;
		-webkit-border-radius: 0 0 0 5px;
		border-radius: 0 0 0 5px;
	}
	
		#bannerImg {
			position: absolute;
			z-index: 1;
			top: 0;
			left: 0;	
			width: 625px;
			height: 231px;
			cursor: pointer;
			
			-moz-border-radius: 0 0 0 5px;
			-webkit-border-radius: 0 0 0 5px;
			border-radius: 0 0 0 5px;
		}
		
		#bannerGallery a, #furtherBanner a {
			position: absolute;
			z-index: 2;
			top: 20px;
			background: #fff;
			width: 12px;
			height: 12px;
			text-indent: -10001px;
			cursor: pointer;
			
			-moz-box-shadow: 0 0 3px #000;
			-webkit-box-shadow: 0 0 3px #000;
			box-shadow: 0 0 3px #000;
		}
		
		.borderradius .bannerLink {
			-moz-border-radius: 12px;
			-webkit-border-radius: 12px;
			border-radius: 12px;
		}
		
		#bannerGallery a.on, #furtherBanner a.on {background: #29779b;}
		
		.no-borderradius #bannerGallery a, .no-borderradius #furtherBanner a { 
			background: url("/images/bannerLinkDot.png"); 
			width: 14px;
			height: 14px;
		}
		
		.no-borderradius #bannerGallery a.on, .no-borderradius #furtherBanner a.on { 
			background: url("/images/bannerLinkDot-on.png"); 
		}
		
		#link5 {right: 20px;}
		#link4 {right: 40px;}
		#link3 {right: 60px;}
		#link2 {right: 80px;}	
		#link1 {right: 100px;}
		
	#homeBannerRight {
		position: absolute;
		bottom: 0px;
		left: 626px;
	}
	
#homeCtaStrip {
	margin: 20px 0;
}

	.homeForm, #emailSignup {
		width: 312px;
		height: 130px;
		float: left;
	}
	
	#furtherRight .homeForm {
		width: 349px;
		float: none;
	}

	#furtherRight #emailSignup {
		float: none;
		height: 100px;
	}
	
	#freeBrochureForm { background: url("/images/freeBrochureFormBG.png"); }
	#parkVisitForm { background: url("/images/parkVisitFormBG.jpg"); }
	
	#furtherRight #freeBrochureForm { background: url("/images/freeBrochureFormBG-further.jpg"); }
	#furtherRight #parkVisitForm { background: url("/images/parkVisitFormBG-furhter.jpg"); }
	
		.homeForm input {
			border: medium none;
			box-shadow: 2px 2px 2px #999999 inset;
			float: left;
			height: 25px;
			line-height: 25px;
			margin: 0 0 10px 20px;
			padding: 0 10px;
			width: 105px;
			font-size: 12px;
		}
		
		.homeForm .styledBtn {
			color: #fff;
			margin: 0 0 0 20px;
		}
		
		#furtherRight .homeForm h3 {
			margin: 0 0 10px 20px;
			padding: 15px 0 0;
		}
	
	#emailSignup {
		background: url("/images/emailSignup.png");
		text-indent: 0;
		width: 349px;
		position: relative;
	}
	
		#homeCtaStrip h3, #homeCtaStrip #emailSignup h3 {
			margin: 15px 20px;
		}
	
		#emailSignup h3 { display: none }
		#homeCtaStrip #emailSignup h3,
		#furtherRight #emailSignup h3 { display: block; }
	
		.viewLatest {
			position: absolute;
			top: 10px;
			right: 40px;
			color: #fff;
			width: auto;
			height: auto;
			float: none;
			text-indent: 0;
		}
		
		#homeCtaStrip .viewLatest, #homeCtaStrip #emailSignup input {
			position: static;
		}
		
		#homeCtaStrip .viewLatest {
			display: block;
			clear: both;
			margin: 0 0 0 20px;
		}
	
	#furtherRight #emailSignup, #furtherRight #emailSignup-large {
		float: none;
		clear: both;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
	}
	
		#emailSignup-large input {
			position: absolute;
			bottom: 20px;
			right: 10px;
			color: #fff;
			width: 55px;
		}
		
		#emailSignup-large input.emailText {
			right: 85px;
			bottom: 18px;
			color: #222;
			font: 11px/1em Arial, sans-serif;
			width: 120px;
			
			padding: 6px 10px 3px;
			border: none;
		}
		
	#emailSignup-large input {
		bottom: auto;
		top: 55px;
	}
	
	#emailSignup-large input.emailText { top: 53px; bottom: auto; }
		
	#emailSignup-large {
		background: url("/images/emailSignup.jpg") no-repeat #4C775C;
		width: 349px;
		padding: 0 0 20px;
		position: relative;
		color: #fff;
	}
	
		#emailSignup-large p {
			margin: 0;
			padding: 96px 20px 0;
		}
		
		#emailSignup-large .callBackMessage {
			left: 124px;
			position: absolute;
			top: 80px;
		}
	
#homeContent, #furtherContent {
	width: 586px;
	padding: 20px;
	float: left;
	
	-moz-border-radius: 5px 0 0 5px;
	-webkit-border-radius: 5px 0 0 5px;
	border-radius: 5px 0 0 5px;
	
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgb(219,229,240)),color-stop(0.56, rgb(255,255,255)));
	background-image: -moz-linear-gradient(center bottom,rgb(219,229,240) 0%,rgb(255,255,255) 56%);
}

	#homeContent .firstPara strong, #homeContent .firstPara b, #furtherContent .firstPara strong, #furtherContent .firstPara b {
		font-size: 14px;
	}
	
	#expander {
		height: 437px;
		overflow: hidden;
	}
	
	#expandBtn {
		display: block;
		margin: 20px 0;
		cursor: pointer;
	}

#homeContent {
	padding-bottom: 4px;
}

#homeRight, #furtherRight {
	width: 349px;
	float: right;
}

	.youtube-video .video-links {
		margin: 0 0 20px;
		padding: 20px 0;
		background: url("/images/transBG-brown.png");
		text-align: center;
		border-radius: 5px;
	}
		
		.youtube-video .video-links .styledBtn {
			color: #fff;
			font-size: 14px;
			letter-spacing: 0;
			line-height: 21px;
			margin: 0 5px;
		}

	#homeRight h3, #furtherRight h3, .unitScrollerWrap h3, .homeForm h3, #emailSignup h3 {
		font: 16px/1.5em 'HypatiaSb',Arial,Sans-serif;
		color: #fff;
		text-transform: uppercase;
		letter-spacing: -1px;
		margin: 0 0 10px;
	}
		
	#holidaySearch, #callbackCTA {
		background: url("/images/transBG-maroon.png");
		padding: 20px;
		color: #fff;
		-moz-border-radius: 0 5px 0 0;
		-webkit-border-radius: 0 5px 0 0;
		border-radius: 0 5px 0 0;
		overflow: hidden;
	}
	
	#callbackCTA {
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		background: url("/images/transBG-brown.png");
	}
	
	#furtherContent #holidaySearch {
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
	}
	
		#furtherContent #holidaySearch h3, #callbackCTA h3 {
			color: #fff;
		}
		
		#callbackCTA h3 {font-size: 17px;}
	
		#furtherContent #holidaySearch .formField {
			width: 136px;
		}
		
		#furtherContent #holidaySearch select {
			width: 125px;
		}
			
		.formField {
			display: block;
			width: 154px;
			float: left;
		}
		
			#holidaySearch label, #callbackCTA label {
				margin: 0;
				letter-spacing: -1px;
				text-transform: none;
				display: block;
				font: 15px/1.5em 'HypatiaSb',Arial,Sans-serif;
			}
			
			#callbackCTA label {
				display: inline-block;
				width:100px;
				margin: 0 0 5px;
			}
		
			#holidaySearch select {
				width: 135px;
				margin: 0 0 20px;
			}
			
			#callbackCTA select {width: 140px;}
			
			#holidaySearch .styledBtn, #callbackCTA .styledBtn {
				color: #fff;
				float: right;
				width: 125px;
			}
			
			#callbackCTA .styledBtn {
				margin: 10px -10px 0 0;
				width: 57px;
			}
			
			#callbackCTA input[type="text"] {
				font: 11px/1em Arial, sans-serif;
				width: 120px;
				background: #fff;
				padding: 6px 10px 3px;
				border: none;
				margin: 0 0 5px;
			}
			
/* -- Further page styles [main columns are the same as homepage, so see above] -- */

#breadcrumb {
	margin: 0 0 20px;
}

#furtherWrap {
	padding-top: 9px;
	background: url("/images/topBevel.png") no-repeat left top;
	overflow: hidden;
}

#furtherWrap.wideBanner {
	padding: 0;
	background: none;
}

	#furtherContent {
		-moz-border-radius: 0 0 0 5px;
		-webkit-border-radius: 0 0 0 5px;
		border-radius: 0 0 0 5px;
	}
	
		.smallBanner {
			margin: -20px 0 20px -20px;
			position: relative;
			height: 270px;
			width: 626px;
		}
		
		.fullBanner {
			position: relative;
			height: 270px;
			margin: 0 0 20px;
		}
		
			#furtherBannerImg {				
				height: 270px;
				width: 100%;
				left: 0;
				position: absolute;
				top: 0;
				z-index: 1;
			}
			
			.smallBanner #furtherBannerImg {
				width: 626px;
			}
		
		#furtherContent li, #furtherContent li span {
			font: 1em/1.5em Arial,sans-serif !important
		}
		
		#furtherContent li {
			margin: 15px 0;
		}

		
	#furtherRight {
		background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0.06, rgb(181,201,225)),color-stop(0.43, rgba(255,255,255,0.5)));
		background-image: -moz-linear-gradient(center bottom,rgb(181,201,225) 6%,rgba(255,255,255,0.5) 43%);
		
		-moz-border-radius: 0 0 5px;
		-webkit-border-radius: 0 0 5px;
		border-radius: 0 0 5px;
	}
	
		#furtherRight img, #furtherRight object {
			display: block;
		}

		#furtherRight #holidaySearch {
			-moz-border-radius: 0;
			-webkit-border-radius: 0;
			border-radius: 0;
		}
		
		#subNav h3 {
			background: #29779b;
			padding: 5px 20px;
			margin: 0;
		}
		
			#subNav h3 a {
				color: #fff;
			}
		
		#subNav ul {
			margin: 0;
			padding: 0;
			background: #fff;
		}
		
			#subNav ul li {
				padding: 3px 20px 4px 55px;
				background-position: 55px 7px;
				border-bottom: 1px solid #ccc;
			}
			
			#subNav ul li.Level1 {
				background: url("/images/subNavBG.jpg") no-repeat left top;
			}
			
			#subNav ul li.NavSelected1 {
				background: url("/images/subNavBG-selected.jpg") no-repeat left top;
			}
			
			#subNav ul li.Level2 {
				padding-left: 65px;
				background-position: 54px 11px;
			}
			
			#subNav ul li.Level2:hover {background-position: 56px 11px;}
			
			#subNav ul li.NavSelected2 {
				background-color: #eee;
				font-weight: bold;
			}
			
				#subNav a { text-decoration: none; }
				
				#subNav li.Level1 a {font-weight: bold;}
				#subNav li.Level2 a {color: #222;}
				
			#subNav ul li.Level3 {
				background: none;
				font-size: 11px;
				padding: 2px 20px 2px 85px;
			}
			
			#subNav ul li.NavSelected3 {
				background-color: #E8F0F3;
			}
				
/* -- Default form styles -- */

.pageForm label {
	display: inline-block;
	width: 170px;
	margin: 0 0 10px;
	vertical-align: top;
}

.pageForm input[type="text"], .pageForm textarea {
	font: 11px/1.5em Arial, Sans-Serif;
	color: #222;
	border: 2px solid #ccc;
	padding: 3px 5px;
	height: 18px;
	width: 200px;
	margin: 0 0 10px;
}

.pageForm textarea {
	height: auto;
	padding: 10px;
	width: 180px;
}

/* -- Top 2 featured lodges CTA -- */

#featuredLodgesCTA {
	padding: 20px;
}

	#featuredLodgesCTA h3 {
		color: #4388a7;
	}
	
	#featuredLodgesCTA ul, #slider {
		margin: 0;
		padding: 0;
	}
	
	#featuredLodgesCTA li, #slider li {
		background: none;
		padding: 20px;
		background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgb(219,229,240)),color-stop(0.56, rgb(255,255,255)));
		background-image: -moz-linear-gradient(center bottom,rgb(219,229,240) 0%,rgb(255,255,255) 56%);
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		border: 1px solid #eee;
		margin: 20px 0 0;
		position: relative;
	}
	
	#featuredLodgesCTA li {
		padding-bottom: 40px;
	}
	
	#featuredLodgesCTA img, #slider img {
		float: left;
		margin: 0 20px 20px 0;
		clear: both;
	}
	
	#featuredLodgesCTA .title, #slider .title {
		color: #4c775c;
		font: 24px/1.5em 'Hypatia',Arial,Sans-Serif;
		letter-spacing: -1px;
		margin: 0 0 5px;
		float: left;
	}
	
	#featuredLodgesCTA .price, #slider .price {
		color: #29779b;
		font: 24px/1.5em 'HypatiaSb',Arial,Sans-Serif;
		letter-spacing: -2px;
		float: right;
	}
	
	#slider .styledBtn, #featuredLodgesCTA .styledBtn {
		position: absolute;
		bottom: 20px;
		right: 20px;
		width: 110px;
	}
	
/* -- Featured lodges scroller (many styles are same as above) -- */

.unitScrollerWrap {
	clear: both;
	position: relative;
	padding: 20px;
	margin: 20px 0 0;
	background: rgba(255,255,255,0.5);
	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.no-rgba .unitScrollerWrap {
	background: url("/images/transBG-white.png");
}

	.unitScrollerWrap h3 {
		color: #29779B;
		margin: -10px 0 10px;
	}

#slideWrap {
	width: 100%;
	position:relative;
	overflow :hidden;
	height: 210px;
}

	#slider {
		position: absolute;
		top: 0;
		left: 0;
		height: 190px;
		padding:0;
	}

		#slider li {
			width: 256px;
			height: 150px;
			float: left;
			margin: 0 0 0 20px;
			line-height: 1.3em
		}

		#slider li:first-child {
			margin: 0;
		}
		
	#next, #prev {
		position: absolute;
		top: 95px;
		color: #29779b;
		width: 34px;
		height: 29px;
		text-indent: -10001px;
		cursor: pointer;
	}
	
	#next {
		right: -40px;
		background: url("/images/scrollNext.png");
	}
	
	#prev {
		left: -40px;
		background: url("/images/scrollPrev.png");
	}
