/* CSS Document 

--------------------------------------------------------------------
						Matt Clayburn, Partner @ CoCreate
						for
						Mink Marketing / Charter Homes
						20/6/08
						
						Version 1.0
						
						Project: Charter Homes
						
						**Please annotate amendments and log below**
						--------------------------------------------
						Amendments
						
						16.5.08
						
						--------------------------------------------
##Designers Notes
-----------------
Colours
-------
background: #075645	
--------------------------------------------------------------------
*/


/*---------------------------
		Globals
-----------------------------*/
*{
padding:0;
margin:0;
}
html{
min-height:100%;
margin:0 0 1px 0;
}
body{
background-color:#075645;
}

/*---------------------------
		Structure
-----------------------------*/
#wrapper{
width:1000px;
margin:20px auto 0 auto;
}
#header, #menu, #content, #footer{
float:left;
}
#header, #menu, #footer{
width:1000px;
}
#header{
height:120px;
margin:0 0 10px 0;
}
#menu{
height:40px;
margin:0 0 10px 0;
}
#menu.propdetails{
height:20px;
}
#content{
width:952px;
padding:20px;
border:solid 4px #FFFFFF;
}
#content.fixed{
height:390px;
}
#contentInner{
float:left;
width:950px;
}
#contentInner.gallery {
padding:10px 0 0 0;
}
#contentInner.testimonials{
padding:50px 0 0 0;
}
#content.form{
padding:20px 20px 0 20px;
}
#copy{
width:570px;
}
#copy.home{
float:right;
}
#colRight{
float:right;
width:530px;
margin:0 0 10px 0;
}
#copy.contactCopy{
float:right;
width:525px;
}
.rightCol, .rightCol p, .rightCol h2{
width:500px;
float:right;
padding:0;
margin:0;
}
.leftCol{
width:420px;
float:left;
}
#colRight.siteplan{
width:390px;
}
#colRight.siteplan table{
margin:0 0 0 40px;
}
#colRight.siteplan table td{
padding:2px 0 2px 0;
}
#colLeft{
float:left;
width:390px;
}
#colSpec{
float:left;
width:300px;
margin:0 30px 0 0;
}
#colSpecImg{
float:left;
width:280px;
margin:0 0 0 0;
}
#colSpecImg img{
margin:0 0 10px 0;
}
#propList{
width:530px;
float:left;
margin:0 0 10px 0;
padding:5px 0 0 0;
border-bottom:solid 1px #FFFFFF;
}
#copySpace{
height:180px;
}
#copy.full{
width:950px;
float:left;
}
#footer{
height:40px;
}
#development{
width:360px;
float:left;
height:130px;
overflow:hidden;
margin:0 0 10px 0;
}
#development.past{
width:465px;
margin:0 5px 10px 0;
}
#map{
border:solid 1px #FFFFFF;
}
#specialOff{
height:50px;
width:530px;
float:left;
}

.partex{
width:440px;
height:400px;
overflow:hidden;
margin:0 20px 40px 0;
float:left;
}
.partex div{
height:380px;
width:300px;
overflow:hidden;
float:left;
}
.partex div p{
width:300px;
float:left;
}
.partex div{
padding:0 10px 0 0;
}
.partex img{
float:left;
margin:0 10px 10px 0;
}
/*---------------------------
			Menu
-----------------------------*/
#menu ul{
width:996px;
height:40px;
list-style:none;
float:left;
border-left:solid 4px #FFFFFF;
}

#menu ul li{
border-right:solid 4px #FFFFFF;
}
#menu ul li, #menu ul li a{
width:110px;
height:40px;
float:left;
}
#menu ul li a{
display:block;
}
#menu ul li.wide, #menu ul li.wide a{
width:152px;
height:40px;
}
#menu ul li.wide a{
display:block;
}
#menu a{
text-transform:uppercase;
text-decoration:none;
text-align:center;
font-weight:bold;
font-size:14px;
line-height:20px;
}
#menu a:hover, #menu a.down{
color:#B6DCBB;
}
/* propertydetails menu */
#menu.propdetails ul{
width:810px;
}
#menu.propdetails ul li, #menu.propdetails ul li a{
width:100px;
}
#menu.propdetails ul li.wide, #menu.propdetails ul li.wide a{
width:130px;
}
#menu.propdetails ul, #menu.propdetails ul li, #menu.propdetails ul li a, #menu.propdetails ul li.wide, #menu.propdetails ul li.wide a{
height:20px;
}
.previous, .next{
font-weight:bold;
font-size:14px;
text-decoration:none;
text-transform:uppercase;
display:block;
float:right;
}
.previous{
width:80px;
padding:0 20px 0 0;
margin:0 10px 0 0;
background:url(../images/arrow_previous.gif) no-repeat right;
}
.next{
width:40px;
padding:0 0 0 30px;
background:url(../images/arrow_next.gif) no-repeat left;
}
/*---------------------------
			Images
-----------------------------*/
.prices_reduced{
background:url(../images/prices_reduced.gif) right top no-repeat;
}
#content.reflections-bg{
background:url(../images/reflections_bg.gif) bottom right no-repeat;
}
#header img{
padding:0 10px 0 0;
}
#colLeft img, #colRight img, #contentInner.gallery img{
border:1px solid #FFFFFF;
}
#colLeft img, #colRight img{
float:left;
}
.leftCol img, #colLeft img{
margin:0 0 10px 0;
}
#contentInner.gallery img{
margin:0 12px 10px 0;
float:left;
}
#colRight img{
margin:0 10px 0 0;
}
#development img{
margin:0 20px 0 0;
}
#colRight img.end{
margin:0 0 0 0;
}
#copySpace img{
border:none;
}
#content .imgleft img{
float:left;
}
#header img, #footer img{
float:right;
}
.welcome{
background:url(../images/title_welcome.gif) no-repeat;
}
.about{
background:url(../images/title_aboutus.gif) no-repeat;
}
.brochure{
background:url(../images/title_brochure.gif) no-repeat;
}
.viewing{
background:url(../images/title_viewing.gif) no-repeat;
}
.register{
background:url(../images/title_register.gif) no-repeat;
}
.contact{
background:url(../images/title_contactus.gif) no-repeat;
}
.news{
background:url(../images/title_news.gif) no-repeat;
}
.land{
background:url(../images/title_landrequired.gif) no-repeat;
}
.special{
background:url(../images/title_specialoffers.gif) no-repeat;
}
.title_testimonials{
background:url(../images/title_testimonials.gif) no-repeat;
}
.reflections{
background:url(../images/title_reflections.gif) no-repeat;
}
.current_dev{
background:url(../images/title_current_developments.gif) no-repeat;
}
.specification{
background:url(../images/title_specification.gif) no-repeat;
}
.salesdetails{
background:url(../images/title_sales_details.gif) no-repeat;
}
.location{
background:url(../images/title_location.gif) no-repeat;
}
.title_gallery{
background:url(../images/title_image_gallery.gif) no-repeat;
}
.title_siteplan{
background:url(../images/title_siteplan.gif) no-repeat;
}
.school_house{
background:url(../images/title_living_in_the_heart.gif) no-repeat;
}
.victoria_gardens{
background:url(../images/title_move_up.gif) no-repeat;
}
.waterfront{
background:url(../images/title_launch_yourself.gif) no-repeat;
}
.richmond{
background:url(../images/title_victorian_splendour.gif) no-repeat;
}
.willowbrook{
background:url(../images/title_eco-friendly.gif) no-repeat;
}
.title_past_dev{
background:url(../images/title_past_developments.gif) no-repeat;
}
.hillview{
background:url(../images/title_hillview.gif) no-repeat;
}
.oaklands{
background:url(../images/title_oaklands.gif) no-repeat;
}

p.award{
background:url(../images/img_award.gif) no-repeat;
background-position:560px 20px;
}
#development img{
float:left;
}

/*---------------------------
		   Forms
-----------------------------*/

#form1{
float:right;
}
#form2{
width:950px;!important
}
#form2 fieldset, #form2 table{
float:left;
width:450px;
border:none;
}

#form2 table.right{
margin:0 0 0 50px;
}
#form1 input, #form1 select{
width:250px;
height:20px;
margin:5px 0 5px 10px;
}

#form2 input, #form2 select{
width:200px;
height:20px;
margin:5px 0 5px 10px;
}
#form1 .long, #form1 textarea{
width:400px;
margin:5px 0 5px 10px;
}
#form2 .long, #form2 textarea{
width:280px;
margin:0 0 10px 10px;
}
#form2 .radio{
margin:0 0 5px 10px;
width:20px;
display:block;
background-color:none;
background:none;
float:left;
}
#form2 label{
margin:5px 0 5px 20px;
height:20px;
display:block;
background-color:none;
float:left;
}
#form2 label.range{
margin:5px 0 5px 10px;
}
#form2 .short{
margin:5px 0 5px 10px;
width:75px;
float:left;
}
#form2 .medium{
margin:5px 0 5px 0;
width:250px;
}
#form1 .submit, #form2 .submit{
width:70px;
height:20px;
float:right;
}
#form1 input.text, input.long, #form1 select, #form1 textarea, #form2 input.text, #form2 select, #form2 textarea{
background-color:#E6E6E6;
border:none;
}
#form1 .checkbox{
margin:10px 0 0 0;
width:20px;
background-color:none;
}
/*---------------------------
		  Typography
-----------------------------*/
#content .imgleft p, #content .imgleft h2{
margin:0 0 0 34px;
width:520px;
}
p{
font-size:13px;
line-height:18px;
text-align:justify;
}

#colLeft ul, #colRight.siteplan table{
font-size:13px;
line-height:18px;
}

#development a.link{
padding:40px 0 0 0;
display:block;
text-transform:uppercase;
font-size:14px;
font-weight:bold;
line-height:24px;
text-decoration:none;
}

#development a:hover{
text-decoration:underline;
}
#development p{
width:300px;
}
.rightCol h2{
text-align:center;
}
.lc{
text-transform:none;
}
.cw{
text-align:center;
width:950px;
}
#colRight p,#colRight h5{
width:510px;
}
#colRight p.col{
width:350px;
}
#colLeft p, #colLeft h2{
width:380px;
float:left;
}


.price{
font-weight:100;
font-size:22px;
line-height:28px;
}

#footer p{
padding:15px 5px 0 5px;
width:990px;
display:block;
float:left;
background:url(../images/img_phone.gif) right no-repeat;
}
h2, h5 {
text-transform:uppercase;
}
#copy.home h2{
text-align:center;
}
#copySpace h6{
font-size:22px;
font-weight:100;
}
#menu a, p, h2, a, table, #colLeft ul, h5, #development a, #copySpace h6{
font-family:Arial, Helvetica, sans-serif;
color:#FFFFFF;
}
h1.flashbanner{
font-family:Helvetica, Arial, sans-serif;
color:#FFFFFF;
font-weight:lighter;
font-size:46px;
letter-spacing:-2px;
width:750px;
float:left;
padding:35px 0 0 5px;
}
input{
color:#000000;
}
#menu a, p, h2, h5{
float:left;
}
p.home, h2.home{
width:570px;
float:right;
}
p.col_1{
width:300px;
float:right;
margin:0 30px 0 0;
}
p.col_2{
width:180px;
float:right;
margin:0 0 0 0;
}
#copy.full p{
width:500px;
padding:0 400px 0 0;
margin:20px 0 0 0;
float:left;
}
#copy.full h2{
width:950px;
float:left;
}
.wide{
width:950px;
margin:0;
padding:0;
}
#copy.full p.col{
width:450px;
margin:0 40px 0 0;
padding:0;
float:left;
}
#copy.full p.colLeft{
width:450px;
margin:0 40px 0 0;
padding:0;
float:left;
}
#copy.full p.colRight{
width:450px;
margin:0;
padding:0;
float:left;
}
#boxRight, .contactBtn{
display:block;
border:solid 4px #FFFFFF;
text-transform:uppercase;
font-size:14px;
text-decoration:none;
padding:5px;
text-align:center;
float:right;
margin:0;
}
#boxRight{
	width:250px;
	margin: 0 0 10px 10px;
}

.contactBtn{
width:100px;
margin:0px 10px 0 0;
}
