BODY {
	font-family:  LatoWebLight,  Arial, Helvetica, sans-serif;
	letter-spacing: normal;
	letter-spacing: .05em;
	font-size: 100%;
	padding: 0;
	margin: 0;
	
	/* Webkit: prevent flickers */
     -webkit-backface-visibility: hidden;
    
    /* Force hardware-acceleration in Webkits to prevent text flickering */
    -webkit-transition: translate3d(0,0,0);
    
    background: #ffffff;
    /* background: #00acf2; */
}
#introfoto {
  
    width: 100%; 
    height: 400px; 
   
    left: 0px; 
    top: 0px; 
    z-index: 0;
    
    /* border: #ff00ff 2px solid; */
    position: relative;
    
  background: url(vde_patroon.gif);
  
  background-position: left top;  
  background-repeat: repeat;  
  
    
}
.header {

        background: #4d545e; 
        height: auto;
        min-height: 42px;
        /* min height is menu knop plus marge om balk weer te geven bij leeg*/
        padding: 0px 0px 0px 0px;
        
        clear: both;
      
        max-width:1260px;
        margin-right: auto;
        margin-left: auto;
        border: #4d545e 0px none;
        /* border-bottom: 1px #616161 solid; */
        margin-bottom: 12px;
}
.logo_knop {

  float:left; 
  margin: 12px 0px 12px 0px;
  
  width: 60%;
  height: auto;
  max-height: 91px;
  max-width: 320px;
  
}
#hmenu {
   /* voor right uitlijnen margin: 57px 0px 0px 0px; en float: right;*/
   /* voor centreren */
   margin: 0px auto 0px auto;
   padding: 0px 0px 0px 0px;
   border: 0px none #ff0000;
   /* border: 1px solid #ff0000; */
   
   /* background: #00adef; */
   width: auto;
   font-size: 1.1em;
    
}
.sticky {  

        position: fixed;  
        
        top: 0;  
        z-index: 100;  
        /* width: auto|value|initial|inherit;*/
        
         
        /* let op voor de juiste breedte moet deze en parent binnen #top vallen ander werkt inherit niet en wordt breedte berekend */
        border: 0px none #0000ff; 
        border-bottom: 1px solid #efefef;
          
         
        width: 98%; /* voor oude browsers */
	    width: -moz-calc(100% - 20px);
        width: -webkit-calc(100% - 20px);
        width: calc(100% - 20px); 
        
        
             /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)";

  /* IE 5-7 */
  filter: alpha(opacity=95);

  /* Netscape */
  -moz-opacity: 0.95;

  /* Safari 1.x */
  -khtml-opacity: 0.95;

  /* Good browsers */
  opacity: 0.95;
}
.sticky .logo_knop {

  float:left; 
  margin: 2px 0px 0px 0px;
  width: auto;
  height: 80px;
  
}
.sticky #hmenu {

   margin: 0px 0px 0px 0px;
   
}
.tel_button {

     float:left; 
     margin: 5px 5px 0px 0px;
     width: auto;
     height: 23px;
     display: none;
}
#canvas {
/* zaken voor er om heen */
  width: 100%;
  margin: 0px 0px 0px 0px; 
  padding: 0px 0px 0px 0px; 
  height: auto;
  
  background: #ffffff;
  border: 0px none #e9e9e9;
  
  margin-right: auto;
  margin-left: auto;
  
  max-width:1280px;
  
}

#content-wrapper {
/* zaken voor de gehele content */
  width: auto;
  margin: 0px 10px 0px 10px;  
  
  /~* marge voor de gehele site */
  padding: 0px 0px 0px 0px; 
  font-size: 1.0em;
  font-size: 100%;
  height: auto;
 
  
  border: 0px none #cccccc;
  
}
#tekstgedeelte {

	margin: 0px 0px 0px 0px;
	padding: 0px;
	border: 0px none #ffccff;
	border-collapse: collapse;
	
	overflow-x: hidden;

	clear: both;
	display: block;
max-width:1260px;
    


}
#footer {
    /* nav is 80  foot zelf is 180 */
	/* iets meer nemen voor menubalk maar hoe veel? is dat hoogte van menu? ongeveer 80 nee lijkt maar 20 of zo (mooi voor imr logo onderaan .... )*/
   
	border: 0px none #ffffff;
	
	height: auto;
	width: 100%;
	min-height: 400px;
	border-collapse: collapse;
	
	overflow-x: hidden;
    
    padding: 0px 0px;
    max-width:1260px;
    /*     voorkomen dat padding opgeteld wordt bij 100%   */
    box-sizing: border-box;
    background: url(vde_patroon.gif);
  
    background-position: left bottom;  
    background-repeat: repeat;  
}
#footertransparant {
  width: 100%;
  height: 100%;
  background: url(footer-transparant-rood-verloop.png);
  background-size: auto 100%;
  background-position: left bottom;  
  min-height: 400px;
  
  padding: 5% 2% 2% 2%;
}
#zoekveld {
    
    /* border: #ff00ff 2px solid; */
	float: right;
	margin: 19px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	width: 50%;
	height: auto;
	/* background-color:#ff22ff; border: 1px solid #ff0000;*/
	text-align: right;
	display: none;
}
.zoekinput {

 width: 168px;
 height: 21px;
 border: 1px solid #00acf2;
 
 font-family:  LatoWebLight,  Arial, Helvetica, sans-serif;
		font-size: .7em;
		background-color: #ffffff;
padding: 0px 0px 0px 2px;
border-radius:0px;
/* voor aplle borders bij velden */
 
}

#navlist {
  margin: 0;
 
  padding: 0;
  text-align: center;
  max-width:1260px;
 
}

#navlist ul {
  
  list-style-type: none;
  list-style-image: none;
 
  text-align: center;
 
}

#navlist li {
  
  margin: 0;
  display: inline-block;
  /* padding: 5px 20px 5px 20px; */
  padding: 0.3em 0.4em ;
  border: #ff0000 0px none;
  /*line-height: 40px;*/
  line-height: 1.5em;
  height: 100%; 
  border: #ffffff 0px none;
  text-align: center;
    
}
#navlist li:hover {
    /* box-shadow:inset 0 0 10px #ffffff; */
    cursor: pointer;
}

#nav ul li a {

  text-decoration: none;
  margin: 0;
  padding: 0px 0px 0px 0px;
  color: #677076;
  border: #ff0000 0px none;
  font-weight: normal;
}


#nav ul li a:hover {
/* mouseover of touche tablet */
  
  text-decoration: none;
  color: #c8ab78;
}

/* Active class bij nav hor*/

.sideviewtoggleknop {

     float:right; 
     margin: 5px 2px 0px 0px;
     width: auto;
     height: 30px;
     display: none;
}

.sectieopmaak_1 {
  /* alleen voor respnsive doet verder zelf niks */
  
  /* deze sectie stijl is voor info pagina de polaroid heeft geen marges hier links en rechts */
    
}

.sectieopmaak_1 .pull-right {
		/* 
float: right;
		margin: 0.8em 0 2em 0em;
 */
		
}
.sectieopmaak_1 .pull-left {
		float: left;
		margin: 0.8em 0em 2em 0;
}


.sectieopmaak_2 {
  /*  */
  
  min-height: 100%;
  height: auto;
  padding: 15% 0 15% 0;
  margin: 0 auto;
  /* heeft txt align zin met ons cms? */
    
  border-bottom: 0px none #000000;
  
 
   
    background: url(verzekeringen-sectie.jpg)  center center fixed;
    webkit-background-size: cover;
    moz-background-size: cover;
    o-background-size: cover;
    background-size: cover;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='verzekeringen-sectie.jpg',     sizingMethod='scale');
    -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='verzekeringen-sectie.jpg', sizingMethod='scale');
    
}


.sectieopmaak_3 {
  
  /*  */
  
  min-height: 100%;
  height: auto;
  padding: 15% 0 15% 0;
  margin: 0 auto;
  /* heeft txt align zin met ons cms? */
    
  border-bottom: 0px none #000000;
  
 
   
    background: url(ons_kantoor.jpg)  center center fixed;
    webkit-background-size: cover;
    moz-background-size: cover;
    o-background-size: cover;
    background-size: cover;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='ons_kantoor.jpg',     sizingMethod='scale');
    -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='ons_kantoor.jpg', sizingMethod='scale');
    
    
    
}
.sectieopmaak_4 {
  /*  */
  
  min-height: 100%;
  height: auto;
  padding: 15% 0 15% 0;
  margin: 0 auto;
  /* heeft txt align zin met ons cms? */
    
  border-bottom: 0px none #000000;
  
 
   
    background: url(financiele-diensten-en-leningen.jpg)  center center fixed;
    webkit-background-size: cover;
    moz-background-size: cover;
    o-background-size: cover;
    background-size: cover;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='financiele-diensten-en-leningen.jpg',     sizingMethod='scale');
    -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='financiele-diensten-en-leningen.jpg', sizingMethod='scale');
    
    
}


.sectieopmaak_5 {
  /*  */
  
  min-height: 100%;
  height: auto;
  padding: 15% 15% 15% 15%;
  margin: 0 auto;
  /* heeft txt align zin met ons cms? */
    
  border-bottom: 0px none #000000;
  
 
   
    background: url(kerstman.jpg)  center center fixed;
    webkit-background-size: cover;
    moz-background-size: cover;
    o-background-size: cover;
    background-size: cover;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='kerstman.jpg',     sizingMethod='scale');
    -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='kerstman.jpg', sizingMethod='scale');
    
    
}
.sectieopmaak_5 TD{
  /* standaard tekst */
   /* 
color: #ffffff;
   color: #c5c6c6;
 */
}

.transparant-wit-30 {
   
   /* hoort bij sectie 2 opmaaktoevoeging in vardef*/
    
    padding: 0% 4% 0% 4%;
    /* position: absolute; 
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 100%; */
   
   
    background-image: url("tansparant-wit-30procent.png");
	background-size: 100%;
   
}
.transparant-wit-50 {
   
   /* hoort bij sectie 9 opmaaktoevoeging in vardef */
    
    padding: 4% 4% 4% 4%;
    /* position: absolute; 
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 100%; */
   
   
    background-image: url("tansparant-wit-50procent.png");
	background-size: 100%;
   
}
.transparant-wit-70 {
   
   /* hoort bij sectie 9 opmaaktoevoeging in vardef */
    
    padding: 4% 4% 4% 4%;
   
    background-image: url("tansparant-wit-70procent.png");
	background-size: 100%;
   
}
.sectieopmaak_6 {
	
    padding: 1% 0% 1% 28%;
	margin: 0% 0 0% 0;

	min-height: 400px;	
    /* background: #f88800; */

	border-bottom: 0px none #000000;
	background-repeat: no-repeat;


    webkit-background-size: auto 100%;;
    moz-background-size: auto 100%;;
    o-background-size: auto 100%;;


	background-size: auto 100%;
	background-image: url(sinterklaas.jpg);
	background-position: left top;

	
}


/* start sectie 7  dit blijft even de test */
.sectieopmaak_7 {

	padding: 1% 0% 1% 0%;
	margin: 0 0 0 0;
	
	/* border: 1px dotted #000000; */
	
	/* 3 kolommen met border lichtblauw en padding 1% */
	
}

.sectieopmaak_7 .tdlinks {
   padding: 11% 11% 11% 11% !important;
}
.sectieopmaak_7 .tdrechts {
   padding: 11% 11% 11% 11% !important;
}

.sectieopmaak_7 .tdlinksparent {
/*  de blokken zijn 30% - de hoogte zelf invullen door 100% in hoogte element te tikken*/
/* er is een sheet "3 kol achtergrond " voor bereken van dit  */
 padding: 1% 3.3333% 1% 0;
 
 
}



.sectieopmaak_7 .tdmiddenparent {
   
  
  padding: 1% 1.6666% 1% 1.6666%;
  
 
}

.sectieopmaak_7 .tdrechtsparent {
   
   padding: 1% 0 1% 3.3333%;
   
   
/* 
  
   -webkit-box-shadow:inset 0px 0px 0px 10px #f00;
    -moz-box-shadow:inset 0px 0px 0px 10px #f00;
    box-shadow:inset 0px 0px 0px 10px #f00;
 */


}
.sectieopmaak_7 .aligntabel_img {
   
   text-align: center;

}

.sectieopmaak_7  .verderopmaak {
  float: right;
  
}



/* start sectie 8  */

.sectieopmaak_8 .tdlinksparent {
 /* 
        alleen opmaak neer zetten als div geen 100% is dit is voor marges  tussen blokken
        border: 1px #000000 solid;
 */
    height: 100%;
	
	padding: 0% 3% 0% 6%;
    background-color: #e1d8c8;
    
}

.sectieopmaak_8 .tdlinksparentdiv {
	/* dit is binnen .tdlinksparent het tekstblok links dus */
	/* border: 3px #000000 dotted; */
	/* padding: 0% 1.5% 0% 3%; */
	
	height: 100%;
	
	background-color: #f8f5f0;
    /* 	let op je kan hier niet met padding boven of onder werken, de hoogte is namelijk percentage van het percentage blok en is dus dan weer niet gelijk */
    /* geeft gelijk de mogelijkheid om dat WEL te doen in blokken zelf */
	padding: 0% 4% 0% 4%; 
}

.sectieopmaak_8 .tdmiddenparent {
  /* midden doet niet mee  padding: 1% 0.6666% 1% 0.6666%; */
}

.sectieopmaak_8 .tdrechtsparent {
	/* padding: 1% 1.25% 1% 2.5%; */
	/* background-color: #ccCCCC; */
    /* 	border: 1px #000000 solid; */
	height: 100%;
	padding: 0% 6% 0% 3%;
    background-color: #e1d8c8;
}
.sectieopmaak_8 .tdrechtsparentdiv
{
	/* dit is binnen .tdrechtsparent het tekstblok rechts dus*/
	height: 100%;
	
	background-color: #f8f5f0;
	
	/* 	let op je kan hier niet met padding boven of onder werken, de hoogte is namelijk percentage van het percentage blok en is dus dan weer niet gelijk */
	/* geeft gelijk de mogelijkheid om dat WEL te doen in blokken zelf */
	padding: 0% 4% 0% 4%; 
	
	/* display: table; */
}
.sectieopmaak_8 .tdlinks { 
   /*  gewoon doen in cms
   background-color: #dadada;
   border: 1px solid #00abf1;
   */
}
.sectieopmaak_8 .tdrechts { 
   
}

.sectieopmaak_8 .aligntabel_img {
   
   text-align: center;

}




/* start sectie 9  test voor blokken van gerine ----------------------------------------------------------------------------------------------------------------------------   */
.sectieopmaak_9 {

	padding: 1% 0% 1% 0%;
	margin: 0 0 0 0;
	
	/* background-color: #ff0000; */
	
}



.sectieopmaak_9 .tdlinksparent {
 /* 
        alleen opmaak neer zetten als div geen 100% is dit is voor marges  tussen blokken
        border: 1px #000000 solid;
 */
    height: 100%;
/* 	padding: 1% 0 1% 2.3333%; */
	padding: 0% 2.3333% 0% 0%;
    background-color: #e1d8c8;
    
}

.sectieopmaak_9 .tdlinksparentdiv {
	/* dit is binnen .tdlinksparent het tekstblok rechts dus*/
	background-color: #f8f5f0;
	
	/* 	let op je kan hier niet met padding boven of onder werken, de hoogte is namelijk percentage van het percentage blok en is dus dan weer niet gelijk */
	/* geeft gelijk de mogelijkheid om dat WEL te doen in blokken zelf */
	padding: 0% 4% 0% 4%; 
	
	height: 100%;
	
	
}

.sectieopmaak_9 .tdmiddenparent {
  /* midden doet niet mee  padding: 1% 0.6666% 1% 0.6666%; */
    height: 100%;
	/* padding: 0% 6% 0% 3%; */
	padding: 0% 0.6666% 0% 0.6666%;
    background-color: #e1d8c8;
}
.sectieopmaak_9 .tdmiddenparentdiv {
	/* dit is binnen .tdlinksparent */
	/* border: 3px #000000 dotted; */
	/* padding: 0% 1.5% 0% 3%; */
	
	height: 100%;
	
	background-color: #f8f5f0;
	
	/* 	let op je kan hier niet met padding boven of onder werken, de hoogte is namelijk percentage van het percentage blok en is dus dan weer niet gelijk */
	/* geeft gelijk de mogelijkheid om dat WEL te doen in blokken zelf */
	padding: 0% 4% 0% 4%; 
}

.sectieopmaak_9 .tdrechtsparent {
	/* padding: 1% 1.25% 1% 2.5%; */
	/* background-color: #ccCCCC; */
    /* 	border: 1px #000000 solid; */
	height: 100%;
	/* padding: 0% 6% 0% 3%; */
	padding: 0% 0% 0% 2.3333%;
    background-color: #e1d8c8;
}
.sectieopmaak_9 .tdrechtsparentdiv
{
	/* dit is binnen .tdrechtsparent */
	height: 100%;
	
	background-color: #f8f5f0;
	
	/* 	let op je kan hier niet met padding boven of onder werken, de hoogte is namelijk percentage van het percentage blok en is dus dan weer niet gelijk */
	/* geeft gelijk de mogelijkheid om dat WEL te doen in blokken zelf */
	padding: 0% 4% 0% 4%; 
}
.sectieopmaak_9 .tdlinks { 
   /*  gewoon doen in cms
   background-color: #dadada;
   border: 1px solid #00abf1;
   */
}
.sectieopmaak_9 .tdrechts { 
   
}

.sectieopmaak_9 .aligntabel_img {
   
   text-align: center;

}
.sectieopmaak_9 A:ACTIVE,  .sectieopmaak_9  A:VISITED, .sectieopmaak_9 A:LINK{
	color: #ff0000;
	font-weight: bold;
	text-align: center;
	background-color: #ff00ff;
}

.sectieopmaak_9 A:HOVER {
	color: #e64190;
	font-weight: bold;
	text-align: center;
	background-color: #ff00ff;
}
.specialefoto {
   /* dit is door 99 als nr te kiezen  ipv link 21 of rechts 41 */
   /* display:inline-block; */
   margin: 0 1% 0 0;

}