/*

Stylesheet for AskriggHideaways.co.uk
Produced by Richard Clark
http://www.rclark.co.uk 

*/

/* Stylesheet Guide 
----------------------
1. RESET
2. CONTAINERS & PAGE LAYOUT
3. HEADER
3a. NAVIGATION
4. FOOTER
5. CONTENT
6. BUTTONS
7.
8. MARGINS
9. FORMS

*/

/* Colour Reference 
---------------------
Page Bkgd:#314b2d
Header Bkgd:#9db799
Nav:
Nav Rollover:
Body Bkgd:#f9fbe0
Body Text:#60735d
Body Link: #60735d
Body Link Over
Button 1: #8aa985
Button 1 Over:
Button 2: #970000
Button 2 Over:
Secondary Nav Bkgd:#dae4c8


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

/* ===============================
1.RESET
================================*/

* {
	margin:0;
	padding:0;
}

body {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:62.5%;
	background:#314b2d url(../img/common/page-bkgd.gif) repeat-y top center;
	text-align:left;
	color:#60735d;
}

img, img a, a img {
	border:0;
}

ul, ol, dl {
	list-style-type:none;
}

a {
	text-decoration:none;
	color:#60735d;	
}

a.emphasis {
	text-decoration:none;
	color:#970000;
	font-weight:bold;	
}

a.emphasis:hover {
	text-decoration:underline;
}


/* ===============================
2. CONTAINERS & PAGE LAYOUT
================================*/

#wrapper {
	margin:0 auto;
	width:980px;
	text-align:center;
	background:#f9fbe0;
	font-size:1em;
}


/* ===============================
3. HEADER
================================*/

#header {
	background:#9db799;
	text-align:left;
	font-size:1.2em;
}

#header-subnav {
	clear:both;
	margin:0 20px;
}

	#header-subnav a {
		color:#f9fbe0;
		text-decoration:underline;
	}	
	
	#header-subnav a:hover {
		text-decoration:none;
	}

	.skipToContent {
		float:left;
		width:25%;
		margin:5px 0;
	}
			
	
	.subNav {
		float:right;
		width:70%;
		text-align:right;
		margin:5px 0;		
	}
	
		.subNav li {
			display:block;
			float:right;
			padding:0 5px;
			border-left:1px solid #f9fbe0;
		}
		
				.subNav li.last {
					border-left:none;
				}
							

#header-img {
	clear:both;
	text-align:left;
	margin:0;
	padding:0;
	height:300px;	
}

#header-img h1, #header-img h2 {
	position:relative;
	border-bottom:0;
}

#header-img h1 img, #header-img h2 img {
	position:absolute;
	top:0;
	left:0;
	z-index:10;
}

#header-img h1 span, #header-img h2 span {
	position:absolute;
	top:10px;
	left:10px;
	z-index:1;
}
/* ===============================
3a. NAV
================================*/

#nav {
	width:100%;
	background:#9db799;
	overflow:auto;
	margin:0;
	border-top:1px solid #b4d5af;
	background:url(../img/common/nav-bkgd.gif) repeat-x bottom left;
	padding-bottom:3px;
	font-size:1.3em;
}
		
		#nav li {
			display:block;
			float:left;
			width:24.8%; /* change this line when more menu items are added */
			text-align:center;
			border-right:1px solid #d0eecb;
			border-left:1px solid #60735d;		
		}	
		
			#nav li a {
				display:block;
				width:243px; /* change this line when more menu items are added */
				padding:7px 0;
				background:#9db799;		
				color:#f9fbe0;
				text-decoration:none;
			}
			
				#nav li a:hover{
					background:#314b2d;	
					border-right:1px solid #314b2d;							
				}			
				
				#nav li.current a {
					background:#314b2d;
					cursor:default;
					border-right:1px solid #314b2d;						
				}
			
			#nav li.first {
				border-right:1px solid #d0eecb;
				border-left:none;
			}
			
			#nav li.last {
				border-right:none;
				border-left:1px solid #60735d;
			}					


/* ===============================
4. FOOTER
================================*/

#footer {
	clear:both;
	background:url(../img/common/footer-bkgd.gif) center top no-repeat;
	padding:60px 0 10px 0;
	min-height:50px;
	margin:0 auto;	
	text-align:center;
	color:#8aa985;
}


	#footer ul {
		margin:10px 0;
		font-size:1.2em;		
	}
	
	#footer li {
		display:inline;
		padding:0 5px;
		border-left:1px solid #8aa985;
	}

	#footer li:first-child {
		border-left:0;
	}	
	
	#footer a {
		color:#8aa985;
		text-decoration:underline;
	}
	
		#footer a:hover {
			text-decoration:none;
			color:#60735d;
		}	

	#footer p {
		font-size:1em;
		margin:10px 0;
	}


/* ===============================
5. CONTENT
================================*/

#content {
	clear:both;
	text-align:left;
	font-size:1.2em;
	margin:18px 0;
	float:left;
}

.oneCol-wide {
	width:225px;
	margin-right:20px;
	float:left;
}

.twoCol-wide {
	width:470px;
	margin-right:20px;
	float:left;	
}

.threeCol-wide {
	width:715px;
	margin-right:20px;
	float:left;	
}

.fourCol-wide {
	width:960px;
	margin-right:20px;
	float:left;	
}


.inner-oneCol {
	width:215px;
	float:left;
}

.inner-oneCol p {
	padding:10px 0;
}

.inner-oneCol-center {
	width:225px;
	float:left;
}

.inner-oneCol-center p {
	padding:10px 0;
}

.rightMargin-innerColumn {
	margin-right:20px;
}

.contentBlock {
	overflow:hidden;
	margin-bottom:10px;
	text-align:left;
}
	.contentBlock p {
		padding:10px 0;
	}
	
	.contentBlock img {
		margin-bottom:10px;
	}
	

.leftPad-columns {
	padding-left:20px;
}

	p.leftPad-innerColumn {
		padding-left:10px;
	}
	
	h1.leftPad-innerColumn {
		margin-left:10px;
		padding:0 0 0 0;
	}

#content img {
	border:9px double #8aa985;
}

h1, h2, h3 {
	font-size:1.4em;
	border-bottom:1px solid #afc5a7;
}


/* ===============================
6. BUTTONS
================================*/

div.btnOne a {
	float:right;
	width:auto;
	text-align:center;
	border:5px double #8aa985;	
	margin-left:10px;
	color:#f9fbe0;	
}

div.btnOne a span {
	background:#8aa985;
	padding:2px 15px;
}

div.btnOne a:hover {
	border:5px double #970000;		
	color:#f9fbe0;		
}

div.btnOne a:hover span {
	background:#970000;	
	padding:2px 15px;
}

div.btnTwo a {
	float:right;
	width:auto;
	text-align:center;
	border:5px double #970000;	
	margin-right:10px;
	color:#f9fbe0;	
}

div.btnTwo a span {
	background:#970000;
	padding:2px 15px;
}

div.btnTwo a:hover {
	border:5px double #314b2d;		
	color:#f9fbe0;		
}

div.btnTwo a:hover span {
	background:#314b2d;	
	padding:2px 15px;
}


/* ===============================
7. ITEM SPECIFIC BLOCKS
================================*/

.availabilty {
	min-height:250px;
}

.calendar {
	margin:5px 0;
}

.quote {
	min-height:220px;
	background:url(../img/common/quote-start.gif) 5px 35px no-repeat;	
	margin-bottom:20px;
	clear:both;
}

	.quote p {
		padding:0 0 15px 0;
	}
	
		.quote blockquote {
			background:url(../img/common/quote-end.gif) bottom right no-repeat;
			padding:40px 20px 15px 20px ;
		}
	
.std-block {
	margin-bottom:20px;	
	clear:both;
	float:left;
	width:100%;
}

	.std-block p {
		padding:10px 0;
	}
	
	.std-block img {
		margin-top:10px;
	}


.secondary-nav {
	background:url(../img/common/left-menu-top-bkgd.gif) top left no-repeat;
	padding-top:18px;
	font-size:1.2em;
}

	.secondary-nav ul {
		background:#dae4c8;
		list-style-type:none !important;
		margin:0 !important;
	}
	
	.secondary-nav ul li {
			border-bottom:1px dashed #9db799;
			margin:0 !important;
	}
	
	.secondary-nav ul li.first {
			border-top:1px dashed #9db799;			
	}	
	
		.secondary-nav ul li a {
			width:195px;
			display:block;
			padding:5px 10px 5px 20px;	
			text-decoration:none !important;					
		}
		
		.secondary-nav ul li a:hover {
			background:#314b2d;
			color:#f9fbe0;
			text-decoration:none !important;			
		}
		
		.secondary-nav ul li.current, .secondary-nav ul li.current a{
			background:#314b2d;
			color:#f9fbe0;
			cursor:default;
		}

.secondary-nav-bottom {
	background:url(../img/common/left-menu-bottom-bkgd.gif) bottom left no-repeat;
	min-height:18px;
	width:225px;
	margin-bottom:20px;
}

.left-feature-one {
	background:#ead6bf url(../img/common/left-feat-red-bottom-bkgd.gif) no-repeat bottom left;
	overflow:hidden;
	padding:0 0 10px 0;
	margin-bottom:20px;	
}

	.left-feature-one h2 {
		background:#ead6bf url(../img/common/left-feat-red-top-bkgd.gif) no-repeat top left;
		padding:10px 0 0 20px;
		margin:0 0 10px 0;
		border-bottom:1px solid #970000;
		color:#970000;
	}
	
	.left-feature-one p {
		padding:0 10px 5px 20px;
		color:#970000;
	}

.left-feature-two {
	background:#dae4c8 url(../img/common/left-feat-green-bottom-bkgd.gif) no-repeat bottom left;
	overflow:auto;
	padding:0 0 10px 0;
	margin-bottom:20px;
}

	.left-feature-two h2 {
		background:#dae4c8 url(../img/common/left-feat-green-top-bkgd.gif) no-repeat top left;
		padding:10px 0 0 20px;
		margin:0 0 10px 0;
		border-bottom:1px solid #8aa985;
		color:#60735d;
	}
	
	.left-feature-two p {
		padding:0 10px 5px 20px;
		color:#60735d;
	}

#content .photo-thumbs {
	list-style:none;
	margin:0;
	padding:0;
}

#content .photo-thumbs li {
	float:left;
	width:auto;
}
	
#content .photo-thumbs img {
	margin-right:5px;
	border:6px double #8aa985;	
}

#content .photo-thumbs a:hover img  {
	border:6px double #970000;	
}

#content .photo-thumbs p {
	padding:10px 0;
}	

p.comment {
	padding:15px 0 5px 0;
}

p.name {
	text-align:right;
	padding:0 0 10px 0;
	border-bottom:1px dotted #afc5a7;
	font-style:italic;
}

#content ul {
	margin:10px 0 10px 40px;
	text-align:left;
	list-style-type:disc;
}

#content ul li {
	margin:5px 0;
}

#content ul li a {
	text-decoration:underline;
}

#content ul li a:hover {
	text-decoration:none;
}

#content ol {
	margin:10px 0 10px 50px;
	text-align:left;
	list-style-type:lower-roman;
}

#content ol li {
	margin:5px 0;
}

#content ol li a {
	text-decoration:underline;
}

#content ol li a:hover {
	text-decoration:none;
}

.external-link h3 {
	margin:10px 0 0 0;
	font-size:1.2em;
	border-bottom:0;
}

#content .external-link a {
	background:url(../img/common/external-link.gif) right top no-repeat;
	padding:0 15px 0 0;
}

#content .external-link a:hover {
	background:url(../img/common/external-link-hover.gif) right top no-repeat;
	padding:0 15px 0 0;
	text-decoration:underline;
}

#content .external-link ul a {
	background:none;
	padding:0;
	font-weight:bold;
}

#content .external-link ul a:hover {
	text-decoration:underline;
	padding:0;
	background:none;
}

#content .external-link a.top {
	background:none;
	padding:0;
}

#content .external-link a.top:hover {
	text-decoration:underline;
	padding:0;
	background:none;
}

#content .year-calendar a {
	text-decoration:underline !important;
}

#content .year-calendar table {
	background:#f9fbe0;
}

#content .year-calendar table tr td {
	padding:10px 0;
}

/* ===============================
8. MARGIN/FLOATS ETC
================================*/

.margin-bottom-ten {
	margin-bottom:10px;
}

.margin-right-ten {
	margin-right:10px;
}

.noBorder {
	border:0 !important;
}


/* ===============================
9. FORMS
================================*/

.contactForm label, .contactForm input {
	clear:both;
	display:block;
}

.contactForm label, .contactForm p {
	margin:5px 10px;
}

.contactForm input, .contactForm textarea, .contactForm select {
	margin:0 0 10px 10px;
	width:300px;
	border:1px solid #afc5a7;
	background:#fff;
}

.contactForm fieldset {
	margin:20px 0;
	border:1px solid #afc5a7;
}

.contactForm legend {
	color:#60735d !important;
	font-weight:bold;
}

.contactForm a {
	text-decoration:underline;
}

/* ===============================
10. PRICES TABLE
================================*/

table.prices td, table.prices th {
	width:220px;
	padding:5px 10px;
}

table.prices th {
	border-bottom:1px solid #60735d ;
}

table.prices {
	border-bottom:1px solid #60735d ;
	border-top:1px solid #60735d ;	
}

table.prices td.highlight {
	background-color:#dae4c8;
}

.highlight {
	background-color:#dae4c8;
	padding:0 5px;
}