/****************************************************************************************************/
/********************************************* RESET ************************************************/
/****************************************************************************************************/
html, body, form{ height: 100%; width:100%; padding:0;  margin:0;} 


/* AFBEELDINGEN BOVEN EN ONDER TEGEN ELKAAR ZETTEN */
img, a img, :link img, :visited img{ border: 0; display:block; vertical-align: top;}

ul{ margin:11px 0; padding:0 0 0 40px; list-style-type:square;}
ol{ margin:11px 0; padding:0 0 0 40px; list-style-type:decimal;}
p{ padding:0 0 11px 0; margin:0;}
/* Padding op divs naast elkaar */
/*
* { box-sizing: border-box;}
*/

/****************************************************************************************************/
/************************************** START STANDAARD CSS *****************************************/
/****************************************************************************************************/

/***** WEBSITE *****/
body#website{
	height:100%;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	overflow-y:scroll;
	overflow-x:hidden;
	background-color:#FFFFFF;
	
	min-width:320px;
	margin: 0 0 100px; /* bottom = footer height */

	/* default font */
	font-family: 'Open Sans', sans-serif;
	font-weight:300;
	font-size:15px;
	color:#333;
	line-height:24px;
	-moz-font-smoothing: none;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}

/***** BACKSITE *****/
body{
	background-color:#FFF;	
	
	/* default font */
	font-family: 'Open Sans', sans-serif;
	font-weight:300;
	font-size:15px;
	color:#333;
	line-height:24px;
	-moz-font-smoothing: none;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}


/* TABEL */
td{
	/* default font */
	font-family: 'Open Sans', sans-serif;
	font-weight:300;
	font-size:15px;
	color:#333;
	line-height:24px;
	-moz-font-smoothing: none;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}


/***** HOOFDTITEL PAGINA *****/
h1{ 
	margin:0; 
	padding:0;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300 !important;
	font-size:50px;
	color:#e74c3c;
	line-height:50px;
	
	padding-bottom:0px;
}


/***** H2 + MAINTITLE *****/
h2, .maintitle{ 
	margin:0;
	padding:0;
	font-family: 'Open Sans', sans-serif;
	font-weight: 500;
	font-size:20px;
	color:#333;
	text-decoration:none;
	line-height:30px;
	
	padding-bottom:10px;
}


/***** H3 + SUBTITLE *****/
h3, .subtitle{ 
	margin:0; 
	padding:0;
	font-family: 'Open Sans', sans-serif;
	font-weight: bold;
	font-size:20px;
	color:#CCC;
	
	padding-bottom:5px;
}


/***** NORMALE LINK *****/
a,
a:link,
a:visited,
a:active{
	color:#e35f51;
	text-decoration:underline;
}
a:hover{
	color:#e35f51;
	text-decoration:none;
}


/***** VET *****/
.vet{font-weight:bold !important;}
/***** SUB *****/
.klein{font-size:12px;}
/***** STROKES *****/
.stroke{border:2px solid #333 !important;}
.stroke_met_schaduw{border:6px solid #FFF !important; box-shadow:1px 1px 15px #CCC;}
/***** CURSOR ROLLOVER *****/
.rollover{cursor:pointer;}

.nomargin{margin:0 !important;}
/***** CLEAR *****/
.clear{clear: both;width:100%;}
/* RESPONSIVE IMAGES */
.resp_img{ width:auto;height:auto;max-width:100%;}
/* COLUMS */
.section100{float:left; width:100%; height:auto; position:relative; box-sizing:border-box; padding:25px;}
.section75{float:left; width:75%; height:auto; position:relative; box-sizing:border-box;padding:25px;}
.section60{float:left; width:60%; height:auto; position:relative; box-sizing:border-box;padding:25px;}
.section50{float:left; width:50%; height:auto; position:relative; box-sizing:border-box;padding:25px;}
.section40{float:left; width:40%; height:auto; position:relative; box-sizing:border-box;padding:25px;}
.section33{float:left; width:33%; height:auto; position:relative; box-sizing:border-box;padding:25px;}
.section25{float:left; width:25%; height:auto; position:relative; box-sizing:border-box;padding:25px;/* background-color: #9F3; border:6px solid #E7E7E7;*/}
.section20{float:left; width:20%; height:auto; position:relative; box-sizing:border-box;padding:25px;}
.section100 img, .section75 img, .section60 img, .section50 img, .section40 img, .section33 img, .section25 img, .section20 img{width:auto;height:auto;max-width:100%;}



/***** CTA BUTTON *****/
/* CATLINK */
a.btn-link,
a.btn-catlink:link,
a.btn-catlink:visited,
a.btn-catlink:active {
	outline: none;  
	overflow: hidden;
	
	font-family: inherit;
	font-weight: 600;
	font-size:16px;
	color:#FFF;
	background-color:#e35f51;
	text-decoration:none;
	padding:13px;
	border-radius:3px;
	display:block;
	width:200px;
	float:right;
	margin-bottom:25px;
	text-align:left;
	text-shadow:1px 1px 0px #000000;
	

	/* Standaard fade rollover CSS3 */
	-webkit-transition-property:background-color;
    -webkit-transition-duration: 0.1s, 0.1s;
    -webkit-transition-timing-function: linear, ease-in;
	
	transition-property:background-color;
	transition-duration: 0.1s, 0.1s;
	transition-timing-function:  linear, ease-in;

}

a.btn-link:hover {
	color:#FFF;
	background-color:#5a646e;
}


/****************************************************************************************************/
/**************************************** START EIGEN CSS *******************************************/
/****************************************************************************************************/


/***** MAIN HEADER MET NAVIGATIE, LOGO EN MENU *****/
#header{
	width:100%;
	height:175px;
	top:0;
	background-color:#FFF;
	position: absolute;
	z-index:99;
	margin-left:auto;
	margin-right:auto;
	padding-top:25px;
	background-image: url(../images/bg_header.png);
	background-position: center bottom;
	background-repeat:no-repeat;
	background-size:100% 75px;
}
#navigatie{
	max-width:1200px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
}


#logo{
	float:left;
	width:320px;
	height:125px;

	background-image:url(../images/logo.png);
	background-position:left;
	background-repeat:no-repeat;
	
	position:relative;
	z-index:98;
}

#menu{
	width:200px;
	text-align:right;
	z-index:97;
	float:right;
	padding-right:25px;
}

#container{
	max-width:1200px;
	width:100%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	padding:200px 25px 50px 25px;
	box-sizing:border-box;
}

#off{
	background-image: url(../images/bg_off.png);
	background-position: right;
	background-repeat:no-repeat;	
}
#web{
	background-image: url(../images/bg_web.png);
	background-position: right;
	background-repeat:no-repeat;	
}

#web:hover{
	background-image: url(../images/bg_webw.png);	
}
#off:hover{
	background-image: url(../images/bg_offw.png);	
}

#adres{
	background-color:#f7f7f7;
}

#seo{
	padding:75px;
}


a.seo-link,
a.seo-link:link,
a.seo-link:visited,
a.seo-link:active {
	outline: none;  
	overflow: hidden;
	
	font-family: inherit;
	font-weight: 700;
	font-size:16px;
	color:#666;
	
	text-decoration:none;
	padding:13px 13px 13px 0px;
	
	display:block;
	border-top:1px solid #e35f51;
	background-image:url(../images/bg_seo.png);
	background-position:right;
	background-repeat:no-repeat;

	margin-bottom:25px;
	
	

	/* Standaard fade rollover CSS3 */
	-webkit-transition-property:background-color;
    -webkit-transition-duration: 0.1s, 0.1s;
    -webkit-transition-timing-function: linear, ease-in;
	
	transition-property:background-color;
	transition-duration: 0.1s, 0.1s;
	transition-timing-function:  linear, ease-in;

}

a.seo-link:hover {
	color:#999;
	
}

#footer {
    position: relative;
    left: 0;
    bottom: 0;
    height: 100px;
    width: 100%;
	background-color:#333;
	padding-left:25px;
	padding-right:25px;
	box-sizing:border-box;
}

#sig{
	color:#999;
	font-size:11px;
}



/****************************************************************************************************/
/************************************** RESPONSIVE CSS *****************************************/
/****************************************************************************************************/


@media only screen and (max-width :1200px)   { 

}

@media only screen and (max-width :960px)   { 


.section100, .section75, .section60, .section50, .section40, .section33, .section25, .section20{
	width:100%;
	margin-top:0px; 
}

	
}

@media only screen and (max-width :610px)   { 

#header{
	height:324px;
}

#container{
padding-top:350px;
}

#logo{
	width:100%;
	background-position:center center;
}

#menu{
	padding-top:25px;
	width: 100%;
    box-sizing: border-box;
	padding-left:50px;
}

a.btn-link,
a.btn-catlink:link,
a.btn-catlink:visited,
a.btn-catlink:active {
	width:100%;
	
}

	#seo{
	padding:50px 25px;
}
}