@charset "utf-8";
* { margin: 0px; padding: 0px;  }



div:hover, a:hover, li:hover, input:hover, span:hover	{-webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
p {margin-bottom:10px;}

html {
    height: 100%;
    background-color: white;
}

body { font-family: 'Roboto', sans-serif; font-size:0.9em;
	font-weight:300; letter-spacing: 2px; line-height: 24px;
color:#2f2f2f;
margin:0;}


h1 {font-size:48px; font-weight:100; letter-spacing: 2px; line-height: 48px; display:inline-block; background-image:url(../afbeeldingen/lijn-koppen.png); background-repeat:no-repeat; background-position: bottom left; background-size:auto; padding-bottom:45px;}
h2 {font-size:48px; font-weight:100; letter-spacing: 2px; line-height: 48px;}
h3 {font-size:24px; font-weight:100;}
h4 {font-size:18px; font-weight:100;}
h5 {font-size:16px; font-weight:100;}

p {font-size:1.1em; font-weight:300; letter-spacing: 2px; line-height: 24px; margin-top:0; }

.logo {position:absolute; top:10%; left:10%; z-index:102;}
.logo img {width:100%; height:auto;}

.container-inside { width:100%; max-width:1200px; margin:0 auto;}
.container-inside-contact { width:100%; max-width:1200px; margin:0 auto; }
.container-inside2 { width:100%; max-width: 1682px; margin:0 auto;}

.container {float:left; width:100%;  margin:0 auto;}
.container-geel {float:left;background-color:#fdc800;width:100%;margin:0 auto; }
.container-wit {    float: left;
    width: 100%;
    margin: 0 auto;
   /* background-image: url(../afbeeldingen/lijn.png);*/
    background-repeat: repeat-y;
    background-size: 100%;
    height: 100%;
} 
.container-wit-vervolg {    float: left;
    width: 100%;
    margin: 0 auto;
   
} 
.container-geel-schuin {width:100%;float:left;
background-image:url(../afbeeldingen/lijn.png); background-repeat:repeat-y;	background-size: contain;
}
.container-wit-zwart {width:100%;float:left;   height: 337px; overflow: hidden;
background-image:url(../afbeeldingen/lijn-wart-wit.png); background-repeat:repeat-y; }

.container-foto {width:100%;float:left; position: relative; overflow: hidden;background-color:#fdc800;/*background-image:url(../afbeeldingen/foto-footer.jpg); background-repeat:no-repeat;	background-size: contain;*/
}
.foto-links {float:left; width:40%; position: relative; overflow:hidden; height:429px;  } 
.foto-links img { width:100%; height:auto; overflow: hidden;
    display: block; }
.foto-links-vervolg {float:left; width:60%; position: relative; overflow:hidden;  } 
.foto-links-vervolg img { width:100%; height:auto; overflow: hidden;
    display: block; }
.driehoek-geel-foto {    float: left;
    border-bottom: 448px solid rgba(253, 200, 0, 1.0);
    border-left: 227px solid transparent;
    position: absolute;
    top: 0;
    right: 0;
}
.container-foto-vervolg {width:100%;float:left; position: relative; overflow: hidden;background-color:#fdc800;
}
.wrapper-breed { width:96%; float:left; background-color:#ffff;min-height: 212px; padding: 4% 2%; }
.wrapper-breed h2 {font-size:30px; font-weight:100; letter-spacing: 2px; line-height: 48px;}
.wrapper-breed ul {margin:0 15px;}
.wrapper-breed li {padding:5px 0; margin:0 15px;}
.wrapper-left-wit { width:62%; float:left; background-color:#ffff;min-height: 212px; padding: 4% 2%; }
.wrapper-left-wit h2 {font-size:30px; font-weight:100; letter-spacing: 2px; line-height: 48px;}
.wrapper-left-wit ul {margin:0 15px;}
.wrapper-left-wit li {padding:5px 0; margin:0 15px;}
.wrapper-right-geel { width:26%; float:right; background-color:#fdc800;min-height: 100px;  padding: 4% 2% 4% 6%; background-image:url(../afbeeldingen/witte-pijl.png); background-size:20%;
 background-position:0% 14%; 
	background-repeat:no-repeat;}
.wrapper-right-geel h2 {color:#fff;}
.wrapper-right { width:34%; float:right; background-color:#dadada; min-height: 100px;      padding-bottom: 50px;
	background-repeat:no-repeat;}
.wrapper-right h2 {color:#fff;}
.wrapper-right-grijs { width:92%; float:right; background-color:#dadada;  min-height: 100px;  padding: 4% 2% 4% 6%; background-image:url(../afbeeldingen/witte-pijl.png); background-size:20%;
 background-position:0 14%; 
	background-repeat:no-repeat;}
.wrapper-right-grijs h2 {color:#fff;}
.wrapper-right img {width:100%; height:auto;}

.navigatie {float:left; width:100%; background-color:#2f2f2e; }
.navigatie-inside { width:100%; max-width:1200px; margin:0 auto;}
/*.navigatie-mobiel {float:left; width:100%; z-index: 107;
      position: fixed;}*/
.header {float:left; width:100%; background-color:#2f2f2e;}
.slider { width:100%; background-color:#ccc; margin:0 auto; overflow: hidden; border-top:solid 10px #fdc800; position: relative;}
.slider-arrow-top { position:absolute; top:0; left:10%; height:25px; width:30px; background-image: url(../afbeeldingen/gele-pijl-klein-down.png); z-index: 105; background-repeat: no-repeat; }

.button-bottom {float:left; width:200px; display:block; background-color:#ff6600; color:#fff;}
.slider-button {
	
    background-image: url(../afbeeldingen/001-arrow.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    bottom: 105px;
    height: 11px;
    left: 50%;
    position: absolute;
    width: 20px;
    z-index: 100;
    cursor: pointer;
    padding: 30px;
    margin-left: -25px;
    animation-name: bounce;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
	
}
.gele-pijl {    width: 100px;
    height: 117px;
    position: absolute;
      background-image: url(../afbeeldingen/gele-pijl.png);
    background-size: cover;
    margin-top: -22px;
    z-index: 999;}

#geledriehoek {   
    z-index: 6;
    position: absolute;
    display: block;
    bottom: 0;
    right: 0;	
	
}
#geledriehoek::before {
 		border-bottom: 1137px solid rgba(0, 0, 0, 0.4);
    border-left: 877px solid transparent;
}
#geledriehoek:before {  
	content: "";
	border-bottom: 1137px solid rgba(253, 200, 0, 0.5);
    border-left: 877px solid transparent;
    display: block;	
  	z-index:-2;
	
}
#geledriehoek:after {   
    content: "";
	
	border-bottom: 1137px solid rgba(0, 0, 0, 0.5);
    border-left: 877px solid transparent;
	 left: 0;
    position: absolute;
    height: 100%;
    z-index: -1;
    top: 0;
	width: 100%;
	
}
#geledriehoek img {    width: 100% !important;
    height: auto !important;
    overflow: hidden !important;
  }

.content-wrapper {min-height:300px; max-width: 1200px; margin:0 auto; width:100%; color:#fff;}
.content-wrapper h2 {font-size:48px; font-weight:100; letter-spacing: 2px; line-height: 48px; display:inline-block; background-image:url(../afbeeldingen/lijn-koppen.png); background-repeat:no-repeat; background-position: bottom left;  padding-bottom:45px; margin-bottom:0; margin-top:0;}
.content-inside {float:left; width: 96%; margin:2% 2%;}
.mobile-wrap {width:85%; float:left; margin: 8px 0;}
.mobile2 {width:33%; float:left;padding: 2px 0 0 0;}
.mobile1 {width:33%; float:left;padding: 0 0 0 4%;}
.mobile { width:30%; float:left;padding: 2px 0 0 0;}

/* aanbod sectie */
#aanbod ul {margin:0 15px;}
#aanbod ul li { float:left; width:26%; padding:1% 2% 1% 4%; list-style: none; background-image:url(../afbeeldingen/gele-pijl-klein.png); background-repeat:no-repeat; background-position:left center;}
#aanbod ul li a {color:#fff; text-decoration:none;}

/* aanbod sectie */
#aanbod2 {color:#333 !important;}
#aanbod2 ul {margin:0 15px;}
#aanbod2 ul li { color:#333 !important; float:left; width:26%; padding:0 2% 1% 4%; list-style: none; background-image:url(../afbeeldingen/gele-pijl-klein.png); background-repeat:no-repeat; background-position:left top;height:100px; }
#aanbod2 ul li a {color:#333; text-decoration:none;     font-weight: 400;}

.foto-midden {float:left; width:100%;
	background-color: rgba(0, 0, 0, 0.9);
background: url(../afbeeldingen/foto-midden.jpg);
background-size:cover;
	opacity:0.6;
	overflow: hidden;
	
}
#theme img { width:100%; height:auto;}

#theme {
    position: relative;
    overflow: hidden;
	    margin: 0 auto;
    width: 100%;
    
}

#theme::before {
    background-image: url(../afbeeldingen/foto-midden.jpg);
}
#theme:before {
    content: "";
    display: block;
    background-image: url(../afbeeldingen/foto-midden.jpg);
	background-repeat: no-repeat;
    background-size: 100%;
    background-attachment: fixed;
    background-position: center center;
    position: absolute;
    width: 100%;
    height: 100%;
	z-index: -2;}

#theme:after {
    content: "";
    background-color: #000000;
    background-color: rgba(0, 0, 0, 0.5);
    left: 0;
    position: absolute;
    height: 100%;
    z-index: -1;
    top: 0;
	width: 100%;}

#theme2 img { width:100%; height:auto;}

#theme2 {
    position: relative;
    overflow: hidden;
	    margin: 0 auto;
    width: 100%;
    
}

#theme2::before {
    background-image: url(../afbeeldingen/Alpha-wit-groot.png);
}
#theme2:before {
    content: "";
    display: block;
    background-image: url(../afbeeldingen/Alpha-wit-groot.png);
    background-repeat: no-repeat;
   /* background-size: cover;
    background-attachment: fixed;*/
   	    background-size: 50%;
    background-position: right;
    position: absolute;
    width: 100%;
    height: 100%;
	z-index: -2;}

#theme2:after {
    content: "";
    background-color: #ededed;
    background-color: rgba(237, 237, 237, 0.5);
    left: 0;
    position: absolute;
    height: 100%;
    z-index: -1;
    top: 0;
	width: 100%;}

/*publicaties*/
.publicaties {width: 96%;
    float: left;
    padding: 4% 2%;
	background-image:url(../afbeeldingen/blok-schuin-wit.png); 
	background-repeat:no-repeat;	
	    background-position: 0% 51%;
	background-color: #fdc800;

}
.publicaties  h2 {float:left; font-size:48px; font-weight:100; letter-spacing: 2px; line-height: 48px; display:inline-block; background-image:url(../afbeeldingen/lijn-koppen.png); background-repeat:no-repeat; background-position: bottom left; padding-bottom:45px; margin-top:0;    margin-right: 172px;}

.publicaties  p {float:right; width:63% }
.publicaties  ul {float:right; width:55%; font-size: 1.1em;
    font-weight: 300;
    letter-spacing: 2px;
    line-height: 24px;
        margin: 15px 0;
    padding: 0 41px;
}

.publicaties  li { margin:0; padding:0 15px;}

/*nieuws*/
.driehoek {float:left;
       border-bottom: 338px solid rgba(255, 255, 255, 1.0);
    border-left: 310px solid transparent;
    background-color: #2f2f2e;
}
.driehoek-geel {float:left;
border-bottom: 250px solid rgba(253, 200, 0, 1.0);
    border-left: 227px solid transparent;
}

.driehoek-geel-vervolg {float:left;
border-bottom: 287px solid rgba(253, 200, 0, 1.0);
    border-left: 227px solid transparent;     margin-left: 20%;
}
.nieuws {width:70%; 
	float:left; 
	/*height: 131px;
	
	background-image:url(../afbeeldingen/blok-schuin-grijs.png); 
	background-repeat:no-repeat;
	background-position: -50% 50%;*/
	background-color: #fff; 
	    padding: 4% 2% 0;

}
.nieuws  h2 {float:left; font-size:48px; font-weight:100; letter-spacing: 2px; line-height: 48px; display:inline-block; background-image:url(../afbeeldingen/lijn-koppen.png); background-repeat:no-repeat; background-position: bottom left;  padding-bottom:45px; margin-top:0;    margin-right: 3%;}

.nieuws  p {float: left;
    width: 77%; }

.leesmeer {background-image:url(../afbeeldingen/gele-pijl-klein-leesmeer.png); background-position: left center; background-repeat: no-repeat;}


/*contact footer*/
.contact {width: 60%;
	     float: left;
	 
   }
.contact-vervolg {width: 25%;
	 float: left;
   	background-color: #fdc800;

}
.contact  h2 { font-size:48px; font-weight:100; letter-spacing: 2px; line-height: 48px; display:inline-block; background-image:url(../afbeeldingen/lijn-koppen-zwart.png); background-repeat:no-repeat; background-position: bottom left;  padding-bottom:45px; margin-top:0;    margin-right: 172px;}

.contact-vervolg  h2 { font-size:48px; font-weight:100; letter-spacing: 2px; line-height: 48px; display:inline-block; background-image:url(../afbeeldingen/lijn-koppen-zwart.png); background-repeat:no-repeat; background-position: bottom left; padding-bottom:45px; margin-top:0;    margin-right: 172px;}

.contact  p {float:left; width:63% }
.contact-form {width:60%; float:left; padding: 4% 2% 0;background-color: #fdc800;     }
.contact-form .mx_form_input textarea {    height: 43px !important;}
.contact-tekst {width:32%; float:right;  padding: 4% 2% ;background-color: #fdc800;}
.contact-tekst img {display:block;}

.contact-tekst-vervolg {width:96%; padding: 4% 2%;background-color: #fdc800; float:right;}
.contact-tekst-vervolg img {display:block;}

.footer-ovk {padding:1% 0; 
	float : left;
color : #333;
font-size : 11px;
text-align : center;
width : 100%;
}
.footer-ovk a {
color : #333;
text-decoration : none;
}
.footer-ovk a:hover {
color : #cccccc;
text-decoration : underline;
}



