.animation-element.slide-left{opacity:0;-moz-transition:all 800ms linear;-webkit-transition:all 800ms linear;-o-transition:all 800ms linear;transition:all 800ms linear;
                                
                                -moz-transform:translate3d(-500px, 0px, 0px);-webkit-transform:translate3d(-500px, 0px, 0px);-o-transform:translate(-500px, 0px);
                                -ms-transform:translate(-500px, 0px);transform:translate3d(-500px, 0px, 0px)}
.animation-element.slide-left.in-view{opacity:1;-moz-transform:translate3d(0px, 0px, 0px);-webkit-transform:translate3d(0px, 0px, 0px);-o-transform:translate(0px, 0px);
                                        -ms-transform:translate(0px, 0px);transform:translate3d(0px, 0px, 0px)}


html
{
    overflow-x:hidden
}


body
{
    overflow-x:hidden;
    
    display: block;
    font-family:  'Oranienbaum' , serif;
    color: #2F4F4F; /*#292A2C donker grijs JasperBaartmans*/
    font-weight: 100;
    line-height: 160%;
    font-size: 20px;
    width:100%;
    max-width:100%;
}

#body_menu
{
    font-family: 'Oranienbaum' , serif;
    color: white; /*#292A2C donker grijs JasperBaartmans*/
    background-color: Black;
    font-weight: 100;
    font-size: 70px;
    width: 100%;
    line-height: 15%;
}

#body_menu a:hover
{
    color:#D4B42F;
}

#body_menu a
{
    color:White;
}


#content_panel
{
    position: inherit;
    z-index: 0;
    left: -10px;
}

#omhoog_panel
{
    position:relative;
    z-index:1;
}

.anker_omhoog
{
    font-size: 60px;
    font-weight: 100;
    text-align: left;
    font-family: 'Lora', serif;
}

#altijd_zichtbaar_omhoog
{
    border-style: 100px;
    float: right;
    position: relative;
}



#vlaggen_panel
{
    position: absolute;
    z-index: 1;
    right: 0px;
} 

.talen_div
{
    
    width: 12%;
    font-size: 25px;
    text-align: left;
    height: 250px;
}  

.talen
{
    height: 35px;
    margin-top: 0px;
    text-align: left;
}
   
.omhoog_div
{
    font-family: 'open Sans';
    width:10%;
    text-align: left;
}         
.logo_div {
    position: relative;
    /*left:30%;*/
    margin: 1%;
    padding: 1%;
    margin-bottom: 2%;
    height: auto;
}


.content {
    position:relative;
    display: block;
    max-width:100%;
    margin-left: 15%;
    margin-right:15%;
    padding-right:5%;
    }

.content_hele_breedte {
    position:relative;
    display: block;
    max-width:100%;
    margin-left: 15%;
    margin-right:22%;
    padding-right:5%;
    }

.content_hele_breedte_alle_projecten
{
    position: relative;
    margin-left:0%;
    margin-right: 0%;
    background-color: #f5f5f5;
    display:block;
}
    
.content_zw_alle_projecten
{
    position: relative;
    margin-left:15%;
    margin-right: 20%;
    background-color: #f5f5f5;
    display:block;
}

.footer
{
    position: relative;
    left: -10px;
    width: 110%;
    height: 100%;
    background-color: #3D3F3E;
    color: #FFFFFF;
} 

.hele_breedte_alle_projecten
{ 
  left:-10px;
  position:relative; 
  width:110%; 
  height:100%;
  background-color: #f5f5f5;
}      
.content_footer
{
    position: relative;
    margin-left: 15%;
    margin-right: 15%;
    padding-right: 5%;
    display: block;
    background-color: #3D3F3E;
} 
.zwfoto
{
	position: relative;
	width: 100%;
    height:auto;
}
       
hr {
        border:none;
        border-top:1px solid #D4B42F;
        height:1px;
        text-align:left;
        width:98%;
}

hr.wit
{
            border-top:1px solid white;
}

h1
{
    font-style:normal;
    font-weight:100;
}

h2 
{
    font-size: 120%;
    color: #D4B42F;
}
.fototekst h3
{
    font-size:20px;
    /*line-height:0px;*/
    font-weight: 100;
      
}
.fototekst h3 a
{
    color:gray;
}
.fototekst h3 a:hover
{
    color: #D4B42F;
}
.fototekst h4
{
    font-size:15px;
    line-height:17px;
    font-weight: 100;
}
.fototekst h4 a
{
    color: #D4B42F;
}
.fototekst h4 a:hover
{
    color:#2F4F4F;
}






/*START MEDIA SCREEN*/




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

           
    .two_col_item {
        width: 45%;
    }
    
    
    .drie_col_item {
        width: 29%;
    }
    
    .drie_col_break
    {
        clear:both
    }

    .ddot_logo_item {
        width: 225px;
        /*background-color:Olive;*/
    }
    .logo_item_footer
    {
        width: 200px;
    }
    
    
    h1
    {
        font-size:63px;
        line-height:85px;
    }
    .talen
    {
        width:40px;
    }
    
    .grote_tussenruimte
    {
        height:50px;
    }
    
    .zwfoto_div_test
    {
        width:29%;  
        position: relative;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        float: left;
        height:auto;
  }

    
    .zwfoto_div
    {
        width:29%;  
        position: relative;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        float: left;
        height:auto;
    }
    
    .menu
    {
        font-size:70px;    
    }

}

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

    .two_col_item
    {
        width:45%;
    }
    .drie_col_item {
        width: 29%;
    }
    .drie_col_break
    {
        clear:both
    }
    
    
    .ddot_logo_item {
        width: 225px;
        /*background-color:orange;*/
        
    }
    .logo_item_footer
    {
        width: 200px;
    }
   h1
    {
        font-size:56px;
        line-height:80px;
    }
    .talen
    {
        width:40px;
    }
    .grote_tussenruimte
    {
        height:50px;
    }
    .zwfoto_div
    {
        width:29%;  
        position: relative;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        float: left;
        height:auto;
    }
    .menu
    {
        font-size:60px;    
    }
    
    
}

@media screen and (min-width: 699px) and (max-width: 1020px)
{
.content
    {
    margin-left: 10%;
    margin-right:10%;
    padding-right:5%;
   }
    
.content_footer
{
    margin-left: 15%;
    margin-right: 15%;
    padding-right: 5%;
} 
    

    .two_col_item
    {
        width: 45%;
    }
    
    .drie_col_item {
        width: 29%;
    }
    .drie_col_break
    {
        clear:both
    }
    
    .ddot_logo_item {
        width: 225px;
        /*background-color:Aqua;*/
    }
    
    .logo_item_footer
    {
        width: 200px;
        text-align: center;
    }
   h1
    {
        font-size:42px;
        line-height:70px;
    }
    .talen
    {
        width:40px;
    } 
    .tussenruimte_voor_fotos
    {
       height:50px; 
    } 
    .grote_tussenruimte
    {
        height:50px;
    }
    .zwfoto_div
    {
        width:29%;  
        position: relative;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        float: left;
        height:auto;
    }
    .menu
    {
        font-size:60px;    
    }
}

@media screen and (min-width: 460px) and (max-width: 699px) 
{

     .content
    {
    margin-left: 5%;
    margin-right:5%;
    padding-right:5%;
    }

.content_footer
{
    margin-left: 5%;
    margin-right: 5%;
    padding-right: 5%;
} 

 
  .two_col_item {
        width:95%;
  }
  
    .drie_col_item {
        width: 45%;
    }
    
    .two_col_break
    {
        clear:both
    }

    
    .ddot_logo_item {
        width: 225px;
        /*background-color:Blue;*/
    }
    
  
    .logo_item_footer
    {
        width: 200px;
        text-align: center;
    }
   h1
    {
        font-size:40px;
        line-height:50px;
    }
    .talen
    {
        width:40px;
    } 
    
    .tussenruimte_voor_fotos
    {
       height:50px; 
    }   
    .grote_tussenruimte
    {
        height:25px;
    }
    .zwfoto_div
    {
        width:45%;  
        position: relative;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        float: left;
        height:auto;
    }
    .menu
    {
        font-size:40px;    
    }
}

@media screen and (min-width:10px) and (max-width: 460px)  /*iphone*/
{
    
.content
    {
    margin-left: 2%;
    margin-right:6%;
    padding-right:6%;
    }

.content_footer
{
    margin-left: 2%;
    margin-right: 6%;
    padding-right: 6%;
}

.talen_div
{
    font-size:18px;
    width: 21px;
}

.talen
{
    width:27px;
}

.anker_omhoog
    {
        font-size: 40px;
        padding-left: 10px;
        font-family: 'Lora' , serif;
        font-weight: lighter;
    }            
hr
{
    margin-right:5px;
}

    .two_col_item{
        width: 90%;
    }
    
    .drie_col_item {
        width: 45%;
    }
    .two_col_break
    {
        clear:both
    }
    

  
    .ddot_logo_item {
        width: 150px;
        /*background-color:Fuchsia;*/
    }
  
    .logo_item_footer
    {
        width: 125px;
        text-align: center;
    }
   h1
    {
        font-size:40px;
        line-height:45px;
    }
    
       
    .tussenruimte_voor_fotos
    {
       height:50px; 
    } 
    .grote_tussenruimte
    {
        height:15px;
    }
      
    .zwfoto_div
    {
        width:45%;  
        position: relative;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        float: left;
        height:auto;
    }
    
        .menu
    {
        font-size:40px;    
    }

    .werk_in_uitvoering
    {
        font-size:25px;
        line-height:40px;   
    }
}



/*EINDE MEDIA SCREEN*/

/* Firefox Only */
/*@-moz-document url-prefix() {
          body {
            font-size:15px;
          } 
           h1{
              font-size:42px;
          }
        .talen_div
        {
            font-size:18px;
            width: 21px;
        }
        .talen
        {
            width:27px;
        }
        .omhoog_div
            {
            width:27px;
        }
        .anker_omhoog
            {
            font-weight:lighter;
            font-size:35px;
        }

 
} /* EINDE FIREFOX*/

  /* Chrome only: */
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) { 
          body {
            font-size:15px;
          } 
           h1{
              font-size:42px;
          }
        .talen_div
        {
            font-size:16px;
            width: 35px;
        }
        .talen
        {
            width:27px;
        }
        .omhoog_div
            {
            width:27px;
        }
        .anker_omhoog
            {
            font-weight:lighter;
            font-size:35px;
        }

    .ddot_logo_item {
        width: 9em;
        /*background-color:Green;*/
    }
    .logo_item_footer
    {
        width: 100px;
    }

 
} /* EINDE chrome*/

.scaled_foto {
    width: 100%;
    height:auto;
}

.intro_div 
{
        position: relative;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        float: left;
        height:auto;
        /*border: thin red solid;*/
}
.two_col_item 
{
       position: relative;
       float: left;
        margin: 1%;
        padding: 1%;
        height:auto;
        overflow:hidden;
        
        /*border: thin red solid;*/
}

.drie_col_item 
{
       position: relative;
       float: left;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        height:100%;
        
        /*border: thin red solid;*/
}

.ddot_logo_item
{
       position: relative;
       text-align: left;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        height:100%;
        
        /*border: thin red solid;*/
}

.logo_item_footer
{
       position: relative;
       text-align: left;
        margin: 1%;
        padding: 1%;
        margin-bottom:2%;
        height:100%;
        /*border: thin red solid;*/
}


.two_col_item_pic 
{
	position: relative;
	width: 100%;
    height:auto;
}

.logo_item_pic
{
	position: relative;
	width: 100%;
    height:auto;
}



div.fototekst
{
  position:relative;
  text-align: center;
  font-size: 15px;
  text-indent: 0;
  }

.tussenruimte
{
    height:20px;
}
.kleine_tussenruimte{
    height:5px;
}


.two_col_setup a
{
    color:#D4B42F;
}

.two_col_setup a:hover
{
	color: black;
}

.two_col_clear
{
    clear:both
}

/*Hover MouseOver bij Linkbutton*/
.popup {
	background-position:left top;
	visibility:hidden;
}

.popup_hover {
	background-position:left top;
    visibility: hidden;

}

a
{
    font-style:normal;
    text-decoration: none;
    color:#D4B42F;
}

a:hover
{
    color: black;
}

a:visited
{
    color: #D4B42F;
}

.link_projecten 
{
    font-style:normal;
}

.tekstbox_contact
{
    border-style: solid;
    border-color: #F6f6f6;
    width: 100%;
    height: 40px;
    font-size: 20px;
}
.tekstarea_contact
{
    border-style: solid;
    border-color: #F6F6F6;
    width: 100%;
    height: 150px;
    font-size: 20px;
}

.contactknop
{
    font-size: 15px;
    color: white;
    background-color: #D4B42F;
    padding: 15px;
    border: none;
    font-weight: bold;
}

.contactknop:hover
{
    color: black;
}

.footer a:hover
{
    color: white;
}


.werk_in_uitvoering
{
    text-align: center;
}