@charset "UTF-8";
/* CSS Document */

body {
	font-family: "PT Sans", sans-serif;
	background: #fff;
	margin: 0;
	padding: 0;
	color: #000;
	background-image: url(LogoVT003grijs.png);
    background-size: 30% ;
	background-repeat: no-repeat;
 	background-attachment:fixed;
 	background-position:center bottom 50px; 
}
ul, ol, dl {
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	padding-right: 15px;
	padding-left: 15px;
	font-family: "PT Sans", sans-serif;
	color: #000;
}
a img {
	border: none;
}
a:link {
	color:#e05c59;
	text-decoration: none;
}
a:visited {
	color: #4E5869;
	text-decoration: underline;
}
a.geel:link {color: #EDED6F; text-decoration: none;}
a.geel:visited {color: #EDED6F; text-decoration: none;}
a.geelspatie:link {color: #EDED6F; text-decoration: none; letter-spacing: 2px;}
a.geelspatie:visited {color: #EDED6F; text-decoration: none; letter-spacing: 2px;}
a.geel:hover {color: #fff; text-decoration: none;}
a.grijs:link {color: #666; text-decoration: none;}
a.grijs:visited {color: #666; text-decoration: none;}
a.grijs:hover {color: #e05c59; text-decoration: none;}
a.black:link {color: #000; text-decoration: none;}
a.black:visited {color: #000; text-decoration: none;}
a.black:hover {color: #e05c59; text-decoration: none;}
.hoofdkader {
	width: 80%;
	max-width: 1360px;
	min-width: 780px;
	background-color: none;
	margin: 0 auto;
	font-size:0;
	font-family: "PT Sans", sans-serif;
}
.fixed-nav-bar {
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 50px;
	background-color: #9966CC;
}
.fixed-nav-bar2 {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	height: 50px;
}
.full-width-bar {
	position: absolute;
	top: 830;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 145px;
	background-color: #9966CC;
}
.full-width-bar2 {
	position: absolute;
	top: 830;
	left: 0;
	z-index: 1;
	width: 1250;
	height: 145px;
	background-color: #9966CC;
}
#footer {
   position:absolute;
   left:0px;
   bottom:0px;
   height:300px;
   width:100%;
   background:#0F9;
}
#apDiv1 {
	position:absolute;
	left:545px;
	top:753px;
	width:105px;
	height:85px;
	z-index:5;
}
#apDiv2 {
	position:absolute;
	left:55px;
	top:287px;
	width:126px;
	height:158px;
	z-index:7;
}
#apDiv3 {
	position:absolute;
	left:796px;
	top:259px;
	width:250px;
	height:87px;
	z-index:7;
}
#apDiv4 {
	position:absolute;
	left:54px;
	top:608px;
	width:400px;
	height:57px;
	z-index:20;
}
#apDiv5 {
	position:absolute;
	left:153px;
	top:394px;
	width:210px;
	height:213px;
	z-index:19;
}
#apDiv6 {
	position:absolute;
	left:62px;
	top:232px;
	width:251px;
	height:150px;
	z-index:10;
}
#apDiv7 {
	position:absolute;
	left:808px;
	top:251px;
	width:227px;
	height:160px;
	z-index:17;
}
#apDiv8 {
	position:absolute;
	left:252px;
	top:694px;
	width:135px;
	height:169px;
	z-index:11;
}
#apDiv9 {
	position:absolute;
	left:402px;
	top:910px;
	width:349px;
	height:67px;
	z-index:12;
}
#apDiv10 {	
	position:absolute;
	left:14px;
	top:434px;
	width:206px;
	height:93px;
	z-index:9;
}
#apDiv11 {	
	position:absolute;
	left:14px;
	top:20px;
	width:60px;
	height:20px;
	z-index:21;
}
#apDiv12 {
	position:absolute;
	width:200px;
	height:115px;
	z-index:21;
	left: 824px;
	top: 556px;
}
.bovenkader {
	background: #FFF;
	height: 80px;
	padding-left: 15px;
	padding-top: 55px;
	font-size:0;
	font-family: "PT Sans", sans-serif;
}
.content {
	margin-left: 55px;
	background-color:rgba(180,180,100,100.10);
}
.contentbleu {
	margin-left: 55px;
	font-family: "PT Sans", sans-serif;
	font-size: 0px;
	background-color:rgba(180,180,180,100.10);
}

/* ~~ 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. */
	font-family: "PT Sans", sans-serif;
}

/* ~~ De voettekst ~~ */
.footer {
	padding: 10px 0;
	background: none;
	height: 140px;
}
.footerabsolute {
	position: absolute;
	bottom: 0px;
	padding: 10px 0;
	background-size: 100% auto;
	background: rgba(180,180,100,100.10);
	height: 200px;
}
.topfooter {
        clear:both;
        background:none;
        min-height:40px;
}

/* ~ 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;
}
.zwart {
	font-family: "PT Sans", sans-serif;
	font-size: 16px;
	line-height: 120%;
	color: #000;
	letter-spacing: 0px;
}
.zwart12 {
	font-family: "PT Sans", sans-serif;
	font-size: 12px;
	line-height: 100%;
	color: #000;
	letter-spacing: 0px;
}
.zwart14 {
	font-family: "PT Sans", sans-serif;
	font-size: 14px;
	line-height: 100%;
	color: #000;
	letter-spacing: 0px;
}
.zwart16 {
	font-family: "PT Sans", sans-serif;
	font-size: 16px;
	line-height: 110%;
	color: #000;
	letter-spacing: 0px;
}
.zwart20 {
	font-family: "PT Sans", sans-serif;
	font-size: 20px;
	line-height: 100%;
	color: #000;
	letter-spacing: 1px;
}
.zwart16space2 {
	font-family: "PT Sans", sans-serif;
	font-size: 16px;
	line-height: 100%;
	color: #000;
	letter-spacing: 2px;
}
.zwartspacing {
	font-family: "PT Sans", sans-serif;
	font-size: 18px;
	line-height: 120%;
	color: #000;
	letter-spacing: 4px;
}
.lichtblauw {
	font-family: "PT Sans", sans-serif;
	font-size: 18px;
	line-height: 300%;
	color: #ACE5EC;
	letter-spacing: 4px;
}
.Blauw24 {
	font-family: "PT Sans", sans-serif;
	font-size: 24px;
	line-height: 120%;
	color: #3E5476;
	letter-spacing: 8px;
}
.LichtBlauw24 {
	font-family: "PT Sans", sans-serif;
	font-size: 24px;
	line-height: 120%;
	color: #ACE5EC;
	letter-spacing: 8px;
}
.Rood_donker {
	font-family: "PT Sans", sans-serif;
	font-size: 18px;
	line-height: 120%;
	color: #db2b25;
	letter-spacing: 2px;
}
.Rood24 {
	font-family: "PT Sans", sans-serif;
	font-size: 24px;
	line-height: 120%;
	color: #db2b25;
	letter-spacing: 8px;
}
.Rood_licht {
	font-family: "PT Sans", sans-serif;
	font-size: 18px;
	line-height: 120%;
	color: #e05c59;
	letter-spacing: 2px;
}
.Geel12 {
	font-family: "PT Sans", sans-serif;
	font-size: 12px;
	line-height: 120%;
	color: #EDED6F;
	letter-spacing: 2px;
}
.Geel14 {
	font-family: "PT Sans", sans-serif;
	font-size: 14px;
	line-height: 120%;
	color: #EDED6F;
	letter-spacing: 2px;
}
.Geel16 {
	font-family: "PT Sans", sans-serif;
	font-size: 16px;
	line-height: 120%;
	color: #EDED6F;
	letter-spacing: 8px;
}
.Geel18 {
	font-family: "PT Sans", sans-serif;
	font-size: 18px;
	line-height: 120%;
	color: #EDED6F;
	letter-spacing: 8px;
}
.Geel24 {
	font-family: "PT Sans", sans-serif;
	font-size: 24px;
	line-height: 120%;
	color: #EDED6F;
	letter-spacing: 8px;
}
.wit18 {
	font-family: "PT Sans", sans-serif;
	font-size: 18px;
	line-height: 300%;
	color: #FFF;
	letter-spacing: 4px;
}
.wit20 {
	font-family: "PT Sans", sans-serif;
	font-size: 20px;
	line-height: 120%;
	color: #FFF;
	letter-spacing: 1px;
}
.wit24 {
	font-family: "PT Sans", sans-serif;
	font-size: 24px;
	color: #FFF;
	letter-spacing: 6px;
	line-height:110%;
}
.wit24_8 {
	font-family: "PT Sans", sans-serif;
	font-size: 24px;
	color: #FFF;
	letter-spacing: 8px;
	line-height:120%;
}
.wit14 {
	font-family: "PT Sans", sans-serif;
	font-size: 14px;
	color: #FFF;
	letter-spacing: 6px;
	line-height:110%;
}
.grijs14 {
	font-family: "PT Sans", sans-serif;
	font-size: 14px;
	color: #9398B3;
	letter-spacing: 6px;
	line-height:110%;
}
.fade {
	font-family: "PT Sans", sans-serif;
	font-size: 28px;
	opacity: 1;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
}

.fade:hover {
      opacity: 0.5;
}
.fade2 {
   opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
   }
.fade2:hover {
      opacity: 0.5;
	  color: #e05c59;
}
.nav-fade li {
   background: #9ed2d7;
   padding: 3px 8px;
   display: inline-block;
   transition: background .25s ease-in-out;
   -moz-transition: background .25s ease-in-out;
   -webkit-transition: background .25s ease-in-out;
   }

.nav-fade li:hover {
	background: #edeb07;
}
.kleinekop {
	font-family: "PT Serif Caption", serif;
	color: #666;
	font-size: 60px;
	letter-spacing: -2px;
	line-height:70%;
	padding-left: 8px;
	opacity: 1;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
	margin-bottom: 20px;
}
.kleinekop:hover {
	opacity: 0.5;
	color: #e05c59;
	font-family: "PT Serif Caption", serif;
}
.Afwijkend {
	font-family: "PT Serif Caption", serif;
	color: #666;
	font-size: 138px;
	letter-spacing: -2px;
	line-height:70%;
	padding-left: 8px;
	opacity: 1;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
	margin-bottom: 20px;
}
.Afwijkend:hover {
	opacity: 0.5;
	color: #e05c59;
	font-family: "PT Serif Caption", serif;
}
.Grotekop {
	font-family: 'PT Serif Caption', serif;
	color: #666;
	font-size: 100px;
	letter-spacing: -2px;
	line-height:45%;
	padding-left: 8px;
}
.Grotekopfade {
	font-family: "PT Sans", sans-serif;
	color: #666;
	font-size: 70px;
	letter-spacing: 3px;
	line-height:90%;
	padding-left: 10px;
	opacity: 1;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
	margin-bottom: 20px;
}
.Grotekopfade:hover {
	opacity: 0.5;
	color: #e05c59;
	font-family: "PT Sans", sans-serif;
}
.Grotekopwit {
	font-family: "PT Sans", sans-serif;
	color: #FFF;
	font-size: 100px;
	letter-spacing: 1px;
	line-height: 85%;
}
.Kleinekop {
	font-family: 'PT Serif Caption', serif;
	color: #F5FFC5;
	font-size: 24px;
	letter-spacing: 8px;
	line-height:45%;
	padding-left: 8px;
}
.Intro {
	font-family: 'PT Sans', sans-serif;
	color: #000;
	font-size: 28px;
}
.groot {
	font-size: 24px;
	line-height: 120%;
	font-family: "PT Sans", sans-serif;
}
.grootwit {
	font-size: 24px;
	color: #FFF;
	line-height: 120%;
	font-family: "PT Sans", sans-serif;
}
.grootspatie {
	font-size: 24px;
	line-height: 120%;
	letter-spacing: 1px;
}
.pijlbox {
	position: absolute;
	bottom: 200px;
	font-size: 0px;
}
.bodem {
	position: relative;
	bottom: 30px;
	padding-left: 15px;
	font-family: "PT Sans", sans-serif;
}
.toplinks {
	position: absolute;
	top: 10px;
	width: auto;
	font-family: "PT Sans", sans-serif;
}
.toplinks_kort {
	position: absolute;
	top: 30px;
	width: 400px;
	font-family: "PT Sans", sans-serif;
}
.text { 
	background:#FFF; 
	opacity:0; 
} 
.text:hover {
	height: 120px;
	opacity:0.8;
	color:#000000;
	font-size:20px;
	font-weight:400;
	font-family: "PT Sans", sans-serif;
	padding:15px;
	padding-top: 23px;
}
.kopwit {
	font-family: "PT Sans", sans-serif;
	color: #FFF;
	font-size: 80px;
	letter-spacing: 1px;
	line-height: 100%;
}
.bottomleft { 
	position: absolute; 
	bottom: 0; 
	left: 8px; 
	width: 1200px; 
	font-weight: bold; 
	color: #fff
}
.right {
    position: absolute;
    right: 0px;
    width: 300px;
}
#magicBox {
	padding: 0;
	background: #FFF;
	color: #000;
	font-size: 16px;
	line-height: 20px;
	border: 2px solid #F00;
}
#navWrap {
   height: 30px;
}
#nav {
   background-image: none;
}
#nav ul {
   margin: 0;
   padding: 0;    
}
#nav li {
	float: left;
	color: #000;
	list-style-type: none;
}
#nav li a {
	color: #433A41;
	text-decoration: none;
}
#nav li a:hover {
	text-decoration: #F00;
}
br.clearLeft {
   clear: left;        
}​
.wrapper {
  width: 1360px;
  margin: 0 auto;
  position: relative; /* Ensure absolute positioned child elements are relative to this */
}

/* Absolute positioned wrapper for the element you want to fix position */
.fixed-wrapper {
	width: 80%;
	max-width: 1360px;
	position: absolute;
	top: 0px;
	min-width: 780px;/* wellicht is het verstandig dat u een minimumbreedte instelt om te voorkomen dat deze lay-out te smal wordt. Zo zorgt u ervoor dat de regels in zijkolommen goed leesbaar blijven. Deze declaratie werkt niet in Internet Explorer 6. */
	margin: 0 auto; /* de lay-out wordt gecentreerd via de combinatie van de automatische waarde voor de zijkanten en de breedte. Als u de breedte van de container instelt op 100%, hebt u dit niet nodig. */
	font-family: "PT Sans", sans-serif;
}

/* The element you want to fix the position of */
#video_background {
	min-width: 100%;
	min-height: 100%;
	background-repeat: no-repeat;
 	background-attachment:fixed;
	z-index: -1000;
	overflow: hidden;
}
.hr { 
	margin-left: 0px;
	color: #000; 
	background: #000; 
	width: 200px; 
	height: 1px; 
}.hrinspring { 
	margin-top: 35px;
	margin-left: 15px;
	color: #000; 
	background: #000; 
	width: 200px; 
	height: 1px; 
}
.btn01 {
  background: #fcfcfc;
  background-image: -webkit-linear-gradient(top, #fcfcfc, #f0f3f5);
  background-image: -moz-linear-gradient(top, #fcfcfc, #f0f3f5);
  background-image: -ms-linear-gradient(top, #fcfcfc, #f0f3f5);
  background-image: -o-linear-gradient(top, #fcfcfc, #f0f3f5);
  background-image: linear-gradient(to bottom, #fcfcfc, #f0f3f5);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: "PT Sans", sans-serif;
  color: #000000;
  font-size: 13px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}

.btn01:hover {
  background: #e8eaeb;
  background-image: -webkit-linear-gradient(top, #e8eaeb, #cdcecf);
  background-image: -moz-linear-gradient(top, #e8eaeb, #cdcecf);
  background-image: -ms-linear-gradient(top, #e8eaeb, #cdcecf);
  background-image: -o-linear-gradient(top, #e8eaeb, #cdcecf);
  background-image: linear-gradient(to bottom, #e8eaeb, #cdcecf);
  text-decoration: none;
}
span.dropt {border: none; background: none;}
span.dropt:hover {text-decoration: none; background: #EDED6F; z-index: 6; }
span.dropt span {position: absolute; left: -9999px;
  margin: 20px 0 0 0px; padding: 3px 3px 3px 3px;
  border-style:solid; border-color:black; border-width:0,5px; z-index: 6;}
span.dropt:hover span {left: 2%; background: #ffffff;} 
span.dropt span {position: absolute; left: -9999px;
  margin: 4px 0 0 0px; padding: 15px 15px 15px 15px; 
  border-style:solid; border-color:black; border-width:1px;}
span.dropt:hover span {margin: 20px 0 0 170px; background: #ffffff; z-index:6;}

.white_button{
   border-top: 1px solid #969696;
   background: #000000;
   background: -webkit-gradient(linear, left top, left bottom, from(#949dc1), to(#949494));
   background: -webkit-linear-gradient(top, #949dc1, #949494);
   background: -moz-linear-gradient(top, #949dc1, #949494);
   background: -ms-linear-gradient(top, #949dc1, #949494);
   background: -o-linear-gradient(top, #949dc1, #949494);
   padding: 5px 10px;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   box-shadow: none;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: #EDED6F !important;
   font-size: 14px;
   text-decoration: none;
   vertical-align: middle;
   }
.white_button:hover {
   border-top-color: #4f4f4f;
   background: #4f4f4f;
   color: #ccc;
   text-decoration:none;
   }
.white_button:active {
   border-top-color: #4a4a4a;
   background: #4a4a4a;
   }


.width-150px{
    width: 150px;
    display: inline-block;
}
.showme{
	position: relative;
	background-size: 100% auto;
	display: none;
	background: #FFF; 
	opacity:0;
}
.showhim:hover .showme{
	display : block;
	opacity: 0.5;
	color: #000;
	font-family: "PT Sans", sans-serif;
	font-size: 16px;
	line-height: 100%;
	letter-spacing: 0px;
}


.grow {
    height: 100px; /* Origional height */
    width: 22%; /* Origional width */
    margin: 5px 1% 5px 1%; /* Just for presentation (Not required) */
    float: left; /* Just for presentation (Not required) */
    position: relative; /* Just for presentation (Not required) */
    transition:height 0.5s; /* Animation time */
    -webkit-transition:height 0.5s; /* For Safari */
}
.grow:hover {
    height: 115px; /* This is the height on hover */
}
.dropbtn {
    background-color: #4CAF50;
    color: white;
    padding: 16px;
    border: none;
    cursor: pointer;
}
.dropdown {
    position: relative;
	z-index: 14;
    display: inline-block;
}
.dropdown-content {
	display: none;
	position: absolute;
	background-color: #C9C1FF;
	min-width: 260px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown-content a {
    color: black;
    padding: 2px 16px;
    text-decoration: none;
    display: block;
}
.dropdown-content a:hover {background-color: #f1f1f1}
.dropdown:hover .dropdown-content {
    display: block;
}
.dropdown:hover .dropbtn {
    background-color: #3e8e41;
}