@charset "UTF-8";
/* CSS Document */
<!--
body {
	font: 12px/1.2 Arial, Verdana, Helvetica, sans-serif;
	background: #FFF;
	margin: 0;
	padding: 0;
	color: #000;
}

/* ~~ Element-/tagkiezers ~~ */
ul, ol, dl { /* Vanwege de verschillen tussen browsers kunt u het beste geen opvulling en marges gebruiken voor lijsten. Voor consistentie kunt u hier of bij de items (LI, DT, DD) voor de lijsten de gewenste waarden opgeven. Houd er rekening mee dat wat u hier doet, wordt gebruikt in de navigatielijst, tenzij u een specifiekere kiezer opgeeft. */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* als u de bovenmarge verwijdert, voorkomt u dat marges buiten de div vallen waartoe ze behoren. De resterende ondermarge zorgt ervoor dat er ruimte blijft tussen de div en alle volgende elementen. */
	padding-right: 15px;
	padding-left: 15px; /* als u opvulling toevoegt aan de zijkant van de elementen in de divs, in plaats van aan de divs zelf, voorkomt u dat u kadermodelberekeningen moet uitvoeren. U kunt als alternatief een geneste div met opvulling aan de zijkant gebruiken. */
}

h3 {
	font: 14px; 
	margin-top: 0;	 /* als u de bovenmarge verwijdert, voorkomt u dat marges buiten de div vallen waartoe ze behoren. De resterende ondermarge zorgt ervoor dat er ruimte blijft tussen de div en alle volgende elementen. */
	padding-right: 15px;
	padding-left: 15px; /* als u opvulling toevoegt aan de zijkant van de elementen in de divs, in plaats van aan de divs zelf, voorkomt u dat u kadermodelberekeningen moet uitvoeren. U kunt als alternatief een geneste div met opvulling aan de zijkant gebruiken. */
}
a img { /* met deze kiezer verwijdert u de blauwe standaardrand die in bepaalde browsers wordt weergeven rond een afbeelding als deze wordt omgeven door een koppeling */
	border: none;
}

/* ~~ De stijl voor de koppelingen op uw site moet deze volgorde aanhouden, inclusief de groep kiezers waarmee het aanwijseffect wordt gemaakt. ~~ */
a:link {
	color: #06C;
	text-decoration: underline; /* tenzij u zeer unieke opmaak toepast op uw koppelingen, kunt u de koppelingen het beste onderstrepen zodat ze gemakkelijk te herkennen zijn */
}
a:visited {
	color: #06C;
	text-decoration: underline;
}
a:hover, a:active, a:focus { /* met deze groep kiezers krijgen gebruikers die navigeren met een toetsenbord, dezelfde aanwijsfunctionaliteit als gebruikers die werken met een muis. */
	text-decoration: none;
}

/* ~~deze container met vaste breedte omvat de overige divs~~ */
.container {
	width: 1005px;
	background: #FFF;
	margin: 0 auto; /* de lay-out wordt gecentreerd via de combinatie van de automatische waarde voor de zijkanten en de breedte */
}

/* ~~ voor de koptekst wordt geen breedte ingesteld. De koptekst loopt over de volledige breedte van uw lay-out en bevat een tijdelijke aanduiding voor een afbeelding, die u moet vervangen door uw eigen gekoppelde logo ~~ */
.header {
	width: 1005px;
	background: #FFF;
	padding-bottom: 10px;
}

/* ~~ Dit zijn de kolommen voor de lay-out. ~~ 

1) Opvulling wordt alleen boven en/of onder aan de divs geplaatst. De elementen binnen deze divs hebben opvulling aan de zijkanten. Hierdoor hoeft u geen kadermodelberekeningen uit te voeren. Houd er rekening mee dat als u opvulling aan de zijkant of een rand aan de div toevoegt, deze opvulling wordt toegevoegd aan de waarde die u definieert voor de totale breedte. U kunt ook de opvulling voor een element in de div verwijderen en in de div een tweede div invoegen die geen breedte heeft, maar wel de benodigde opvulling voor uw ontwerp bevat.

2) Er is geen marge ingesteld voor de kolommen omdat deze allemaal zwevend zijn. Als u marge moet toevoegen, moet u dit niet doen aan de kant waarnaar de kolom zweeft (bijvoorbeeld een rechtermarge voor een div die is ingesteld op zweven naar rechts). Vaak kunt u hiervoor opvulling gebruiken. Bij divs waarvoor u deze regel niet kunt toepassen, moet u een declaratie 'display:inline' toevoegen aan de regel van de div om een fout op te lossen waarbij in sommige versies van Internet Explorer de marge wordt verdubbeld.

3) Omdat klassen meerdere keren kunnen worden gebruikt in een document en meerdere klassen kunnen worden toegepast op een element, zijn aan de kolommen klassenamen toegewezen in plaats van id's. U kunt bijvoorbeeld zo nodig twee zijbalk-divs stapelen. Desgewenst kunt u deze eenvoudig wijzigen in id's, zolang u maar ervoor zorgt dat u ze één keer per document gebruikt.

4) Indien gewenst kunt u de navigatie aan linkerkant plaatsen in plaats van aan de rechterkant. Hiervoor hoeft u alleen de kolommen in tegenovergestelde richting te laten zweven (allemaal naar links in plaats van naar rechts), waarna ze in omgekeerde volgorde worden weergegeven. U hoeft de divs niet te verplaatsen in de HTML-broncode.

*/
.sidebar1 {
	float: right;
	width: 248px;
	padding-top: 10px;
	padding-bottom: 10px;
}
.sidebarchalet {
	float: right;
	width: 170px;
	padding-top: 10px;
	padding-bottom: 10px;
}
.content {
	padding: 5px 0;
	width: 745px;
	float: right;
}

.iframe {
	width: 1005px;
	margin: 0 auto;
}

.chalet {
	width: 835px;
	float: right;
}

.twitter-volg {
	width: 250px;
	height: 65px;
	float: left;
	background:#EDEDED;
	}

.kolom155 {
	width: 155px;
	height: 65px;
	float: left;
	background:#EDEDED;
	}

.kolom200 {
	width: 200px;
	height: 65px;
	float: left;
	background:#EDEDED;
	}


/* ~~ De gegroepeerde kiezer zorgt voor de ruimte van de lijsten in het inhoudsgebied ~~ */
.content ul, .content ol { 
	padding: 0 15px 15px 40px; /* deze opvulling is gespiegeld aan de rechteropvulling in de voorgaande regel voor koppen en alinea's. De opvulling is onderaan geplaatst zodat er ruimte ontstaat tussen overige elementen in de lijsten en is aan de linkerkant geplaatst om de inspringing te maken. Deze opvulling kunt u naar wens aanpassen. */
}

/* ~~ De stijlen voor navigatiebalken (kunnen worden verwijderd als u een voorgedefinieerd vlieguit-menu, bijvoorbeeld Spry, gebruikt) ~~ */
ul.nav {
	list-style: none; /* hiermee verwijdert u de lijstmarkering */
	border-top: 1px solid #666; /* hiermee maakt u de bovenrand voor de koppelingen - de overige worden geplaatst via een onderrand op de LI */
	margin-bottom: 15px; /* hiermee stelt u de ruimte in tussen de navigatie en de inhoud eronder */
}
ul.nav li {
	border-bottom: 1px solid #666; /* hiermee maakt u de scheiding voor knoppen */
}
ul.nav a, ul.nav a:visited { /* als u deze kiezers groepeert, behouden de koppelingen het knopuiterlijk ook nadat erop de koppelingen is geklikt */
	padding: 5px 5px 5px 15px;
	display: block; /* hiermee krijgt de koppeling de blokeigenschappen, waardoor de koppeling de hele LI in het blok vult en het volledige gebied reageert op een muisklik. */
	width: 200px;  /*met deze breedte kan op de volledige knop worden geklikt in Internet Explorer 6. Als u IE6 niet ondersteunt, kunt u dit verwijderen. U kunt de juiste breedte berekenen door de opvulling voor deze koppeling af te trekken van de breedte van de zijbalkcontainer. */
	text-decoration: none;
	background: #C6D580;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* hiermee wijzigt u de achtergrond en tekstkleur van muis- en toetsenbordnavigatie */
	background: #ADB96E;
	color: #FFF;
}

/* ~~ De voettekst ~~ */
.footer {
	padding: 10px 0;
	background:#EDEDED;
	position: relative;/* hiermee kan de eigenschap hasLayout voor IE6 op de juiste wijze worden gewist */
	clear: both; /* met deze eigenschap voor wissen kan de container bepalen waar de zwevende kolommen eindigen en ze insluiten */
}

/* ~ diverse klassen voor zweven/wissen ~~ */
.fltrt {  /* met deze klasse kunt u een element aan de rechterkant van uw pagina laten zweven. Het zwevende element moet voorafgaan aan het element waarnaast het op de pagina staat. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* met deze klasse kunt u een element aan de linkerkant van uw pagina laten zweven. Het zwevende element moet voorafgaan aan het element waarnaast het op de pagina staat. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* deze klasse kunt u gebruiken voor een <br> of een lege div als het laatste element dat volgt op de laatste zwevende div (binnen de container) wanneer de voettekst uit de container is verwijderd of er buiten is geplaatst */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
-->

.top5 {
font-size: 2.5em; font-weight: 900; color: #36C;}

/* deze klasse is voor het menu aan de rechterkant */

.buttonscontainer {
	width: 190px;
	border: solid white;
}

.buttons a {
	color: #000;
	background-color: #EDEDED;
	padding: 2px;
	padding-left: 3px;
	display: block;
	border-left: 8px solid white;
	font: 13px Arial, sans-serif;
	text-decoration: none;
	text-align: left;
	margin-top: 1px;
	}

.buttons a:hover {
	border-left: 8px solid #999;
	text-decoration: none;
	color: #FFFFFF;
	background-color: #999;
}
.buttons a:visited  {
	border-left: 8px solid #EDEDED;
	text-decoration: none;
	font-family: Arial, sans-serif;
	font-size: 13px;
}

/*stylesheet voor hoofdmenu*/

html .jqueryslidemenu{height: 1%;} /*Holly Hack for IE7 and below*/

.jqueryslidemenu{
	font:  13px Arial;
	background: #EDEDED;
	width: 100%;
	font-weight: bold;
}

.jqueryslidemenu ul{
margin: 0;
padding: 0;
list-style-type: none;
}

/*Top level list items*/
.jqueryslidemenu ul li{
position: relative;
display: inline;
float: left;
}

/*Top level menu link items style*/
.jqueryslidemenu ul li a{
	display: block;
	background: #EDEDED; /*background of tabs (default state)*/
	color: #FFF;
	padding: 8px 10px;
	border-right: 1px solid #CCC;
	color: #CCC;
	text-decoration: none;
}

* html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}

.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{
	color: #36c;
}

.jqueryslidemenu ul li a:hover{
	background: #ccc;
}
	
/*1st sub level menu*/
.jqueryslidemenu ul li ul{
position: absolute;
left: 0;
display: block;
visibility: hidden;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul{
top: 0;
}

/* Sub level menu links style */
.jqueryslidemenu ul li ul li a{
	font: normal 13px Arial;
	width: 180px; /*width of sub menus*/
	padding: 5px;
	margin: 0;
	border-top-width: 0;
	border-bottom: 1px solid #CCC;
}

.jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/
	background: #666;
	color: #36c;
	}

/* ######### CSS classes applied to down and right arrow images  ######### */

.downarrowclass{
position: absolute;
top: 12px;
right: 1px;
}

.rightarrowclass{
position: absolute;
top: 6px;
right: 5px;
}


/* ------------------------ 
   GENERAL CLASSES & ID'S
   ------------------------ */	
   
.erceemedia {
	font-size: 11px;
	color: #666;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
}

.copyright {
	font-size: 11px;
	color: #666;
	text-align: left;
}

.centreer {
	text-align: center;
}

.sneeuwtip780 {
	border: 1px solid #b8b8b8;
	margin-bottom: 1em;
	width: 740px;
}

.sneeuwtip780 .innerdiv {
	background: transparent url(images/hoekje.gif) bottom right no-repeat;
	position: relative;
	left: 2px;
	top: 2px;
	padding: 1px 4px 15px 5px;
	font-size: 12px;
}


.border { padding: 4px;	border: 1px solid #ccc; } /* simple border */

.borderLeft {float: left; padding: 4px;	border: 1px solid #ccc; } /* simple border */
.border2 {
	padding: 4px;
	border: 1px solid #ccc;
	background-color: #fafafa;
	text-align: left;
} /* simple border w/background color */
	
.borderfloatL { /* poloroid style border w/float left */ 
	float: left;
	padding: .5em .5em 2em .5em;
	margin: 0 10px 10px 0; 
	border-top: 1px solid #ebebeb; 
	border-right: 1px solid #efefef; 
	border-left: 1px solid #f4f4f4; 	
	background: #ffffff url(images/shadow-btm.png) repeat-x bottom; }

.borderfloatR { /* poloroid style border w/float right */ 
	float: right;
	padding: .5em .5em 2em .5em;
	margin: 0 0 10px 10px; 
	border-top: 1px solid #ebebeb; 
	border-right: 1px solid #efefef; 
	border-left: 1px solid #f4f4f4; 	
	background: #ffffff url(images/shadow-btm.png) repeat-x bottom; }

.borderfloatR p, .borderfloatL p { /* poloroid style text */ 
	margin: 0 0 -6px 0px ; 
	font: 7pt Arial, sans-serif; 
	color: #333; 
	text-align: left;
}
	
.cred {
	color: #990000;
	font-weight: bold;
} /* color red */
.cblue {
	color: #3366CC;
	font-weight: bold;
} /* color blue */
.cgreen {
	color: #006633;
	font-weight: bold;	
} /* color green */

.cgrey {
	color: #666;
	font-weight: bold;	
} /* color grey */

.cblack {
	color: #000;
	font-weight: bold;	
} /* color grey */


.land {
	font: bolder 14px Arial, Verdana sans-serif;
	color: #990000;
}/* color red 14pc */
.center { text-align: center; }	
.clear { clear: both; }
.floatL { float: left; margin: 0 10px 0 0; } /* basic float left */ 
.floatR { float: right; margin: 0 0 0 10px; } /* basic float right */ 
.right { text-align: right; }
.xsmall {
	font-size: x-small;
	text-align: right;
	background-color: #36C;
	color: #FFF;
}
.xxsmall { font-size: xx-small; }

/* --------------------------- 
   END General Classes & ID's
   --------------------------- */		

	
/* -------------------------------------------
	MAIN MENU SECTION - Standaard verticaal
	------------------------------------------- */
#menu ul { list-style: none; margin: 0; padding: 0; }
#menu li { list-style: none; display: inline; }
#menu { width: 200px; border: 1px solid #999; margin: 10px 10px 10px 0; }
#menu li a { height: 32px; voice-family: "\"}\"";  voice-family: inherit; height: 24px; text-decoration: none; }
#menu li a:link, #menu li a:visited { color: #333; font: bold 12px Verdana; display: block; background: url(images/menu.gif); padding: 8px 0 0 20px; }
#menu li a:hover, #menu li #current, #menu li a:active { color: #000; font: bold 12px Verdana; background: url(images/menu.gif) 0 -32px; padding: 8px 0 0 20px; text-indent: 4px; }

/* -------------------------------------------
	MAIN MENU SECTION -  Vakantieparken
	------------------------------------------- */
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

#underlinemenu{
margin: 0;
padding: 0;
}

#underlinemenu ul{
margin: 0;
margin-bottom: 1em;
padding-left: 0;
float: left;
font-weight: bold;
width: 100%;
border: 1px solid #DFDFDF;
border-width: 1px 0;
}

* html #underlinemenu ul{ /*IE only rule. Delete extra margin-bottom*/
margin-bottom: 0;
}

#underlinemenu ul li{
display: inline;
}

#underlinemenu ul li a{
float: left;
color: black;
font-size: 14px;
font-weight: bold;
padding: 2px 6px 4px 6px;
text-decoration: none;
background: white url(image/menudivide.gif) top right repeat-y;
}

#underlinemenu ul li a:hover{
color: black;
background-color: #F3F3F3;
border-bottom: 4px solid black;
padding-bottom: 0;
}

/*subunderline menu */
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.subunderlinemenu{
font-weight: bold;
width: 100%;
}

.subunderlinemenu ul{
padding: 6px 0 7px 0; /*6px should equal top padding of "ul li a" below, 7px should equal bottom padding + bottom border of "ul li a" below*/
margin: 0;
text-align: left; /*set value to "left", "center", or "right"*/
}

.subunderlinemenu ul li{
display: inline;
}

.subunderlinemenu ul li a{
color: #494949;
padding: 6px 3px 4px 3px; /*top padding is 6px, bottom padding is 4px*/
margin-right: 15px; /*spacing between each menu link*/
text-decoration: none;
border-bottom: 3px solid gray; /*bottom border is 3px*/
}

.subunderlinemenu ul li a:hover, .sub_ underlinemenu ul li a.selected{
border-bottom-color: black;
}
/* ---------------------
   END Main Menu Section
	--------------------- */
.menukop {
	font-size: 14px;
	font-weight: bolder;
	color: #666;
	text-align: center;
}

/* ---------------------- 
   CALENDAR Style section 
	---------------------- */

.daysofweek {
	background-color: #ebebeb;
	font: 10px verdana;
	color: #333; }

.Linkskop {
	font: bold 14px Arial, "Verdana sans-serif";
	color: #666666;
	padding-bottom: 4px;
}
.links {
	font: 14px Arial, "Verdana sans-serif";
	color: #3366CC;
	}

#centreer {
	text-align: center;
}
center {
	text-align: left;
}
p {
	text-align: left;
}

.reclamekop {
	font-size: 13px;
	}
	
.rotatie {
	font: bolder 14px Arial, "Verdana sans-serif";
	color: #3366CC;
	text-align: center;
	}

.belvilla {
	font: bolder 16px Arial, "Verdana sans-serif";
	color: #36C;
	background-color: #CCC;
	text-align: left;
}

/* font Google */
.z-magra {
	font-family: 'Magra', sans-serif;
	font-size: 16px;
	color:#03C
}
.z-magra12 {
	font-family: 'Magra', sans-serif;
	font-size: 12px;
	color:#03C
}
.z-magra14 {
	font-family: 'Magra', sans-serif;
	font-size: 14px;
	color:#03C
}
.zw-magra16 {
	font-family: 'Magra', sans-serif;
	font-size: 16px;
	color:#000
}
.zw-magra14 {
	font-family: 'Magra', sans-serif;
	font-size: 14px;
	color:#000
}
.zw-magra {
	font-family: 'Magra', sans-serif;
	font-size: 12px;
	color:#000
}
