@charset "utf-8";
@media screen, projection {
/* ==================== @Base settings ==================== */
html, body, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, table, ul, dd, dt, 
li, tbody, td, tfoot, th, thead, tr, object, a, b, br, dfn, em, i, img, kbd, 
span, strong {
    margin: 0;
    padding: 0;
}

body, html {height:100%;}
body {
    background:#fcf3da url(../img/body-background.jpg) repeat-x 0 0;
    font: 100.01%/1.5 "arial", verdana, helvetica, sans-serif;
    text-align:left;
}

img {border:0; vertical-align:bottom;}
caption {text-align:left; font-weight: normal;}
td, th {text-align:center;}

a {color:#414040; text-decoration:underline;}
a:hover {text-decoration:none;}

p {font-size:1em;}
table, #artforms-text p {font-size:0.75em;}
#artforms-text p {margin-bottom:10px;}
.printOnly {display: none;} /* print js */

h1, h2, h3, h4, h5, h6 {background:transparent; color:#802014;}
h1 {font-size:1.5em;}
h2 {font-size:1.2em;}
h3, h4, h5, h6 {font-size:1.1em;}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#artforms-reqtext {display:none;} /* required formfield joomla */
#container {
	position:relative; 
	width:1003px;  
	margin:0 auto; 
	background:url(../img/back-header.jpg) top center no-repeat; 
	z-index:1;
}

/* ==================== @navigatie ==================== */
#navigatie {position:relative; height:100px;}
#navigatie .logo {float:left; width:80px; margin:18px 0 0 32px; display:inline;}
#navigatie ul {float:right; list-style:none; margin:70px 50px 0 0; height:35px; display:inline;}
	#navigatie li {
		background:url(../img/back-menu.gif);
		float:left; 
		width:auto; 
		margin-right:2px;
		height:35px;
	}
		
	#navigatie li.corfu-tab, 
	#navigatie li.roda-tab {width:68px;}
	#navigatie li.roda-tab {background: url(../img/back-menu.gif) no-repeat -70px 0;}

		#navigatie li.corfu-tab a:hover,
		#navigatie li.corfu-tab a#active_menu-nav {background: url(../img/back-menu.gif) 0 -35px;}
		
		#navigatie li.roda-tab a:hover, 		
		#navigatie li.roda-tab a#active_menu-nav {background: url(../img/back-menu.gif) -70px -35px;}
		
	#navigatie li.appartementen-tab {background:url(../img/back-menu.gif) -140px 0px; width:137px;}
		#navigatie li.appartementen-tab:hover,
		#navigatie li.appartementen-tab a#active_menu-nav {background:url(../img/back-menu.gif) -140px -35px;}
		
		#navigatie li.appartementen-tab a:hover {background:url(../img/back-menu.gif) -140px -35px;}

		#navigatie li a {
			display:block;
			padding:5px 15px;
			text-decoration:none;
			color:#802014;
		}

/* ==================== @main-content ==================== */
#main-content {
	position:relative;
	width:950px; 
	background:#fff; 
	margin:37px auto 0 auto;
	padding:0 15px 10px 15px;
	min-height:480px;
}

	.home #main-content h1, .home #main-content .intro-tekst p {margin-left:17px;}
	.home #main-content .intro-tekst p { 
		font-size:1.0em;
		line-height:1.3em;
		width:525px;
		color:#646262;
	}
	
		.intro-tekst {position:relative; height:auto; padding-top:20px;}
	
	#main-content .image-rotator {
			position:absolute; 
			right:64px; 
			top:-18px; 
			width:253px; 
			height:182px; 
			background:url(../img/rotator-background.jpg) no-repeat;
			z-index:5;
		}
		
				#main-content .image-rotator ul {list-style:none; height:106px; overflow:hidden;}
					#main-content .image-rotator ul li {margin:38px 0 0 41px;}
		
		#sub-nav {float:left; list-style:none; width:160px; padding-right:20px; font-size:0.75em; padding-top:20px;}
		        #sub-nav ul {list-style:none; background:url(../img/stippel_bottom.gif) left top repeat-x;}
	                #sub-nav li {background:url(../img/stippel_bottom.gif) left bottom repeat-x; padding:5px 0;}
					#sub-nav #current a {background:url(../img/subnav-driehoek.gif) 0 4px no-repeat; color:#e5aa3a; text-decoration:none;}
						#sub-nav li:hover {cursor:pointer;}
						#sub-nav li a {padding-left:10px; display:block; color:#802014;}
						#sub-nav li a:hover {color:#e5aa3a; background:url(../img/subnav-driehoek.gif) 0 4px no-repeat;}
						
		#main-text {float:left; width:625px; padding:10px 10px 10px 0;}
			#main-text p {margin-bottom:20px; font-size:0.75em;}
			#main-text a {color:#802014;}
			#main-text img {float:left; padding:8px; margin:5px 16px 0 0; border: 1px solid #E0E0E0;}
			#main-text #gmap {width:500px; height:300px; margin-bottom:15px;} /* Google Maps */
				#main-text #gmap img {padding:0; border:none; margin-top:0;} 
			
/* ==================== @appartementen ==================== */		
.appartementen {
		position:relative;
		background:url(../img/back-appartementen.gif) repeat-x 0 26px; 
		height:200px; 
		padding:0 0 0 10px; 
		margin-top:30px; 
	}
	
	.appartementen h2 {padding-bottom:15px;}
	.appartementen img {float:left; padding:0 10px 0px 0;}
		.appartementen-tekst, .appartementen ul {float:left; }
		.appartementen-tekst {font-size:0.75em; width:290px;}	
			.appartementen-tekst a {font-weight:bold;}
		.appartementen ul {list-style:none; margin:40px 0 0 32px; padding-right:10px; width:280px;}
		.appartementen li {color:#582821; background:url(../img/bullet.gif) 0 5px no-repeat; padding-left:20px; }
		
	.reserveren-fp {
		 float:right; 
		 border-left:14px solid #fff; 
		 width:308px;
		 height:160px; 
		 padding-top:40px; 
		 position:relative;
		 text-align:center;
	 }
	.reserveren-fp h2 {font-size:0.9em; text-align:left; margin-top:-40px; padding-left:10px;}
        .reserveren-fp a.rating {
             font-size:3.0em; 
             color:#802121; 
             text-decoration:none; 
             font-weight:bold;
         }

           .reserveren-fp a.rating span {
                font-size:0.3em; 
                text-decoration:underline; 
                font-style:italic; 
                font-weight:normal; 
                display:block;              
                margin-top:-10px;
           }

           .reserveren-fp a.rating:hover span {text-decoration:none;}
           .reserveren-fp a.reserveer-nu {
                position:absolute;
                left:59px;
                top:140px; 
                background:url(../img/maak-reservering.jpg) 0 0; 
                width:189px; 
                height:35px; 
                text-decoration:none; 
                text-align:center; 
                color:#fff;
                display:block;
                font-weight:bold; 
                font-size:1.3em;
                padding-top:2px;
           }

      .reserveren-fp a.reserveer-nu:hover {background-position:0 -37px;}
	  .photo-album {position:relative; overflow:hidden; margin-bottom:20px; width:600px;}
	  
/* ==================== @eiland+reisverhaal ==================== */
.eiland-blokken {position:relative; height:250px; margin-top:30px;}
	.eiland-blokken h2 {color:#feb62b; padding-bottom:15px;}
	.roda-blok, .korfoe-blok, .carousel {
			float:left;
			background:url(../img/back-geelverloop.gif) repeat-x 0 26px; 
			height:225px;  
			width:287px;
			padding:0 10px;
			font-size:0.75em;
		}
		
                .reisverhalen ul {list-style:none;}
		.korfoe-blok {margin-left:15px; display:inline;}
		.carousel {float:right; padding:0; width:307px;}

	.roda-blok a, .korfoe-blok a, .carousel a.rating {font-weight:bold;}	
	.roda-blok img, .korfoe-blok img, .appartementen img {float:left; padding:5px 10px 0px 0;}
	.carousel table {font-size:1em; margin-top:10px;}
		.carousel td {text-align:left;}
	
/*===================== @skip navigation =======================*/	
#skip {
	position:absolute; 
	right:0;
	top:0;
	text-align:right;
	font-size:0.7em;
	z-index:2;
}

#skip a, #skip a:hover, #skip a:visited {
	position:absolute;
	left:0px;
	top:-500px;
	width:1px;
	height:1px;
	overflow:hidden;
	color: #802014;
	text-decoration: underline;		
}

#skip a:active, #skip a:focus {
	position:static;
	display:block;
	background-color:#fff;
	width:auto;
	height:auto;
	margin-right:20px;
	color: #802014;
	text-decoration: none;
	padding:2px 5px;
}

/*===================== @iframe reserverings formulier =======================*/	
body.contentpane {background:none;}
body.contentpane #navigatie, body.contentpane #footer {display:none;}
body.contentpane #main-content, body.contentpane #main-text {width:auto; margin:0; padding:0; float:none;}
body.contentpane #container {width:625px; margin:0;}

/* ==================== @prijslijst, @autoverhuur en excursies tables ==================== */
.excursies {width:300px; font-size:0.75em; margin-bottom:10px;}
	.excursies .soort-excursie {width:144px;}
	.excursies .dag-excursie {width:120px;}
	.excursies .prijs-excursie {width:40px;}
	.autoverhuur {margin-bottom:20px;}
#prijslijst-appartement, .autoverhuur {width:600px; margin-bottom:15px;}
#prijslijst-appartement td, .autoverhuur td, .excursies td {border-bottom:1px solid #f8e5ad;}
#prijslijst-appartement th {width:64px;}
#prijslijst-appartement th.aantal-personen {width:192px;}
#prijslijst-appartement tr.alt td, .autoverhuur tr.alt td, .excursies tr.alt td {background-color:#fefaf1;}
#prijslijst-appartement tr.over td, 
#prijslijst-appartement tr td.white, 
#prijslijst-appartement tr td.date-white {background-color:#fff;}
#prijslijst-appartement tr td.white {width:25px; border:none;}
#prijslijst-appartement tr td.date-white {border-bottom:none;}
#prijslijst-appartement td.date, 
#prijslijst-appartement tr td.white, 
#prijslijst-appartement tr td.date-white {border-right:1px solid #f8e5ad;}
#prijslijst-appartement .geboekt {font-weight:bold; color:#802014;}
#prijslijst-appartement td {width:50px;}

/* ==================== @jquery-album ==================== */
.jquery-album {list-style:none;}
	.jquery-album li {
		float:left;
		position:relative; 
		width:148px; 
		height:111px; 
		padding:1px; 
		display:inline;
	}
	
	#main-text .jquery-album li a img {
		float:left; 
		z-index:1; 
		padding:0; 
		margin:0; 
		border:none;
	}
	
	.jquery-album li .zoom-img {position:absolute; top:9px; right:5px; z-index:2;}

/* ==================== @jcarousel ==================== */
.jcarousel-container {position: relative;}
.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
	width:295px;
}

.jcarousel-control {
	position:relative; 
	width:290px; 
	height:25px; 
	padding-top:7px;
	margin-bottom:4px;
	padding-left:10px;
}
	.jcarousel-control a, .active-carousel {
		display:block; 
		background:#f8f0d8; 
		color:#000;
		float:right; 
		padding:0 6px;
		margin-right:5px;
		display:inline;
		text-decoration:none;
		border:1px solid #f6d582;
		border-bottom:none;
	}
	
	.jcarousel-control .active-carousel {background:#f6d582;}

.carousel ul {list-style:none; height:170px; overflow:hidden;}
.carousel .jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
	width:300px;
    padding: 0;
}

.carousel li.video-placeholder p {float:right; width:94px;}
.jcarousel-list li img {padding-top:6px;}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    width: 290px;
    height: 152px;
	background-image:none;
	overflow:hidden;
}

.carousel li {padding:0 10px 20px 10px;}
.jcarousel-next, .jcarousel-prev {z-index:3; display:none;}

.jcarousel-item ul.vakantie-voordeel {float:left; width:150px; padding-top:5px;}
	.jcarousel-item ul.vakantie-voordeel li {
		height:auto; 
		width:150px; 
		margin-bottom:10px; 
		padding:0;
	}
		.jcarousel-list li img.voordeel-magazine {
			float:left; 
			border:4px solid #fff; 
			margin:5px 10px 0 0; 
			padding:0;
		}

/* ==================== @footer ==================== */
#footer {
	position:relative;	
	width:950px;
	background-color:#fdde9e;
	padding:5px 15px 10px 15px;	
	margin:0 auto 20px auto;
}

   #footer a {color:#802014; font-size:0.75em; margin-right:10px;}

}  /* don't remove, end screen block */

@media print {
body {
    background:white;
	font-size:12pt;
	font-family:"Times New Roman", Times, serif;
}

#navigatie ul, #footer, #sidebar, #sub-nav, #skip, #gmap, #main-text img, .carousel, .home img, .image-rotator {display: none;}
#navigatie a.logo img {display:block; border:none;}
#main-text {position:static; width:auto; padding:0; margin:0;}
	#main-text h1 {display:block; width:100%;}
	
} /* don't remove, end print block */