/*
Css for Frigiliana Villa Rental site
*/
body {
  font-family: Verdana, Helvetica, Arial, sans-serif;
  background-color: #ffed96;
  line-height: 125%;
  padding: 0;
  margin: 0;
  }
  
 h1, h2, h3, h4 {
font-family: Verdana, Helvetica, Arial, sans-serif;
color: navy;
}

  h1 {
  font-family: Georgia, Arial, Helvetica, sans-serif;
  font-size:160%;
  color: navy;
  padding-top: 2.9em;
  padding-bottom: .5em;
  padding-left: .6em;
  margin: 0;
  background: #ffe573;
  line-height: 1.3;
  }
 
 h2 {
 font-size: 148%;
 font-weight: normal;
 padding-top: 2px;
 line-height: 1.4;
 padding-bottom: 0;
 margin-right: 20px;
 }
 
 h3 {
 font-size: 120%;
 font-weight: normal;
 padding-top: 20px;
 padding-bottom: 0;
 margin-right: 20px;
 }
 
 h4 {
 font-size: 95%;
 font-weight: normal;
 padding-top: 0px;
 padding-bottom: 0px;
 margin-bottom: 0px;
 margin-right: 20px;
 border: none;
 }
 
 h2, ul {
 margin-top: 15px;
 }
 
p {
font-size: small;
color: black;
margin-right: 20px;
text-align: justify;
}



li {
font-size: small;
}

/*list-style-position in navigation menu*/

.compact li {
list-style-position: inside;
list-style-type: none;
list-style-position: inside;
text-indent: 0px;
font-size: 84%;
padding-bottom: 0px;
}

.indentation {
padding-left: 1.4em;
list-style-type: none;
list-style-position: inside;
}
/*end of list-style-position in navigation menu*/



#tagline p {
font-style: italic;
font-family: Georgia, times, serif;
background-color: #FFCF00;
font-size: small;
border-bottom: 1px solid;
border-top: 1px solid;
padding-top: .3em;
padding-bottom: .3em;
padding-left: 1.6em;
margin: 0;
background: #FFb373;
}

/*
#tagline p {
font-style: italic;
font-family: Georgia, times, serif;
background-color: #A68700;
border-top: 3px solid #FFE573;
border-bottom: 3px solid #FFE573;
padding-top: .2em;
padding-bottom: .2em;
padding-left: .8em;
margin: 0;
background: #bfa430 url(backgrounds/tagline-fade.jpg) repeat-y right;
}
*/





em {
text-transform: uppercase;
}

a {
font-weight: normal;
color: black;
}

a:link {
color: blue;
}

a:visited {
color: navy;
}

a:hover {
text-decoration: none;
color: yellow;
background-color: purple;
}

a:active {
color: blue;
background-color: navy;
}


img {
border: 8px solid white;
}


.umpire {
padding: 20px;
}

.umpire1 {
padding: 40px;
}

.umpire2 {
padding: 5px;
}

.umpire3 {
padding: 50px;
}

.umpire4 {
padding: 60px;
}

.umpire5 {
padding: 100px;
}

.umpire6 {
padding: 0.1em;
}

.umpire7 {
padding: 300px;
}

.umpire8 {
padding: 10px;
}

.umpire9 {
padding: 30px;
}



div.floatright {
    float: right;
    margin-left: 20px;
    margin-right: 0px;
    margin-top: 15px;
    margin-bottom: 15px;
}

div.floatleft {
    float: left;
    margin-left: 0px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
}

p.caption.landscape {
    font-style: normal;
    font-size: 65%;
    font-weight: bold;
    padding: .25em .5em;
    margin-top: 0;
    margin-bottom: 3px;
    text-align: left;
    width: 310px;
    line-height: 1.4em;
    text-align: justify;

}

p.caption.portrait {
    font-style: normal;
    font-size: 65%;
    font-weight: bold;
    padding: .25em .5em;
    margin-top: 0;
    text-align: left;
    width: 225px;
    line-height: 1.4em;
    text-align: justify;

}

p.caption.panoramic {
    font-style: normal;
    font-size: 65%;
    color: black;
    font-weight: bold;
    padding: .25em .5em;
    margin-top: 0;
    text-align: left;
    width: 700px;
    line-height: 1.4em;
    text-align: justify;
}

p.caption.language_flag {
    font-style: normal;
    font-size: 70%;
    color: black;
    font-weight: normal;
    margin-top: 0px;
    width: 50px;
    line-height: 1em;
}

div.floatright_language_flag {
    float: right;
    margin: 0px;
    margin-top: 30px;
    
}





td {
border: 1px solid black;
padding: 0.2em;
}

table {
border-collapse: collapse;
border: 1px solid black;
}

th {
text-align: left;
background: gray;
color: white;
padding: 0.2em;
}



/*CSS for villa summary*/

table.villa_summary {
border-collapse: collapse;
margin-left: 0px;
border: 1px solid black;
}

table.villa_summary th {
font-size: none;
text-align: none;
background: none;
color: none;
padding-top: 0;
padding-bottom: 0;
padding-left: 2px;
padding-right: 2px;
}

table.villa_summary td {
text-align: left;
font-size: 70%;
background: #ffffff repeat-x top;
border: none;
padding: 0.4em;
padding-left: 10px;
}

table.villa_summary caption {
color: #000066;
font-size: medium;
text-align: left;
padding-bottom: 5px;
font-weight: bold;
}

table.villa_summary td.standout {
font-weight: bold;
}

/*Villa summary table - column spacing*/
#col1, #col4 {width: 0%;}

#col3 {width: 7%;}

#col2, #col5 {width: 0%;}




/*CSS for prices table*/

table.price-chart {
border-collapse: collapse;
}

table.price-chart th, table.price-chart.td {
padding: 4px;
border: 1px solid black;
}

table.price-chart th {
font-size: small;
text-align: center;
background: gray;
color: #ffffff;
padding-top: 0;
padding-bottom: 0;
padding-left: 2px;
padding-right: 2px;
}

table.price-chart td {
text-align: center;
font-size: small;
background: #e2edff url(backgrounds/td.jpg) repeat-x top;
}

table.price-chart caption {
color: #000066;
font-size: small;
text-align: left;
padding-bottom: 5px;
font-weight: bold;
}

/*Pricing table - column spacing*/
#period, #stay {width: 16%;}

#from, #to, #weekly {width: 25%;}



/*CSS for requirements table*/
table.requirements th, table.requirements.td {
padding: 4px;
border: none;
}

table.requirements th {
font-size: medium;
text-align: center;
background: gray;
color: #ffffff;
padding-top: 0;
padding-bottom: 0;
padding-left: 2px;
padding-right: 2px;
}

table.requirements caption {
color: #000066;
font-size: small;
text-align: left;
padding-bottom: 5px;
font-weight: bold;
}

table.requirements td {
border: none;
}

table.requirements {
border-collapse: collapse;
border: none;
}

table.requirements th {
text-align: left;
background: none;
color: black;
padding: 0px;
}

table.requirements td {
border: none;
padding: 0.2em;
}

table.requirements {
border-collapse: collapse;
}

table.requirements td {
text-align: left;
font-size: small;
font-weight: bold;
background: none;
}

/*Requirements table - column spacing*/
.item, .price {width: 15%;}
.price {width: 15%;}




table.essentials {
border-collapse: collapse;
}

table.essentials th, table.essentials td {
padding: 4px;
border: none;
}

table.essentials th {
font-size: 17px;
text-align: left;
background: gray;
color: #ffffff;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 2px;
padding-right: 2px;
}

table.essentials td {
text-align: left;
font-size: small;
background: #e2edff url(backgrounds/td.jpg) repeat-x top;
color: navy;
font-weight: normal;
}

table.essentials caption {
color: #000066;
font-size: small;
text-align: left;
padding-bottom: 5px;
font-weight: bold;
}

table.essentials td.highlight {
font-weight: bold;
}

/*Essentials table - column spacing*/
.name {width: 45%;}
.number {width: 20%;}




table.SWOT {
border-collapse: collapse;
}

table.SWOT th, table.SWOT td {
padding-left: 14px;
Padding-right: 14px;
padding-top: 10px;
padding-bottom: 10px;
border: none;
}

table.SWOT th {
/*font-size: 16px;
text-align: left;
background: gray;
color: #ffffff;*/
padding-top: 4px;
padding-bottom: 4px;
padding-left: 4px;
padding-right: 4px;
}

table.SWOT td {
text-align: left;
font-size: small;
background: #e2edff repeat-x top;
color: navy;
font-weight: normal;
}

table.SWOT caption {
color: #000066;
font-size: small;
text-align: left;
padding-bottom: 5px;
font-weight: bold;
}

table.SWOT td.highlight {
font-weight: bold;
}

table.SWOT td.highlight1 {
font-weight: bold;
color: black;
}

/*SWOT table - column spacing*/
.name {width: 15%;}
.description {width: 50%;}




form.contact fieldset {
border: none;
padding: 10px;
}

form.contact {
padding: 0;
margin: 0;
margin-top: -15px;
line-height: 150%;
}

form.contact label {
font-weight: bold;
font-size: small;
color: navy;
}

form.contact label.fixedwidth {
display: block;
width: 240px;
float: left;
}

form.contact .buttonarea input {
background: #ffe573;
color: black;
font-weight: bold;
padding: 5px;
border: 1px solid white;
}

form.contact .buttonarea {
text-align: center;
padding: 4px;
background-color: #FFb373;
}


.footer {
font-size: 82%;
font-weight: normal;
text-align: center;
padding-bottom: 5%;
padding-left: 0px;
width: 720px;
}



/*
This section deals with the position of items on the screen.
It uses absolute positioning - fixed x and y coordinates measured from the
top-left corner of the browser's content display.
*/


#navigation {width: 260px; height: 725px; border-right:1px; background: #ffed96; margin-left: 0; padding-left: 0; text-indent: 0px;}

#navigation, #bodycontent, #header {position: absolute;}

#navigation {top: 13em; }
#bodycontent {top: 10em; }

#bodycontent {left: 280px; border-left: 3px; color: black}

#header {width: 100%; border-top: 3px solid #7da5d8;}

div.w_widget {padding-left: 2.6em;}




/* CSS for photo gallery - http://www.cssplay.co.uk/menu/photo_not_so_simple
=================================================================== 
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/numbergallery.html
Copyright (c) 2005-2009 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/*main box area*/
#gallery_villa {width:728px; height:440px; padding:10px; border:1px solid #fff; background: #bfb896; position:relative; margin-bottom:20px;}

/*display photo window*/
#gallery_villa b.default {position:absolute; left:0; top:10px; width:548px; height:380px; text-align:center;}
/*border around display photo window*/
#gallery_villa b.default img {display:block; margin:0 auto 10px auto; border:1px solid #eee; border-color:#fff;}
/*display window text*/
#gallery_villa b.default span {display:block; color:navy; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:12px; width:406px; margin:0 auto;}


/*thumbnails*/
/*size formating and positioning of thumbnail area*/
#gallery_villa ul {list-style:none; padding:0; margin:0; width:190px/*180*/; position:relative; float:right;}
/*spacing */
#gallery_villa ul li {display:inline; width:58px; height:47px; float:left; margin:0 0 4px 4px;}
/*size of input box*/
#gallery_villa ul li a {display:block; width:58px; height:47px; text-decoration:none; border:0.1em solid #000; border-color:#fc6;}
/*stored text on thumbnails - this feature hides it from browser so it only shows on mouseover*/
#gallery_villa ul li a span {display:none;}

/*thumbnails?*/
/*size of picture*/
#gallery_villa ul li a img {display:block; width:58px; height:47px; border:0;}
#gallery_villa ul li a:hover {white-space:normal; border-color:#fff; background:#777;}

/*positioning of display window within main box area on thumbnail mouseover*/
#gallery_villa ul li a:hover b {position:absolute; left:-548px; top:0; width:548px; height:380px; text-align:center; background:#bfb896; z-index:20;}
/*text display for individual photos on thumbnail mouseover*/
#gallery_villa ul li a:hover span {display:block; color:navy; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:12px; width:406px; margin:0 auto;}
/*size of display box on thumbnail mouseover*/
#gallery_villa ul li a:hover img {margin:0 auto 10px auto; width:auto; height:auto; border:1px solid #fc6; border-color:#fff;}

/*underlying images behind display box*/
#gallery_villa ul li a:active, #gallery_villa ul li a:focus {white-space:normal; border-color:#fff; background:#777;}
#gallery_villa ul li a:active b, #gallery_villa ul li a:focus b {position:absolute; left:-548px; top:0; width:548px; height:380px; text-align:center; background:#bfb896; z-index:10;}
#gallery_villa ul li a:active span, #gallery_villa ul li a:focus span {display:block; color:navy; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:12px; width:406px; margin:0 auto;}
#gallery_villa ul li a:active img, #gallery_villa ul li a:focus img{margin:0 auto 10px auto; width:auto; height:auto; border:1px solid #eee; border-color:#fff;}


/*CSS ORIGINAL/*
#gallery {width:728px; height:380px; padding:10px; border:1px solid #333; background: #888; position:relative; margin-bottom:20px;}
#gallery b.default {position:absolute; left:10px; top:10px; width:548px; height:380px; text-align:center;}
#gallery b.default img {display:block; margin:0 auto 10px auto; border:1px solid #eee; border-color:#555 #ddd #eee #333;}
#gallery b.default span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:350px; margin:0 auto;}

#gallery ul {list-style:none; padding:0; margin:0; width:180px; position:relative; float:right;}
#gallery ul li {display:inline; width:52px; height:52px; float:left; margin:0 0 5px 5px;}
#gallery ul li a {display:block; width:50px; height:50px; text-decoration:none; border:1px solid #000; border-color:#eee #555 #333 #ddd;}
#gallery ul li a span {display:none;}
#gallery ul li a img {display:block; width:50px; height:50px; border:0;}
#gallery ul li a:hover {white-space:normal; border-color:#555 #ddd #eee #333; background:#777;}
#gallery ul li a:hover b {position:absolute; left:-548px; top:0; width:548px; height:380px; text-align:center; background:#888; z-index:20;}
#gallery ul li a:hover span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:350px; margin:0 auto;}
#gallery ul li a:hover img {margin:0 auto 10px auto; width:auto; height:auto; border:1px solid #eee; border-color:#555 #ddd #eee #333;}

#gallery ul li a:active, #gallery ul li a:focus {white-space:normal; border-color:#555 #ddd #eee #333; background:#777;}
#gallery ul li a:active b, #gallery ul li a:focus b {position:absolute; left:-548px; top:0; width:548px; height:380px; text-align:center; background:#888; z-index:10;}
#gallery ul li a:active span, #gallery ul li a:focus span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:350px; margin:0 auto;}
#gallery ul li a:active img, #gallery ul li a:focus img{margin:0 auto 10px auto; width:auto; height:auto; border:1px solid #eee; border-color:#555 #ddd #eee #333;}



/*
===================================================================
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/numbergallery.html
Copyright (c) 2005-2009 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
===================================================================*/

a, a:visited, a:hover, a:active {}
#outsideshow,
#slides {padding:0; margin:0; list-style:none;}

#outsideshow {width:750px;}
#outsideshow li {float:left; background: #444;}
#outsideshow li a {text-decoration:none;}
/*position of height of number menu on background*/
#outsideshow li #pad {height:240px;}
#outsideshow li a:hover {background:transparent;}
/*#outsideshow :hover #pad {display:none;}  - prevents number menu from jumping up*/

/*clickable number menu*/
#slides {width:680px; margin:0 auto; height:16px; padding:2px 8px; background: none; border-top:1px solid #fc6; border-bottom:1px solid #fc6;}
/*individual number blocks within number menu*/
#slides li {float:left; width:20px; height:16px; text-align:center; background:#8a8; color:#ffc; font:12px/16px arial, verdana, sans-serif;}
#slides li a {display:block; text-decoration:none; color:#ffc;}
/*Row 2*/


/*main background*/
#slideshow {width:800px; height:290px; background:transparent; padding-top:260px; overflow:hidden; position:relative; z-index:100;}
#outsideshow #slideshow p {position:absolute; left:0; width:750px; text-align:center; color:#ffc; z-index:-1; font:12px/16px arial, verdana, sans-serif; padding:0; margin:0;}

#outsideshow table {border-collapse:collapse; width:750px; height:0; margin:-1px;}
#slides a span {position:absolute; left:-9999px; top:-9999px; display:block; border:0; z-index:0;}
#slides a span b {display:none;}
#slides a em {display:block; width:0; height:0; overflow:hidden; border-top:5px solid #ffc; border-right:5px dashed transparent; border-left:5px dashed transparent; position:absolute; left:-9999px; top:-9999px;}
#slides a:hover {color:#fc6; border:0; position:relative;}

/*size of hover image in number menu*/
#slides a:hover span {width:120px; height:auto; left:-51px; bottom:26px; top:auto; padding:0; border:1px solid #8a8;}
#slides a:hover span img {width:120px; height:auto; border:0; display:block;}
#slides a:hover em {left:5px; top:-10px;}

/*attributes for main pop-up photo and text*/
#slides a:active {position:static; color:#f60; outline:0;}
#slides a:active span {border:0; width:800px; height:350px; left:0; top:0; margin-top:25px;}
#slides a:active span img {height:380px; width:auto; margin:15px auto; border:1px solid #fc6;}
#slides a:active span b {display:block; text-align:center; font-weight:normal; color:#ffc; margin-left:60px; margin-right:60px;}

#slides a:focus {position:static; color:#f00; outline:0;}
#slides a:focus span {border:0; width:800px; height:350px; left:0; top:0; margin-top:25px; z-index:-1;}
#slides a:focus span img {height:380px; width:auto; margin:15px auto; border:1px solid #fc6;}
#slides a:focus span b {display:block; text-align:center; font-weight:normal; color:#ffc; margin-left:80px; margin-right:80px;}


/*============================
CSS for View map button
Credits: Dynamic Drive CSS Library
URL: http://www.dynamicdrive.com/style/csslibrary/item/3d-css-buttons
==============================*/
.cssbutton{
background-color: #d1ec4c;
border: 2px #d1ec4c outset;
padding: 1px 4px;
color: black;
text-decoration: none;
font: bold 10px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
}

.cssbutton:visited{
color: black;
}

.cssbutton:hover{
border-style: inset;
background-color: #e3f48e;
padding: 2px 3px 0 5px; /*shift text 1px to the right and down*/
}

.cssbutton:active{
color: black;
}