body {font-size:100%; line-height:1em; margin:5px 0 0 0; padding:0; background:#000033; color:#999; font-family:verdana, Arial, "Times New Roman", Times, serif; }
/*
	if font-size is 100% in body then these work out (assumed default setting in the browser of 16px)
  font-size:1em;		 = 16px
	font-size:0.875em; = 16x.875=14px
	font-size:0.75em;  = 16x0.75=12px
*/
html, body {min-height:100%; width:100%; height:100%;}
html>body {height:auto;}

h1 {color:#ccc;}
h2 {color:#ccc;}
h3 {color:#ccc; padding-bottom:0px;margin-bottom:0px;font-size:1em;}
h4 {color:#60829a; padding:0; margin:10px 0px 10px 0px;font-size:1em;}
h5 {color:#60829a; padding:0; margin:3px;}
.bold {font-weight:800;}
img {border:none;}

.clear {clear:both; line-height:1px;}
.float_left {float:left;}
.float_right {float:right;}

/* green #8eb337 */
a:active, a:link, a:visited {color:#7cb522;font-weight:800;text-decoration:underline;}
a:hover {color:#ccc;font-weight:800;text-decoration:underline;}

/* layout classes */
/* main container */
div#container {position:relative;margin-left:auto;margin-right:auto;width:985px;text-align:left;padding:0;border:solid 0px #666;/*#ccc4b7;*/background:#000033;}

/* header - british racing green (similar) = #004626 -  dark blue (that Peter likes) = #000033 */
div#header {position:relative;width:100%;height:105px;margin:0;background:#000033;}

div#headercol1 {width:225px;float:left;text-align:center;}
	img.logo {width:225px;height:87px;}

div#headercol2 {width:535px;float:left;text-align:center;}
	div.strapline {font:bold 1.3em verdana;padding:0;float:left;text-align:center;line-height:25px;color:#006;}
	img.strapline_image {width:455px;height:100px;}

div#headercol3 {width:225px;float:left;}
	div.headerlinks {float:right;margin:7px 10px 0 0;font-size:0.65em;}
	div.refsearch {float:right;margin:7px 10px 0 0;font-size:0.65em;}
	div.refsearch input {font-size:1em}

/* footer */
div#footer {color:#666;font-size:0.65em;text-align:left;margin:0 auto;padding:5px;clear:both;border-top:1px solid #666;background:#17174c;}
#footer p {margin:2px;}

/* full width main content */
div#fullmain {float:left; width:985px; padding:0px 0px 5px 0px;font-size:0.75em;}
div#fullmain div.top {padding:10px 0px 10px 10px;margin-bottom:5px;background:#cae6f1;}
div#fullmain div.top h2 {margin-top:5px;color:#166336;} 
div#fullmain div.top p {color:#166336;} 
div#fullmain div.bottom {padding:10px 10px 10px 10px;border-top:1px dotted #fff;background:#f4edc1;}

/* boxes */
div.box_n_border {border:1px solid #666; background:#000033;margin:0px 0 10px 0;padding:0 0 0 0;}
div.inner_content {padding:10px;}

div.box_villa_options {border:1px solid #666; background:#000033 url(../images/property_img.jpg) top right no-repeat; overflow:hidden; margin:0 0 10px 0;}

div.box_resort_intro {background: url(../images/resort_img.jpg) top right no-repeat;}
div.resort_intro_content {padding:10px; color:#999999;}
div.resort_intro_content p {margin:5px;}
div.resort_inner_content {padding:0px 10px 10px 10px;margin:0;}
div.resort_inner_content h2 {margin:0px;padding:0px 5px 10px 5px;font-size:1.5em;}
div.resort_inner_content h3 {margin:0px;padding:10px 5px 10px 5px;font-size:1em;}
div.resort_inner_content p {margin:5px;}

div.no_top_border {border-top:none;}
/* end of boxes */

/* villa options for seaching */
div.villa_options {width:245px;float:left;padding:0;}
ul.villaoption {padding:0;margin:0;list-style-type:none;font-size:0.75em;}
ul.villaoption li {color:#ddd;}
ul.villaoption li a:active, ul.villaoption li a:link, ul.villaoption li a:visited {padding:2px 0 2px 0px;margin:0;display:block;background:#17174c;color:#ddd;text-decoration:none;border-bottom:solid 1px #000033;text-align:center;width:100%;}
ul.villaoption li a:hover, ul.villaoption li a:link.selected, ul.villaoption li a:visited.selected {background:#26267F;color:#fff;}

.freeform_text {width:355px;float:left;padding:5px 0px 0px 15px;}
.freeform_text p {margin:5px 0 5px 0;padding:0;}

/*highlighted properties */
div.highlighted_properties {padding:0px 5px 0 5px;width:729px;float:left;}
div.highlighted_properties h3 {margin:4px 0 4px 4px;color:#ccc;font-size:1em;}

div.feat_prop_container {height:130px;width:230px;float:left;margin:0 2px 5px 7px;}
span.prop_ref {font:normal .75em verdana; color:#00a0e3;}
img.feat_prop_img {float:left;width:140px;height:105px;margin:5px 5px 0 0;}
div.feat_prop_container p.first_icon {padding:1px 1px 1px 5px; margin:4px 0 0 0;font-size:.75em;}
div.feat_prop_container p.icon {padding:1px; margin:0;font-size:.75em;}

/* legend */
.legend {background:#17174c; width:230px; float:right; margin:0; padding:0px;height:100%;border-left:solid 1px #666;}
.legend h3 {margin:4px 0 4px 38px;color:#ccc;font-size:1em;padding:0;}
.legend p {font-size:.75em;margin:10px 0 9px 7px;padding:0;}
.legend img {width:28px;padding:0;margin:0;}

/* images */
img.photo_landscape {margin:10px;width:150px;height:120px;padding:5px;background:#000;border:solid 1px #666;}

img.photo_landscape_large {margin:10px;width:225px;height:169px;padding:5px;background:#000;border:solid 1px #666;}

img.photo_landscape_very_large {margin:10px;width:500px;height:375px;padding:5px;background:#000;border:solid 1px #666;}

img.photo_landscape_very_large_panoramic {margin:0px;width:950px;height:135px;padding:5px;background:#000;border:solid 1px #666;}

/* property listing */
div.property_grid {padding:0px;width:245px;float:left;background:#17174c;height:290px;}
div.property_grid p {font-size:0.75em;margin:4px 0 4px 4px;padding:0;}
div.property_grid img.grid_img {float:left;width:55px;height:41px;margin:5px 0 0 5px;}
div.property_grid_large_area {margin:5px 0 0 0;width:720px;float:right;}
img.grid_large_image {float:left;margin:0 10px 10px 0;padding:5px;background:#000;border:solid 1px #666;}

div.property_grid_control {padding:0px;width:245px;float:left;background:#17174c;color:#666;height:45px;}
div.property_grid_control p {font-size:.75em;margin:10px 0 9px 7px;padding:0;}

/* end of layout classes */

/* main tabs classes */
/* fix the font size to 11px as we don;t want these to grow in size if user changes text size as it will upset the design of the tabs */
ul#maintabnav {font-weight:800;font-size:11px;list-style-type:none;padding:0 0 24px 20px;border-bottom:1px solid #666;margin:0;}
ul#maintabnav li {float:left;height:21px;background-color:#333;margin:2px 4px 0 4px;border:1px solid #666;padding:0;}
ul#maintabnav li.tabselected {border-bottom:1px solid #003;background-color:#003;}
ul#maintabnav a {float:left;display:block;color:#666;text-decoration:none;padding:2px 5px 3px 5px;}
ul#maintabnav li.tabselected a {color:#ccc;}
ul#maintabnav li.tabunselected a:hover {background:#666;color:#fff;text-decoration:none;} 
/* end of main tabs classes */

/* resort tabs */
div.resortmenu {width:100%;float:left;padding:0;margin:0 0 10px 0;border-bottom:solid 1px #666;}
div.resortmenuphoto1 {background: url(../images/resort_facilities.jpg) top right no-repeat;}
div.resortmenuphoto2 {background: url(../images/resort_kids.jpg) top right no-repeat;}
div.resortmenuphoto3 {background: url(../images/resort_tennis.jpg) top right no-repeat;}
div.resortmenuphoto4 {background: url(../images/resort_golf.jpg) top right no-repeat;}
div.resortmenuphoto5 {background: url(../images/resort_spa.jpg) top right no-repeat;}
div.resortmenuphoto6 {background: url(../images/resort_gym.jpg) top right no-repeat;}
div.resortmenuphoto7 {background: url(../images/resort_equestrian.jpg) top right no-repeat;}
ul.resortmenu {list-style-type:none;padding:0;margin:0;font-size:0.75em}
ul.resortmenu li{color:#ddd;}
ul.resortmenu li a:link, ul.resortmenu li a:visited {width:200px;text-decoration:none;color:#ddd;background:#17174c;margin:0;padding:1px 0 1px 0;border-right:1px solid #666;border-bottom:1px solid #666;display:block;text-align:center;}
ul.resortmenu li.lastone a:link, .resortmenu li.lastone a:visited {border-bottom:none;}
ul.resortmenu li a:hover, ul.resortmenu li a:link.selected, ul.resortmenu li a:visited.selected{background:#26267F;color:#fff;}


/* currency classes */
div.currency_symbol {float:left;margin-right:1px;color:#aaa;}

div.currency_selection {float:right;margin:6px 10px 0 0;font-size:0.7em;}
div.currency_selection p {padding:2px 25px 5px 0;margin:0;color:#eee;text-align:right;}

.btn_GBP_selected {float:left;text-align:left;padding:2px;width:34px;}
.btn_GBP_selected a {display:block;width:23px;height:15px;background:url("../images/gbp.gif") 0 0 no-repeat;text-decoration:none;}
.btn_GBP_selected a:hover {background-position:0 -15px;}
.btn_GBP {float:left;text-align:left;padding:2px;width:34px;}
.btn_GBP a {display:block;width:23px;height:15px;background:url("../images/gbp.gif") 0 0 no-repeat;text-decoration:none;background-position:0 -15px;}
.btn_GBP a:hover {background-position:0 0px;}

.btn_EUR_selected {float:left;text-align:left;padding:2px;width:34px;}
.btn_EUR_selected a {display:block;width:23px;height:15px;background:url("../images/euro.gif") 0 0 no-repeat;text-decoration:none;}
.btn_EUR_selected a:hover {background-position:0 -15px;}
.btn_EUR {float:left;text-align:left;padding:2px;width:34px;}
.btn_EUR a {display:block;width:23px;height:15px;background:url("../images/euro.gif") 0 0 no-repeat;text-decoration:none;background-position:0 -15px;}
.btn_EUR a:hover {background-position:0 0px;}

.btn_USD_selected {float:left;text-align:left;padding:2px;width:34px;}
.btn_USD_selected a {display:block;width:23px;height:15px;background:url("../images/usd.gif") 0 0 no-repeat;text-decoration:none;}
.btn_USD_selected a:hover {background-position:0 -15px;}
.btn_USD {float:left;text-align:left;padding:2px;width:34px;}
.btn_USD a {display:block;width:23px;height:15px;background:url("../images/usd.gif") 0 0 no-repeat;text-decoration:none;background-position:0 -15px;}
.btn_USD a:hover {background-position:0 0px;}
/* end of currency classes */

/* accommodation details */
.accommodation_details_left {float:left;width:420px;font-size:0.875em;}

.accommodation_details_right {float:right;width:535px;font-size:0.875em;margin:0px 0 0 0;}
.return_to_list_container {height:15px;margin:0px;padding:0px;text-align:right;width:535px;float:right;}
.accommodation_details_right_inner {width:430px;float:left;}
.accommodation_details_right span.title {font-weight:800;color:#60829a;}
.accommodation_details_right h5 {padding:0; margin:1px;}
.accommodation_details_right p {padding:0; margin:1px;}
.accommodation_details_right h4 {padding:0; margin:1px;}
.accommodation_details_description {width:430px;height:110px;overflow:auto;}
.accommodation_details_features {width:430px;height:196px;overflow:auto;border:0px solid #666;background:#000033;margin:0px;padding:0px;}

.accommodation_details_icons {height:390px;float:left;width:100px;margin:10px 0 0 5px;}
.accommodation_details_icons p.first_icon {padding:1px 1px 1px 1px; margin:4px 0 0 0;}
.accommodation_details_icons p.icon {padding:1px; margin:0;}
.register_interest_container {width:100px;height:35px;margin:10px 0 0 0;}
input.register_interest {font-size:0.875em;width:100px;height:35px;background:#17174c;color:#ddd;}
input.register_interest:focus, input.register_interest:hover {color: #000;background: #FCF9CE; /*#F5FAFA;*/border: 1px solid #455084; /*#888;*/}

input.proprefsearch {font-size:0.875em;background:#17174c;color:#ddd;}
input.proprefsearch:focus, input.proprefsearch:hover {color: #000;background: #FCF9CE; /*#F5FAFA;*/border: 2px solid #455084; /*#888;*/}

form.register_interest_form {margin:0;padding:0;}

/* gallery container */
.property_large {width:400px;height:300px;margin: 0 0 0 0;float:left;padding:5px;background:#000;border:solid 1px #666;}
.property_small_first {clear:both;width:65px;height:49px;border-top:solid 2px #003;border-right:solid 2px #003;border-bottom:solid 1px #003;border-left:solid 1px #003;margin:0;padding:0px;float:left;}
.property_small {width:65px;height:49px;border-top:solid 2px #003;border-right:solid 2px #003;border-bottom:solid 1px #003;border-left:solid 2px #003;margin:0px;padding:0px;float:left;}
.property_small_end {width:65px;height:49px;border-top:solid 2px #003;border-right:solid 0px #003;border-bottom:solid 1px #003;border-left:solid 2px #003;margin:0px;padding:0px;float:left;}

.gallerycontainer{ position: relative; height: 300px; /*Add a height attribute and set to largest image's height to prevent overlaying*/}
a.thumbnail img{}
a.thumbnail:hover{background-color: transparent;}
a.thumbnail:hover img.property_small_first{padding:0px;margin:0px;border-top:solid 2px #fff;border-right:solid 2px #fff;border-bottom:solid 1px #fff;border-left:solid 1px #fff;}
a.thumbnail:hover img.property_small{padding:0px;margin:0px;border-top:solid 2px #fff;border-right:solid 2px #fff;border-bottom:solid 1px #fff;border-left:solid 2px #fff;}
a.thumbnail:hover img.property_small_end{padding:0px;margin:0px;border-top:solid 2px #fff;border-right:solid 0px #fff;border-bottom:solid 1px #fff;border-left:solid 2px #fff;}

/*CSS for enlarged image*/
a.thumbnail span{position:absolute;background-color:#003;left:-1000px;visibility:hidden;color:black;text-decoration:none;padding:0;margin:0;}
a.thumbnail span img{ /*CSS for enlarged image*/ margin:0;padding:0;border:solid 1px #fff;padding:5px;background:#000;border:solid 1px #666;}
a.thumbnail:hover span{ /*CSS for enlarged image*/visibility: visible;top: 0px;left: 0px; /*position where enlarged image should offset horizontally */z-index: 50;border:none;}

table.linkstable {padding:0;margin:0;width:100%;}
caption {padding:0 0 5px 0;font-style:italic;font-size:9px;text-align: right;}
table.linkstable th {font-weight:bold;font-size:10px;	color:#4f6b72; letter-spacing: 2px;	text-transform: uppercase; text-align: left; padding: 6px 6px 6px 12px;	background: #000033;}
table.linkstable td {padding: 6px 6px 6px 12px;	color:#666; background:#17174c;}


/* form classes, labels, inputs etc */
.styledform p{width:400px; clear:left; margin:0; padding: 5px 0 8px 0; padding-left: 105px; /*width of left column containing the label elements*/
	border-top: 0px dotted #dddddd; height: 1%;}

.styledform label{float: left; text-align: left; margin-left: -105px; /*width of left column*/
	width: 100px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
  font-weight:normal; color:#666666;}

.styledform label.controls {color: #003;background: #003;}
.styledform label span.moretext {font-weight:normal;font-style:italic;font-size:0.9em;color:#999999;}
.styledform span.mandatory {font-size:1.5em;color:#FCF9CE;}

.styledform input, .styledform textarea, .styledform select
{font-size: 1em; font-family:Arial, Helvetica, sans-serif; color: #666; background: #fff; border: 1px solid #ccc;}

.styledform input:focus, .styledform input:hover, 
.styledform textarea:focus, .styledform textarea:hover,
.styledform select:focus, .styledform select:hover {color: #000;background: #FCF9CE; /*#F5FAFA;*/border: 1px solid #455084; /*#888;*/}

.styledform .button {background:#17174c;color:#ddd;}