/* 

STYLE SHEET FOR [Bolankan Cottage]
Created by Webfooted Designs Ltd
www.webfooteddesigns.co.uk

ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images

Notes

*/



/* --------- 1. defaults  --------- */

* {
		margin: 0;
		padding: 0;
	}

body {	
		
		}	
		
.clearBoth {
		clear: both;
		height: 0;
		font-size: 0.1em;
		}	
		
		
		
/*  --------- 2. structure  --------- */

/* sets the width of the content area and positions it in the centre of the page */

#wrapper {
		width: 1024px;
		margin: 10px auto 0 auto;
		position: relative;
		}

#homepage #wrapper {
		background: url(../images/homebackground.jpg) no-repeat;
		}
		
#mastheadhome {
		height: 91px;		
		}
		
#masthead {
		background: url(../images/mastheadalt.jpg) no-repeat;
		height: 91px;		
		}		
		
#title  p {	
		font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif;
		position: absolute;
		font-size: 4.0em;
		color: #000000;	
		top: 8px;
		left: 30px;		
		}
		
#content {
		clear: left;
		margin: 0 32px 0 32px;
		text-align: justify;
		}
		
/*  --------- These styles are specific to the home page  --------- */		
		
#contentphotoshome {
		width: 847px;
		height: 549px;
		margin-left: 89px;
		margin-bottom: 10px;
		}
		
.contentphotohome {
		float: left;
		margin-right: 85px;
		margin-top: 290px;
		background-color: #9fd0e0;
		}
		
.contentphotohome p {
		padding: 5px;
		margin: 0;
		font-size: 1.2em;
		}
		
#lastphotohome {
		margin-right: 0;
		margin-left: 1px;		
		}
		
/*  --------- Back to the rest of the website  --------- */		
		
.contentphotos {
		margin: 0 0 10px 57px;
		width: 847px;
		height: 196px;
		background-color: #e1e1e1;
		border: 1px solid #959595;		
		}
		
.contentphoto {
		float: left;		
		padding: 5px 0 5px 5px;
		}
		
#footer {
		float: right;
		font-size: 1.2em;
		margin: 10px 32px 0 0;
		}
		
/*  --------- Property page  --------- */		
		
.tariff {
		border-collapse: collapse;
		width: 450px;
		font-size: 1.4em;
		margin: 10px 20px 10px 0;
		float: left;
		}	

.tariff th, .tariff td {
		border: 1px solid #9FD0DF;
		padding: 5px;
		}
		
/*  --------- Contact us page  --------- */			
	
#contactdetails {
		margin: 40px;
		}

	
/* ---------- 3. links and navigation ---------- */

a {
		color: #3C4E54;
		text-decoration: underline;
		}
		
a:hover {
		text-decoration: none;
		}
		
#title a {
		text-decoration: none;
		color: #000000;
		}
		
#skipLink  {
		position: absolute;
		left: -9999px;
		}

.contentphotohome a {		
		color: #111111;
		text-decoration: none;
		}	

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

#navigation {
		position: absolute;
		top: 27px; 
		right: 80px;
		font-size: 1.6em;
		/*font-weight: bold; */
		}

#navigation a {
		display: block; /* makes the links act as block level elements */
		float: left; /* positions the links vertically (see also #navigation li) */
		padding: 10px;
		color: #000000;
		text-decoration: none;
		font-weight: bold;
		}
		
	
		
#home a:hover, a.current {
		background: url(../images/homeline.gif) no-repeat;		
		background-position: 9px 30px;
		}
		
#property a:hover, #property a.current {
		background: url(../images/propertyline.gif) no-repeat;
		background-position: 5px 30px;
		}		
		
#availability a:hover, #availability a.current {
		background: url(../images/availabilityline.gif) no-repeat;
		background-position: 7px 30px;
		}		
		
#area a:hover, #area a.current {
		background: url(../images/arealine.gif) no-repeat;
		background-position: 10px 30px;
		}	
		
#contactus a:hover, #contactus a.current {
		background: url(../images/contactline.gif) no-repeat;
		background-position: 7px 30px;
		}

#navigation ul {
		list-style: none;
		font-family: "Century Gothic", verdana, arial, helvetica, sans-serif;
		}

#navigation li {
		float: left; /* this is applied to the li as well for compatibility with earlier versions of IE (7 and earlier) */
		}
		
/* ---------- 4. fonts ---------- */

html {
		font-size: 100%;
		}

body {
		font-size: 62.5%;
		font-family: verdana, arial, helvetica, sans-serif;
		color: #111111;
		}
		
		

h1, h2, h3, h4, p, ul {
		}

#headinghome {
		margin-left: 10px;
		font-size: 2.5em;
		color: #111111;
		font-weight: normal;
		line-height: 1.0em;
		font-family: "Century Gothic", verdana, arial, helvetica, sans-serif;
		}
		
#mainheading {
		font-size: 2.5em;
		color: #111111;
		font-weight: normal;
		font-family: "Century Gothic", verdana, arial, helvetica, sans-serif;
		padding-bottom: 2px;
		border-bottom: 1px solid #515b26;
		}		

h2 {
		font-size: 2.5em;
		color: #111111;
		font-weight: normal;
		font-family: "Century Gothic", verdana, arial, helvetica, sans-serif;
		padding-bottom: 2px;
		border-bottom: 1px solid #515b26;
		}

h3 {
		}
		
h4 {
		}

#content p {
		margin: 10px 0 10px 0;
		font-size: 1.4em;
		line-height: 1.5em; /* increased line height to make the text more readable */
		font-family: verdana, arial, helvetica, sans-serif;
		}
		
ol, ul#arealist {
		line-height: 1.5em; /* increased line height to make the text more readable */
		margin: 0 40px 0 40px;
		font-size: 1.4em;
		}
		
ul#arealist {
		margin-top: 20px;
		}
		
ol li, ul#arealist li {
		margin-bottom: 10px;
		}
		
blockquote {
	font-size: 1.5em;
	font-style: italic;
	padding: 20px 40px;
	margin: 10px 0;
	background: #E5F2F7;
}

/* ---------- 5. images ---------- */

a img {
		border: none; /* to stop borders appearing on images that are links - this can be altered if you want linked images to have borders */
		}
		
.alignright {
		float: right;
		margin-left: 15px;
		margin-top: 20px;
		background-color: #e1e1e1;
		border: 1px solid #959595;	
		padding: 5px;
		}