﻿/* ============ elements ============ */
body {
margin: 0;
padding: 0;
background: #006699;
font: normal 11px Tahoma, Arial, Helvetica, sans-serif;
color: #3F3F3F;
/* Force IE to center containers */
text-align: center;
}

h4 {
margin: 0;
padding: 0;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000;
background-color: transparent;
}

h3 {
margin: 0;
padding: 0;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;
color: #000;
background-color: transparent;
}

h2 {
margin: 0;
padding: 0;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #000;
font-size: 16px;
background-color: transparent;
}

h1 {
margin: 0;
padding: 0;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 18px;
color: #000;
background-color: transparent;
}

p {
line-height: normal;
text-align: left;
margin: 0 0 10px 0;
}

a, a:visited, a:hover, a:active {
color: #369;
}

a:hover {
text-decoration: none;
}

a img {
border: 0;
}

/* ============ general classes ============ */
.centre_item {
text-align: center;
}

.bgnd_white {
background: #FFF;
color: #000;
}

.paddingleft6 {
padding-left: 6px;
}

.paddingleft2 {
padding-left: 2px;
}

.paddingleftright6 {
padding: 0px 6px 0px 6px;
}

.noscript {
font-size: 12px;
color: #fff;
text-align: center;
}

.seperator_t {
border-top: 2px #EAC37E dotted;
}

.seperator_b {
border-bottom: 2px #EAC37E dotted;
}

.seperator_tb {
border-bottom: 2px #EAC37E dotted;
border-top: 2px #EAC37E dotted;
}

.colour369 {
color: #369;
}

.preloadimage {
display: none;
}

.tenpixleftmargin {
margin-left: 10px;
}

/* magnifying glass cursor image for IE followed by mozilla proprietory cursor for firefox */
img.zoomable {
cursor: url('../../images/magnify.cur'), -moz-zoom-in;
}

/* ============ wrapper ============ */
#mainwrapper {
width: 890px;
margin: 0 auto;
padding-top: 10px;
background: #FFF;
text-align: left;
}

/* ============ header ============ */
#header {
width: 890px;
height: 100px;
margin: 0 auto;
background: #00699C url('../images/mainbanner890.png') no-repeat center bottom;
}

/* ============ main navbar container ============ */
#main_nav {
width: 890px;
height: 21px;
margin: 0;
background: #EAC37E;
}

/* ------ main navbar ------ */
ul#navbar {
height: 21px;
margin: 0 0 0 90px;
padding: 0;
list-style-type: none;
white-space: nowrap;
}

ul#navbar li.first {
float: left;
font-family: verdana, arial, sans-serif;
font-size: 10px;
margin: 0px;
padding: 5px 0 4px 0;
background-color: #EAC37E;
border-left: 1px solid #FFF;
}

ul#navbar li {
float: left;
font-family: verdana, arial, sans-serif;
font-size: 10px;
margin: 0px;
padding: 5px 0 4px 0;
background-color: #EAC37E;
border-right: 1px solid #FFF;
}

#navbar a, #navbar a:link {
margin: 0;
padding: 5px 9px 4px 9px;
color: #000;
text-decoration: none;
}

ul#navbar li#navbaractive #current {
color: #FFF;
background-color: #C3A36C;
font-weight: bold;
cursor: default;
}

#navbar a:hover {
color: #FFF;
background-color: #D2B074;
}

/* ============ content wrapper ============ */
#contentwrapper_index {
width: 768px;
margin: 40px auto 20px 60px;
}

#contentwrapper {
width: 630px;
margin: 40px auto 20px auto;
}

#contentwrapper_terms h4 {
color: #369;
}

#contentwrapper_propman {
width: 630px;
height: 500px;
margin: 40px auto 20px auto;
background: url(../images/manage.jpg) bottom left no-repeat;
}

#contentwrapper_cyprus {
width: 630px;
margin: 10px auto 20px auto;
}

#contentwrapper_flights {
width: 680px;
margin: 0px auto 0px auto;
}

/* ============ main content ============ */
#maincontent {
float: left;
width: 558px;
background: #FFF;
}

#maincontent_carhire {
float: left;
width: 430px;
background: #FFF;
}

#maincontent_bookingform {
float: left;
width: 420px;
background: #FFF;
}

#maincontent_cyprus {
float: left;
width: 450px;
background: #FFF;
}

/* ------ property listing gallery tabs ------ */
#tabs ul {
margin: 0;
padding: 0;
list-style-type: none;
}

#tabs li {
/*margin: 0 0 .2em 0;*/
float: left;
}

#tabs a {
display: block;
color: #FFF;
background: #75A4D4 url(../images/tab.gif) no-repeat top;
width: 200px;
height: 18px;
padding: 6px 0px 0px 0px;
text-align: center;
text-decoration: none;
}

#tabs a:hover {
color: #FFF;
font-weight: bold;
}

#active a {
display: block;
color: #FFF;
background: #369 url(../images/tab_active.gif) no-repeat top;
width: 200px;
height: 18px;
text-align: center;
text-decoration: none;
}

#active a:hover {
color: #FFF;
text-decoration: none;
cursor: default;
}

#tabrule {
float: left;
width: 546px;
height: 5px;
background-color: #369;
}

/* ------ property listing gallery ------ */
/* Iframe */
#frame_props {
width: 546px;
height: 1000px;
}

#listing_title {
width: 546px;
height: 25px;
padding: 3px 0 2px 0;
margin-bottom: 2px;
background-color: #369;
float: left;
}

#listing_title h3 {
color: #FFF;
}

#listing_title_top {
width: 546px;
height: 25px;
margin-bottom: 2px;
background-color: #369;
float: left;
}

#listing_title_top h3 {
color: #FFF;
}

#listing_buttons {
float: right;
position: relative;
width: 73px;
height: 18px;
margin: -19px 6px 0 0;
}

#gallery {
margin: 0px;
padding: 0px;
}

#gallery ul {
display: block;
margin: 0px;
padding: 0px;
}

#gallery ul a, #gallery a:visited, #gallery a:active {
color: #FFF;
text-decoration: none;
}

#gallery ul a:hover {
text-decoration: underline;
}

#gallery li {
display: block;
list-style: none;
float: left;
margin: 0 6px 6px 0;
padding: 0px;
border: solid 1px #336699;
background: #6185B3;
}

#gallery li p {
text-align: center;
margin: 0px;
padding: 6px;
color: #FFF;
font-weight: bold;
}

#gallery li span {
text-align: center;
margin: 0px;
padding: 6px;
color: #FFF;
font-weight: normal;
}

#gallery li p.info {
text-align: left;
margin: 0px;
padding: 3px;
color: #000;
font-weight: bold;
background: #FFF;
}

#gallery hr {
clear: both;
visibility: hidden;
margin: 0px;
padding: 0px;
height: 1px;
}

/* ------ individual property hover slideshow ------ */
#showcontent {
float: left;
width: 434px;
background: #FFF;
}

/* Iframe */
#slideshow {
width: 434px;
height: 394px;
border: 1px #000 solid;
}

/* ------ extra pics in narrative ------ */
#xtrapics_container {
min-width: 436px;
}

#xtrapics div {
float: left;
width: 50%;
}

#xtrapics {
margin-right: 135px;
}

/* ------------ property management (management.htm) ------------ */
#managementlist {
display: block;
width: 270px;
margin-left: auto;
margin-right: auto;
font-size: 12px;
font-weight: bold;
}

/* ------------ booking form (bookingform.htm) ------------ */
#formcontainer h4 {
color: #369;
}

#transferlabel {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;
color: #369;
}

.cssform p{
width: 270px;
clear: left;
margin: 0;
padding: 5px 0 8px 0;
padding-left: 160px;/*width of left column containing the label elements*/
height: 1%;
}

.cssform label{
font-weight: bold;
float: left;
margin-left: -160px;/*width of left column*/
width: 150px;/*width of labels. Should be smaller than left column to create some right margin*/
}

.cssform input[type="text"]{/*width of text boxes. IE6 does not understand this attribute*/
width: 180px;
}

.cssform textarea{
width: 250px;
height: 150px;
}

/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/

* html .threepxfix{
margin-left: 3px;
}

/* ------ booking date form field popup calendar ------ */
table.calendar {
font-family: Helvetica, Arial, sans-serif;
font-size: 0.8em;
border-collapse: collapse;
background-color: white;
border: solid #999999 1px;
background-color: white;
width: 200px;
text-align: center;
/*prevent user from selecting text in Mozilla & Safari - check calendar constructor for IE code)*/
/*-moz-user-select: none;*/
/*-khtml-user-select: none;*/
}

table.calendar input, table.calendar select {
font-size: 10px;
}

table.calendar td {
border: 0;
font-size: 10px;
text-align: center;
}

div.mainheading {
margin: 2px;
}

table.caldayheading {
border-collapse: collapse;
cursor: pointer;
empty-cells: show;
margin: 0 6px 0 6px;
}

table.caldayheading td {
border: solid #CCCCCC 1px;
text-align: left;
color: #0054E3;
font-weight: bold;
width: 22px;/*should match calendar cell's width*/
}

table.caldayheading td.wkhead {
border-right: double #CCCCCC 3px;
}

table.calcells {
border-collapse: collapse;
cursor: pointer;
margin: 0 6px 0 6px;
}

table.calcells td {
border: solid #CCCCCC 1px;
vertical-align: top;
text-align: left;
font-weight: bold;
width: 22px;
height: 20px;/*IE doesn't like ems*/
}

table.calcells td div {
padding: 1px;
margin: 0;
}

table.calcells td.wkhead {
background-color: white;
text-align: center;
border-right: double #CCCCCC 3px;
color: #0054E3;
}

table.calcells td.wkday {
background-color: #DDDDDD;
}

table.calcells td.wkend {
background-color: #DDDDDD;
}

table.calcells td.curdate {}

table.calcells td.cell_selected {
background-color: #99CCFF;
color: black;
}

table.calcells td.notmnth {
background-color: #FFFFFF;
color: #CCCCCC;
}

table.calcells td.notallowed {
background-color: white;
color: #EEEEEE;
font-style: italic;
}

table.calcells td.hover {
background-color: #999999;
}

table.calcells td.curdate {
color: red;
}

/* - collapsible weather - */

#weather_conditions {
width: 468px;
height: 60px;
display: block;
margin-left: auto;
margin-right: auto;
padding-top: 10px;
}

#weather_collapse {
float: left;
padding: 10px 0 0 0;
width: 750px;
margin: 0 auto;
}

#weather_collapse_title {
font-size: 11px;
font-weight: bold;
text-decoration: underline;
color: #006699;
text-align: center;
cursor: pointer;
}

/* ------------ flights (flights.htm) ------------ */
/* Iframe */
#frame_flights {
width: 680px;
height: 600px;
margin: 0px auto;
}

/* ============ right content ============ */
#rightcontent {
float: right;
width: 160px;
background: #FFF;
}

#rightcontent_index {
float: right;
width: 160px;
margin-top: 24px;
background: #FFF;
}

#rightcontent span {
line-height: normal;
}

#rightcontentcyprus {
float: right;
width: 162px;
background: #FFF;
}

#rightcontentcyprus img {
border: 1px solid #000;
}

.rightcontentbox {
border-top: 1px #EAC37E solid;
border-left: 1px #EAC37E solid;
border-right: 1px #EAC37E solid;
}

.rightcontentboxtitle {
display: block;
padding: 6px;
background: #FFF url(../images/boxtitle.gif) no-repeat;
text-align: center;
color: #000;
}

.rightcontentboxtitle_special {/* extra height for special offers */
display: block;
height: 54px;
padding: 6px;
background: #EAC37E url(../images/boxtitle.gif) no-repeat;
text-align: center;
color: #000;
}

#rightcontentplaintitle {
display: block;
padding: 6px;
background: #EAC37E;
text-align: center;
color: #000;
}

#rightcontent ul {
list-style: none;
line-height: 15px;
margin: 4px 0px 4px 0px;
padding-left: 4px;
}

#rightcontent li {
background: url(../images/bullet.gif) no-repeat left;
padding-left: 12px;
}

#rightcontent li.nobullet {
background: none;
padding-left: 12px;
line-height: 9px;
}

#spacerblock {
display: block;
height: 33px;
}

/* ---------- right content widgets ---------- */
#weather {
width: 150px;
height: 50px;
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
}

/* - collapsible currency converter - */
#currency {
width: 125px;
display: block;
margin-left: auto;
margin-right: auto;
padding-top: 6px;
}

#collapse {
float: right;
padding-left: 0px;
width: 160px;
margin: 0 auto;
}

#collapse_title {
font-size: 11px;
font-weight: bold;
text-decoration: underline;
color: #006699;
text-align: center;
cursor: pointer;
}

/* - hover buttons - */
#bookrequest {
display: block;
width: 125px;
height: 26px;
margin: auto;
background: url(../images/bookingreqbutton1.gif) no-repeat 0 0;
}

#bookrequest:hover {
background: url(../images/bookingreqbutton2.gif) no-repeat 0 0;
}

#contactus {
display: block;
width: 125px;
height: 26px;
margin: auto;
background: url(../images/contactus1.gif) no-repeat 0 0;
}

#contactus:hover {
background: url(../images/contactus2.gif) no-repeat 0 0;
}

/* ------ bottom nav links ------*/
#navlist {
margin: 0px auto 0px auto;
text-align: center;
}

#navlist ul {
padding-left: 0px;
margin-left: 0px;
}

#navlist li {
list-style: none;
padding: 0px 20px 0px 0px;
display: inline;
}

#navlist li.last {
padding: 0px 0px 0px 0px;
}

#navlist a {
color: #878787;
text-decoration: none;
}

#navlist a:hover {
text-decoration: underline;
}

#navactive a, #navactive a:hover {
color: #000;
text-decoration: none;
cursor: default;
}

/* ============ footer ============ */
#footer {
width: 890px;
height: 55px;
background: #75a4d4 url('../images/footer_graphic.gif') no-repeat bottom right;
}

#footer p {
text-align: center;
color: #fff;
}

#copyright {
float: right;
color: #FFF;
margin: 22px 20px;
}

#w3cvalid {
float: left;
padding: 20px 0 0 10px;
}

