BODY {
	font-family:  LatoWebLight,  Arial, Helvetica, sans-serif;
	letter-spacing: normal;
	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; 
}

.header {

        background: #162642; 
        height: auto;

        max-height: auto;
        /* min height is menu knop plus marge om balk weer te geven bij leeg*/

        
        border: 0px #ff00ff none;
        
        clear: both;
      
        max-width:1260px;
        margin-right: auto;
        margin-left: auto;
        
        /* border-bottom: 1px #616161 solid; */
        
        /* (img-height / img-width * container-width) */                 /* (250  / 1260 * 100)  +marge boven  +marge onder     */
        /* truc om achtergrond kleur mee te laten schalen */
        /* padding-top: percentage(image-height($url) / image-width($url)); } */
        padding-bottom: 25.84%;
}
.logo_knop {

  
  margin: 3% 0px 0px 3%;
  
  width: 20%;
  height: auto;
  max-height: 250px;
  max-width: 250px;
  
  

  display: inline-block; 
  float: left;

}


.kreet {
  
  margin: 3% 0px 4% 0px;
  right: 0px;
  width: 60%;
  height: auto;
  
  max-width: 850px;
  
  

  display: inline-block; 
  float: right;

}

#hmenu {
   margin: 0px 20px 0px 0px;
   padding: 0px 0px 0px 0px;
   /* border: 1px solid #ff0000; */
  
   float: right;
   /* background: #162642; */ 
   width: auto;
   font-size: 0.9em;
}
.sticky {  
        padding-bottom: 0.1%;
        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: 5px 0px 5px 5px;
  width: auto;
  height: 80px;
  
}
.sticky #hmenu {

   margin: 23px 0px 0px 0px;
   
}

.sticky .kreet {
   display: none;
}


.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;
  
  
  border: 0px none #e9e9e9;
  
  margin-right: auto;
  margin-left: auto;
  
  max-width:1280px;
  background: #ffffff; 
}

#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;
	/* voor raar gedrag met scrollen bij korte pagina's moet de footer minimaal de hoogte van de header + de sticky balk zijn */
	min-height: auto;
	width: 100%;
	
	border-collapse: collapse;
	
	overflow-x: hidden;
    background: #162642; 
    padding: 0px 5px;
    max-width:1260px;
    /*     voorkomen dat padding opgeteld wordt bij 100%   */
    box-sizing: border-box;
}

#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: Arial, Verdana, "Verdana TT", 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
{
	
	padding: 0% 4% 0% 4%;
	margin: 0 auto;
	/* heeft txt align zin met ons cms? */
	border-bottom: 0px none #000000;
	
	
}
.sectieopmaak_2 .tdlinksparent  {
/* 		verspringen links gaat 80px naar beneden */
		padding: 80px 0px 80px 0px;
			/* border: #ff0000 2px solid;	 */
		/* background: #616161; */
		}
.sectieopmaak_2 .tdmiddenparent  {
		
		
		/* background: #610061; */
		}
.sectieopmaak_2 .tdrechtsparent  {
		
		
		/* background: #610061; */
		}
.sectieopmaak_3 {
  /* alleen voor respnsive doet verder zelf niks detailpagina referentieproject */
  
  /* deze sectie stijl is voor tabel links midden rechts responsive */
    
}
.sectieopmaak_4 {
  /* alleen voor responsive aleen zichtbaar op telefoon */
  
   /* deze sectie stijl is voor tabel links midden rechts responsive  afbeeldingen worden 100%*/
    
}
.sectieopmaak_5 {
  /* alleen voor responsive aleen zichtbaar op pc */
   display: block;  
}

.specialefoto {
   /* dit is door 99 als nr te kiezen  ipv link 21 of rechts 41 */
   /* display:inline-block; */
   margin: 0 1% 0 0;

}