@charset "utf-8";
@import url("../webfonts/helvetica_neue_etext_w01_light/stylesheet.css");
@import url("../webfonts/Zapfino/stylesheet.css");


/* CSS Document */

/* ~~ 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. 
	color: #9FF;
	text-align: left;
}
	*/
h1 {
	font-size: 60px;
	font-family: berkshire-swash;
	font-style: normal;
	font-weight: 400;
	color: #99CCFF;
}
/* CSS Document */

/* ~~ 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. 
	color: #9FF;
	text-align: left;
}
	*/
h11 {
	font-size: 60px;
	font-family: berkshire-swash;
	font-style: normal;
	font-weight: 400;
	color: #99CCFF;
}
h2	{font-size:24px;}

/* ~~ De stijl voor de koppelingen op uw site moet deze volgorde aanhouden, inclusief de groep kiezers waarmee het aanwijseffect wordt gemaakt. ~~ */
/* a:link {
	color: #66CCFF;
	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: #6E6C64; 
	color: #66CCFF;
	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;
}
*/
body {
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
/*	color: #066; 
	background-image: url();
	background-repeat: no-repeat;*/
}

#fsbg {
	width: 100%;
	position: fixed;
	z-index: -100;
	left: 0px;
	top: 0px;
	min-height: 100%;
	min-width: 1024px;
	height: auto;
	opacity: 0.55px;
	
}

/* ~~ deze container met vaste breedte omvat alle overige divs ~~ */
.container {
	width: 80%;
	/*	background: #FFF;*/
	margin: auto; /* de lay-out wordt gecentreerd via de combinatie van de automatische waarde voor de zijkanten en de breedte */
	overflow: hidden; /* met deze declaratie kan de container bepalen waar de zwevende kolommen eindigen en ze insluiten */
	height: 65cm;
	position: relative;
	left: auto;
	margin-top: 0cm;
/*  background: rgb(0,153,204);
	background: rgba(0,0,0,0.3); */
}
/* .sidebar2 {
	float: left;
	width: 26cm;
	height: 16cm;
	position: absolute;
	left: 0cm;
	top: 0px;
	backface-visibility: hidden;
	visibility: visible;
	text-align: left;
}
*/

.header {
	height: 100px;
}
/*.content {

	padding: 10px 0;
	width: 0px;
	float: left;
}


/* ~~ 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. */

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: 195px;  /*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;
}
.footer {
	padding: 10px 0;
	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 voor een <br /> of een lege div gebruiken als het laatste element dat volgt op de laatste zwevende div (binnen de container) wanneer overflow:hidden is verwijderd uit de container */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
.circle_image {
	width:80px;
	height:80px;
	border-radius:50%;
}

/* navagatie opmaak */
ul {
	padding: 0px;
	margin-top: 0%;
	margin-right: 0%;
	margin-left: 20%;
	list-style-type: none;
	z-index: -200;
}
ul li {
	text-align: center;
	font-size: 1em;
	width: 150px;
	float: left;
	text-decoration: none;
}
ul li a {
	text-decoration: none;
	color: #FFCC00;
	display: block;
	padding-top: 2px;
	padding-left: 5px;
	padding-right: 16px;
	padding-bottom: 14px;
	font-weight: 400;
	font-variant: normal;
	font-size: 1em;
	font-style: italic;
	font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
	margin-top: 0px;
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 2px;
	border-top: thin solid #F9F7F7;
	text-align: center;
}
nav {
	margin-left: 8%;
	width: 81%;
}

ul li a:hover {
	color: #99CCFF;
	border-top-width: medium;
	display: block;
	font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
	font-style: italic;
	font-variant: normal;
	font-weight: 400;
	font-size: 1em;
}
ul li ul li {
	display: none;
	font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
	font-style: italic;
	font-variant: normal;
	font-weight: 400;
	font-size: 13px;
}

ul li:hover ul li {
	display: block;
	background-color: #2E3741;
}



#kt_bonaire {
	position: relative;
	width: 50%;
	height: 108px;
	z-index: 4;
	left: 25%;
	top: 21px;
	text-align: center;
	visibility: visible;
	font-weight: 400;
	font-family: berkshire-swash;
	font-style: normal;
	color: rgb(153,153,153);
	right: 25%;
/*	text-shadow: 5px 5px 5px #999; */
}

/* #home{
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 125px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	/*visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}*/
/*#boeknu {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #F90;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 817px;
	width: 84;
	z-index: 7;
	top: 20px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	/*visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}*/

#about_starshipvillas {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 100;
	font-family: berkshire-swash;
	left: 7px;
	width: auto;
	z-index: 7;
	top: 175px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}
#about_bonaire {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 225px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}

#villas {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #FFF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 5px;
	width: 84;
	z-index: 7;
	top: 265px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}

#villa_volans {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: auto;
	z-index: 7;
	top: 475px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}
#villa_cassiopeia {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 325px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}
#villa_lyra {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 275px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}

#villa_aquila {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 425px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}


#villa_cepheus {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 375px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}
#activiteiten {
	position: absolute;
	height: 26px;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 525px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	border-radius: 0px;
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}
#contact {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 575px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}
#prijzen {
	position: absolute;
	height: auto;
	z-index: 1;
	color: #0FF;
	font-weight: 400;
	font-family: berkshire-swash;
	left: 7px;
	width: 84;
	z-index: 7;
	top: 625px;
	cursor: pointer;
	margin: 0px;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
	vertical-align: central;
	list-style-type: circle;
	/*border-radius: 50px;*/
	visibility: visible;
	text-align: left;
	border: solid;
	border-width: thin;
	font-style: normal;
}
#apDiv1 {
	position: absolute;
	width: 80%;
	/* [disabled]height: 500px; */
	z-index: 8;
	left: auto;
	top: 150px;
	visibility: visible;
	font-size: 16px;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	padding-left: 10%;
	padding-right: 10%;
}
#apDiv3 {
	position: absolute;
	width: 391px;
	height: 213px;
	z-index: 8;
	left: 30%;
	visibility: visible;
	font-size: 16px;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	margin-left: auto;
}

	
/*********************************/
#blk_text_home {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 36px;
	font-style: normal;
	font-weight: bold;
	color: rgb(255,204,0);
	text-align: center;
}
#blk_text_ab_starship {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: normal;
	color: rgb(255,255,255);
	text-align: left;
}
#bewerkbaar {
	position: absolute;
	width: 550px;
	height: 397px;
	z-index: 8;
	left: 192px;
	top: 140px;
}

.tabel {
	color: #FFF;
	font-family: Arial, Helvetica, sans-serif;
}
.italic {
	font-style: italic;
}
#blk_text_ab_bonaire {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
	font-size: 16px;
	font-style: normal;
	text-align: left;
}
.blk_text {
	font-size: 16px;
	font-style: normal;
	text-align: left;
	color: rgb(255,255,255);
}
h3   {
	color: rgba(255,188,43,1.00);
	font-family: Zapfino;
	font-style: normal;
	font-weight: 400;
	font-size: 20pt;
	font-variant: normal;
	text-decoration: none;
	text-align: center;
}
h34   {
	color: rgba(255,188,43,1.00);
	font-family: Zapfino;
	font-style: normal;
	font-weight: 400;
	font-size: 15pt;
	font-variant: normal;
	text-decoration: none;
	/* [disabled]width: 80%; */
	text-align: left;
}
h31   {
	color: rgba(255,188,43,1.00);
	font-family: alex-brush;
	font-style: normal;
	font-weight: 400;
	font-size: 30pt;
	font-variant: normal;
	text-decoration: none;
	float: right;
}
h32   {
	color: rgba(255,188,43,1.00);
	font-family: alex-brush;
	font-style: normal;
	font-weight: 400;
	font-size: 30pt;
	font-variant: normal;
	text-decoration: none;
	float: none;
	width: 0%;
}


.links_nav {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
	font-size: 14px;
	position: absolute;
	width: 55px;
	height: 50px;
	left: 2px;
	top: 520px;
	color: rgb(255,255,255);
	font-style: italic;
	border: 1px none #000000;
	cursor: pointer;
	background-image: url(../images/prev.png);
	background-repeat: no-repeat;
}
.rechts_nav {
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
	font-size: 14px;
	position: absolute;
	width: 55px;
	height: 50px;
	left: 650px;
	top: 520px;
	color: rgb(255,255,255);
	font-style: italic;
	border: 1px none #000000;
	cursor: pointer;
	background-image: url(../images/next.png);
	background-repeat: no-repeat;
}
.container .sidebar2 #apDiv1 .blk_text p {
	font-size: 16px;
}
.p {
	font-family: actor;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
}
p {
	font-family: "helvetica neue etext w01 light";
	font-size: 21px;
	font-style: normal;
	font-weight: 400;
	color: #FFFFFF;
	font-variant: normal;
	text-align: justify;
}
#video {
	margin-left: 15%;

}
#apDiv2 {
	visibility: hidden;
	z-index: -11;
}