/* CSS Document */



#dikkelijn
{
	border-top-style:solid;
	border-width:10px;
	border-color:#39C;	
	position:absolute;
	top:220px;
	left:0px;
	width:100%;	
}

/* ***************************titel + tekst ------- visie team filmpjes**************************/

#titel
{
	position: absolute;
	top: 300px;
	left: 50px;
	width: calc(100% - 100px);
	height:65px;
	background-color: #39C;
	font-size: 36pt;	
	color: white;
	padding-left:10px;
	
}


#tekst_team
{
	position: absolute;
	top: 365px;
	left: 50px;
	width: calc(100% - 100px);
	height: 800px;
	/*min-width: 400 px;*/
	background-color: #E7E7E7;
	font-size:22px;
	/*border-bottom-style:solid;*/ /*want titelbalk voor experts hieronder */
	border-width: 10px;
	border-color: #39C;	
	padding-left:10px;
}


#tekst_visie
{
	position: absolute;
	top: 365px;
	left: 50px;
	width: calc(100% - 100px);
	height: 1450px;
	/*min-width: 400 px;*/
	background-color: #E7E7E7;
	font-size:22px;
	border-bottom-style:solid;
	border-width: 10px;
	border-color: #39C;	
	padding-left:10px;
}

#tekst_filmpjes
{
	position: absolute;
	top: 365px;
	left: 50px;
	width: calc(100% - 100px);
	height: 1250px;
	/*min-width: 400 px;*/
	background-color: #E7E7E7;
	font-size:22px;
	border-bottom-style:solid;
	border-width: 10px;
	border-color: #39C;	
	padding-left:10px;
}

#tekst_clubs
{
	position: absolute;
	top: 365px;
	left: 50px;
	width: calc(100% - 100px);
	height: 525px;
	/*min-width: 400 px;*/
	background-color: #E7E7E7;
	font-size:22px;
	border-bottom-style:solid;
	border-width: 10px;
	border-color: #39C;	
	padding-left:10px;
}

#tekst_contact
{
	position: absolute;
	top: 365px;
	left: 50px;
	width: calc(100% - 100px);
	height: 525px;
	/*min-width: 400 px;*/
	background-color: #E7E7E7;
	font-size:22px;
	border-bottom-style:solid;
	border-width: 10px;
	border-color: #39C;	
	padding-left:10px;
}

/*****************************   TEAM *******************/
ul
{
 	list-style-type:square;	
}

img.Team_foto
{
width:200px ;
height:200px ;
}

span.uitleg
{
	position: absolute;
	left: 300px;	
	/*display:inline-block;
	width: 400px;
	text-align:center;*/
	
}

/*
span.experts_titel
{
	display:inline-block; width:200px; text-align:center;
	
}

#experts_opsomming
{
	position: absolute;
	left: 400px;	
}
#experts_opsomming_2
{
	position: absolute;
	left: 400px;	
	margin-top: 90px;
}
#experts_opsomming_3
{
	position: absolute;
	left: 400px;	
	margin-top: 190px;
}
#experts_opsomming_4
{
	position: absolute;
	left: 400px;	
	margin-top: 270px;
}
#experts_opsomming_5
{
	position: absolute;
	left: 400px;	
	margin-top: 360px;
}

*/

#dropt_kristof 
{ 
	background: #39C; 	
	display:inline-block;
	width:200px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 20%;
	top: 20px;
}
#kristof_foto
{
	position: absolute;
	left: 20%;
	top: 45px;	
}

#CV_kristof
{
	position: absolute;
	top: 275px;
	left: 75px;
	background-color: white;	 /* #E7E7E7; */
	width: calc(100% - 150px);
	height: 450px;
	visibility: hidden;
}

img.CV
{
	height: 100%; 
	width: 100%; 
	object-fit: contain;
}

#dropt_linda
{ 
	background: #39C; 	
	display:inline-block; 
	width:200px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 45%;
	top: 20px;
}
#linda_foto
{
	position: absolute;
	left: 45%;
	top: 45px;	
}
#CV_linda
{
	position: absolute;
	top: 275px;
	left: 75px;
	background-color: white;	 /* #E7E7E7; */
	width:calc(100% - 150px);
	height: 450px;
	visibility: hidden;
}

#dropt_bram
{ 
	background: #39C; 	
	display:inline-block; 
	width:200px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 70%;
	top: 20px;
}
#bram_foto
{
	position: absolute;
	left: 70%;
	top: 45px;	
}
#CV_bram
{
	position: absolute;
	top: 275px;
	left: 75px;
	background-color: white;	 /* #E7E7E7; */
	width:calc(100% - 150px);
	height: 450px;
	visibility: hidden;
}

#CV_keuze
{
	position: absolute;
	top: 275px;
	left: 75px;
	background-color: white;	 /* #E7E7E7; */
	font-size:24px;
	text-align:center;
	color: black;
	width:calc(100% - 150px);
	height: 450px;
}

/*    EXPERTS      */

#titel_experts
{
	position: absolute;
	top: 1165px;
	left: 50px;
	width: calc(100% - 100px);
	height:65px;
	background-color: #39C;
	font-size: 36pt;	
	color: white;
	padding-left:10px;
	
}

@media screen and (min-width: 1200px) {
#tekst_experts
{
	position: absolute;
	top: 1230px;
	left: 50px;
	width: calc(100% - 100px);
	height: 1000px;
	/*min-width: 400 px;*/
	background-color: #E7E7E7;
	font-size:22px;
	border-bottom-style:solid;
	border-width: 10px;
	border-color: #39C;	
	padding-left:10px;
}
}

@media screen and (max-width: 1199px) {
#tekst_experts
{
	position: absolute;
	top: 1230px;
	left: 50px;
	width: calc(100% - 100px);
	height: 1300px;
	/*min-width: 400 px;*/
	background-color: #E7E7E7;
	font-size:22px;
	border-bottom-style:solid;
	border-width: 10px;
	border-color: #39C;	
	padding-left:10px;
}
}

img.Expert_foto
{
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
#titel_expert_1
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 50px;			/* begint te tellen vanaf tekst_experts ...*/
}
#foto_expert_1
{
	position: absolute;
	left: 75px;
	top: 75px;	
	background-color: white;
	width: 400px;
	height: 200px;
}
#info_expert_1
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 275px;			/* begint te tellen vanaf tekst_experts ...*/
}
/* ------------------  Groot scherm ---------------------- */
@media screen and (min-width: 1200px) {
#titel_expert_2
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 600px;
	top: 50px;			/* begint te tellen vanaf tekst_experts ...*/
}
}
@media screen and (min-width: 1200px) {
#foto_expert_2
{
	position: absolute;
	left: 600px;
	top: 75px;
	background-color: white;
	width: 400px;
	height: 200px;	
}
}
@media screen and (min-width: 1200px) {
#info_expert_2
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 600px;
	top: 275px;			/* begint te tellen vanaf tekst_experts ...*/
}
}

@media screen and (min-width: 1200px) {
#titel_expert_3
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 400px;			/* begint te tellen vanaf tekst_experts ...*/
}
}
@media screen and (min-width: 1200px) {
#foto_expert_3
{
	position: absolute;
	left: 75px;
	top: 425px;	
	background-color: white;
	width: 400px;
	height: 200px;
}
}
@media screen and (min-width: 1200px) {
#info_expert_3
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 625px;			/* begint te tellen vanaf tekst_experts ...*/
}
}

@media screen and (min-width: 1200px) {
#titel_expert_4
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 600px;
	top: 400px;			/* begint te tellen vanaf tekst_experts ...*/
}
}
@media screen and (min-width: 1200px) {
#foto_expert_4
{
	position: absolute;
	left: 600px;
	top: 425px;
	background-color: white;
	width: 400px;
	height: 200px;	
}
}
@media screen and (min-width: 1200px) {
#info_expert_4
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 600px;
	top: 625px;			/* begint te tellen vanaf tekst_experts ...*/
}
}
	
/* ---------------------- GSM ------------------------- */

@media screen and (max-width: 1199px) {
#titel_expert_2
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 350px;			/* begint te tellen vanaf tekst_experts ...*/
}
}
@media screen and (max-width: 1199px) {
#foto_expert_2
{
	position: absolute;
	left: 75px;
	top: 375px;
	background-color: white;
	width: 400px;
	height: 200px;	
}
}
@media screen and (max-width: 1199px) {
#info_expert_2
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 575px;			/* begint te tellen vanaf tekst_experts ...*/
}
}

@media screen and (max-width: 1199px) {
#titel_expert_3
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 650px;			/* begint te tellen vanaf tekst_experts ...*/
}
}
@media screen and (max-width: 1199px) {
#foto_expert_3
{
	position: absolute;
	left: 75px;
	top: 675px;	
	background-color: white;
	width: 400px;
	height: 200px;
}
}
@media screen and (max-width: 1199px) {
#info_expert_3
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 875px;			/* begint te tellen vanaf tekst_experts ...*/
}
}

@media screen and (max-width: 1199px) {
#titel_expert_4
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 950px;			/* begint te tellen vanaf tekst_experts ...*/
}
}
@media screen and (max-width: 1199px) {
#foto_expert_4
{
	position: absolute;
	left: 75px;
	top: 975px;	
	background-color: white;
	width: 400px;
	height: 200px;
}
}
@media screen and (max-width: 1199px) {
#info_expert_4
{
	background: #39C; 	
	display:inline-block; 
	width:400px; 
	text-align:center; 
	color: white; 
	position:absolute; 
	left: 75px;
	top: 1175px;			/* begint te tellen vanaf tekst_experts ...*/
}
}


/*    VISIE */

.blauw
{
	 background: #39C;
	 color: white;
	 display:inline-block;
	 padding-left: 5px;		/* kleine marge links en rechts */
	 padding-right: 5px;
	 
}


/* ------------------------- FILMPJES --------------------------- */



#filmpje_1_groot
{
	position: absolute;
	top: 50px;
	left: 100px;
}

#filmpje_1_gsm
{
	position: absolute;
	top: 50px;
	left: 100px;
}	


/*****************************   SPELERS *******************/

ul.spelers
{
 	list-style-type:none;	
}

span.eerste_kolom
{
	
	display:inline-block; width:200px; text-align:center;
	
}

span.tweede_kolom
{
	position: absolute;
	left: 750px;
	
}

img.speler_overzicht
{
	width: 200px;
	height: 200px;	
}

span.eerste_kolom:hover span{ z-index: 6; left: 2%;}
span.eerste_kolom span {position: absolute; left: -9999px;										/* kader */
  margin: 4px 0 0 0px; padding: 3px 3px 3px 3px; 
  border-style:solid; border-color:black; border-width:1px;}
span.eerste_kolom:hover span {position: absolute; left: 300px; width: 400px; margin-top: -200px; background: #ffffff; z-index:6;} 	

span.tweede_kolom:hover span{ z-index: 6; left: 2%;}
span.tweede_kolom span {position: absolute; left: -9999px;										/* kader */
  margin: 4px 0 0 0px; padding: 3px 3px 3px 3px; 
  border-style:solid; border-color:black; border-width:1px;}
span.tweede_kolom:hover span {position: absolute; left: -450px; width: 400px; margin-top: -200px; background: #ffffff; z-index:6;} 	

/********************************************************/
html {
    position: relative;
    min-height: 100%;
}

body {
    margin: 0 0 100px; /* bottom = footer height */
    padding: 25px;
}

