/***** Tablet *****/
@media only screen and (max-width: 960px) {

    h1, h2 {
        font-size: 40px;
        line-height: 50px;
    }

    .header-white {
        width: 80px;
    }

    .header-yellow {
        width: calc(100% - 80px);
        float: right;
        padding: 40px 50px 50px 50px;
    }

    .header-logo,
    .header-menu {
        display: none;
    }

    .button_container {
        display: block;
    }

    .logo-mobiel {
        opacity: 1;
        transition: .25s;
        transition-delay: .5s;

    }

    footer .grid_5,
    footer .grid_4 {
        width: calc((100% / 12 * 6) - 40px);
    }

    footer .grid_3 {
        width: calc((100% / 12 * 12) - 40px);
        margin-top: 60px;
    }

    .footer-logo {
        float: none;
    }

    .footer-wecare {
        float: none;
        margin: 0 60px 0;
        width: 70px;
    }

    .callme {
        text-align: center;
    }

     .callme .footer-belme {
         width: calc((100% / 12 * 12) - 40px);
     }

     .callme .form-input {
        margin: 10px auto 20px;
         float: none;
         width: calc((100% / 12 * 12) - 40px);
         max-width: 600px;
     }

     .callme .button {
        margin: 20px 0 0;
        max-width: 300px;
        width: calc((100% / 12 * 12) - 40px);
        float: none;
     }

    .homeslider {
        padding-bottom: 80px;
    }

    .hometekst,
    .services {
        padding: 0 15%;
    }

    .screen {
        display: none;
    }

    .tablet {
        display: block;
    }

    .industries-blok {
        width: calc(100% / 3);
        padding: 40px;
    }


    .sliderbuttons:nth-child(1) {
        margin-bottom: 10px;
    }

    .grid_6.left.sliderbuttons,
    .grid_6.right.sliderbuttons {
        text-align: center;
    }

    .contactdetails {
        margin-top: 40px;
    }

    .tabs ul li {
        width: 100%;
    }

    .team-blok {
        width: calc(100% / 3);
    }
}





/***** Phone (portrait 480px) *****/
@media only screen and (max-width: 480px) {

    .header-yellow {
        padding: 40px 20px 20px 20px;
    }

    h1, h2 {
        font-size: 28px;
        line-height: 34px;
    }

    footer .grid_5,
    footer .grid_4 {
        width: calc((100% / 12 * 12) - 40px);
    }

    .copyright {
        text-align: center;
    }

    .hometekst,
    .services {
        padding: 0;
    }

    .phone {
        display: block;
    }

    .tablet {
        display: none;
    }

    .industries-blok {
        width: calc(100% / 2);
        padding: 20px;
    }

    .team-blok {
        width: calc(100% / 2);
    }
}





/***** Screen (mobilemenu fixes when menu is open and screen gets bigger) *****/
@media only screen and (min-width: 961px) {

    .header-white {
        width: 25%;
    }

    .header-yellow {
        width: 75%;
        float: left;
    }

    .header-logo,
    .header-menu {
        display: block;
    }

    .button_container {
        display: none;
    }

    .logo-mobiel {
        opacity: 0;
    }

    header .overlay {
        display: none;
    }

    .header-yellow-content.getyellow {
        opacity: 1;
    }

}

/***** HEADER ICONS *****/
@media only screen and (min-width: 1600px) {
    .headericon {
        width: 600px;
    }
}

/***** HEADER ICONS *****/
@media only screen and (max-width: 1600px) {
    .headericon {
        right: 20px;
        top: -130px;
        width: 150px;
    }
}

/***** HEADER ICONS *****/
@media only screen and (max-width: 960px) {
    .headericon {
        top: -20px;
        right: -20px;
        width: 80px;
    }
}

/***** HEADER ICONS *****/
@media only screen and (max-width: 480px) {
    .headericon {
        display: none;
    }
   
}