@import url('reset.css');

/*//////////////////////////

	client:   BEST GAPP
	version:  v1.0
	author:   tom greenhill
	notes:	  search for !NOTE

/////////////////////////*/

body {font: 62.5%/1 Arial, Helvetica, sans-serif; color:#4d4d4d;}
p {font-size: 1.1em; line-height: 1.6em;margin:0 0 15px;}
a.btn {display:block;height:25px;width:95px;text-indent:-9999em;}
	a.read {background:url(../images/btn-read-on.gif) top left no-repeat;}
	a.more {background:url(../images/btn-more.gif) top left no-repeat;}
	a.back {background:url(../images/btn-back.gif) top left no-repeat;display:block;height:18px;width:221px;text-indent:-9999em;}
	a.alt, #results ul.searchResults li.clearfix p.detailsLink a {text-transform:uppercase;font-size:1.4em; text-decoration:underline;}
	a.alt:hover, #results ul.searchResults li.clearfix p.detailsLink a:hover {text-decoration:none;}
	
a {text-decoration: none;color:#083759;}
a:hover {text-decoration: underline;}

.indent {text-indent:-9999em;}


/* ---- COMMON STRUCTURAL ELEMENTS */

#wrapper {width:996px;margin: 0 auto; padding:0 0 40px;}
#header, #nav, #feature, #heritage, #footer, #results, #potw #content {width:940px; margin-left: auto; margin-right:auto;} /* !NOTE left/right margin set for multiple items be careful not to overwrite below! */

#header {height:62px;position:relative;padding:53px 0 0;margin-bottom:15px;border-bottom: 1px solid #0054a5;}
#header p.strap {text-indent:-9999em;width:240px;height:35px;background:url(../images/strapline.png) center center no-repeat;}
#header #logo {position: absolute;right:0;bottom:29px;}

#nav {line-height:14px; height:14px;margin-bottom:40px;}

#nav li {float:left;}
	#nav li.nav-1 {width:50px;margin:0 33px 0 0;}
	#nav li.nav-2 {width:71px;margin:0 32px 0 0;}
	#nav li.nav-3 {width:155px;margin:0 33px 0 0;}
	#nav li.nav-4 {width:188px;margin:0 34px 0 0;}
	#nav li.nav-5 {width:225px;margin:0 34px 0 0;}
	#nav li.nav-6 {width:85px;}
	
#nav li a{display:block; height:14px;line-height:14px;background-image:url(../images/bg-nav.png);background-repeat:no-repeat; text-indent:-9999em;}
	#nav li.nav-1 a {background-position: 0 0;}
		#nav li.nav-1 a:hover {background-position: 0 -14px;}
	#nav li.nav-2 a {background-position: -83px 0;}
		#nav li.nav-2 a:hover {background-position: -83px -14px;}
	#nav li.nav-3 a {background-position: -186px 0;}
		#nav li.nav-3 a:hover {background-position: -186px -14px;}
	#nav li.nav-4 a {background-position: -374px 0;}
		#nav li.nav-4 a:hover {background-position: -374px -14px;}
	#nav li.nav-5 a {background-position: -596px 0;}
		#nav li.nav-5 a:hover {background-position: -596px -14px;}
	#nav li.nav-6 a {background-position: -855px 0;}
		#nav li.nav-6 a:hover {background-position: -855px -14px;}
		
#footer {border-top: 1px solid #0054a5; padding:15px 0 0; text-align:center;clear:both;font-size:1em;margin-top:30px;}
#footer p {color:#626161;margin:0 0 5px;}
#footer p.copy {color: #ccc;}


/* ---- HOME PAGE */

#feature {margin-bottom: 25px;}
#feature .inner {padding:30px 0 0; width:320px;float:left;}
#feature .inner h1 {width:252px;height:170px;background:url(../images/hdr-h1-home.png) top left no-repeat;margin:0 0 20px;}
#feature .feature {float:right;}

#callouts {margin:0 0 40px;}
#callouts .callout {background-color:#eceded;padding:20px 30px 50px; float: left;width: 260px;margin:0 18px 0 0;position:relative;min-height:155px; height: auto !important; height: 155px;}
#callouts .last {margin:0;}
#callouts .callout h2 {height:14px;}
#callouts #res-sales h2 {background:url(../images/hdr-residential-sales.png) top left no-repeat}
#callouts #res-lettings h2 {background:url(../images/hdr-residential-lettings.png) top left no-repeat}
#callouts #int-property h2 {background:url(../images/hdr-international-property.png) top left no-repeat}
#callouts .callout p.strap {margin:0 0 20px;}
#callouts .callout p.actions {clear:both;margin:0;}
#callouts .callout dl {font-size:1.1em;margin:0 0 10px;}
#callouts .callout dl dt {font-weight:bold;width:145px;}
#callouts .callout dl dd {float:left;width:145px;font-size:.9em; line-height:1.4em}
#callouts .callout .image {float:right;width:103px;}

#callouts a.btn {position: absolute; bottom: 20px; left:30px;}

#callouts #int-property p.copy {width:145px; float:left;font-size:1em; line-height: 1.4em}

#heritage {clear:both;width:600px;margin:0 28px 30px 0;float:right}
	.ie6 #heritage {margin: 0 14px 30px 0;}
#heritage .inner {float:left;}
#heritage h3 {background:url(../images/hdr-heritage.png) top left no-repeat; width:325px; height:44px;margin:0 0 25px;}
#heritage p {width: 350px;}
#heritage img {float:right;}


/* ---- SEARCH PAGE */

#search {margin:0 10px;background:url(../images/bg-search.gif) top center repeat-y;}
#search h2 {height:13px;margin:0 0 12px;}
#search p {font-size:1.1em;}

#search #facets {background-color: #f3f4f4;width:415px; border-right:1px solid #d8dada; float:left; padding:18px;}
#search #facets h2 {background:url(../images/hdr-search-residential-lettings.png) top left no-repeat; /*width:189px;*/}
#search #facets h2.sales {background:url(../images/hdr-search-residential-sale.png) top left no-repeat; /*width:189px;*/}
#search #facets h2.international {background:url(../images/hdr-search-int-property.png) top left no-repeat; /*width:189px;*/}

#search #featured-property {background-color: #e2e4e4; float: right;width:488px;padding:18px;}
	.ie6 #search #featured-property, .ie7 #search #featured-property, .ie8 #search #featured-property {padding: 18px 18px 0}
#search .photo { padding: 0 !important; float: left !important }	
#search #featured-property h2 {background:url(../images/hdr-search-property-of-the-week.png) top left no-repeat; width:197px;margin:0 0 20px;}
#search #featured-property .inner {width:250px; float:left;}
#search #featured-property .address {font-size:1.2em; margin:0 0 4px; line-height:1em}
#search #featured-property .potw {float:right;}

#search fieldset {clear:both;margin:0 0 15px;}
#search fieldset.last {margin:0}
#search fieldset legend {color:#558dc3;font-size:1.1em;margin:0 0 5px;}
	.ie6 #search fieldset legend, .ie7 #search fieldset legend, .ie8 #search fieldset legend {margin:0 0 5px -7px;}
#search fieldset ol {}
#search fieldset li {width: 150px; float: left;}
#search fieldset li label {text-transform:uppercase;font-size:.8em;display:block;margin:0 0 4px;}
#search fieldset li select {width: 140px;}
#search fieldset li.submit {width:100px;padding: 15px 0 0;}


#results {margin-top:10px; position: relative;}
#results h3 {color:#003366; font-size:1.6em;border-bottom: 1px solid #e4e5e5; padding:0 0 8px;margin:0 0 15px;background: url(../images/hdr-search-results.png) top left no-repeat; height:14px;}
#results p.actions {position:absolute;top:-2px;right:0;margin:0;}
#results ul#paging {position:absolute; top:1px; right:0;line-height:20px;}
#results ul#paging li {float:left;margin:0 0 0 2px;}
#results ul#paging li.copy {text-transform:uppercase;margin:0 15px 0 0;}
#results ul#paging li.copy span {text-transform:lowercase;}
#results ul#paging li a {padding: 2px 5px;color:#8e8f90}
#results ul#paging li a:hover, 
#results ul#paging li a.active {background-color:#8e8f90;color:#fff;text-decoration:none;}

#results ul.searchResults {margin:0 0 40px}
#results ul.searchResults li.clearfix {border-bottom:1px solid #e4e5e5; padding:0 0 30px; margin:0 0 20px;position:relative;}

#results #resultsDiv h3 strong {float:right;}

body.result #resultsDiv h3 {margin:0 0 15px 180px;padding:0;}
body.detail #detailsDiv h3 {margin:0 0 15px 0; }
body.result #resultsDiv h3,
body.detail #detailsDiv h3 {font-size:1.5em; font-weight:normal; color:#003366; text-transform:uppercase;background:none;border:none;}

#results ul.searchResults li.clearfix a.thumbnail {float:left;margin:0 0 10px;display:block;border:none;}
#results ul.searchResults li.clearfix .inner {margin:0 140px 0 0;color:#9d9ea0;width:615px; float:right;}
	.ie6 #results ul.searchResults li.clearfix .inner {margin: 0 70px 0 0;}
	
#results ul.searchResults li.clearfix h4 {color:#9D9EA0; line-height:1.3em;margin: -10px 0 10px 40px;float:right;font-size:1.1em}
#results ul.searchResults li.clearfix p {color:#9D9EA0; line-height:1.3em;margin: 0 0 3px 180px}
#results ul.searchResults li.clearfix ul.roomList {color:#9D9EA0;margin:0 0 0 180px; float:none; /* !NOTE to resolve line jump bug */}
#results ul.searchResults li.clearfix ul.roomList li {float:left;margin:0 10px 4px 0;list-style:none;}
#results ul.searchResults li.clearfix ul.roomList li.rental {float:none; clear:both;}
#results ul.searchResults li.clearfix p.detailsLink {position:absolute; left:0; bottom: 10px;margin:0;}


/* ---- SEARCH DETAIL PAGE */

body.detail #detailsDiv {position:relative;}
body.detail #detailsDiv .optionButtons {position:absolute;top:0; right:0;}
body.detail #detailsDiv .optionButtons li {float:left;font-size:1.4em;text-transform:uppercase;font-weight:100;line-height:1.1em;}
body.detail #detailsDiv .optionButtons li.first {border:none}
body.detail #detailsDiv .optionButtons li a {color:#99999d;margin:0 0 0 10px; padding:0 0 0 10px; border-left:1px solid #99999d;}
body.detail #detailsDiv .optionButtons li a.printButton {border:none;}
body.detail #detailsDiv div.lightbox {float:left; margin:0 25px 25px 0;}
body.detail #detailsDiv #images #image {margin:0 0 15px;width:541px;height:361px}
body.detail #detailsDiv #images ul {}
body.detail #detailsDiv #images ul li {float:left;margin:0 10px 0 0;}
body.detail #detailsDiv #images ul li img {width:115px;height:77px; cursor:pointer;}
body.detail #detailsDiv ul {margin:0 0 15px;}
body.detail #detailsDiv p,
body.detail #detailsDiv li {font-size:1.2em;line-height:1.3em}
body.detail #detailsDiv p {font-weight:bold;margin:0 0 25px;}
body.detail #detailsDiv h4.price {color:#003366;margin:0 0 10px;font-size:1.8em;font-weight:100;}
body.detail #detailsDiv h4.price strong {color:#757575;font-size:.6em}
body.detail #detailsDiv h4 {font-size:1.3em;line-height:1.3em;margin:0 0 4px;}
body.detail #detailsDiv .thumbnailGallery {float:left; width:100%;}
body.detail #detailsDiv .thumbnailGallery .thumbnail {border:none;margin:0 5px 5px 0;display:block;float:left;}


/* ---- SERVICES PAGE */

#services #sidenav {width:220px;margin: 0 45px 20px 18px;float:left;}
#services #sidenav li {margin:0 0 10px;font-size:1.7em; text-transform:uppercase;line-height:1em}
#services #sidenav li.title {padding: 10px; text-indent:-9999em;background: url(../images/hdr-services.png) 10px center  no-repeat;}
#services #sidenav li a {padding: 10px;background-color:#e5e5e6;color:#848688;display:block;}
#services #sidenav li a:hover,
#services #sidenav li a.active {text-decoration:none;background-color:#d3d3d4;}
#services #content {margin: 0 0 75px 283px}
#services #content h1 {background:url(../images/hdr-services-h1.png) top left no-repeat; width:387px; height:116px;margin:0 0 20px;}
#services #content h2 {background: url(../images/hdr-services-h2.png) top left no-repeat; width:569px; height:83px;margin:0 0 28px;}
#services #content p.strap {background: url(../images/hdr-services-strap.png) top left no-repeat; width:549px; height:79px;}

#content p {font-size:1.3em}
#content p.em {color:#333;}
#content ul {margin:0 10px 15px;}
#content ul li {font-size:1.2em; list-style: inside disc;margin:0 0 5px}


/* ---- PROPERTY OF THE WEEK */

#potw #content {color:#8e8f90;}
#potw #content h1 {background:url(../images/hdr-potw.png) top left no-repeat; width:351px; height:22px;margin:0 0 35px;}
#property .image {float:left;margin:0 20px 0 0;}
#property .copy {background-color: #f3f4f4;  padding:5px 20px 0;margin:0 0 0 625px;min-height:379px;height:auto !important;height:379px;}
#property .copy h3 {font-size:1.2em;margin:0 0 12px;padding:15px 0 0;}
#property .copy ul {margin:0 0 15px 15px;}
#property .copy ul li {margin:0 0 2px;list-style: outside disc}

#potw #copy {clear:left;padding: 25px 0;position:relative;}
#potw #copy h2 {font-size:1.6em;text-transform:uppercase;font-weight:100;margin:0 0 35px;}
#potw #copy ul.images {position:absolute;right:335px;top:21px;}
#potw #copy ul.images li {float:left;font-size:1.6em;text-transform:uppercase;font-weight:100;line-height:1.5em;list-style: none;}
#potw #copy ul.images li a {color:#8e8f90;margin:0 0 0 5px; padding:2px 6px;}
#potw #copy ul.images li a.active, #potw #copy ul.images li a:hover {background-color:#8e8f90;color:#fff;text-decoration:none}
#potw #copy p {font-size:1.4em;line-height:1.3em;max-width:605px;width: auto !important;width:605px;}



/* ---- CONTACT PAGE */

#contact #content {margin: 0 28px}
#contact #content h1 {background:url(../images/hdr-contact-h1.png) top left no-repeat; width:373px; height:28px;margin:0 0 25px;}
#contact #content strong {color:#083759;font-weight:bold}
#contact #content p.em {float:left;}
#contact #content iframe {float:right;width:600px;height:300px;border:1px dotted #666;margin:0 0 40px; }



/*//////////////////////////

		CLASSES

/////////////////////////*/

.cboth {clear:both;}
.hide {display: none;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block !important;}
/* End hide from IE-mac */