@charset "UTF-8";

/* NIKS AANPASSEN IN DIT BESTAND */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video
{margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline; background:transparent;}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary
{display: block;}

audio, canvas, video {display: inline-block; *display:inline; *zoom:1;}

audio:not([controls]) {display:none; height:0;}

[hidden] {display:none;}

html {overflow-y:scroll; overflow-x:hidden; font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}    
    
body {line-height: 1;}

nav ul, nav ol {list-style: none; list-style-image:none;}    
ol, ul {list-style: none;}
    
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none; font-size:75%}
abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help;}    

sub, sup {font-size:75%; line-height:0; position:relative; vertical-align:baseline}
sub {bottom: -0.25em;}
sup {top: -0.5em;}

table {border-collapse: collapse; border-spacing: 0;}

a:link, a:visited, a:hover, a:active {text-decoration:none;}
a img, :link img, :visited img {border:none;}
a:focus {outline: thin dotted;}
a:active, a:hover {outline: 0;}

html, button, input, select, textarea {font-family: sans-serif;}
textarea {resize:none; vertical-align:top; font-size:100%; overflow:auto;}
textarea:focus {outline:none;}
input:focus {outline:none;}
button, input, select {vertical-align: baseline; *vertical-align: middle; font-size:100%; line-height:normal; margin:0;}
legend {white-space: normal; *margin-left:-7px;}
button, input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance:button; cursor:pointer; *overflow: visible;}
button[disabled], input[disabled] {cursor: default;}
input[type="checkbox"], input[type="radio"] {box-sizing; border-box; *height: 13px; *width: 13px;}
input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance:none;}
button::-moz-focus-inner, input::-moz-focus-inner {border:0; padding:0;}

img {-ms-interpolation-mode: bicubic;}
svg:not(:root) {overflow:hidden;}

strong, b {font-weight:bold}

tt {font-family: "Courier New", Courier, monospace}
code, kbd, pre, samp {font-family: monospace, serif; _font-family: 'courier new', monospace; font-size:16px;}
pre {white-space: pre; white-space:pre-wrap; word-wrap: break-word;}
hr {display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
i {font-style:italic}
u {text-decoration:underline}
strike, del {text-decoration:line-through}
ins {text-decoration:none}
center {text-align:center}
dfn {font-style:italic}
mark {background: #ff0; color: #000;}

/* EXTERNE FONTS */

/* GEHOSTE FONTS */
@font-face {
    font-family: 'ChopinScript';
    src: url('/fonts/chopinscript-webfont.eot');
    src: url('/fonts/chopinscript-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/chopinscript-webfont.woff') format('woff'),
         url('/fonts/chopinscript-webfont.ttf') format('truetype'),
         url('/fonts/chopinscript-webfont.svg#ChopinScript') format('svg');
    font-weight: normal;
    font-style: normal;

}
@charset "UTF-8";

html,
body {
   margin:0;
   padding:0;
   height:100%;
   font-family: Arial, Helvetica, sans-serif; font-size:12px; line-height:22px; color:#6d6e6c;
}
#container {
   min-height:100%;
   position:relative;
}

/* HEADER */
#headerwrap {
   background:#444444;
   height:104px; position:fixed; width:100%; z-index:1100;
}
#header {
    max-width:1400px; height:104px;
    margin: 0px auto 0px auto; 
    padding: 0px 20px 0px 20px; font-family: 'Oswald', sans-serif; font-weight:300; position:relative; z-index:1000;
}

/* BODY */
#bodywrap {
   padding-bottom:160px;   /* HOOGTE VAN DE FOOTER - AAN TE PASSEN */
}
#body {
    max-width:1400px;
    margin: 0px auto 0px auto; 
    padding: 124px 20px 70px 20px;
}

/* FOOTER */
#footerwrap {
   position:absolute;
   bottom:0;
   width:100%;
   height:160px; background-image:url(../images/bg_foot.jpg); background-repeat:repeat-x; background-position:top;
}
#footer {
    max-width:1400px; 
    margin: 0px auto 0px auto; 
    padding: 0px 20px 0px 20px;
}

#logo { position:absolute;}

.topnav { color:#FFF; position:absolute; right:0px;font-size:13px; line-height:16px; width:250px; margin-top:15px;}
.topnav a { color:#FFF; padding-left:10%; padding-right:10%; display: inline-block;}

.nav { font-size:14px; text-transform:uppercase; line-height:46px; padding-top:58px; }
.nav ul li a { float:right; margin-left:8%; color:#FFF;}
.nav ul li a:hover { background-image:url(../images/bg_nav.jpg); background-repeat:no-repeat; background-position:center bottom;}

.ticker {font-family: 'Oswald', sans-serif; font-weight:300; text-align:center; font-size:24px; line-height:34px; color:#aeba22; height:124px;}
.ticker span { background-color:#FFF; padding-left:10px; padding-right:10px;}
.foot { text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:11px; text-align:center; line-height:36px; color:#FFF;}
.foot a { color:#FFF;}

h1 {font-family: 'Oswald', sans-serif; font-weight:300; text-align:center; color:#aeba22; font-size:22px; text-transform:uppercase; line-height:74px; background-image:url(../images/h1.jpg); background-repeat:no-repeat; background-position:center bottom; margin-bottom:15px;}
h2 {font-family: 'Oswald', sans-serif; font-weight:300; text-align:center; color:#aeba22; font-size:18px; text-transform:uppercase; line-height:74px;  margin-bottom:15px;}
h3 {font-family: 'Oswald', sans-serif; font-weight:300; font-size:12px; text-transform:uppercase; text-align:center; line-height:33px; background-image:url(../images/h3.jpg); background-repeat:no-repeat; background-position:center bottom; color:#aeba22; margin-bottom:65px; }

.centr { text-align:center; }

.diensten {}
.diensten h2 { text-transform:uppercase; color:#AEBA22; text-align:center; font-size:16px; line-height:35px; background-color:#E6E6E6; margin-bottom:14px;}
.dienst { padding:30px;}
.dienst h3 { color:#6d6e6c; line-height:48px; font-size:16px; background-image:url(../images/mat2_bg.png); background-repeat:no-repeat; background-position:right top; text-align:left; border-bottom:2px solid #9ea83b; margin-bottom:0px;}
.dienst h3:hover { background-position:bottom right; cursor:pointer;}

.diensten h2.active{ background: #b4b342; color: #fff;}

.project { position:relative;}
.project a { position:absolute; width:100%; height:100%; text-align:center;  z-index:100;}
.project a h2 { display:none; font-family: 'Oswald', sans-serif; font-weight:300; color:#869200; font-size:30px; text-transform:uppercase; padding-top:22%;}
.project a:hover { background-image:url(../images/bg_link.png); }
.project a:hover h2 { display:block;}

.groepen {}
.groepen a { font-size:16px; text-align:center; display:block; text-transform:uppercase; color:#aeba22; font-family: 'Oswald', sans-serif; font-weight:300; line-height:45px; background-color:#e6e6e6; width:100%;}

.plus { background-image:url(../images/plus.png); background-repeat:no-repeat; background-position:right top; position:absolute; width:52px; height:50px; display:block; right:0px;}
.rel { position:relative;}

.pro_controls { height:45px; width:100%; background-image:url(../images/line.png); background-repeat:repeat-x; margin-top:25px; margin-bottom:25px;}
.controls_left { float:left; width:45%; margin-left:1%;}
.controls_left a { float:left; margin-right:1%;}
.controls_right { float:right; width:45%; margin-left:1%;}
.controls_right a { float:right; margin-right:1%;}

.materiaal {}
.materiaal h2 { color:#AEBA22; font-size:16px; line-height:35px; background-color:#E6E6E6; margin-bottom:14px; text-align:left; padding-left:2%; text-transform:none; background-repeat:no-repeat; background-position:right top; margin-bottom:10px; }
.materiaal h2:hover { background-position:bottom right; cursor:pointer;}
.materiaal h2.active{ background: #b4b342; color: #fff;}
.line {border-bottom:2px solid #9ea83b; line-height:1000%;}

.kader {  box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
 border:2px solid #d5e14d;}
 
 .gegevens { font-size:11px; line-height:20px; margin-bottom:5%;}
 .gegevens a { color:#87921f;}
 
 .left { float:left;}
 .right { float:right;}
 
 .pad { padding:3%;}
 
 input[type=text] { border:1px solid #717171; padding:2%; width:100%; margin-bottom:6%; border-radius: 3px; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;  }
 textarea {border:1px solid #717171; padding:2%; width:100%; margin-bottom:6%; border-radius: 3px; min-height:200px; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;  }
 input[type=submit] { width:100%; color:#FFF; border:none; background-color:#bbca17; line-height:40px; display:block;}
 
 .nb { max-width:450px; margin:auto;}



/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 5%;
}
.col:first-child { margin-left: 0; }


/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
.group {
    zoom:1; /* For IE 6/7 */
}
                                               
/*  GRID OF TWO  */
.span_2_of_2 {
	width: 100%;
}
.span_1_of_2 {
	width: 47.5%;
}

					
/*  GRID OF THREE  */
.span_3_of_3 {
	width: 100%;
}
.span_2_of_3 {
	width: 65%;
}
.span_1_of_3 {
	width: 30%;
}


/*  GRID OF FOUR  */
.span_4_of_4 {
	width: 100%;
}
.span_3_of_4 {
	width: 73.75%;
}
.span_2_of_4 {
	width: 47.5%;
}
.span_1_of_4 {
	width: 21.25%;
}


/*  GRID OF FIVE  */
.span_5_of_5 {
	width: 100%;
}
.span_4_of_5 {
	width: 79%;
}
.span_3_of_5 {
	width: 58%;
}
.span_2_of_5 {
	width: 37%;
}
.span_1_of_5 {
	width: 16%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
}

@media only screen and (max-width: 480px) {
	
	.span_2_of_2 {
		width: 100%; 
	}
	.span_1_of_2 {
		width: 100%;
	}
	
	.span_3_of_3 {
		width: 100%; 
	}
	.span_2_of_3 {
		width: 100%; 
	}
	.span_1_of_3 {
		width: 100%;
	}
	
	
	
	.span_4_of_4 {
		width: 100%; 
	}
	.span_3_of_4 {
		width: 100%; 
	}
	.span_2_of_4 {
		width: 100%; 
	}
	.span_1_of_4 {
		width: 100%;
	}
	
	
	
	.span_5_of_5 {
		width: 100%; 
	}
	.span_4_of_5 {
		width: 100%; 
	}
	.span_3_of_5 {
		width: 100%; 
	}
	.span_2_of_5 {
		width: 100%; 
	}
	.span_1_of_5 {
		width: 100%;
	}
}


@charset "UTF-8";

/* NIKS AANPASSEN IN DIT BESTAND */
.cb {clear:both}
.fl {float:left}
.fr {float:right}
.al {text-align:left}
.ar {text-align:right}
.aj {text-align:justify}
.ac {text-align:center}
.nm {margin:0px;}
.np {padding:0px;}
.nb {border:none;}
.nbl {border-left:none !important;}
.nbr {border-right:none !important;}
.nbb {border-bottom:none !important;}
.nbt {border-top:none !important;}
.nmr {margin-right:0px !important;}
.nml {margin-left:0px !important;}
.nmt {margin-top:0px !important;}
.nmb {margin-bottom:0px !important;}
.npr {padding-right:0px;}
.npl {padding-left:0px;}
.npt {padding-top:0px;}
.npb {padding-bottom:0px;}
.nbr {border-right: none;}
.nbl {border-left:none;}
.nbt {border-top:none;}
.nbb {border-bottom:none;}
.nbg {background:transparent;}
.dn {display:none;}
.dni {display:none !important;}
.db {display:block;}
.dib {display:inline-block;}
.cp {cursor: pointer;}
.cd {cursor: default;}
.pr {position: relative;}

.center
{
  margin: 0 auto;
  width: 960px;
}

.c ul
{
	padding-left: 15px;
	list-style-type: disc;
	margin: 1em 0;
}

.c p
{
	margin: 1em 0;
}

.c ol
{
	padding-left: 15px;
	list-style-type: decimal;
	margin: 1em 0;
}

.c strong
{
	font-weight: bold;
}

.c em
{
	font-style: italic;
}

.c table
{
	margin: 1em 0;
}

.c td, .c th
{
	border: 1px solid #333;
	padding: 3px;
}

.c blockquote
{
	border-left: 5px solid #aaa;
	padding-left: 5px;
	font-style: italic;
	margin: 1em 0 1em 15px;
}

.four-row-grid>*
{
	width: 21.1%;
	margin-right: 5.2%;
	margin-top: 4%;
	float: left;
}

.four-row-grid>*:nth-child(4n)
{
	margin-right: 0;
}

.three-row-grid>*
{
	width: 30.5%;
	margin-right: 4.2%;
	float: left;
	margin-top: 4%;
}

.three-row-grid>*:nth-child(3n)
{
	margin-right: 0;
}

.five-col-grid>*
{
	width: 15.5%;
	margin-right: 5.625%;
	float: left;
	margin-top: 2%;
}

.five-col-grid>*:nth-child(5n)
{
	margin-right: 0;
}

.three-row-grid .cb, .four-row-grid .cb, .five-col-grid .cb
{
	width: 100%;
	margin: 0;
	float: none !important;
}

@media all and (max-width: 1130px) {
	.four-row-grid>*
	{
		width: 30.5%;
		margin-right: 4.2%;
	}

	.four-row-grid>*:nth-child(3n)
	{
		margin-right: 0;
	}

	.four-row-grid>*:nth-child(4n)
	{
		margin-right: 4.2%;
	}

	.three-row-grid>*
	{
		width: 47.5%;
		margin-right: 0;
	}

	.three-row-grid>*:nth-child(3n)
	{
		margin-right: 0;
	}

	.three-row-grid>*:nth-child(2n)
	{
		float: right;
	}

	.five-col-grid>*
	{
		width: 21.1%;
		margin-right: 5.2%;
		margin-top: 4%;
	}

	.five-col-grid>*:nth-child(5n)
	{
		margin-right: 5%;
	}

	.five-col-grid>*:nth-child(4n)
	{
		margin-right: 0;
	}
}

@media all and (max-width: 790px) {
	.four-row-grid>*
	{
		width: 47.5%;
		margin-right: 0;
	}

	.four-row-grid>*:nth-child(4n)
	{
		margin-right: 0;
	}

	.four-row-grid>*:nth-child(2n)
	{
		float: right;
	}

	.five-col-grid>*
	{
		width: 30.2%;
		margin-right: 4.2%;
		margin-top: 4%;
	}

	.five-col-grid>*:nth-child(4n)
	{
		margin-right: 4.2%;
	}

	.five-col-grid>*:nth-child(3n)
	{
		margin-right: 0;
	}
}

@media all and (max-width: 680px) {
	.three-row-grid>*
	{
		width: 100%;
		margin-top: 35px;
	}
}

@media all and (max-width: 560px) {
	.five-col-grid>*
	{
		width: 47.5%;
		margin-right: 0 !important;
	}

	.five-col-grid>*:nth-child(4n)
	{
		margin-right: 0;
	}

	.five-col-grid>*:nth-child(2n)
	{
		float: right;
	}
}

@media all and (max-width: 300px) {
	.five-col-grid>*
	{
		width: 100%;
		margin-top: 35px;
	}
}

@media all and (max-width: 400px) {
	.four-row-grid>*
	{
		width: 100%;
		margin-top: 35px;
	}
}