﻿
/*////////// Commercial Department Styles //////////*/

#commercialsearch{padding: 0; height: 1%; /*ie scrollbar*/overflow: hidden;/*end*/}
#commercialsearch:after{content: "."; clear: both; display: block; height: 0; visibility: hidden;}
#commercialsearch h4{background: #7FA3BB; color: #fff; font-weight: bold; font-size: 120%; padding: 10px 10px; margin: 0 0 10px 0;}
#commercialsearch div.lnk{width: 137px; display: block; float: left; background: #ECF1F4; border: 1px solid #DEE8EA; margin: 0 0 0 5px; text-decoration: none !important; padding: 10px 8px 5px 8px; line-height: 25px;}
#commercialsearch div.lnk a.lnkimg{background:url(/images/commercial/logo-mask.gif) no-repeat 0px 4px #294f42; float: left; border: 1px solid #fff;}
#commercialsearch div.lnk a.lnkimg img{width: 135px; height: 62px; float: left;}
#commercialsearch div.lnk a.lnkimg:hover img{opacity: 0.4; filter: alpha(opacity=40);}
#commercialsearch div.lnk a.lnk{float:left; color:#5F8E96; font-weight:bold; background:transparent url(/images/homenav/block-commercial.gif) no-repeat scroll left center; padding-left:15px; text-decoration: none;}
#commercialsearch div.lnk a.lnk:hover{color: #385061;}
#commercialsearch div.on{background: #E0E8EA; border: 1px #7FA3BB solid;}
#commercialsearch div.on a.lnk{color: #385061;}
#commercialsearch div.on a.lnkimg{background: none;}
#commercialsearch div.on a.lnkimg:hover img{opacity:1; filter:alpha(opacity=100);}
#commercialsearch strong {font-size:120%; color:#555; float:left;}

.commMapSearch{background: #E0E8EA; border: 1px solid #7FA3BB; height: 1%;}
.commMapSearch:after{content: "."; clear: both; display: block; height: 0; visibility: hidden;}
.commMapSearch h4{background: #7FA3BB; color: #fff; font-weight: bold; font-size: 120%; padding: 10px 10px; margin: 0 0 15px 0;}
.commMapSearch .map{width: 320px; height: 123px; margin: 0 auto; border: 1px #aaa solid;}
.commMapSearch .map a{float: left; width: 320px; height: 123px; background: url(/images/cheff-map.jpg) no-repeat 0px -24px;}
.commMapSearch p{width: 320px; margin: 10px auto 15px auto;}

form#commercialsearch{float: left; width: 200px; margin: -5px 0px 0px 47px; border: none; text-align: right;}
form#commercialsearch select{width: 200px;}
form#commercialsearch input#submit{float: right; margin-right: 0;}

.switchbuttons{float: right; margin: 0 20px 10px 0; font-size: 120%; font-style: italic;}

.clusterholder{float: left;}
.clusterholder b.hdr{font-size: 110%; color: #EC6B26;}
.clusterholder ul, .clusterholder li{float: left; list-style: none; margin: 0;}
.markerholder, .markerholderOn{float: left; display: none; border: solid 1px #ABABAB; border-top: solid 0px #fff; padding: 6px 8px;}
.markerholderOn{display: block;}

ul.tab{width: 293px; background: url('/images_mapping/gray_base.gif') repeat-x left bottom; margin-top: 5px;}
ul.tab li a{display: block; background-color: #fff; border-top: solid 1px #ABABAB; border-left: solid 1px #ABABAB; border-right: solid 1px #ABABAB; padding: 2px 6px; float: left; margin: 3px 2px 0 0; background: url('/images_mapping/tab_bg.gif') repeat-x left bottom; text-decoration: none !important;}
ul.tab li a:hover{text-decoration: underline !important; margin: 1px 2px 0 0; padding: 4px 6px 2px 6px;}
ul.tab li a.on{background-image: none; background-color: #fff;}

.markerholder a:hover, .markerholderOn a:hover{text-decoration: none !important;}

body#commercial h4.collapse-trigger{height: 14px; cursor: pointer;}
/*bit messy because ie6 won't recognise transparent border color*/
body#commercial #landprop .pagelinks a{border: 1px #fff solid; text-decoration: none;}
body#commercial #landprop .pagelinks a:hover{border: 1px #94b2c6 solid;}
body#commercial #landprop .pagelinks a.on{background: #94b2c6; border: 1px #94b2c6 solid;}
/*end*/
body#commercial #landprop .pageleft{margin: 15px 0 0 0;}
body#commercial #landprop ul li{position: relative; width: 282px; vertical-align: top; margin: 0 10px 20px 10px; padding: 7px 7px 30px 7px; background: url(/images/commercial/bg-listing.gif) repeat-x 0 0 #e7e7e7; border: 1px #7FA3BB solid; display: -moz-inline-stack; display: inline-block; *display: inline; zoom: 1;-moz-border-radius: 5px; -webkit-border-radius: 5px;}
body#commercial #landprop ul li h2{width: 272px; margin: 0 0 10px 0; background: #7FA3BB; padding: 5px; -moz-border-radius: 5px 5px 0 0; /*to hide second line*/height: 15px; line-height: 18px; overflow: hidden;/*end*/}
body#commercial #landprop ul li h2 a{color: #fff; text-decoration: none;}
body#commercial #landprop ul li h2 a:hover{color: #eee;}
body#commercial #landprop ul li h5{margin: 10px 0; font-size: 110%;}
body#commercial #landprop ul li .propertyHolder{overflow:auto;height:250px;position:relative;}
body#commercial #landprop ul li .propertyHolder ul li{height:auto;clear:both;margin:0;float:left;padding:5px 5px 5px 25px;width:235px;background:transparent url(/images/homenav/block-commercial.gif) no-repeat scroll left 8px;border:none;}
body#commercial #landprop ul li .img{float: left; margin: 0 10px 5px 0;width:126px;text-align:center;}
body#commercial #landprop ul li .img b{font-size:110%;color:#DC001A;}
body#commercial #landprop ul li .img a:hover img{border: 1px #ccc solid; background: #ddd;}
body#commercial #landprop ul li .submitbutton{float: left; margin: 0px 0 0 0;}
body#commercial #landprop ul li a.control{padding: 0 0 2px 19px; background: url(/images/commercial/expand.gif) no-repeat 0 0; font-size: 90%; cursor: pointer;}
body#commercial #landprop ul li a.collapse{background-image: url(/images/commercial/collapse.gif);}
body#commercial #landprop ul li .extra{display: none; _float: left;}
body#commercial #landprop ul li .extra:after{content: "."; clear: both; display: block; height: 0; visibility: hidden;}
body#commercial #landprop ul li .tools{position: absolute; display: block; width: 276px; height: 20px; padding: 0 10px; left: 0; bottom: 0; top: auto; right: auto; text-align: right; line-height: 20px; background: #a7c5da; font-size: 95%; border-top: 2px #94b2c6 solid;}
body#commercial #landprop ul li .tools a{color: #fff;}

#com_holder{float: left; background: #E0E8EA; padding: 10px; height: 1%;}
#com_holder:after{content: "."; clear: both; display: block; height: 0; visibility: hidden;}
#com_holder #com_prop_search, #com_holder #com_prop_down{width: 240px; float: left;} 
#com_holder #com_prop_search a.btnNew, #com_holder #com_prop_down a.btnNew{background: transparent url(/images/commercial/btn_new_small.jpg) no-repeat; float: left; width: 184px; height: 37px; display: block; text-decoration: none !important; margin-left: -4px; font-size: 120%; color: #DEDEDE; font-weight: bold; padding-top: 20px; padding-left: 18px;}
#com_holder #com_prop_req{width: 240px; float: left; margin-left: 10px;} 
#com_holder #com_prop_req a.btnNew{background: transparent url(/images/commercial/btn_new.jpg) no-repeat; float: left; width: 204px; height: 37px; display: block; text-decoration: none !important; margin-left: -4px; font-size: 120%; color: #DEDEDE; font-weight: bold; padding-top: 20px; padding-left: 18px;}
#com_holder a.btnNew:hover{color: #FFF !important;}
#com_holder h2{border: 0; margin-top: 0px !important;}

.comm-btn-holder{float: right; width: 50%; background: #e0e8ea; padding: 10px; margin: 15px 0 0 0;}
a.comm-search-btn{float: left; background: transparent url(/images/commercial/btn_new_small.jpg) no-repeat; width: 135px; height: 37px; display: block; text-decoration: none !important; font-size: 120%; color: #DEDEDE; font-weight: bold; padding: 20px 0 0 18px;}
a.register-btn{float: right; background-image: url(/images/commercial/btn_new.jpg); width: 185px; color: #DEDEDE; font-weight: bold;}
a.comm-search-btn:hover{color: #FFF !important;}

ul.comm-images{margin: 15px 0 0 0;}
ul.comm-images li{display: inline; margin: 0 11px; list-style: none;float:left;}
ul.comm-images li img{padding: 2px; border: 1px #ccc solid;}

#comm_prop .dets{float: left; width: 420px;}
#comm_prop .img{float: right; width: 506px; margin: 0 0 0 20px;}
#comm_prop .img img{padding: 2px; border: 1px #ccc solid;}

form#requirements label{width: 120px;}
form#requirements input{width: 270px;}
form#requirements input.checkbox{width: auto; margin: 5px 10px 0 0; border: 0;}
form#requirements span.checkLabel{float: left; margin: 5px 0 0 0;}
form#requirements textarea{width: 350px; height: 150px; margin: 5px 0 10px 0;}
form#requirements input.submitbutton{width: auto;}

