@charset "utf-8";
/* CSS Document */
@import "reset.css";

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

/******************************************* HTML Elements */
html { height: 100%; overflow-y: scroll }
body { height: 100%; font: 62.5% Verdana, Geneva, sans-serif; text-align: center; min-width: 810px;
	background: white url(../../images/bg/bg_body.jpg) center top no-repeat }

a { text-decoration: none }

/******************************************* Layout */ 
#wrapper { width: 810px; margin: 0 auto; text-align: left; font-size: 13px; z-index: 1 }

/******************************************* Header */
#header { position: relative; width: 100%; height: 160px; border-bottom: 7px solid #7b9cb5 }
#header h1 a { width: 143px; height: 61px; background: url(../../images/logo.jpg) top left no-repeat;
	position: absolute; top: 60px; right: 33px; text-indent: -9999px }
#header p.caption { position: absolute; top: 80px; left: 20px }

/******************************************* Banner */
#banner { width: 100%; height: 267px }
#banner #featured-img { width: 458px; height: 100%; float: left }
#banner #featured-box { width: 330px; height: 227px; float: right; padding: 20px 0 20px 22px; background: #003d4a }
#banner #featured-box div {float:left; width:141px;padding-bottom:8px;margin-top:8px;}
#banner #featured-box div.first {padding-right:12px;border-right:2px solid #7F9EA4;}
#banner #featured-box div.second {padding-left:12px;}

/******************************************* Menu */
#menu { width: 800px; padding-left: 10px; height: 34px; background: #7b9cb5; z-index: 10 }
#menu li { float: left; font-size: 11px; font-weight: bold; color: white; line-height: 32px }
#menu li a { padding: 0 6px; color: white; display: block; float: left; height: 34px }
#menu li a:hover, #menu li a.selected { color: #003d4a }

#menu li.developments { position: relative; z-index: 100 }
#menu li.developments ul#rollover { display: none; position: absolute; top: 34px; left: -3px; width: 107px; background: #7b9cb5;
	opacity: .90; padding-bottom: 5px }
#menu li.developments ul#rollover li { clear: left; line-height: 22px; width: 107px }
#menu li.developments ul#rollover li a { height: 22px; width: 89px; padding: 0 9px }

/******************************************* Content */
#content { width: 443px; float: left; padding-top: 20px; padding-left: 15px }
#content p { color: #003d4a }
#content p.apartment { font-weight:bold; }

/******************************************* Sidebar */
#sidebar { width: 352px; float: right; color: #9f011e; font-weight: bold; font-size: 12px; }
#sidebar p { margin-bottom: 10px; line-height: 1.5em; padding-left: 20px; }



/******************************************* Footer */
#footer { clear: both; padding: 25px 0 0 15px }
#footer p { color: #636466; font-size: 14px }
#footer li { display: inline; padding-right: 10px; color: #444; font-size: 15px }
#footer a {
	padding-bottom: 20px;
	font-size: 11px;
	color: #636466;
}

/******************************************* PAGES */
/******************************************* [ENTER] */
.enter #content { width: 100%; position: relative }
.enter #content h1 a { width: 242px; height: 101px; background: url(../../images/logo_enter.jpg) top left no-repeat;
	position: absolute; top: 260px; left: 288px; text-indent: -9999px }
.enter #content p.caption { position: absolute; top: 382px; left: 150px }
.enter #content a { position: absolute; top: 637px; left: 355px }

/******************************************* [HOME] */
.home #banner #featured-box p.selling { width: 148px; height: 19px; background: url(../../images/home_selling.png) top left no-repeat; 
	text-indent: -9999px; margin-bottom: 5px }
.home #banner #featured-box p.title { text-transform: uppercase; color: white; margin-bottom: 15px; font-size: 12px }
.home #banner #featured-box a.details { display: block; width: 141px; height: 22px; background: url(../../images/clickfordetails.gif) top left no-repeat; text-indent: -9999px }
.home #banner #featured-box img { margin-bottom: 15px }

.home #content p { margin-top: 30px; line-height: 1.8em }
.home #content p.first { font-weight: bold; margin-top: 30px }

.home #sidebar { text-align: center }
.home #sidebar img { margin-top: 75px }
.home #sidebar p { color: black; font-weight: normal }

.pdf {float: left; padding-right: 10px; padding-bottom:20px; padding-left: 20px; padding-top: 10px; }

.pdfd { margin-top: 15px; line-height: 1.8em; font-size: 10px; }

#sidebar a { color:  #9f011e; }

/******************************************* [DEVELOPMENTS - CURRENT] */
.dev-current #banner #featured-img { width: 552px } 
.dev-current #content { width: 507px; padding-right: 30px }
.dev-current #banner #featured-box, .dev-current #sidebar { width: 220px; padding: 15px 19px 5px }
.dev-current #banner #featured-box { height: 247px }
.dev-current #banner #featured-box td { padding: 2px 3px }
.dev-current #banner #featured-box p { color: #edb01a; font-weight: bold; font-size: 10px; line-height: 15px }

.dev-current #sidebar { padding-top: 20px }
.dev-current #sidebar p img { margin-left: 20px }
.dev-current #sidebar p.agent img { margin-left: 0px }
.dev-current #sidebar span { display: block; font-size: 9px; color: black; font-weight: normal }
.dev-current #sidebar td { width: 33%; text-align: center }
.dev-current #sidebar p.brochure a { display:block; float:left; }

.dev-current #sidebar td p {
	padding-top: 10px;
	color: black;
	font-size: 10px;
	font-weight: normal
}

.dev-current #content h2 { color: #9f011e; margin-bottom: 20px }
.dev-current #content h2, .dev-current #content h3 { text-transform: uppercase; font-size: 15px }
.dev-current #content h3, .dev-current #content p { color: #636466 }
.dev-current #content h3 { margin-bottom: 10px; font-size: 15px }
.dev-current #content p { font-size: 11px; margin-bottom: 15px }

.dev-current #content a.back { margin-top:50px;display: block; width: 213px; height: 18px; background: url(../../images/backcurdev.gif) top left no-repeat; text-indent: -9999px }
/******************************************* [DEVELOPMENTS - FUTURE & PAST] */
.dev #header { border-bottom: 7px solid #003a4a }
.dev #menu { margin: 0 }

.dev #content, .dev #content table { width: 795px }
.dev #content td { float: left; padding: 10px; height: 120px }
.dev #content td.text { width: 527px }
.dev #content td.image { width: 218px }

.dev #content h2, .dev #content h3 { color: #9f011e; font-size: 15px; text-transform: uppercase }
.dev #content h3 { font-size: 12px; margin-bottom: 10px }
.dev #content p, .dev #content a { color: #636466; margin-bottom: 10px; font-size: 11px }
.dev #content a { font-weight: bold }
.dev #content a:hover { text-decoration: underline }

/******************************************* [GALLERY] */
.gallery #header { border-bottom: 7px solid #003a4a }
.gallery #menu { margin: 0 }

.gallery #content { width: 100%; padding-left: 0; text-align: center }

/******************************************* [NEWS] */
.news #banner #featured-box p.selling { width: 148px; height: 19px; background: url(../../images/home_selling.png) top left no-repeat; 
	text-indent: -9999px; margin-bottom: 5px }
.news #banner #featured-box p.title { text-transform: uppercase; color: white; margin-bottom: 15px; font-size: 12px }
.news #banner #featured-box a.details { display: block; width: 141px; height: 22px; background: url(../../images/clickfordetails.gif) top left no-repeat; text-indent: -9999px }
.news #banner #featured-box img { margin-bottom: 15px }

.news #content, .news #content table { width: 795px }
.news #content td { float: left; padding: 10px; /*height: 120px */}
.news #content td.text { width: 459px } /*795 - 60 = 735*/
.news #content td.image { width: 162px }
.news #content td.link { width: 114px; text-align: right; vertical-align: bottom }
.news #content td.link a { display: block; color: #9f011e; font-weight: bold; font-size: 12px; line-height: 1.5em; margin: 75px 0 0 0 }

.news #content h3 { font-size: 11px; text-transform: uppercase; color: #666 }
.news #content h4 { font-size: 11px; text-transform: uppercase; color: #666 }
.news #content h3.first { margin-top: 20px }
.news #content p { font-size: 11px; color: #666; margin-bottom: 15px }
.news #content a { color: #636466; font-weight: bold }

/******************************************* [ARTICLE] */
.article #header { border-bottom: 7px solid #003a4a }
.article #menu { margin: 0 }

.article #content { width: 100%; padding-left: 0; text-align: center }
.article #article { width: 552px; text-align: left; margin: 20px auto 0 }
.article #article h3 { font-size: 11px; text-transform: uppercase; color: #666 }
.article #article h4 { font-size: 11px; text-transform: uppercase; color: #666 }
.article #article h5 { font-size: 10px; text-transform: uppercase; color: #666 }
.article #article p { font-size: 11px; color: #666; margin-bottom: 15px }
.article #article a { color: #636466; font-weight: bold }
.article #article li { font-size: 11px; color: #666; margin-bottom: 15px; list-style:inside; }
.article #article .articleAward {float: left; padding-right: 10px; }

/******************************************* [ARCHIVE] */
.archive #header { border-bottom: 7px solid #003a4a }
.archive #menu { margin: 0 }

.archive #content { width: 100%; padding-left: 0 }
.archive #content, .archive #content table { width: 795px }
.archive #content td { float: left; padding: 10px; height: 120px }
.archive #content td.text { width: 527px }
.archive #content td.image { width: 218px }

.archive #content h3 { font-size: 11px; text-transform: uppercase; color: #666 }
.archive #content p { font-size: 11px; color: #666; margin-bottom: 15px }
.archive #content a { color: #636466; font-weight: bold }

/******************************************* [ROFFEY HOMES] */
.roffey #content h2 { text-transform: uppercase; color: #636466; margin: 20px 0 15px; font-size: 15px }
.roffey #content p, .roffey #content li { color: #636466; margin-bottom: 10px; font-size: 11px }
.roffey #content ul { margin-left: 15px }

/******************************************* [CONTACT] */
.contact #header { border-bottom: 7px solid #003a4a }
.contact #menu { margin: 0 }

.contact #content { position: relative; width: 70% }
.contact #content p { position: relative; color: #636466; margin-bottom: 10px; font-size: 12px }
.contact #content p.req, .contact span.star { color: #a70e13; font-weight: bold }
.contact span.star { position: absolute; left: -20px; top: 25px }
.contact p.phone, .contact p.mobile { width: 284px; float: left }
.contact p.mobile { width: 280px }
.contact p.email { clear: left }
.contact label { display: block; padding-bottom: 5px }
.contact .name input, .contact .email input, .contact .message textarea { width: 560px }
.contact .message textarea { height: 100px }
.contact .phone input { width: 260px }
.contact .mobile input { width: 276px }
.contact #BtnSubmit { position: absolute; bottom: 12px; right: -90px }

.contact #footer ul, .login #footer ul, .listcontact #footer ul { margin: 10px 0 }
.contact #footer li span, .login #footer li span, .listcontact #footer li span { color: #999 }
.contact #footer p.address,.login #footer p.address, .listcontact #footer p.address { font-size: 11px }
.contact #footer p.regadd, .login #footer p.regadd, .listcontact #footer p.regadd { font-size: 9px; margin-top: 40px }
.contact #footer p.regno, .login #footer p.regno .listcontact #footer p.regno { font-size: 9px }

/******************************************* [LOGIN] */
.login #header { border-bottom: 7px solid #003a4a }
.login #content { padding-top: 30px; padding-bottom: 30px; width: 795px }
.login table { background: #7b9cb5; color: white }
.login th { background: #003a4a; vertical-align: middle }
.login #btnLogIn { float: right; padding: 10px; margin-right: 30px }

/******************************************* [LIST CONTACT] */
.listcontact #header { border-bottom: 7px solid #003a4a }
.listcontact #content { padding-top: 30px; padding-bottom: 30px; width: 795px }
.listcontact table { background: #7b9cb5 }
.listcontact table#Panel1 { background: #003a4a; color: white; text-align: right }
.listcontact th { background: #003a4a; vertical-align: middle; color: white }
.listcontact td { text-align: left }
.listcontact td.f-name { width: 105px; padding-left: 10px }
.listcontact td.f-width { width: 115px }
.listcontact h2.list { padding: 8px; padding-top: 10px; width: 100px; float: right }
.listcontact #btnExportTop { float: right; padding: 8px }

/******************************************* [LIST CONTACT] */
.privacy #header { border-bottom: 7px solid #003a4a }
.privacy #menu { margin: 0 }
.privacy #content h2 { text-transform: uppercase; color: #636466; margin: 20px 0 15px; font-size: 15px }
.privacy #content p { color: #636466; margin-bottom: 10px; font-size: 11px }

/******************************************* Global Classes */
p.caption { width: 528px; height: 42px; background:url(../../images/bg/bg_caption.png) top left no-repeat; text-indent: -9999px }
a#back { padding-left: 25px !important; width: 60px; background: url(../../images/ico_back.png) left 5px no-repeat }

/******************************************* Generic Classes */
.maroon { color: #9f011e }
.yellow { color: #edb01a }
.grey-blue { color: #7b9cb5 }
.dark-blue { color: #003a4a }
.teal { color: #003d4a }
.grey { color: #636466 }


