/*
	------------------------
	07-12-2016
	alleen tbv website 
	------------------------
*/

body {
	background-color: white;
}

#container {
	/* position: relative; */ 
	width: 100%;
	margin: auto;
	text-align: center; 
	border: 0px solid red;
	/*
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	*/
}


#menu-balk {
  	position: fixed;
  	top: 0px;
  	left: 0px; 
  	width: 100%;
  	height: 100px;
	margin-top: 0px; 
  	background-color: white;
  	z-index: 5;
  	opacity: 0.7;
  	filter: alpha(opacity=70); /* For IE8 and earlier */
}

#menu-balk-content {
  	position: fixed;
  	left:0px;
  	top: 15px; 
  	width: 100%;
  	height: 80px;
  	border: 0px solid red;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
  	z-index: 6;
}

.greybox {
	height: 300px;
	background-color: grey;
	text-align: left;
	overflow: scroll;
	z-index: 3;
}

.gripbox { top: 910px; }

.ipad { 
	position: absolute;
	top: 990px;
	left: 0px;
	width: 100%;
	text-align: center;
	z-index:4; 
}

.formulier {
	position: absolute;
	top: 310px;
	left: 0px;
	width: 100%;
	z-index: 2;
}

titel_text {
	font-size: 40px;
	color: white;
	font-family: Quicksand, Futura, Arial, Verdana;
	/*	font-weight: bold;	*/
}

plat_wit {
	font-size: 16px;
	color: white;
	font-family: Quicksand, Futura, Arial, Verdana;
}


plat_zwart {
	font-size: 16px;
	color: black;
	font-family: Quicksand, Futura, Arial, Verdana;
}

.knop {
	/* standaard knoppen  */
	width: 200px;
	height: 32px;
    background: white;
    border: 1px solid red;
	border-top-left-radius:15px;
	border-bottom-right-radius:15px;
    background: none;
 	font-size: 18px;
	color: white;
	font-family: Quicksand, Futura, Arial, Verdana;
	cursor: pointer;
}
.knop:hover {
    background-color: white;
    color: black;
}


message_text {
	/* na het versturen van formulier */
	font-size: 22px; 
	color: #EEEEEE;	//#666666; 
	font-family: Quicksand, Futura, Arial, Verdana;
}

a {
	font-size: 26px;
	color: black;
	font-family: Quicksand, Futura, Arial, Verdana;
	text-decoration: none;
	cursor: pointer;
}
a:hover {
    color: red;
}

.nav_knop {
	/* navigatie knoppen  */
	width: 350px;
	height: 70px;
    background: white;
    border: 4px solid #666666;
    margin: 0;
    padding: 0;
    font-size: 25px;
    font-family: Quicksand, Futura, Arial, Verdana;
    color: black;
	cursor: pointer;
}

.nav_knop:hover {
    background-color: white;
    box-shadow: 0px 0px 20px #888888;
}



/* Kleinere schermen */
/* @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { */
@media only screen and (min-device-width: 320px) and (max-device-width: 600px) { 
	.ipad { top: 1170px; }
	.greybox { height: 500px; }
	.gripbox { top:1075px; }
	.formulier { top: 600px; }
	
	plat_wit { font-size: 23px; }
	plat_zwart { font-size: 12px; }
}



/* alleen voor pc scherm testen, standaard waarden staan in deze stylesheet */
@media only screen and (max-width: 650px) { 
	.ipad { top: 1010px; }
	.formulier { top: 310px; }
	
	a { font-size: 18px; }
	titel_text { font-size: 30px; }
	plat_wit { font-size: 13px; }
	plat_zwart { font-size: 13px; }


}