@charset "UTF-8";


html {height:100%}
body {
	margin:0;
  min-width:400px;
  width:100%;
  height:101%;
  background:#eee;
  color:#333;
  font:76%/1.6 verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;
}
img {
	max-width: 100%;
}

#wrapper{
  margin:0 auto;
  padding:15px 15%;
  text-align:left
}
#content {
  max-width:70em;
  width:100%;
  margin:0 auto;
  padding-bottom:20px;
  overflow:hidden
}
.demo {
  margin:0;
  padding:1.5em 1.5em 0.75em;
  border:1px solid #ccc;
  position:relative;
  overflow:hidden
}
.collapse p {padding:0 0px 1em}
.top{font-size:.9em; text-align:right}
#switch, .switch {margin-bottom:5px; text-align:right}

#knop {
	background-image:url(img/knop.png);
	width:338px;
	height:52px;
	color:#fff;
	margin-left:-4px;

}
#knop1 {
	background-image:url(img/knop.png);
	width:338px;
	height:52px;
	color:#fff;
	float:right;
}



#knop a {
	font-family:"proxima-nova",sans-serif;
	font-size:20px;
	padding:2px;
	text-align:center;
	line-height:50px;
}

.main {
	background-color:#333;	
}


/* --- Headings  --- */


h1 {
  font-family: "proxima-nova",sans-serif;
  font-weight:700;
  font-size:50px;
  line-height:50px;
  text-align:left;
  margin-top:0px;
  margin-bottom:20px;	
  }
 
 .tk-proxima-nova {

 }

  
h1.logo {
	font-size:14px;	
	margin-bottom:10px;
 }
   
.wit {
	color:#fff;	 
 }
  
.oranje {
	color:#f5740c;
}
  
h2{font-size:1em}


h3 {
	text-align:left;
}

h4 {
	font-family:"proxima-nova";
	font-style:oblique;
	font-size:13px;
	
	}

p {
	text-align:left;
	
}

.stappen {
	font-size: 1.2em;
}

.inleiding {
	font-size: 16px;
	font-style: italic;
}

.expand{padding-bottom:.75em}

/* --- Links  --- */

a {
	color:#f5740c;	
}

a:link, a:visited {
	text-decoration:none;
}
a:hover, a:active, a:focus {

}
a:active, a:focus {
  color:red;
}
.expand a {
}
h2 a {
	color:#FF0004;
	margin:10px;
}

.expand a:link, .expand a:visited {
  color:#fff;
}
.expand a:hover, .expand a:active, .expand a:focus {
}
.expand a.open:link, .expand a.open:visited {
 
}

.header {
	background-color:#FFFFFF;
	width:100%;	
	margin: 0 auto;
}
.navigatie {
	margin:0px auto; 
	max-width:1020px;	
	padding:0 50px;
}

.navigatie a {

}

#contact {
	padding: 5px 20px;
	margin-left:5px;
	top: 5px;
	z-index: 100;
	float:left;
	background-color:#fff;
	border:solid 1px #f5740c;
	border-radius:3px;
	font-size:16px;		
}

#contact2 {
	padding: 5px 20px;
	top: 5px;
	z-index: 100;
	float:left;
	background-color:#f5740c;
	border:solid 1px #f5740c;
	border-radius:3px;
	font-size:16px;	
}
a #contact2  {
	color:#fff;
}

.topmenu {
	position: fixed;
	top: 5px;
	right: 20%;
	width: 220px;
	height: 22px;
	z-index: 100;
}


.segment {
	width: 100%;
	clear: both;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}



.inner {
	margin:0 auto;
	padding:50px;
	max-width:1024px;	
}
.l-col {
	width:50%;
	float:left;
}
.r-col {
	width:50%;
	float:left;
}

/*#banner  {
	background-image: url(img/blauw.png);
	background-position:top;
	z-index:0;
}*/
#id1.segment  {
	background-image:url(img/aanraking.png);
	background-position:top;
	background-repeat:no-repeat;
	overflow:hidden;
	min-height: 400px;
	background-color:#fff;
	top: -10px;
}

#id2.segment  {
	background-image:url(img/roos.png);
	background-position: top;
	width:100%;
	min-height: 400px;
	z-index: 2;
	top: -40px;
}
#id3.segment  {
	background-image: url(img/oranje.png);
	background-position:top;
	min-height: 400px;
	z-index:3;
	top:-100px;
}
#id3b.segment  {
	
	min-height: 400px;
	z-index:3;
	background-repeat:none;
	background-color:#c75e0a;

}

#id4.segment  {
	background-image: url(img/praten.png);
	background-repeat:no-repeat;
	background-position:top;
	min-height: 400px;
	z-index:4;
	top:-130px;
}
#id5.segment  {
	background-image: url(img/blauw.png);
	background-position:top;
	min-height: 400px;
	z-index:5;
	top:-170px;
}
#id6.segment  {
	background-image: url(img/kennismaking.png);
	background-position:top;
	min-height: 400px;
	z-index:6;
	top:-210px;
}


#id6.segment  {
	
}

#id7 {
	min-height: 100px;
	top:-145px;
}

#id7 a {
	display:inline-block;
}

.bullit {
	display:inline-block;
	font-size: 36px;
	font-weight: bold;

}
.leesmeer {
	position:relative;
	top:10px;	
	float:right;	
	padding: 5px 20px;
	z-index: 100;
	border:solid 1px #fff;
	border-radius:3px;
	font-size:16px;
	color:#fff;

}

/*nieuws
*/

.lichtoranje {
	color:#eedfd3;
}

h2.sub {
	font-size:18px;
	margin-top:0px;
}
.bg-oranje {
	background-color: #c75e0a;
}
.bg-wit {
	background-color: #fff;
}

.pad20 {
	padding:20px;
}





.footer {
	width: 100%;
	clear: both;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
	background-color: #333;
	background-position:top;
	min-height: 400px;
	z-index:7;
	top:-250px;
}

.footerplaatje {
	float:right;	
}

.dequote {
	position:relative;
	z-index:10;	
	top:-100px;
	font-family:"proxima-nova";
	font-style:italic;
	font-size:18px;
	font-weight:400;
	
}
.quoteopen {
	width:90px;
	height:70px;
	overflow:hidden;	
	background-image:url(img/quote.png);
	background-position:left;
	position:relative;
	z-index:-10;
	top: 20px;
	left:-20px;
	
}
.quoteclose {
	width:90px;
	height:70px;
	overflow:hidden;	
	background-image:url(img/quote.png);
	background-position:right;
	position:relative;
	z-index:-12;
	top:100px;
	left:170px;
}

.referentie {
	color:#FFF;

}

.referentie a {
	color:#fff;	
}

.stappen {
	font-size:14px;	
	font-weight:bold;	
	}

/* --- SLIDER  --- */


#wrapper {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 10px;
	left: 4px;
	overflow: hidden;
	padding:0px;
}

	#mask {
		width:500%;
		height:100%;
	}

	.item {
		width:20%;
		height:100%;
		float:left;
	}
	#item1 {
		}
	
	
	.content {
		min-width:370px;
		max-width:1020px;
		top:100px;
		margin:0 auto;
		position:relative;
	}
	.content p {
		padding:20px;
		background-color:#F0F2FF;
	}
	
	.selected {
		background:#fff;
		font-weight:700;
	}

	.clear {
		clear:both;
	}



@media (max-width: 820px){
	.bullit {
		font-size:16px;
	}
	.leesmeer {
		top:-10px;		
	}

}

	
@media (max-width: 580px){
	.topmenu {
		position: fixed;
		top: 50px;
		left: 10px;
		width: 220px;
		height: 22px;
		z-index: 100;
}	
	h1 {
		font-size:42px;	
	}
	
	#contact {
		right:20px;
		
}
	
	#id1.segment  {
	
}

	#id2.segment {
		background-image:none;
		background-color:#9f9b9a;
}



	#id3.segment  {
	background-image: url(img/oranje.png);
	background-position:top;
	min-height: 680px;
	z-index:3;
	top:-90px;
}
	#id6.segment  {
	background-image:none;
	background-color:#ddd;
	min-height: 480px;
	z-index:3;
	top:-180px;
}



	#id5 h1 {
		font-size:24px;
	}


	.l-col {
		width:100%;
	}
	.r-col {
		width:100%;
	
	}

.footerplaatje {
	float:right;	
	clear:both;
}

	
}

/* --- MOBIEL --- */
@media (max-width: 768px){
	body {
		min-width:0;
	}
	.navigatie, .inner {
		max-width:100%;
		padding-left:20px;
		padding-right:20px;
		box-sizing:border-box;
	}
	.content {
		min-width:0;
		max-width:100%;
	}
	#knop, #knop1 {
		max-width:100%;
	}
	.l-col, .r-col {
		width:100%;
		float:none;
	}
	img {
		max-width:100%;
		height:auto;
	}
}
