@charset "utf-8";
/* villa-sfakoi.co.uk Stylesheet by themightyant.com */

* {
	margin:0; padding:0;
}
html {
	background-color: #4E80BB; 
	font-family:"Segoe UI", "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
	color:#fff;
	clear:both;
}
body {
	background-color: #4E80BB; 
	width:900px; 
	margin:30px auto;
	padding:0 30px;
	-webkit-text-size-adjust:100%;
	clear:both;
}
section {
	float:left;
	width:570px;
	height:221px;
	padding:0px;
	margin-bottom:30px;
	display:table;
	border: 2px solid #89ace2;
}
section#top {
	border:0;
	padding:0;
	position:relative;
}
section h1 {
	margin:12px 18px;
	font-size:18px;
}
section#top h1 {
	background:url('../images/villa-sfakoi-rental-corfu-kassiopi-greece.gif') 0 0 no-repeat; 
	text-indent:-9999px;
	width:559px;
	height:35px;
	margin:20px 0;	
}
section h2, section h3 {
	margin:12px 18px;
	font-size:17px;
}
section#top h2, section#top h3 {
	font-size: 16px;
	line-height:22px;
	margin:0 0 10px 0;
	font-weight: bold;
	font-family: "Trebuchet MS", Tahoma, sans-serif;
	color: #FFFFFF;
}
nav ul {
	margin-top:25px;
}
nav ul li {
	list-style-type:none;
	display:inline;
	padding-right: 28px;
}
nav ul li.last-child, nav ul li:last-child {
	padding-right:0;
}
nav a:link, nav a:visited {
	color:#fff;
	text-decoration:none;
}
nav a:hover, nav a:focus, nav a:active, nav a.selected {
	color:#fff;
	text-decoration:none;
	border-bottom:2px solid #89ace2;
}
article {
	display:table-cell;
	vertical-align:middle;
}
p, article ul {	
	font-family: "Segoe UI", "Trebuchet MS", Tahoma, sans-serif;
	font-size: 13px;
	line-height: 18px;
	color: #FFFFFF;
	text-align: justify;
	margin:18px;
}
p.bottomP {
	margin-bottom:5px;
}
p a:link, p a:visited {
	color:#fff; 
	text-decoration:none;
	border-bottom:2px solid #89ace2;
}
p a:hover, p a:focus, p a:active {
	color:#ddd;
	border-bottom:2px solid #fff;
}
h4 {
	font-size:17px; 
	border-bottom:2px solid #89ace2; 
	margin-bottom:20px;
	padding-bottom:3px;
}
.clearit {
	clear:both;
}
article ul {
	margin:8px 18px;
}
article ul li {
	list-style-position:inside;
}
.col {
	width:240px;
}
.left {
	float:left;
}
.right {
	float:right;
}

aside {
	float:right;
}
aside.gallery {
	float:left; 
	margin-right:20px; 
	margin-bottom:16px;
}
aside.gallery.last {
	margin-right:0px;
}
aside.gallery img {
	width:210px;
	height:159px;
}
img, #gallery img.top-img {
	width:300px;
	height:225px;
}
img.tall {
	height:433px;
}
img.rate-table {
    height:244px;
}
a.lightbox{
	position:relative;
	display:inline-block;
	font-size:0;
	line-height:0;
}
a.lightbox:after{
	position:absolute;
	top:0px;
	left:0px;
	bottom:0px;
	right:0px;
	border:2px solid rgba(255,255,255,0.6);
	content:" ";
}
a:hover.lightbox:after{
	position:absolute;
	top:0px;
	left:0px;
	bottom:0px;
	right:0px;
	border:2px solid rgba(255,255,255,1.0);
	content:" ";
}
table {
	width:530px;
	margin:5px 0 5px 18px;
	font-size:14px;
	border-spacing: 0;
	text-align:right;
	border:none;
}
.large {
	margin:15px 0 15px 18px;
}
th {
	font-weight:bold;
	padding:1px 5px;
}
td {
	padding:1px 5px;
}
.odd {
	background-color:#6591C5;
}
.date {
	width:50%;
	text-align:left;
}
.price {
	width:25%;
}
footer {
	clear:both;
}
img.holiday-lettings {
	width:auto;
	height:auto;
	border:none;
   opacity:0.7;
   -webkit-transition:opacity 250ms ease;
   transition: opacity 250ms ease;
}
img.holiday-lettings:hover {
   opacity:1;   
}

/* Mobile Stylesheet - 2015 */
@media screen and (max-width: 960px) {

    body {
        width: 100%;
        margin: 30px auto;
        padding: 0 30px;
        box-sizing: border-box;
    }
    section#top h1 {
        width: 100%;
        height: auto;
        margin: 5px 0 15px;
        padding-bottom: 1.5%;
        background-size: contain;
    }
    nav a:link, nav a:visited {
        white-space: nowrap;
        margin-bottom: 5px;
        display: inline-block;
    }    
    section {
        float: left;
        width: 100%;
        width: calc(100% - 4px);
        height: auto;
        text-align: left;
    }
    aside {
        float: none;
        display: inline-block;
        margin-bottom: 25px;
        margin-right: 25px;
    }    
    img, #gallery img.top-img {
        max-width: 100%;
        width: auto;
        height: auto;
    }
    .col {
        width: 44%;
        width: calc(50% - 36px);
    }
    table {
        width: 96%;
        width: calc(100% - 36px);
    }
    #gallery { 
        text-align: center; 
    }
    aside.gallery {
       display: inline-block;
       float: none;
    }
   #gallery aside:first-of-type {
       display: none;
    }
    aside.gallery.last { 
        margin-right: 20px; 
    }
}

@media screen and (max-width: 740px) {

    body {
        margin: 20px auto;
        padding: 0 20px;
        text-align: center;
    }
    section#top {
        text-align: center;
        width: 100%;
    }
    section {
       float: none;
    }

    aside {
        margin-bottom: 17px;
        margin-right: 0;
    }   
     

}


@media screen and (max-width: 540px) {
    
    .col {
        width: auto;
    }
    nav ul li {
        padding-right: 19px;
    }

    .left, 
    .right { 
        float: none; 
    }
    
}