/* ---------- table of contents ---------- */
/*

wrappers

columns

templates
	240
	480
	720

typography

common

forms
	
masthead

header

left column
	240 pieces

middle column
	480 pieces
	available properties
	stepcarousel
	stepcarousel's arrows
	temp

right column
	log in

rollovers
	tabs
	recent listings

footer

ie hacks

*/


/* ---------- notes ---------- */
/*

brown header colour: 623405
orange link rollover: FF6600
dark blue link colour: 336699
medium blue (for buttons): 336699
light blue (for spacers): dedede
grey for text: 666666

*/


/* --------------------------------------------------------------------------------------------------------------- */

.xrow:hover{
	background: #999999;
}

#directions div{
	font-size: 10px;
}

#directions img {
	display: none;
}


input , textarea , select  {
	border: 1px solid #999999;
}

#obiekt_form .long {
	width: 400px;
}
#obiekt_form .medium {
	width: 200px;
}

.buttons {
	background: #e2e6e9;
	color: #336699;
	border: 1px solid #88adc8;
	font-size: 11px;
	font-weight: bolder;
	padding: 5px 20px;
}
.buttons:hover{
	background: #336699;
	color: #ffffff;
}

.button {
	border: 0;
}


li.checked {
	list-style-image: url( /images/icons/icons-check.gif );
	color: #bfccbe;
}


/* ---------- wrappers ---------- */


body { background:url(../images/pageBg.png) repeat-x top #333333; margin:0; }

div.overallWrapper { text-align:center; width:966px; margin:auto auto; min-height:400px; }
div.leftColumn, div.bodyWrapper, div.rightColumn { text-align:left; }

div.outerBodyWrapper { background:url(../images/outerBodyWrapperBg.png) repeat-y;  }
#homepage div.outerBodyWrapper { background:url(../images/outerBodyWrapperBgHome.png) repeat-y; }
div.bodyWrapper { clear:both; background:url(../images/bodyWrapperBg.png) no-repeat; padding:2px 7px 0 7px; }
div.outerBodyWrapperBottom { background:url(../images/outerBodyWrapperBottomBg.png) no-repeat; height:8px; }


img { border: 0; }



/* ---------- columns ---------- */


.leftColumn { width:232px; float:left; background:none; }
.middleColumnTop { width:488px; float:left; }
.rightColumn { float:left; width:232px; padding-top:0; background:none; border-bottom:none; }
.middleColumnBottom { width:720px; float:left; } /* this is below rightColumn in the HTML */

.doubleWideColumn { width:720px; float:left; }




/* ---------- templates ---------- */


/* 240 px pieces */
.top240, .bottom240 { width:232px; height:4px; }
.middle240 { width:208px; } /* the padding below makes this one total 232px */
.top240 { background:url(../images/top240.png) no-repeat; }
.bottom240 { background:url(../images/bottom240.png) no-repeat; }
.middle240 { background:url(../images/middle240.png) repeat-y; padding:0px 12px 8px 12px; }
.middle240 .hr { line-height:0; font-size:0; height:1px; clear:both;  }


/* 480 px pieces */
.top480, .bottom480 { width:488px; height:4px; }
.middle480 { width:480px; } /* the padding below makes this one total 488px */
.top480 { background:url(../images/top480.png) no-repeat; }
.bottom480 { background:url(../images/bottom480.png) no-repeat; }
.middle480 { background:url(../images/middle480.png) repeat-y; padding:0px 12px 12px 12px; width:464px; }


/* 720 pieces */
.top720, .bottom720 { width:720px; height:4px; }
.middle720 { width:712px; } /* the padding below makes this one total 720px */
.top720 { background:url(../images/top720.png) no-repeat; }
.bottom720 { background:url(../images/bottom720.png) no-repeat; }
.middle720 { background:url(../images/middle720.png) repeat-y; padding:0px 4px 0 4px; } /* has just 4px left/right padding b/c padding is below in middle720column */


/* these are the 4 cols that make up 'Full Serve | Reference System | $2500 Rental ...' */
.middle720column { float:left; width:146px; margin:0 0 10px 0; padding:6px 14px 8px 12px; text-align:center; border: #FFFFFF solid 1px; } /* there's more right padding than left so spacing is even despite 2px border-right */
.middle720columnDivider { float:left; width:1px; margin:0 0 10px 0; padding:6px 0 6px 0; background:#dedede; height:131px; }
.middle720column img { margin:10px 0 10px 0; } /* there's an ie hack for this */
.fullServiceSection .middle720column:hover { color:#FF6600; cursor:pointer; border: #dedede solid 1px; }

.middle952 {
	float:left;width:932px; margin-left:-4px; padding:6px 14px 8px 12px; text-align:center; border: #FFFFFF solid 1px; background-color:#fff; }


/* for the 4 icons */
.icon { width:60px; height:55px; margin:10px auto; display:block; }
.pad { background:url(../images/icons/pad.png) no-repeat; }
.check { background:url(../images/icons/check.png) no-repeat; }
.lock { background:url(../images/icons/lock.png) no-repeat; }
.world { background:url(../images/icons/world.png) no-repeat; }
/* ie 6 hack */
* html .pad { background:url(../images/icons/pad-whiteBg.png) no-repeat; }
* html .check { background:url(../images/icons/check-whiteBg.png) no-repeat; }
* html .lock { background:url(../images/icons/lock-whiteBg.png) no-repeat; }
* html .world { background:url(../images/icons/world-whiteBg.png) no-repeat; }





.middle720 .first { margin-left:9px; }

.temp { background:url(../images/temp.jpg) no-repeat; width:720px; height:340px; }




/* ---------- typography ---------- */


/* general rules*/
body, input, textarea, select, .notetextarea, .pagination a, #directions div { font-family:Tahoma, Arial, sans-serif; }
input, textarea, select { font-size:12px; color:#666666; }
p, h2, h4, ul, ol, li { margin:0; padding:0; }


/* 11px paragraph font */
.featuredProperty a, .recentListings p, .searchTextInput, .logInTextInput { font-size:11px; }
.notetextarea { font-size:11px; }


/* 12px paragraph font */
p, td, li, form, .middle480 a, .rightColumn, select { font-size:12px; }
p, td, li, form { color:#666666; line-height:1.4em; } /* line-height just to make safari pc behave -- it changes nothing on the other browsers */
.middle480 p, .middle480 ul, .middle480 ol, .middle716 p, .middle716 ul, .middle716 ol { padding-bottom:11px; }
.propertyDetails .middle240 p { padding-bottom:6px; }


/* 12px header font */
h1 { font-size:14px; font-weight:bold;  }
h2, h4, .mastheadTopRight, .mastheadBottomRight { font-size:12px; font-weight:normal;  }
.mastheadTopRight, .mastheadBottomRight { font-size:12px; font-weight:normal;  }
h1, h2, h3, h4 { color:#666666;  }
h1, h2 { font-size:17px; margin:0 0 6px 0; padding:0 0 4px 0; line-height:18px; border-bottom:solid 1px #666666; display:block; width:100%; font-family:Tahoma, Arial, sans-serif;  } /* come back to this ... looks better w/ line-height of 1em or 14px, but poorly cross-browsers */
.recentListingMenuChild h4 { text-transform:uppercase; }
.middle480 h2 { margin:0 0 11px 0; }
.middle720 h2 { margin:0 8px 6px 8px; }


/* lists */
ul, ol { margin-left:30px; }


/* special pieces */
.top { text-align:center; padding-top:8px; }



/* ---------- links ---------- */


a { color:#336699; text-decoration:none; outline:none; } /* outline:none removes dotted lines around clicked links in ffox */
a:hover { text-decoration:underline; color:#660000; }
a:focus { -moz-outline-style: none; } /* remove dotted line around clicked links in ffox */
.mastheadTopRight a { color:#555555; }
.mastheadTopRight a:hover { color:white; }
.smallLink { margin-top:6px; } /* these are the "Advanced Search >>" style links*/
.rightAligned { text-align:right; }




/* ---------- common ---------- */


.clear { clear:both; height:0; line-height:0; font-size:0; }

img.left { float:left; margin:0 14px 14px 0; }
img.right { float:right; margin:0 0 14px 14px; }


/* ---------- forms ---------- */


form { margin:0; }
.logInForm {  } /* there's a hack for this */


/* log in sticky */
.stickyChild .logInForm { margin-bottom:-3px; }


/* form text inputs */
.searchTextInput, .logInTextInput { color:#666666;  width:166px; height:18px; margin:0 5px 0 0; padding:6px 2px 1px 4px; vertical-align:top; border:solid 1px #88adc8; } /* this is ie hacked below */
.searchTextInput { display:block; float:left; width:169px; margin:0; height:19px; border:solid 1px #999999; }
.logInTextInput { width:74px; height:14px; margin-right:4px; padding:3px 2px 2px 4px; }
.notetextarea { color:#666666; border:solid 1px #88adc8; } /* this is ie hacked below */
.notebutton { color:#666666; border:solid 1px #88adc8; } /* this is ie hacked below */

/* Have A Question? form */
.contactUsForm { margin-top:6px; }
.contactUsForm input, .contactUsForm textarea { width:202px; padding:2px; margin-bottom:2px; }


/* form dropdowns */
.searchByCriteriaLeft { float:left; width:178px; }
.searchByCriteriaLeft select, .quickSearch select { width:86px; height:22px; color:#666666; padding:2px 1px 1px 1px; margin:0 0 4px 0; /*padding:2px 2px 1px 2px; */ }
.quickSearch select { width:208px; }


.propertyDetailBox { padding-left: 3px; float: left; width: 160px; }

.error { color:red; display:none; }

#messageHolder { padding-top:0; }


/* ---------- kamil forms ---------- */

/* td.formhead { background:#ededed; padding:8px 8px 8px 8px; } */
td.formhead { padding:0px 8px 2px 0px; color:#623405; text-transform:uppercase; }
td.formheadsub { padding:12px 8px 12px 8px; color:#666666; background-color:#dddddd; font-weight:bold; }
.formlines { padding:4px 8px 4px 8px; background-color:#ededed; }

/* ----------- brad -----------*/

td.inboxbody { padding:4px 8px 4px 8px; border-bottom:solid 1px #88adc8; border-top:solid 1px #88adc8; }



/* ---------- masthead ---------- */


div.masthead { background:url(../images/mastheadBg.png) no-repeat; height:114px; }

.mastheadLeft { width:273px; height:114px; float:left; margin-right:10px; text-align:left; }
.mastheadLeft a { display:block; width:234px; height:101px; margin-left:10px; } /* the home link */
.mastheadRight { width:628px; height:114px; float:left; }


.mastheadTopRight { width:628px; height:23px; padding-top:4px; } /* there's a hack for this */

/* these three rules fix problem of skype adding width to phone number and pushing it below its box */
.mastheadTopRight a { display:block; float:left; margin-right:29px; } 
.mastheadTopRight a.first  { margin-left:26px; } /* there's a hack for this */
.mastheadTopRight a.last  { margin-right:0; }
.mastheadTopRight a.skype { width:94px; }
/* end three skype rules */

.mastheadMiddleRight { height:34px; }
.mastheadMiddleRight .stickyChild { height:22px; height:32px; padding:0 0 0 26px;  border:solid 1px #84aac6; border-top:none; text-align:left; z-index:5; position:relative; }
.mastheadMiddleRight .stickyChild a { color:white; /*border-bottom:dotted 1px white;*/ }
.mastheadMiddleRight .stickyChild a:hover { color:white; }
.mastheadMiddleRight .stickyChild .logInForm { margin:0; }

.mastheadBottomRight { width:628px; height:41px; margin:11px 0 0 0; padding-top:0px; }

a.tab, a.tabOn { width:88px; height:33px; margin:4px 1px 0 1px; padding-top:4px; float:left;  border-bottom:none; color:#666666; }
a.tab:hover, a.tabOn { height:37px; margin-top:0; color:#666666; background-color:#ffffff; text-decoration:none; border-bottom:none; font-weight:bold; } /* the background colour change here is only for the tabs with no rollovers; the tabs w/ rollovers change colour via the at_show and at_hide js funcions */

a.lastTab { margin-right:0; }



/* ---------- rollovers ---------- */


/* tabs */
.tabMenuChild, .recentListingMenuChild { visibility:hidden; position:absolute; border:solid #666666 1px; width:200px; margin-top:-13px; margin-left:-1px; text-align:left; }
.tabMenuChild { padding:10px 0 10px 0; background:url(../images/tabMenuChildBg.png) top repeat-x #e2e2e2; border-top:0; }
.tabMenuChild h4 { margin:8px 8px 6px 8px; border-bottom:solid 1px #666666; }
.tabMenuChild p { line-height:18px; padding:1px 8px 1px 8px; }
.tabMenuChild a { display:block; }
.tabMenuChild a:hover { background-color:none; }


/* recent listings */
.recentListingMenuParent, .recentListingMenuParentOn { float:left; padding:4px 0 4px 0; border:solid 1px white; border-left:none; border-right:none; }
.recentListingMenuParentOn { border:solid 1px #e2e2e2; border-left:none; border-right:none; background:#e2e2e2; }
.recentListingMenuParent p, .recentListingMenuParentOn p { width:100px; }
.recentListingMenuChild { width:580px; margin-left:208px; border:solid #e2e2e2 1px; padding:8px 8px 8px 10px; background:#e2e2e2; z-index:2; } /* make margin-top  -190ish to center vertically; z-index is so these show above the stepcarousel images */
#recentListingMenuChild1 { margin-top:-92px; }
#recentListingMenuChild2 { margin-top:-137px; } 
#recentListingMenuChild3 { margin-top:-178px; } 
#recentListingMenuChild4 { margin-top:-219px; }
#recentListingMenuChild5 { margin-top:-260px; }

.recentListingMenuChild img { float:left; margin:0; }
.recentListingMenuChild p, .recentListingMenuChild h2 { float:left; margin-left:8px; width:270px; }
.recentListingMenuChild h4 { margin-top:2px; }




/* ---------- recent listings ---------- */


.recentListings img { float:left; margin:0 8px 0px 0; }
.recentListings p { float:left; }




/* ---------- available properties ---------- */


/* available properties */
/* this is like a 480, but is a fixed height with one big background image w/ a gradient */
.availableProperties, .availableSurroundings { background:url(../images/availablePropertiesBg.png) no-repeat; width:464px; height:362px; padding:4px 12px 12px 12px; } /* this one needs 12px padding b/c it's a bigger bg image by 4px */
.photoGallery, .photoGallery2 { background:url(../images/photoGalleryBg.png) no-repeat; height:450px; }

.availableProperty { height:252px; width:464px; top:0; left:0; cursor:pointer; display:none; background-attachment:fixed; }
.photoGallery .availableProperty { height:348px; }

.availableSurrounding { height:252px; width:464px; top:0; left:0; cursor:pointer; display:none; background-attachment:fixed; }
.photoGallery2 .availableSurrounding { height:348px; }


#availableProperty1, #countryName1 { display:block; } /* shows first thumb and countryName */
#availableSurrounding1, #countryNameArea1 { display:block; } /* shows first thumb and countryName */
#availablePropertyImg1 { border-top:solid 2px #336699; border-bottom:solid 2px #336699; margin-top:2px; margin-bottom:-20px; } /* this all disappears if they hover over any other stepcarousel thumb */
#availableSurroundingImg1 { border-top:solid 2px #336699; border-bottom:solid 2px #336699; margin-top:2px; margin-bottom:-20px; } /* this all disappears if they hover over any other stepcarousel thumb */

.availablePropertyText { background:url(../images/blueSemiTransparent.png) bottom repeat-x; height:20px; padding-top:2px; margin-bottom:0; }
.availablePropertyText p { color:white; text-align:center; padding-top:2px; }


/* on the details page (property.tpl) */
.resultsPage { float:left; }
.resultsPage .middleColumnTop, .resultsPage .rightColumn { margin-top:8px; }
.resultsPage .middleColumnTop { border-right:solid 1px white; width:480px; } /* take away 1 extra b/c the border adds 1 */
.resultsPage .rightColumn { border:solid 0px blue; width:220px; } /* make change to middle240 below if you change width here */

.resultsPage .propertyOverview { padding:0px 8px 12px 8px; border:solid 0px red; }
.resultsPage .quickLinks { padding:10px; border:solid 1px #DEDEDE; background:#f5f5f5; border-left:none; border-right:none; }
.resultsPage .quickLinks p { color:#cccccc; }

.resultsPage .availableProperty { cursor:default; }

.resultsPage h2 {  margin:0 0 6px 0; /*font-size:18px; text-transform:lowercase;*/ }

.resultsPage .photoGallery, .resultsPage .middle480, .resultsPage .middle240 { background:white; padding:12px 0px 12px 0px; margin:0px 8px 0px 8px; border-right:solid 0px #DEDEDE; border-bottom:none; }
.resultsPage .middle240 { width:215px; } 
.resultsPage .middle480 { width:463px; } 

.resultsPage .photoGallery, .resultsPage .locationAndDetails { padding-top:0; }
.resultsPage .photoGallery2 { padding-top:8px; }

.resultsPage #fullDescription { display:none; }

.resultsPage .detailsTable td { padding:2px 0; }


h2.propertyName { font-size:20px; display:block; width:496px; float:left; border-bottom:none; margin-bottom:0; }
h2.propertyPrice { display:block; width:200px; float:left; text-align:right; border-bottom:none; margin-bottom:0; }
div.belowNameAndPrice { height:10px; border-top:solid 1px #666666; }


/* end on the details page (property.tpl) */


/* ---------- stepcarousel ---------- */


.stepcarouselWrapper{ float:left; margin-top:14px; } /* there's an ie hack for this */

.stepcarousel, stepcarousel2{ position: relative; overflow: scroll; width: 399px; height: 80px; float: left; } /*leave position and overflow alone; width should be width of carousel viewer itself; height should be enough to fit content's height */

.resultsPage .stepcarousel, .resultsPage .stepcarousel2 { height:70px; } 

.stepcarousel .belt, .belt2{ position: absolute; left: 0; top: 0; } /*leave position alone*/

.stepcarousel .panel,.panel2{ float: left; overflow: hidden; margin: 0px; width:56px; height:72px; padding: 0 1px 0 0; text-align:center; } /* leave float alone; overflow clips content that go outside dimensions of holding panel DIV; margin is the margin around each panel; width is the of each panel holding each content. If removed, widths should be individually defined on each content DIV */

.stepcarousel .panel a img { margin:4px 1px; border:none; padding:2px 0; } /* when rolled the margin disappears to make room for the top border */
.stepcarousel .panel a { width:56px; height:58px; color:white; display:block; }
.countryName { display:none; color:#336699; margin-top:0; padding-top:0; }


/* stepcarousel's arrows */
a#arrowLeft, a#arrowRight, a#arrowRightLight { float:left; height:46px; margin:6px 0; }
a#arrowLeft { background:url(../images/arrowLeftDark.png) no-repeat; width:32px; margin-right:0px; }
a#arrowLeft:hover { background:url(../images/arrowLeftDarkO.png) no-repeat; /*border-top:solid 2px #336699; border-bottom:solid 2px #336699;*/ }
a#arrowRight { background:url(../images/arrowRightDark.png) no-repeat; width:32px; margin-left:1px; } /* arrowRight is 1px wider to make up for uneven number here; 1px left margin */
a#arrowRight:hover { background:url(../images/arrowRightDarkO.png) no-repeat; /*border-top:solid 2px #336699; border-bottom:solid 2px #336699;*/ }
a#arrowRightLight { background:url(../images/arrowRightLight.png) no-repeat; width:32px; margin-left:0px; } /* arrowRight is 1px wider to make up for uneven number here; 1px left margin */
a#arrowRightLight:hover { background:url(../images/arrowRightLightO.png) no-repeat; /*border-top:solid 2px #336699; border-bottom:solid 2px #336699;*/ }

a.arrow, a.arrowLight { padding:0; }
a.arrow img { border:0; }




/* ---------- testimonials ---------- */


.testimonials { float:left; height:154px; text-align:left; width:322px; } 





/* ---------- map ---------- */


.map { margin-top:8px; } /* there's an ie hack for this */




/* ---------- log in ---------- */


/* this is like a 240, but is a fixed height with one big background image w/ a gradient */
.logIn { background:url(../images/logInBg.png) no-repeat; width:208px; height:61px; padding:12px 12px 12px 12px; } /* this one needs 12px padding b/c it's a bigger bg image by 4px */
/* if this changes to a normal 240 box in future watch out ... ie6 will give it a margin-bottom of -9 (see hacks) */




/* ---------- footer ---------- */  

.footer { clear:both; width:952px; height:42px; background:url(../images/footerBg.png) no-repeat; margin:0 auto 0 auto; padding-top:40px; }
#homepage .footer { background:url(../images/footerBgHome.png) repeat-y;  }

.footerLeftColumn { width:590px; margin-left:175px; float:left; text-align:center; }
.footerRightColumn { float:left; width:175px; text-align:right; padding-right:8px; }


.belowFooter { margin-top:10px; }
.belowFooterColumn { float:left; width: 132px; margin:0 2px 30px 2px; }
.belowFooter .first { margin-left:5px; }
.belowFooter .last { margin-right:0; }







/* ---------- search page, OCP, pricelist table ----------*/

table.propertyResult { background-color:#efefef; padding:5px; padding-bottom:14px; }

table.priceListTable td { padding:5px; } /* pricelist on details.php*/

table.OCPpriceListTable td.formlines { padding-left:2px; padding-right:2px; } /* OCP pricelist */



/* ----------                          ----------*/
/* ---------- new CP stuff - sept 2009 ----------*/
/* ----------                          ----------*/


.cp img { /*border:solid 4px #b9c4cc; float:left;*/  }

.cp .box { float:left; width:343px; margin-right:10px; border:solid 0px red; background:#ededed; }
	.cp .boxHeader { display:block; font-size:.8em; font-weight:bold; background:#dddddd; margin:0; padding:12px 8px 12px 8px; margin-right:0; }
	.cp .boxBody { min-height:120px; padding:10px 8px; border:solid 0px blue; }
	.cp .boxBodyLeft { float:left; width:148px; }
	.cp .boxBodyRight { margin-left:158px; border:solid 0px red; /*width:182px;*/ }

.myPayments .boxBodyLeft { width:190px; margin-top:6px; padding:6px 0; border:solid 0px red; }
	.myPayments .boxBodyLeft p { padding:0; }
.myPayments .boxBodyRight { margin:6px 0 0 190px; border:solid 0px blue; }
.myPayments .clear { border-bottom:solid 1px #ffffff; height:1px; }
.cp .note { padding:8px; border:solid 0px red; }

/* buttons - general rules */
a.btn, a.btnSmall, input.inputBtn, input.btnGo, input.btnLogIn { display:block; height:28px; width:134px; }
a.btnSmall { float:left; width:65px; }
input.btnGo { float:left; width:27px; margin:0 0 0 4px; }
input.btnLogIn { height:21px; width:94px; }

	/* buttons - specific */
	a.addToFavourites { background:url(/images/buttons/addToFavourites.png) top no-repeat; }
	a.editProfile { background:url(/images/buttons/editProfile.png) top no-repeat; }
	a.view { background:url(/images/buttons/view.png) top no-repeat; }
	a.sendEnquiry { background:url(/images/buttons/sendEnquiry.png) top no-repeat; }
	a.editDetails { background:url(/images/buttons/editDetails.png) top no-repeat; }
	a.editAvailability { background:url(/images/buttons/editAvailability.png) top no-repeat; }
	a.editPhotos { background:url(/images/buttons/editPhotos.png) top no-repeat; }
	a.makePayment { background:url(/images/buttons/makePayment.png) top no-repeat; }
	a.delete { background:url(/images/buttons/delete.png) top no-repeat; }
	a.saveChanges { /*url defined inline*/ background-position:top; background-repeat:no-repeat; }
	a.contactOwner { background:url(/images/buttons/contactOwner.png) top no-repeat; }
	a.writeAReview { background:url(/images/buttons/writeAReview.png) top no-repeat; }
	a.remove { background:url(/images/buttons/remove.png) top no-repeat; }
	a.logOut { background:url(/images/buttons/logOut.png) top no-repeat; margin-bottom:8px; }
	a.searchNow { background:url(/images/buttons/searchNow.png) top no-repeat; margin-top:6px; }
	input.searchNow { background:url(/images/buttons/searchNow.png) top no-repeat; border:none; cursor:pointer; }
	input.sendEnquiry { background:url(/images/buttons/sendEnquiry.png) top no-repeat; border:none; cursor:pointer; }
	input.save { background:url(/images/buttons/save.png) top no-repeat; border:none; cursor:pointer; }
	input.saveChanges { background:url(/images/buttons/saveChanges.png) top no-repeat; border:none; cursor:pointer; }
	input.addPhoto { background:url(/images/buttons/addPhoto.png) top no-repeat; border:none; cursor:pointer; margin-top:8px; }
	input.saveNote { background:url(/images/buttons/saveNote.png) top no-repeat; border:none; cursor:pointer; margin:4px 0 4px 170px; }
	input.makePayment { background:url(/images/buttons/makePayment.png) top no-repeat; border:none; cursor:pointer; margin-bottom:4px; }
	input.saveProfile { background:url(/images/buttons/saveProfile.png) top no-repeat; border:none; cursor:pointer; margin-bottom:4px; }
	#upload, #areaupload, .suite_upload { background:url(/images/buttons/uploadPhoto.png) top no-repeat; border:none !important; cursor:pointer !important; font-weight:bold !important; height:21px; width:110px !important; color:#566d7e !important; font-size:12px !important; padding-top:7px; padding-right:24px; }

	/* buttons - specific, small */
	a.editSmall { background:url(/images/buttons/editSmall.png) top no-repeat; }
	a.notesSmall { background:url(/images/buttons/notesSmall.png) top no-repeat; }
	a.viewSmall { background:url(/images/buttons/viewSmall.png) top no-repeat; }
	input.btnGo { background:url(/images/buttons/goArrow.png) top no-repeat; border:none; cursor:pointer; margin-bottom:4px; }
	input.btnLogIn { background:url(/images/buttons/logIn.png) top no-repeat; border:none; cursor:pointer; }

	/* buttons - rollover */
	a.addToFavourites:hover,
	a.editProfile:hover,
	a.view:hover,
	a.sendEnquiry:hover,
	a.editDetails:hover,
	a.editAvailability:hover,
	a.editPhotos:hover,
	a.makePayment:hover,
	a.delete:hover,
	a.saveChanges:hover,
	a.contactOwner:hover,
	a.writeAReview:hover,
	a.remove:hover,
	a.logOut:hover,
	a.searchNow:hover,
	input.searchNow:hover,
	input.sendEnquiry:hover,
	input.save:hover,
	input.saveChanges:hover,
	input.addPhoto:hover,
	input.saveNote:hover,
	input.makePayment:hover,
	input.saveProfile:hover,
	input.btnGo:hover,
	input.btnLogIn:hover,
	a.editSmall:hover,
	a.notesSmall:hover,
	a.viewSmall:hover,
	a.btnGo
	{ background-position:bottom; }
	
	
	/* Ajax Uploader: We can't use ":hover" preudo-class because we have invisible file input above, so we have to simulate hover effect with javascript. From http://valums.com/wp-content/uploads/ajax-upload/demo-jquery.htm */
	#upload.hover, #areaupload.hover { background-position:bottom; color:white !important; }



	

/* ---------- hacks ---------- */


/* -- all browsers -- */


/* because all browsers (even firefox) get a mystery 3px margin below */
.logInForm { margin-bottom:-3px; }

/* because the FEATURED PROPERTY images add 3 px margin below unless displayed as block; this fix is for ffox, ie fixes below */
#image_rotate img { vertical-align:bottom; }


/* -- ie 6 -- */

/* because ie6 duplicates text (the 'earch' in Search) and puts it below; -3px margin right fixes */
* html a.lastTab { margin-right:-3px; }

/* because everything below the tabs gets pushed down the page */
* html div.outerBodyWrapper { margin-top:0px; } /* was -2px, but not needed as of Dec 1 2009 */

/* because leftColumn top240s get 14px and other top 240s get 10px of margin-bottom */
* html .top240 { margin-bottom:-11px; } /* this was 10 before 12 px font */
* html .leftColumn .top240 { margin-bottom:-13px; }
* html .rightColumn .bottom240 { margin-bottom:-11px; }/* this didn't exist before 12 px font */

/* because bottom240s get 10px extra margin-bottom */
* html .bottom240 { margin-bottom:-10px; }
* html .leftColumn .bottom240 { margin-bottom:-14px; }

/* because top720s and 480s get 14px extra margin-bottom */
* html .top720 { margin-bottom:-14px; }
* html .top480 { margin-bottom:-14px; }

/* because availableProperties gets 5px extra margin-bottom */
* html .middleColumnBottom { margin-top:-5px;  }

/* because bottom720s and 480s get 13px extra margin-bottom */
* html .bottom720 { margin-bottom:-14px; }
* html .bottom480 { margin-bottom:-14px; }

* html .middle720column { width:150px; margin:0 0 10px 0; padding:6px 14px 8px 12px; text-align:center; } /* there's more right padding than left so spacing is even despite 2px border-right */
* html .middle720columnDivider { float:left; width:2px; margin:0 0 10px 0; padding:6px 0 8px 0; background:#dedede; height:131px; }
* html .fullServiceSection .first { margin-left:0px; }
* html .testimonialWrapper .first { margin-left:5px; }

* html .second { margin-top:-14px; }

* html .testimonialsImage { margin-bottom:-10px; }

/* because the footerLeftColumn is too wide */
* html .footerLeftColumn { margin-left:60px; float:left; text-align:center; }

/* because the thin body background continues for too far in ie6 */
* html .belowFooter, * html .belowFooterColumn { /*background:white;*/ }

/* because the belowFooter gets pushed down too far */
* html .outerBodyWrapperBottom { margin-bottom:-13px; }

/* to fix double-margin bug; cuts margin from 26 to 13 */
* html .mastheadTopRight a.first  { margin-left:13px; }

/* for the extra padding below the logInSticky */
* html .mastheadMiddleRight .stickyChild { margin-bottom:-2px; }

/* for details.php PHOTO GALLERY */
* html .photoGallery .stepcarouselWrapper { margin-bottom:-5px; }




/* to add border:solid red 1px; */
.leftColumn, .middleColumnTop, .middleColumnBottom, .rightColumn  {  }

.top240, .availableProperties, .middleColumnBottom, .rightColumn  {  }





/* -- ie 7 -- */




/* -- ies (both) -- */

/* because the stepcarousel wrapper gets an extra 4px margin-top (# is 18 for good browsers, 14 for ies) */
* html .stepcarouselWrapper{ margin-top:14px; }
*:first-child+html .stepcarouselWrapper{ margin-top:14px; }

/* because the go buttons (for search and log in) are a pixel too high otherwise */
* html .searchTextInput, * html .logInTextInput { margin-top:-1px; }
*:first-child+html .searchTextInput, *:first-child+html .logInTextInput { margin-top:-1px; }

/* because the search form and map and middle720column images get an extra 3px margin-bottom (ie 3 pixel bug) */
* html .searchForm { margin-bottom:-3px; }
*:first-child+html .searchForm { margin-bottom:-3px; } 
* html .map { margin-bottom:-3px; }
*:first-child+html .map { margin-bottom:-3px; } 
* html .middle720column img { margin-bottom:7px; } /* is 10 for non-ie browsers */
*:first-child+html .middle720column img { margin-bottom:7px; } /* is 10 for non-ie browsers */

.pagination {
	float: right;
	clear: both
}

.pagination a {
	display: block;
	margin:1px;
	padding: 4px 0px 2px;
	width: 20px;
	text-align: center;
	font-size: 12px;
	float: left;
	height: 16px;
}
	.pagination a.left {
		background: url( /images/buttons/arrow_left.gif ) no-repeat center -6px;
	}
	.pagination a.left-grey {
		background: url( /images/buttons/arrow_left_grey.gif ) no-repeat center -6px;
	}
	.pagination a.right {
		background: url( /images/buttons/arrow_right.gif ) no-repeat center -6px;
	}
	.pagination a.right-grey {
		width: 18px;
		background: url( /images/buttons/arrow_right_grey.gif ) no-repeat center -6px;
	}
.pagination a.page {
	border: 1px solid #AAAAAA;
}
.pagination a.active {
	background: #DDDDDD;
	border: 1px solid #AAAAAA;
}
.pagination a.page:hover{
	background: #eeeeee;
}

.logo img { float:left;background:#fff;border:0;}
