.btn-primary::before{
    position: absolute; content: ''; border: 0px solid #13a337; width: 30px; height: 30px; background: url("../img/icons/pijl.svg"); background-repeat: no-repeat; background-size: cover;
    left: 30px;
}
.light .btn-primary{
    color: #c7d6d2!important;
}
.onze-steentjes .light .btn-primary{
    display: none;
}


#projecten{
    width: calc(100% - 40px); margin-top: 45px;
}
#projecten .page-block-caption{
    display: none;
}
#projecten .block.projects{
    padding: 0px; overflow: hidden; margin: 0px;
}
#projecten .block.projects .block-image{
    padding: 8.3% 0px 0px 8%;
}
#projecten .block.projects .block-ttl{
    position: absolute; top: auto; bottom: 0px; background: rgba(199,214,210,0.8); height: 35px; width: 92%; margin-left: 8%;
}
#projecten .block.projects .block-ttl h2{
    font-family: headfont; font-size: 14px; padding: 0px 20px; margin: 0px; line-height: 35px;
}
.block.projects .block-ttl h2 a{
    color: #002f3c;
}
.block.projects .block-hover-caption{
    opacity: 0;
    position: absolute; top: auto; bottom: 0px; background: url("../img/frame/steen.svg"); height: 100%; width: 100%; background-repeat: no-repeat; background-size: cover; background-position: 0px 0px;
    left: 8%;
    top: 13.1%;
    pointer-events: none;
}

#projecten .page-block-link{
    margin-top: 45px; text-align: center;
}

#projecten .page-block-link .btn-primary{
    padding-top: 9px; font-family: headfont; background: #13a337; color: #ffffff;
}
#projecten .page-block-link .btn-primary::before{
    display: none;
}


.block.projects .block-hover-caption h2,
.block.projects .block-hover-caption h3{
    text-align: center; padding: 0px 8.3% 0px 0px; margin: 100px 0px 0px 0px;
    font-family: acumin-pro, sans-serif;
    font-weight: 300;
    font-style: normal; font-size: 38px;
}
.block.projects .block-hover-caption h3{
    font-weight: 400; font-size: 18px; margin: 0px;
}


.block.projects:hover .block-hover-caption{
    -webkit-animation: brick 1s linear ;
    -moz-animation: brick 1s linear ;
    -ms-animation: brick 1s linear ;
    -o-animation: brick 1s linear ;
    animation: brick 1s linear ;
    animation-fill-mode: forwards;

    
}
@keyframes brick {
  0% {
      opacity: 0;
    left: 8%;
    top: 13.1%;
  }
  40% {
      opacity: 1;
    left: 8%;
    top: 13.1%;
  }
  100% {
        left: 0%;
        top: 0%;
      opacity: 1;
  }
}


.block.projects-filler{
    padding: 0px; overflow: hidden; margin: 0px;
    position: relative; float: left; width: 16.66%; background: #ffffff;
}
.block.projects-filler .block-image{
    width: 183.4%; float: right;
    padding: 16.6% 0px 0px 0%;
}
#projectblockfiller_2{
    float: right; margin-right: -40px
}
#projectblockfiller_2 .block-image{
    float: left;
}

@media (max-width: 768px){
    .block.projects-filler{
        display: none;
    }
}

.onze-steentjes #pageBlock1{
    display: none;
}

#mywork .block.projects{
    width: 100%; margin: 30px 0px 0px 0px; float: left; position: relative;
    width: 100%; padding: 0px 0px 0px 75px;
}

#mywork .block.projects .block-image{
    width: 34%;
}
#mywork .block.projects .block-ttl{
    width: 50%; padding-left: 45px; position: relative; float: left;
}
#mywork .block.projects .block-ttl h2 a{
    color: #13a337;
}
#mywork .block.projects .block-ttl h3 a{
	font-family: acumin-pro, sans-serif;
    font-weight: 400;
    font-style: normal; font-size: 34px; text-decoration: none; color: #002f3c;
}

#mywork .block.projects .block-caption{
    width: 50%; padding-left: 45px;
}

@media (max-width: 768px){
    
    #mywork .block.projects{
        width: 50%;
        padding: 0px 0px 0px 0px;height: 600px;
    }

    #mywork .block.projects .block-image{
        width: 100%;
    }
    #mywork .block.projects .block-ttl,
    #mywork .block.projects .block-caption{
        width: 100%; padding-right: 15px; padding-left: 15px;
    }
}

@media (max-width: 600px){
    
    #mywork .block.projects{
        width: 100%; height: auto;
    }

}

.contact #pageBlock1{
    margin: 0px;  padding-bottom: 0px;  
}
.contact #pageBlock1 .page-block-caption .page-block-name h1{
    color: #13a337; font-size: 34px; padding-top: 45px;
}
.frame1{
    background: url("../img/frame/frame.svg");width: 370px; background-repeat: no-repeat; background-size: contain; background-position: 0px 0px;
    padding: 60px 110px 10px 65px; margin: 0px 0px 30px 0px;
}
.frame1 textarea{
    height: 95px; border: 1px solid #f1f1f1!important; border-radius: 0px;
}
.frame2 {
    max-width: 320px;
}
@media (min-width: 768px){
    .contact #pageBlock1{
        width: 40%; margin-bottom: 60px;
    }
    .contact #pageBlock1 .page-block-caption .page-block-name h1{
        font-size: 60px; padding-top: 45px;
    }
    .frame1{
        position: absolute; top: -200px; left: auto; left: 50%;
    }
    .frame2 {
        max-width: 400px; margin-left: 50px!important;
    }
}
@media (min-width: 991px){
    .contact #pageBlock1 .page-block-caption .page-block-name h1{
        font-size: 80px;
    }
    .frame1{
        width: 600px; height: 400px; top: -350px; 
        padding: 105px 160px 0px 120px; margin: 0px 0px 30px 0px;
    }
    .frame1 textarea{
        height: 160px;
    }
}

#detailfino h2 span{
    color: #13a337;
}
#uwplanidee{
    background:#c7d6d2; text-align: center!important;
}
#uwplanidee .page-block-txt{
    text-align: center!important;
}
#uwplanidee .btn-primary{
    padding-top: 9px; font-family: headfont; background: #13a337; color: #ffffff;
}
#uwplanidee .btn-primary::before{
    display: none;
}

#pageBlock0.small .page-block-page_image img{
    max-width: 535px;
}


#plangallery{
    width: 100%;
}
#plangallery .block-image{
    padding: 15px 105px 0px 15px;
}
#plangallery .block-image:nth-of-type(2n){
    padding: 15px 15px 0px 105px;
}
@media (min-width: 768px){
    #plangallery .block-image{
        width: 50%;
    }
    #plangallery .block-image{
        padding: 15px 30px 15px 105px; float: left;
    }
    #plangallery .block-image:nth-of-type(2n){
        padding: 45px 105px 15px 60px; float: right;
    }
    
    h3.year-ttl{
        padding-left: 75px!important;
    }
}

