body { background: #363636 url(../images/bg1.gif) center top no-repeat; margin: 0; padding: 46px 0 30px 0; font-size: 62.5%; font-family: "Lucida Grande", Helvetica, "Trebuchet MS", sans-serif; text-align: center; color: #ffffff; }

#wrap { width: 792px; margin: auto; text-align: left; background: url(../images/bg7.gif) repeat-y center; }

a:link, a:visited { color: #000000; text-decoration: none; }
a:hover, a:active { color: #ffffff; text-decoration: none; }

#header { padding: 14px 30px 30px 30px; background-color: #249ca6; margin: 0 16px 0 16px; }
#header .floater a:link, #header a:visited { float: right; color: #FFFFFF; text-decoration: none; }
#header .floater a:hover, #header .floater a:active  {color: #FFFFFF; text-decoration: underline; }
#header a.home:link, #header a.home:visited { float: none; }


.floater { float: right; margin: 0; width: 380px; }
.floater img {margin-top: 22px;}

/* ++++++ navigation styles ++++++ */

#nav { border: 10px solid #FFFFFF; border-bottom: none; border-top: none; margin: 0 16px 0 16px; padding: 0; background: #FFFFFF; height: 14px; }
#nav ul { list-style: none; display: inline; margin: 0; padding: 0; height: 14px; margin: 0; padding: 0; }
#nav li { list-style-type: none; display: inline; }
#nav a span { display: none; }
#nav li a { height: 14px; float: left; }

#home a:link, #home a:visited { background: url(../images/home3.gif) 19px top no-repeat; width: 142px; }
#home a:hover, #home a:active { background: url(../images/home3.gif) 19px -14px no-repeat; }
#apartments a:link, #apartments a:visited { background: url(../images/apart3.gif) 19px top no-repeat; width: 142px; }
#apartments a:hover, #apartments a:active { background: url(../images/apart3.gif) 19px -14px no-repeat; }
#location a:link, #location a:visited { background: url(../images/loc3.gif) 19px top no-repeat; width: 142px; }
#location a:hover, #location a:active { background: url(../images/loc3.gif) 19px -14px no-repeat; }
#specification a:link, #specification a:visited { background: url(../images/spec3.gif) 19px top no-repeat; width: 142px; }
#specification a:hover, #specification a:active { background: url(../images/spec3.gif) 19px -14px no-repeat; }
#contact a:link, #contact a:visited { background: url(../images/con3.gif) 19px top no-repeat; width: 142px; }
#contact a:hover, #contact a:active { background: url(../images/con3.gif) 19px -14px no-repeat; }

#main:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#main { display: block; clear: both; display: inline-block; padding: 30px; font-size: 1.1em; line-height: 1.4em; background-color: #249ca6; margin: 0 16px 0 16px; }
/* Hides from IE-mac \*/
* html #main {height: 1%;}
#main {display: block;}
/* End hide from IE-mac */

#main .hero { float: right; }
.hero p { width: 270px; margin-top: 5px; padding-top: 0; }

h1 span, h2 span { display: none; }
h1#headhome { background: url(../images/head_home.gif) left top no-repeat; height: 60px; width: 348px; margin: 0; padding: 0; }
h1#headhomer { background: url(../images/head_home2.gif) left top no-repeat; height: 84px; width: 600px; margin: 0; padding: 0; display: block; }
h1#headmortgage { background: url(../images/head_mortgage.gif) left top no-repeat; height: 134px; width: 585px; margin: 0; padding: 0; }
h1#headlead { background: url(../images/lead.gif) left top no-repeat; height: 147px; width: 700px; margin: 0; padding: 0; }
h1#headloc { background: url(../images/head_location.gif) left top no-repeat; height: 30px; width: 332px; margin: 0; padding: 0; }
/*h1#headcon { background: url(../images/head_contact.gif) left top no-repeat; height: 84px; width: 361px; margin: 0 0 10px 0; padding: 0; }*/
h1#headcon { background: url(../images/head_contact3.gif) left top no-repeat; height: 30px; width: 361px; margin: 0 0 10px 0; padding: 0; }
h1#headapart { background: url(../images/head_apart.gif) left top no-repeat; height: 30px; width: 361px; margin: 0 0 10px 0; padding: 0; }
h1#headamen { background: url(../images/head_amen.gif) left top no-repeat; height: 30px; width: 361px; margin: 0 0 10px 0; padding: 0; }
h1#headspec { background: url(../images/head_spec.gif) left top no-repeat; height: 30px; width: 361px; margin: 0 0 10px 0; padding: 0; }
h1#headcred { background: url(../images/head_cred.gif) left top no-repeat; height: 30px; width: 361px; margin: 0 0 10px 0; padding: 0; }
h1#headthank { background: url(../images/head_thank.gif) left top no-repeat; height: 60px; width: 361px; margin: 0 0 10px 0; padding: 0; }
h2#headshow { background: url(../images/head_contact.gif) left top no-repeat; height: 28px; width: 361px; margin: 0 0 10px 0; padding: 0; }
h2#headshowa { background: url(../images/head_price.gif) left top no-repeat; height: 60px; width: 398px; margin: 0 0 0 0; padding: 0; }
h2#headshowb { background: url(../images/head_price3.gif) left top no-repeat; height: 60px; width: 308px; margin: 0 0 0 0; padding: 0; }
h2#headterms { background: url(../images/terms.gif) left top no-repeat; height: 65px; width: 333px; margin: 0 0 0 0; padding: 0; }
h2 { color: #000000; font-size: 1.2em; margin-bottom: 0; padding-bottom: 0; }
p { width: 393px; }
p.first { margin-top: 0; padding-top: 0; }
p.firsty { margin-top: 0; padding-top: 0; width: 150px; }

a.mort:link, a.mort:visited { background: #000000; color: #FFFFFF; padding: 4px; clear: both; margin-top: 15px; }
a.mort:hover, a.mort:active { background: #FFFFFF; color: #000000; padding: 4px; }

#footer { margin: 0; padding: 26px 16px 0 16px; color: #ffffff; background: url(../images/bg6.gif) no-repeat #363636; }
#footer div { float: right; }
#footer a:link, #footer a:visited { color: #249ca6; }
#footer a:hover, #footer a:active { color: #ffffff; }

.plan { display: block; margin: 10px 0 10px 0; }

ul#sub { width: 100px; list-style: none; margin: 11px 20px 20px 0; padding: 0; float: right; }
#sub li { list-style-type: none; margin: 0; padding: 0; line-height: 2em; }
#sub li a:link, #sub li a:visited { display: block; padding-left: 5px; text-decoration: none; border-bottom: 1px dotted #ffffff; color: #000000; }
#sub li.sel a:link, #sub li.sel a:visited { display: block; padding-left: 5px; text-decoration: none; background: url(../images/arrow.gif) no-repeat right center; }
#sub li a:hover, #sub li a:active { display: block; padding-left: 5px; color: #ffffff; text-decoration: none; }

a#print:link, a#print:visited { color: #FFFFFF; background: #000000; padding: 5px; border: 1px solid #000000; }
a#print:hover, a#print:active { color: #000000; background: #FFFFFF; padding: 5px; border: 1px solid #000000; }

.mono { display: none; }

#contactform { background: #000000; width: 275px; padding: 10px; }
label { display: block; }
input, textarea { display: block; margin: 5px 0 5px 0; }
.sbmt { background: #249ca6; color: #FFFFFF; padding: 5px; border: none; margin-top: 10px; }
#name, #phone, #email, #postcode { width: 255px; padding: 2px; }
#enquiry { width: 255px; padding: 2px; }

.lefty { float: left; width: 160px; display: block; }

.blacky { color: #000000; width: 200px; float: left; }
.blacky p { width: 180px; }
.blacky a { text-decoration: underline; }

iframe { margin-top: 39px; }

.spec { display: block; width: 200px; float: left;  }
.spec p { border-bottom: 1px dotted #FFFFFF; margin-bottom: 0; padding-top: 0px; width: 200px; }
.conlist { display: block; width: 140px; float: left;  }
.conlist p { margin: 0; padding: 0px; width: 140px; }
.spec span, .conlist span { float: right; }
p.showpics { width: 310px; float: right; margin: 0 40px 0 0; }
.fourpad { margin-left: 4px; }
.pads { width: 280px; }
.newright { float: right; width: 320px; margin-top: 0; clear: right; margin-right: 30px; }
.strippa { margin: -30px -30px auto -30px; }
.coll { float: left; width: 350px; }
.coll p { width: 330px; }
.blck { display: block; clear: both; }
.tiny { width: 330px; color: #000000; font-size: 0.8em; line-height: 1.2em;}

input.validation-failed, textarea.validation-failed { border: 1px solid #249ca6; color : #249ca6; }
input.validation-passed, textarea.validation-passed { border: none; color : #000; }
.validation-advice { color: #249ca6; }

/* lightbox styles */

.hero img.black { display: none; }

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }