/*=================================================

		CSS for: Whiterocks Resort, Bafra
		Author: Toby Vervaart
		Company: Consultants in Design
		Email: info@consultantsindesign.co.uk
		Creation Date: 
		Last Modified:

=================================================*/

/*=================================================

		GLOBALS

=================================================*/

/* CSS Reset
-------------------------------------------------*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

fieldset,img { 
	border:0;
}

address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}

ol,ul {
	list-style:none;
}

caption,th {
	text-align:left;
}

h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}

q:before,q:after {
	content:'';
}

abbr,acronym { 
	border:0;
}

/* Set 1em == 10px
-------------------------------------------------*/

html {
	font-size: 50%;
}

body {
	font-size: 125%;
}

/*=================================================

		COLOUR & TYPOGRAPHY

=================================================*/

body {
	background: #1F87CE url("../images/bg.jpg") no-repeat top center;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	color: #444;
}

/* Headings
-------------------------------------------------*/

h1 a {
	display: block;
	width: 227px;
	height: 62px;
	text-indent: -9999px;
	background: #FFF url("../images/logo.jpg") no-repeat top left;
	background-position: fixed;
	float: left;
	margin: 0 0 20px 0;
}

h2#callnow {
	display: block;
	width: 195px;
	height: 56px;
	text-indent: -9999px;
	background: transparent url("../images/callnow.jpg") no-repeat top left;
	float: right;
	margin: 2px 0 0 0;
}

h2#registernow a {
	display: block;
	float: right;
	width: 171px;
	height: 54px;
	text-indent: -9999px;
	background: transparent url("../images/updates.jpg") no-repeat top left;
	margin: 2px 0 15px 0;
}

h2#rci a {
	display: block;
	width: 193px;
	height: 54px;
	background: transparent url("../images/rci-header.jpg") no-repeat top left;
	text-indent: -9999px;
	margin: 2px 0 0 30px;
	float: right;
}

h2, h3, h4, h5, h6 {
	color: #12507A;
	font-weight: lighter;
}

h2 {
	font-size: 30px;
	margin: 0 0 3px 0;
}

h3 {
	font-size: 20px;
	margin: 0 0 15px 0;
	margin: 0 0 20px 0;
}

h3.fullWidth {
	padding: 0 0 15px 0;
	border-bottom: 1px solid #B7CCD9;
}

h4 {
	border-top: 1px solid #CFE0EA;
	border-bottom: 1px solid #CFE0EA;
	font-size: 14px;
	line-height: 22px;
	padding: 5px 0;
	margin: 0 0 15px 0;
}

h5 {
	font-size: 14px;
	margin: 0 0 10px 0;
	line-height: 22px;
}

h6 {

}

/* Paragraphs & Text
-------------------------------------------------*/

p {
	font-size: 12px;
	line-height: 20px;
	margin: 0 0 10px 0;
}

small {

}

address {
	font-size: 14px;
	line-height: 22px;
	margin: 0 0 10px 0;
	padding: 10px;
	background: #DFF2FF;
	border: 1px solid #60A5D4;
}

/* Lists
-------------------------------------------------*/

ol, ul {
	font-size: 12px;
	line-height: 18px;
}

li {
	margin: 0 0 7px 0;
}

ol {
	margin: 0 0 15px 0;
}

dl {
	margin: 0 0 15px 0;
}

dt {
	color: #12507A;
	font-size: 14px;
	padding: 5px 0;
	margin: 0 0 10px 0;
	border-top: 1px solid #B7CCD9;
	border-bottom: 1px solid #B7CCD9;
}

dd {
	font-size: 12px;
	line-height: 20px;
}

/* Links
-------------------------------------------------*/

a:link, a:active, a:visited {
	color: #12507A;
}

a:hover {
	text-decoration: none;
}

/* Forms
-------------------------------------------------*/

fieldset {

}

legend {
	display: none;
}

form {

}

label {
	display: block;
}

input, textarea, select {
	padding: 2px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	width: 98%;
	color: #444;
}

input {

}

/* Make sure submits, radios, buttons and checkboxes have normal widths */
input.submit, input.button, input.radio, input.checkbox {
	width: auto;
}

textarea {
	height: 100px;
	overflow: auto;
}

select {

}

optgroup {

}

option {

}

/* Tables
-------------------------------------------------*/

table {
	font-size: 12px;
}

tr {

}

thead {

}

th, td {
	padding: 5px;
}

th {
	font-weight: bold;
}

tbody {

}

td {

}

tfoot {

}

/* Icons
-------------------------------------------------*/

.print, .email, .skype, .skypeAdd, .download {
	padding: 5px 0 5px 22px;
}

.success, .error {
	padding: 0 0 0 22px;
}

.print {
	background: transparent url("../images/icon-print.gif") no-repeat center left;
}

.email {
	background: transparent url("../images/icon-email.gif") no-repeat center left;
}

.success {
	background: transparent url("../images/icon-tick.gif") no-repeat center left;
}

.error {
	background: transparent url("../images/icon-cross.gif") no-repeat top left;
}

.skype {
	background: transparent url("../images/icon-skype.gif") no-repeat center left;
}

.skypeAdd {
	background: transparent url("../images/icon-skype-add.gif") no-repeat center left;
}

.download {
	background: transparent url("../images/icon-page-put.gif") no-repeat center left;
}

/* Decorative
-------------------------------------------------*/

img.articleHeader {
	padding: 10px;
	border: 1px solid #DFDFDF;
	margin: 0 0 15px 0;
}

img.articleHeaderAlt {
	margin: 0 0 15px 0;
}

img.noBorder, div.smCol img.noBorder {
	border: 0;
	padding: 0;
}

/*=================================================

		STRUCTURE

=================================================*/

/* Wrapper
-------------------------------------------------*/

div#wrapper {
	position: relative;
	width: 860px;
	height: auto;
	margin: 20px auto 0 auto;
	text-align: left;
	background: transparent;
}

/* Header
-------------------------------------------------*/

div#header {
	border: 1px solid #1B6FAD;
	background: #FFF;
	padding: 10px;
	clear: both;
	margin: 60px 0 0 0;
	width: 830px;
	overflow: auto;
}

/* Navigation
-------------------------------------------------*/

ul.nav {
	padding: 0 5px;
	margin: 20px 0;
	clear: both;
}

ul.nav li {
	display: inline;
}

ul.nav li a:link, ul.nav li a:active, ul.nav li a:visited {
	background: transparent url("../images/icon-navarrow.gif") no-repeat 7px center;
	padding: 7px 10px 7px 14px;
	color: #FFF;
	text-decoration: none;
	font-size: 14px;
	margin: 0 8px 0 0;
}

ul.nav li a:hover, ul.nav li a.selected {
	background: #0B5587 url("../images/icon-navarrow.gif") no-repeat 7px center;
}

ul.nav ul {
	width: 150px;
	background: #0B5587;
}

ul.nav li {
	margin: 0;
	padding: 0;
}

ul.nav ul li a:link, ul.nav ul li a:active, ul.nav ul li a:visited  {
	margin: 0 0 0 0;
	padding: 7px 10px 7px 14px;
	width: 126px;
	font-size: 12px;
}

ul.nav ul li a:hover {
	background: #2285C9 url("../images/icon-navarrow.gif") no-repeat 7px center;
}

ul.nav ul li ul {
	margin: 0 0 0 37px;
}

ul.nav li .sfHover {
	background: #0B5587 url("../images/icon-navarrow.gif") no-repeat 7px center;
}

ul.nav li ul li .sfHover {
	background: #2285C9 url("../images/icon-navarrow.gif") no-repeat 7px center;
}

/* Body
-------------------------------------------------*/

div#body {
	padding: 20px 20px 10px 20px;
	background: #FFF;
	clear: both;
	margin: 15px 0 0 0;
	width: 810px;
}

/* Home Page
-------------------------------------------------*/

div#banner {
	margin: 60px 0 5px 0;
}

div#navLinksWrap {
	padding: 0 5px;
	overflow: auto;
}

div.navLink {
	width: 277px;
	height: 270px;
	position: relative;
	margin: 0 9px 0 0;
	float: left;
}

div.navLink a.textLink {
	position: absolute;
	bottom: 0;
	color: #9BEB44;
	font-size: 12px;
	background: transparent url("../images/icon-navarrow.gif") no-repeat 7px center;
	padding: 0 0 0 15px;
}

div.navLink.last {
	margin: 0;
}

div.navLink a img {
	border: 3px solid #65B3E8;
	margin: 0 0 7px 0;
}

div.navLink a:hover img {
	border: 3px solid #FFF;
}

div.navLink h3 {
	font: normal 16px Arial, Helvetica, sans-serif;
	color: #FFF;
	margin: 0 0 5px 0;
}

div.navLink p {
	font: normal 11px/15px Arial, Helvetica, sans-serif;
	margin: 0 0 7px 0;
	color: #FFF;
}

/* Scroller */

#scroller_container {
	position: relative;
	width: 846px;
	height: 30px;
	overflow: hidden;
	margin: 0 0 7px 5px;
	background: #1A70AB;
	border: 1px solid #1A6CA6;
}

#scroller {
	padding: 10px;
}

#scroller p {
	padding: 0;
	color: #FFF;
	margin: -5px 0 0 0;
}

/* Footer
-------------------------------------------------*/

div#footer {
	clear: both;
	padding: 20px 25px;
	overflow: auto;
}

/* Columns
-------------------------------------------------*/

div.lgCol {
	width: 475px;
	height: auto;
	float: left;
	clear: left;
	margin: 0 25px 15px 0;
}

/*div.lgCol img {
	border: 1px solid #DFDFDF;
	padding: 10px;
	margin: 0 0 15px 0;
}*/

div.smCol {
	width: 305px;
	height: auto;
	float: left;
	margin: 0 0 15px 0;
}

div.smCol img {
	padding: 10px;
	border: 1px solid #DFDFDF;
	margin: 0 0 15px 0;
}

div.col {
	width: 395px;
	float: left;
	margin: 0 0 15px 0;
}

div.margin {
	margin: 0 20px 15px 0;
}

div.col img {
	padding: 10px;
	border: 1px solid #DFDFDF;
	margin: 0 0 15px 0;
	width: 375px;
}

div.lgCol table td {
	border: 1px solid #EFEFEF;
}

/* Drill Down
-------------------------------------------------*/

div#drilldown {
	background: #FFF;
	clear: both;
	margin: 60px 0 0 -4px;
	width: 830px;
	height: 517px;
}

div.leftCol {
	width: 395px;
	margin: 10px 10px 20px 0;
	float: left;
}

div.rightCol {
	width: 395px;
	margin: 10px 0 20px 10px;
	float: left;
}

ul.propertyDetail {
	width: 195px;
	float: left;
	font-size: 14px;
	color: #3173A8;
	margin: 0 0 15px 0;
}

ul.propertyDetail li {
	padding: 3px;
	margin: 0 0 2px 0;
	border-bottom: 1px solid #C5E5FF;
}

form#frmPropertyEnquire {
	clear: both;
	padding: 15px;
	border: 1px solid #B3C8D6;
	margin: 0 0 10px 0;
	background: #EFF6FB;
}

form#frmPropertyEnquire input {
	margin: 0 0 5px 0;
}

form#frmPropertyEnquire div.leftCol {
	width: 379px;
	margin: 10px 10px 0 0;
	float: left;
}

form#frmPropertyEnquire div.rightCol {
	width: 379px;
	margin: 10px 0 0 10px;
	float: left;
}

form#frmPropertyEnquire h4 {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 16px;
}

/* Page Options
-------------------------------------------------*/

ul#pageOptions {
	background: #EFF6FB;
	border: 1px solid #B3C8D6;
	padding: 10px;
	margin: 0 0 20px 0;
	_height: 1%;
}

ul#pageOptions li {
	display: inline;
	margin: 0 25px 0 0;
}

/* Send to a friend
-------------------------------------------------*/

form#frmSendToFriend {
	width: 240px;
	float: left;
	margin: 0 20px 0 0;
}

div#privacy {
	width: 195px;
	background: #1B6FAD;
	color: #FFF;
	float: left;
	padding: 10px;
	margin: 20px 0 0 0;
}

div#privacy a {
	color: #FFF;
}

/* Info Box
-------------------------------------------------*/

dl.infoBox {
	border: 1px solid #DFDFDF;
	margin: 0 0 19px 0;
}

dl.infoBox dt {
	background: #12507A url("../images/bg-infobox.jpg") repeat-x top left;
	padding: 15px 12px;
	font-size: 16px;
	color: #FFF;
	margin: 0;
}

dl.infoBox dd {
	padding: 8px 12px;
	background: #FCFCFC;
}

dl.infoBox dd.alt {
	background: #E0F2FF;
}

/* Image Box
-------------------------------------------------*/

div.imgBox {
	padding: 10px 8px 8px 10px;
	border: 1px solid #DFDFDF;
	margin: 0 0 15px 0;
	overflow: auto;
	_height: 1%;
}

div.imgBox img {
	width: 140px;
	height: 140px;
	margin: 0 2px 2px 0;
	float: left;
	border: 0;
	padding: 0;
}

/* Alerts
-------------------------------------------------*/

div.alertOk {
	padding: 10px;
	border: 1px solid #ECD938;
	background: #F9FAC7;
	margin: 0 0 15px 0;
}

div.alertError {
	padding: 10px;
	border: 1px solid #D43D20;
	background: #FDE0DA;
	margin: 0 0 15px 0;
}

div.alertOk p, div.alertError p {
	margin: 0;
}

/* Generic Info Sidebar
-------------------------------------------------*/

div.genericInfo {
	background: #12517B url("../images/bg-genericInfo.gif") no-repeat top left;
	padding: 20px;
	color: #FFF;
}

div.genericInfo h5 {
	color: #FFF;
	padding: 0 0 5px 0;
	border-bottom: 1px solid #5C91B4;
}

div.genericInfoBottom {
	background: #12517B url("../images/bg-genericInfo-bottom.gif") no-repeat top left;
	height: 22px;
	margin: 0 0 15px 0;
}

/* Phases
-------------------------------------------------*/

dl.phase {
	display: block;
	width: 222px;
	height: 160px;
	float: left;
	padding: 0 0 0 170px;
}

dl.phase dt {
	color: #12507A;
	font-size: 20px;
	margin: 0 0 7px 0;
	border: 0;
	padding: 0;
}

dl.phase dt a {
	text-decoration: none;
}

dl.phase dt a:hover {
	text-decoration: underline;
}

dl.phase dd {
	margin: 0 0 5px 0;
	font-size: 12px;
	line-height: 18px;
}

dl#phase01, dl#phase03 {
	margin: 0 20px 0 0;
}

dl#phase01 {
	background: transparent url("../images/img-phase01.jpg") no-repeat top left;
}

dl#phase02 {
	background: transparent url("../images/img-phase02.jpg") no-repeat top left;
}

dl#phase03 {
	background: transparent url("../images/img-phase03.jpg") no-repeat top left;
}

dl#phase04 {
	background: transparent url("../images/img-phase04.jpg") no-repeat top left;
}

/* Phases Detailed
-------------------------------------------------*/

div.phaseBox {
	/*border: 2px solid #60A5D4;
	background: #F6FBFF;*/
	margin: 0 0 15px 0;
	overflow: auto;
	_height: 1%;
	clear: both;
}

div.phaseBox ul {
	width: 30%;
	float: left;
	margin: 0 3% 0 0;
}

div.phaseBox li {
	padding: 0 0 0 15px;
	background: transparent url("../images/icon-bullet.gif") no-repeat top left;
}

/* Specification Table
-------------------------------------------------*/

table.specTable {
	clear: both;
	border: 1px solid #60A5D4;
	padding: 10px;
	font-size: 10px;
	width: 100%;
	margin: 0 0 15px 0;
}

table.specTable tr {
	border-bottom: 1px solid #ADB8C0;
}

table.specTable tr.sold {
	background: #bd2424;
	color: #FFF;
}

table.specTable thead tr {
	background: #FFF url("../images/bg-specTable.gif") repeat-x top left;
	color: #FFF;
}

table.specTable th {
	text-align: center;
}

table.specTable td {
	padding: 10px;
	text-align: center;
}

table.specTable tr.alt {
	background: #EEF6FC;
}

table.specTable img {
	margin: 0;
	padding: 0;
	border: 0;
}

/* Complexes (On Phase Pages)
-------------------------------------------------*/

div.complex {
	width: 180px;
	height: auto;
	/*background: #EFF6FB;*/
	overflow: hidden;
	_height: 1%;
	margin: 0 0 20px 0;
	float: left;
	margin: 0 20px 25px 0;
	border: 1px solid #12507A;
}

div.complex img {
	width: auto;
	padding: 0;
	border: 0;
}

div.complex h3 {
	margin: 0;
	padding: 10px 10px 0 10px;
	background: transparent url("../images/bg-body.gif") repeat-x top left;
}

div.complex a:link, div.complex a:active, div.complex a:visited  {
	text-decoration: none;
}

div.complex a:hover {
	text-decoration: underline;
}

div.complex p.arrow {
	padding: 0 0 0 10px;
}

/* Homepage - Teaser
-------------------------------------------------*/

div#teaser {
	width: 850px;
	height: 280px;
	background: #12507A url("../images/bg-teaser.jpg") no-repeat top left;
	color: #FFF;
}

div#teaser .lgCol {
	margin: 0 !important;
}

div#teaser h2, div#contact h2, form#frmContactRegister h2 {
	font-size: 26px;
	line-height: 22px;
	color: #FFF;
}

div#teaser h2 a, div#contact h2 a {
	text-decoration: none;
}


div#teaser a, div#contact a {
	color: #FFF;
}

div#teaser h3, form#frmContactRegister h3 {
	font-size: 15px;
	color: #FFF;
	border: 0;
	background: transparent url("../images/icon-arrow.gif") no-repeat center left;
	padding: 0 0 0 15px;
	margin: 0 0 15px 0;
}

div#teaser .lgCol {
	width: 530px;
	height: 238px;
	float: left;
	padding: 42px 0 0 30px;
}

div#teaser .lgCol h2 {
	font-size: 45px;
	margin: 0 0 30px;
}

div#teaser .lgCol h3 {
	background: none;
	padding: 0 0 0 50px;
	width: 400px;
	line-height: 24px;
	font-size: 15px;
}

div#contact .smCol {
	width: 259px;
	height: 265px;
	float: left;
	padding: 0 10px 0 0;
}

div#contact .smColMid {
	width: 249px;
	height: 265px;
	float: left;
	padding: 0 10px;
}

div#contact .smColRight {
	width: 259px;
	height: 265px;
	float: left;
	padding: 0 0 0 10px;
}


/* Homepage - Contact
-------------------------------------------------*/

h2#hp-download {
	padding: 230px 0 0 10px;
}

div#contact {
	width: 810px;
	/*height: 245px;*/
	padding: 20px 20px 0 20px;
	background: #12507A url("../images/bg-homepage-contact.jpg") no-repeat bottom left;
	color: #FFF;
	_height: 1%;
	overflow: auto;
}

div#contact h3.contactDetail {
	background: #D5EEFF;
	border: 1px solid #60A5D4;
	margin: 0 0 10px 0;
	padding: 10px;
	color: #13507C;
}

div#contact h3.contactDetail a {
	color: #13507C;
}

div#contact h3 {
	color: #FFF;
	font-size: 18px;
	margin: 0 0 5px 0;
}

div#contact h2 {
	margin: 0 0 20px 0;
}

/*div#contact form#frmRegister, div#contact div.success, div#contact div.error, div#registerFrm {
	width: 250px;
	height: 255px;
	padding: 0 20px 0 0;
	_padding: 0 15px 0 0;
	margin: 0 19px 0 0;
	_margin: 0 9px 0 0;
	border-right: 1px solid #2A6288;
	float: left;
}*/

div#contact div.success, div#contact div.error {
	width: 250px;
	height: 255px;
	margin: 0;
	padding: 0;
}

div#contact div.success, div#contact div.error {
	background-image: none !important;
}

div#contact div.success p {
	padding: 10px;
	background: #EEFFC6;
	border: 1px solid #89BA13;
	color: #444;
}

div#contact div.error p {
	padding: 10px;
	background: #FFCACA;
	border: 1px solid #AA0B0B;
	color: #444;
}

div#contact div.error p a {
	color: #444;
}

form#frmRegister {
	width: 256px;
	margin: 0;
	float: left;
	margin: 0 20px 0 0;
}

form#frmRegister p {
	margin: 0 0 15px 0;
}

form#frmRegister p small {
	font-size: 10px;
	line-height: 14px;
}

form#frmRegister input {
	width: 249px;
}

form#frmRegister label {
	display: none;
}

form#frmRegister select {
	width: 130px;
	float: left;
}

form#frmRegister .submit {
	float: right;
	width: auto;
}

div#contact img {
	margin: 0 0 10px 0;
}

div#contactInfo .col {
	width: 260px;
	float: left;
}

div#contactInfo h2 {
	margin: 0 0 13px 0;
}

div#contactInfo h2#telephone {
	margin: 38px 0 10px 0;
}

div#contactInfo h2#rocksEmail {
	font-size: 20px;
}

div#registerTxt {
	width: 485px;
	padding: 10px 20px 10px 25px;
	background: #2081C5 url("../images/regside.gif") no-repeat top left;
	color: #FFF;
	float: left;
	margin: 0 0 20px 0;
}

div#registerTxt h2 {
	color: #FFF;
	font-size: 18px;
	padding: 0 0 7px 0;
	margin: 0 0 7px 0;
	border-bottom: 1px solid #1578AF;
}

div#registerTxt a {
	color: #9BEB44;
}

/* Contact Page - Registration Form
-------------------------------------------------*/

form#frmContactRegister {
	padding: 20px;
	background: #12507A;
	color: #FFF;
}

form#frmContactRegister h2 {
	margin: 0 0 25px 0;
}

form#frmContactRegister a {
	color: #FFF;
}

form#frmContactRegister p {
	margin: 0 0 15px 0;
}

form#frmContactRegister p small {
	font-size: 10px;
	line-height: 14px;
}

form#frmContactRegister label {
	display: none;
}

form#frmContactRegister select {
	width: 130px;
	float: left;
}

form#frmContactRegister .submit {
	float: right;
}

/*=================================================

		USEFUL CLASSES

=================================================*/

/* Usually used for de-bugging
-------------------------------------------------*/

.hidden {
	display: none;
}

.left {
	float: left;
}

.right {
	float: right;
}

.overflow {
	overflow: auto;
}

.clear {
	clear: both;
}

.textLeft {
	text-align: left;
}

.textRight {
	text-align: right;
}

.textCenter {
	text-align: center;
}

.noborder {
	border: 0;
}