body
{
    margin:0px;
    padding:0px;
    /*background-color: white;*/
    background: fixed;
    background-image:url("../images/backgrounds/background_alpha2.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    font-family: arial,sans-serif;
}

header
{
    background: -moz-linear-gradient(top,  rgba(30,87,153,1) 0%, rgba(81,140,196,1) 54%, rgba(125,185,232,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(54%,rgba(81,140,196,1)), color-stop(100%,rgba(125,185,232,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(81,140,196,1) 54%,rgba(125,185,232,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(81,140,196,1) 54%,rgba(125,185,232,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(81,140,196,1) 54%,rgba(125,185,232,0) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(30,87,153,1) 0%,rgba(81,140,196,1) 54%,rgba(125,185,232,0) 100%); /* W3C */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#007db9e8',GradientType=0 ); /* IE6-9 */*/

}

header
{
    height:170px;
    margin-top:-10px;
    padding:20px 15px 15px 15px;
    width:100%;
    position: fixed;
}

nav
{
    margin-top:15px;
    font-weight: bold;
}

#smenu
{
    position: fixed;
    float:left;
    width:200px;
    margin-left:30px;    
}

form input{margin-left:5px;}

form label{font-weight: bold;margin-top:3px;width:150px;text-align: right;display:inline-block;vertical-align: top;}

#form_details{margin-lef:auto;margin-right:auto;}

#form_details label
{
    font-weight: bold; margin-right:10px; width:150px;text-align: right;display:inline-block;vertical-align: top;
}

#form_details pre
{
    margin-top:-36px;
    padding-left:160px;
    font-family: arial,sans-serif;
    text-align: left;
}

form input, form textarea
{
    color:#000;
    border:solid 1px #1e5799;
    padding:3px;
    font-family: arial,sans-serif;
    margin:2px;
    -moz-border-radius: .4em;
    border-radius: .4em;
}

form #firstname, form #surname, form #telephone, form #email
{background-color:#ffb;}

form #submit{text-align: center;}

form textarea{width:340px;}

#booking_form{text-align: left;margin-left:auto;margin-right:auto;}

#form_buttons
{
    text-align: center;
}

#form_buttons .vbutton
{
    font-size:1em;
    border:none;
}

#requestForm label.error
{
    color:#f00;
    margin:0px 0px 10px 160px;
    text-align: left;
    width:350px;
}
input.error, textarea.error
{
    border:solid 2px #f00;
}

.titles, .slider_titles
{
    /*position:inherit;*/
    padding:.5em 1em .5em 1em;
    margin:10px 0px 10px 0px;
    font-size: 1.5em;
    font-weight:bold;
    color:white;   
}

.underline_off
{
    text-decoration: none;
}

.sb_buttons
{
    display:block;
    margin:5px 10px 5px 10px;
}
.sb_buttons:hover
{
    color:#fff;

    /*background-color: #f00;*/

}

.heading
{
    padding:5px 15px 5px 15px;
    margin:10px 0px 10px 0px;
    font-size:1.2em;
    text-align: left;
    
}

nav a , nav a:hover, .vbutton, .sb_buttons
{
    text-decoration: none;
    padding:5px 12px 5px 12px;
   
}

nav a, .vbutton, .yellow_button, .villa_button, .villa_button img, #main img, .sb_buttons, .yellow_button img, .titles, .slider_titles, .headings, article, .heading, .infobox, .yellow_box, .yellow_slide
{
    -moz-border-radius: 1em 2em 1em 2em;
    border-radius: 1em 2em 1em 2em; 
}


.yellow_button a{text-decoration: none;font-weight:bold;}
.villa_button a{text-decoration: none;color:#000000;}

nav a, .yellow_button, .villa_button, .heading, .yellow_box, .yellow_slide
{
     background-color:#febf01;
}

nav a, .yellow_button a, .villa_button h3, .heading
    {color:#1e5799;} /* blue */
    
.villa_button a
{
    color:#000;
    font-weight: normal;
}

.villa_button a:hover
{
    color:#fff;
}


.vbutton, .sb_buttons, #rates:hover, #rooms:hover
    {color:#febf01} /* yellow */
    

nav a:hover, a:hover
{
    color:white;
    background-color:#1e5799;
}


.vbutton, .titles, .slider_titles, .sb_buttons
{
    background-color:#1e5799;
    text-align: center;
}
.titles
{
    color:white;
}


.vbutton:hover, .slider_titles:hover
{
    color:#1e5799;
    background-color:#febf01;
}

/* section and article styling */

.center
{
    margin-left:auto;
    margin-right:auto;
}

#main
{
    padding-top:175px;
    margin:0px auto 120px auto;
    text-align: center;
}

article a:hover{background-color: transparent;}

article
{
    margin:5px 15px 5px 15px;
}

article p, section p
{
    text-align: left;
}


#costa p
{width:569px;}

article
{
    background: -moz-linear-gradient(top,  rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.7) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.7)), color-stop(100%,rgba(255,255,255,0.7))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.7) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.7) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.7) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.7) 100%); /* W3C */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ffffff', endColorstr='#b3ffffff',GradientType=0 ); /* IE6-9 */*/
}

article
{
    padding:15px 75px 15px 75px;
    margin-bottom:15px;
    width:570px;
    margin-left:auto;
    margin-right:auto;
}

article
{
    border-style:solid;
    border-width:1px;

}

article a
{
    text-decoration: none;
    color:#1e5799;
    font-weight: bold;
}

article a:hover
{
    text-decoration: none;
    color:#febf01;
    font-weight:blod;
}

article h1, section h1
{
    padding:0px;
    margin:0px;
    color:#1e5799;
}




/* Footer styling */
footer
{
    background: -moz-linear-gradient(top,  rgba(254,191,1,0) 0%, rgba(254,191,1,1) 48%, rgba(254,191,1,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,191,1,0)), color-stop(48%,rgba(254,191,1,1)), color-stop(100%,rgba(254,191,1,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(254,191,1,0) 0%,rgba(254,191,1,1) 48%,rgba(254,191,1,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(254,191,1,0) 0%,rgba(254,191,1,1) 48%,rgba(254,191,1,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(254,191,1,0) 0%,rgba(254,191,1,1) 48%,rgba(254,191,1,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(254,191,1,0) 0%,rgba(254,191,1,1) 48%,rgba(254,191,1,1) 100%); /* W3C */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00febf01', endColorstr='#febf01',GradientType=0 ); /* IE6-9 */*/

}

footer
{
    position:fixed;
    /*position:relative;*/
    height:45px;
    width:100%;
    bottom:0;
    padding:28px 0px 0px 15px;
    margin:0px;
    
}

footer h1
{
    padding:0px;
    margin:0px;
}

footer .desingby
{
    font-size: .8em;
    text-align: left;
}

footer a
{
    text-decoration: none;
    color:black;
}

footer a:hover
{
    text-decoration: none;
    color:red;
}


table
{
    border:none;
    padding:0px;
}

th
{
    padding:0px;
    margin:0px;
    background-color:#febf01;
}

section li
{
    text-align: left;
}

section h2
{
    font-weight: normal;
}

#rates, #rooms{margin:0px 0px 5px 0px;color:#ffffff;}

#rates section, #rooms section{margin-top:15px;}



.infobox
{
    background-color:#ffffff;
    margin:0px;
    padding-bottom:0px;
}

.yellow_box, .yellow_slide
{
    color:#000;
    margin:6px;
    padding:1px 1px 6px 1px; 
}

.yellow_box a
{
    text-decoration: none;
    color:#000;
    display:inline-block;
    padding:3px;
}

.yellow_box a:hover
{
    color:#1e5799;
    background-color:transparent;
}

.sb_buttons a
{text-decoration: none;}

.yellow_box .sb_buttons{color:#fff;}
.infobox table
{
    width:80%;
    margin-left:auto;
    margin-right:auto;
}
.yellow_slide
{
    width:960px;
    height:300px;
    margin-left:auto;
    margin-right:auto;  
}

.yellow_slide h1
{
  margin-bottom:0px;
  padding-bottom:0px;
}

.text_scroller
{
    text-align:left;
    padding:0px 0px 0px 0px;
    height:210px;
    width:520px;
    overflow-y:auto;
    margin-top:6px;
    padding-left:10px;
}

.tbl_title
{
    text-align: left;
}

.tbl_value
{
    text-align: center;
}


#rooms.infobox{margin-bottom:10px;}


.ui-datepicker
{
    font-size: .8em;
}

#contact_info p, #contact_info a
{
    text-align: center;
}