@charset "utf-8";
/* CSS Document */


/* GOOGLE FONTS **/
@import url(https://fonts.googleapis.com/css?family=Raleway+Dots);
/*** font-family: 'Raleway Dots', cursive; ***/
@import url(https://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,700,800,900);
/*** font-family: 'Raleway', sans-serif; ***/
@import url(https://fonts.googleapis.com/css?family=Fredericka+the+Great);
/*** font-family: 'Fredericka the Great', cursive; ***/
@import url(https://fonts.googleapis.com/css?family=Cedarville+Cursive);
/*** font-family: 'Cedarville Cursive', cursive; ***/
@import url(https://fonts.googleapis.com/css?family=Julius+Sans+One);
/*** font-family: 'Julius Sans One', sans-serif; ***/

/* eind google fonts **/
body{
	margin:100px;
	font-family: 'Raleway', sans-serif;
	color:hsla(0,0%,100%,1.00);
	line-height:135%;
	}
	
body,td,th {
	font-family: Raleway, sans-serif;
	}

li {
	font-family: 'Raleway', sans-serif;
	line-height:200%;
	}

h1, h2, h3, h4, h5, h6{
	font-family: 'Raleway', sans-serif;
	font-weight:100;
	/*text-transform: uppercase;*/
	}
	
h1{
	/*font-family: 'Raleway', sans-serif;*/
	font-family: 'Fredericka the Great';
	font-size: 30px;
	color: hsla(0,0%,90%,1.00);
	/*font-variant:small-caps;*/
	margin-bottom: 5px;
	font-weight: lighter;
}

h2{
	font-size:12px;
	color: hsla(0,0%,100%,1.00);
	/*font-variant:small-caps;*/
	margin-bottom:-10px;
}

h4{
	padding-left:0px;
	color: hsla(0,0%,100%,1.00);
	}
		
a:link {
	text-decoration: none;
	color: hsla(0,0%,100%,1.00);
	font-weight:500;
	}
	
a:active {
	}

a:visited {
	color: hsla(0,0%,100%,1.00);
	}

a:hover {
	background-size: contain;
	background-color: hsla(0,0%,0%,1.00);
	color: hsla(0,0%,100%,1.00);
	font-size:100%;
	font-weight:600;
	}

/** MENU **/	
.menu{
	position:absolute;
	left:0%;
	top:8%;
	/*font-family: 'Raleway', sans-serif;*/
	/*font-family: 'Fredericka the Great';*/
	color: hsla(0,0%,100%,1.00);
	opacity:0.9;
	margin-bottom:-10px;
	overflow:visible;
	
	}

#menu_bar{
	width: 545px;
	height: 81px;
	background-color: hsla(0,0%,0%,0.50);
	z-index: 0
	}
	
#menu_logo{
	position:absolute;
	top:0px;
	left:190px;
	z-index: 1;
	}
	
.menu_bg{

	width: 380px;
	height: 80px;
	background-color: hsla(0,0%,0%,0.60);
	z-index: 0;
	padding-left: 20px;
	padding-top: 1px;
	padding-bottom: 0px;
	padding-right: 0px;
	}
		
.titel a:link {
	text-decoration: none;
	color: hsla(209,100%,85%,1.00);
	font-weight: 400;
	}
	
.titel a:active {
	}

.titel a:visited {
	color: hsla(0,0%,100%,1.00);
	font-weight: 900;
	font-size:32px;
	}

.titel a:hover {
	color: hsla(0,0%,100%,1.00);
	}

.subtitel{
	font-family: 'Fredericka the Great';
	font-size:20px;
	color: hsla(0,0%,0%,1.00);
	font-variant:small-caps;
	line-height:- 0px;
	}
	
/*********************************/
img{
	border:0px;
	border-radius:8px;
	box-shadow:hsla(0,0%,100%,1.00);
	}
	

.container{
	position:relative;
	height:100%;
	width:800px;
	margin: 0 auto;
	z-index:1;
	background-color:#636;
	}
	
.content{
	width:600px;
	margin:0 auto;
	}
	

	

.opsomming{
	line-height:10%;
	}
	
opsomming.li{
	line-height:10%;
	color:hsla(359,61%,50%,1.00);
	}
	
/* items */
.btn_home{
	background-image:url(beelden/driehoek.gif);
	background-repeat:no-repeat;
	background-size:auto;
	width:40px;
	height:40px;
	cursor:pointer;
	display:block;
	}

/*** navigatie ***/	
.knoppen{
	position:absolute;
	top:0px;
	left:0px;
	z-index:50;
	cursor:pointer;
}

.vorige{
	position:absolute;
	left:0px;
	width:80px;
	height:400px;
	background-color:hsla(359,50%,75%,0.0);
	cursor:pointer;
	z-index:00;
	opacity:0.3;
	margin:0px;
	}

.volgende{
	position: absolute;
	width: 80px;
	height: 400px;
	background-color: hsla(359,50%,55%,0.0);
	cursor: pointer;
	z-index: 00;
	margin:0px;
	opacity:0.3;
	float:right;
	}
	
/*** fotos ***/

.bg{
	/*background-image:url(beelden/light/foto-001.JPG);*/
	background-size:cover;
	background-repeat:no-repeat;
	background-color:hsla(0,0%,0%,1.00);
}


/*** testelementen ***/
#demo{
	position:relative;
	top:500px;
	left:200px;
	width:300px;
	height:75px;
	z-index:10;
	visibility:hidden;
}

#klap img{
	transform: rotate(90deg)  scale(0.5);
	border: rgba(231,8,11,1.00) dashed thick;
}
