/* 	CSS Document for LochsideRetreat.com 

	Copyright Steve Bullen March 2009 */

/*	
	*** Table of Contents ***
	
	1. Body Defaults
	2. Page Structure
	3. Text
	4. Headings
	5. Navigation
		5.1 Links
		5.2 Nav
	6. Lists
	7. Forms
	8. Images
		8.1 Gallery
	9. Miscellaneous Classes      */

	
	/* *** 1. Body Defaults *** */

body {
	font-family: Calibri, Trebuchet MS, Arial sans-serif;
	font-size:0.8em;
	line-height:1.4em;
	word-spacing:-0.1em;
	color:#221623;
	background-color:#ddceae;
	background-image: url(../images/bg04.gif);
	background-position:0% 0%;
	background-repeat:repeat-x;
	margin:0 0 5px 0;
	width:100%;
}

/* *** 2. Page Structure *** */

#wrapper {
	width:100%;
	max-width:800px;
	min-width:600px;
	margin:0 auto;
	background-color:#fff;
	}

#header {
	width:100%;
	height:300px;
	margin:0 auto;
	background-image:url(../images/banner01.jpg);
	background-repeat:no-repeat;
	background-position:center;
	} 
	
#topnav {
	float:left;
	width:100%;
	height:48px;
	margin:0 auto;
	padding:0;
	background-color:#231c17; 
/*	background-image: url(../images/topnavbg.gif);
	background-repeat:repeat-x;
	background-position:top; */
	}
	
#content {
	float:left;
	width:75%;
	margin:20px 2% 20px 5%;
	}

#content-1, #content-2 {
	float:left;
	width:45%;
	margin:0 2%;
	}

#content-3 {	
	float:left;
	width:75%;
	margin:0 2% 20px 5%;
	}

#content-4 {
	clear:both;
	width:80%;
	margin:10px auto;
	}	
	
#content-5 {
	clear:both;
	width:90%;
	margin:10px auto;
	}
	
	
#contact {
	float:left;
	width:100%;
	margin:30px 0 10px 30px;
	padding:10px;
	}	
	
#sidebar {
	float:right;
	width:15%;
	margin:20px 2% 20px 0;
	}	

#footer {
	clear:both;
	margin:20px auto 0 auto;
	padding:10px;
	}
	
		
/* *** 3. Text *** */

#content {
	color:#172316;
	text-align:justify;
	}
#footer {
	text-align:center;
	}
p.imagegallery {
	
	margin:10px 0 10px 125px;
	text-align:center;
}
p.offer, p.info {
	margin:5px auto;
}	

/* *** 4. Headings *** */

h1 {
	font-size:1.8em;
	font-family:Gill Sans MT, Calibri, Arial, sans serif;
	font-weight:normal;
	color:#231c17;
	text-transform:uppercase;
	letter-spacing:-0.05em;
	word-spacing:0.3em;
	padding:0 0 15px 0;
	background:url(../images/heading1Underline.gif) bottom left repeat-x;
	}
h1.imagegallery {

	margin:10px 0 10px 120px;
	text-align:center;
}

h2 {
	font-size:1.5em;
	font-family:Trebuchet MS, Calibri, Arial, sans serif;
	font-weight:normal;
	text-transform:capitalize;
	color:#231c17;
	padding:0 0 10px 0;
	background:url(../images/heading2Underline.gif) bottom left repeat-x;
	}
h2.contact {
	font-size:1.2em;
	font-family:Trebuchet MS, Calibri, Arial, sans serif;
	font-weight:bold;
	text-transform:capitalize;
	text-align:center;
	color:#fff;
	background:none;
	margin:0 0 5px 0;
	padding:0;
	}
h2.con-4 {
		text-align:center;
		max-width:200px;
		margin:10px auto;
		}
		
		
h3.dlHead {
	width:90%;
	height:30px;
	background:url(../images/downloadArrowSmall.png) left center no-repeat;
	text-transform:uppercase;
	color:#531c58;
	padding:10px 0 0 45px;
	}
h3.ratesHead {
	clear:both;
	width:100%;
	margin:auto;
	font-size:1.1em;
	font-family:Calibri, Arial, sans serif;
	font-weight:bold;
	text-decoration:underline;
	text-align:center;
	}
h3.offer {
	width:90%;
	height:30px;
	margin:0 auto;
	text-transform:uppercase;
	text-align:center;
	color:#531c58;
	letter-spacing:1px	
}
h3.info {
	width:90%;
	height:30px;
	margin:0 auto;
	text-transform:uppercase;
	text-align:center;
	color:#531c58;
	letter-spacing:1px	

}		
em {
	color:#993333;
	}
em.offer {
	text-align:center;
	font-size:1.1em;
	}	
			
/* *** 5. Links & Nav *** */

/* 5.1 Links */

a:link {color:#1d3f58;}
a:visited {color:#1d3f58;}
a:hover {color:#21581c;}
a:active {	}

a.download {text-decoration:none;}


/* 5.2 Nav */

/* Primary Navigation - Using 'Sliding Doors' technique from: http://www.alistapart.com/articles/slidingdoors/ */

#topnav {
	float:left;
	width:100%;
	margin:auto;
	}
#tabs {
	margin:auto;
    width:90%;
    }
#tabs ul {
	margin:0 auto;
	padding:10px 10px 0 0;
	}
#tabs li {
	float:left;
	margin:0;
	padding:0;
	font-size:1.2em;
	font-weight:bold;
	color:#fff;
	text-transform:uppercase;
	list-style-type:none;
	word-spacing:0.3em;
	}
#tabs a {
	float:left;
	display:block;
	padding:6px 10px;
	text-decoration:none;
	}
	
 /* Commented Backslash Hack
     hides rule from IE5-Mac \*/
#tab a {float:none;}
  /* End IE5-Mac hack */

#topnav ul li a:link {
	color:#fff;
	}
#topnav ul li a:visited {
	color:#fff;
	}
#topnav ul li a:hover {
	color:#fff;
	background-color:#7f6553;
	}
#topnav ul li a:active {
	
	}
#topnav ul li.current {
	background-image:url(../images/pointer.png);
	background-repeat:no-repeat;
	}

/* Secondary Navigation */



/* *** 6. Lists *** */

	
ul#facilities {
	list-style-type:square;
	list-style-position:inside;
	margin:0 0 0 10px;
	padding:0;
	font-family: Calibri, Trebuchet MS, Arial sans-serif;
	color:#531c58;
	font-size:1em;
	word-spacing:0.1em;
	}
ul#facilities li {
	margin:0;
	padding:5px 0;
	}

ul#contact-1 {
	float:left;
	list-style-type:none;
	margin:0 10px 0 10px;
	padding:0;
	}
ul#contact-2 {
	float:right;
	list-style-type:none;
	margin:0 10px 0 10px;
	padding:0;
	}
	
ul#linksAttr, ul#linksTravel {
	float:left;
	list-style-type:none;
	text-align:left;
	margin:0;
	padding:0;
	}
ul#linksAttr a, ul#linksTravel a {
	text-decoration:none;
	}
ul#linksAttr li, ul#linksTravel	li {
	padding:5px 0;
	}

ul#dlList {
	float:left;
	list-style-type:none;
	text-align:left;
	margin:0;
	padding:0;
	}
ul#dlList a {
	font-size:1.2em;
	}
ul#dlList li.dlDesc {
	color:#999;
	}
		
#rates dl {
	word-spacing:0;
	margin:0 0 20px 0;
	}
#rates dt {
	float:left;
	padding:5px;
	margin:0 40px 0 0;
	}
#rates dd{
	float:right;
	padding:5px;
	}

	
	
/* *** 7. Forms *** */

form {
	font-size:1em;
	background-color:#fff;
	width:90%;
	margin:auto;
	padding:20px;
	border:1px solid #221623;
	/* Add curved corners for Firefox & Safari */
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	}
legend {
	display:none;
	}
fieldset {
	margin:10px 0 0 0;
	padding:0;
	border:none;
	}
fieldset dl {
	padding:10px 10px 0 10px;
	list-style:none;
	}
fieldset dd {
	position:relative;
	padding-bottom:1em;
	}	
fieldset#enquiry label {
	width:140px;
	height:35px;
	margin-top:-8px
	}
fieldset#buttons {
	margin:10px auto;
	text-align:center;
	}
label {
	float:left;
	width:140px;
	line-height:3em;
	padding-right:30px;
	font-size:1em;
	}

input, textarea, select {
	padding:7px;
	margin-left:5px;
	font-family:Calibri, "Trebuchet MS", sans-serif;
	font-size:1em;
	border:1px solid #221623;
	color:#000;
	background-color:#fff;
	text-transform:capitalize;
	width:220px;
	/* Add curved corners for Firefox & Safari */
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	}	
input#email, input#confirmemail {
	text-transform:none;
	}
textarea {
	padding:5px;
	margin-left:5px;
	text-transform:none;
	}
.submit, .reset {
	width:100px;
	height:50px;
	background-image: url(../images/jewelButtonBrownUp.png);
	background-repeat:none;
	border:none;
	color:#fff;
	font-family:Trebuchet MS, Calibri, Arial, sans serif;
	font-size:14px;
	font-weight:bold;
	padding:0 0 2px 0;
	text-align:center;
	}

/* *** 8. Images *** */

#attrPhoto-1 {
	height:333px;
	width:90%;
	margin:20px auto;
	padding:0;
	background:url(../images/photosAttr-1.png) center center no-repeat;
	}

/* #indexPhotos-1 {
	height:520px;
	width:90%;
	margin:80px auto 0 auto;
	padding:0;
	background:url(../images/photosIndex-1.png) center center no-repeat;
	} */
	
#indexPhotos-4 {
	height:351px;
	width:90%;
	margin:20px auto;
	padding:0;
	background:url(../images/photosIndex-2.png) center center no-repeat;
	}

#ratesPhotos-1 {
	height:351px;
	width:90%;
	margin:20px auto;
	padding:0;
	background:url(../images/photosRates-1.png) center center no-repeat;
	}
	
#googleMap {
	margin:auto;
	text-align:center;
	}
	

/* *** 8.1 Gallery *** */

/* Index Page */

#indexPhotos-1 {
	position:relative;
	margin:60px 0 30px 0;	
}
#indexPhotos-2 {
	position:relative;
	margin:30px 0;
	
}
#indexPhotos-3 {
	position:relative;
	margin:30px 0;
	
}


#image-container {
		position:relative;
		left:100px;
		top:20px;
}


/* http://www.webdesignermag.co.uk/tutorials/create-a-pure-css-image-gallery/ */

/* Old Gallery */

/*

#container {
width:550px;
height:380px;
}

#container ul {
padding:0;
margin:0;
list-style-type:none;
}
	
#container a.gallery span {
position:absolute;
width:1px;
height:1px;
top:5px;
left:5px;
overflow:hidden;
background:#fff;
}

#container a.gallery, #container a.gallery:visited {
display:block;
color:#000;
text-decoration:none;
border:1px solid #231c17;
margin:1px 2px 1px 2px;
text-align:left;
cursor:default;
}

#container a.gallery:hover {
border:1px solid #fff;
}

#container ul {
width:180px;
height:420px;
}

#container li {
float:left;
}

#container a.gallery:hover span {
position:absolute;
width:454px;
height:300px;
top:440px;
left:560px;
color:#fff;
background:#231c17;
padding:2px;
}

#container a.photo1 {
background:url('../gallery/gallimg01tn.jpg');
height:80px;
width:80px;
}

#container a.photo2 {
background:url('../gallery/gallimg02tn.jpg');
height:80px;
width:80px;
}

#container a.photo3 {
background:url('../gallery/gallimg07tn.jpg');
height:80px;
width:80px;
}

#container a.photo4 {
background:url('../gallery/gallimg03tn.jpg');
height:80px;
width:80px;
}

#container a.photo5 {
background:url('../gallery/gallimg04tn.jpg');
height:80px;
width:80px;
}

#container a.photo6 {
background:url('../gallery/gallimg05tn.jpg');
height:80px;
width:80px;
}

#container a.photo7 {
background:url('../gallery/gallimg09tn.jpg');
height:80px;
width:80px;
}

#container a.photo8 {
background:url('../gallery/gallimg08tn.jpg');
height:80px;
width:80px;
}

#container a.photo9 {
background:url('../gallery/gallimg06tn.jpg');
height:80px;
width:80px;
}

*/


	
/* *** 9. Miscellaneous Classes *** */

.dropPara {
	margin-top:52px;
	}	
.dropHead {
	margin-top:30px;
	}
.linksDropHead {
	margin-top:64px;
	}	
.break {
	margin-bottom:20px;
	}	
.note {
	clear:both;
	margin-top:40px;
	}
.warning {
	display:block;
	text-align:center;
	text-transform:uppercase;
	font-style:normal;
	font-size:1.2em;
	}
.maintenance {
	margin-left:20px;
	}
.priceCut {
	text-decoration:line-through;
	}
.clearFloats {
	clear:both;
	float:left;
	width: 100%;
	}
	
	
	/* *** Rounded Corners for Sidebar *** */

#sidebar.rounded {
	position:relative;
	/* background-color:#1d35f8; */
	}
#sidebar.rounded.tl, #sidebar.rounded.tr, 
#sidebar.rounded.bl, #sidebar.rounded.br {
	position:absolute;
	width:15px;
	height:15px;
	}
#sidebar.rounded.tl	{
	top:0;
	left:0;
	background:url(../images/sidebarRoundedTopLeft.png) top left no-repeat;
	}
#sidebar.rounded.tr {
	top:0;
	right:0;
	background:url(../images/sidebarRoundedTopRight.png) top right no-repeat;
	}
#sidebar.rounded.bl {
	bottom:0;
	left:0;
	background:url(../images/sidebarRoundedBottomLeft.png) bottom left no-repeat;
	}
#sidebar.rounded.br {
	bottom:0;
	right:0;
	background:url(../images/sidebarRoundedBottomRight.png) bottom right no-repeat;
	}