* {
    padding: 0;
    border: 0;
    margin: 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

footer {
    background: #222;
    color: white;
    text-align: center;
    padding: 20px;
    font-size: 14px;
    margin-top: 10%;
}

footer a {
    color: white;
    text-decoration: none;
    margin: 0 10px;
}

footer a:hover {
    text-decoration: underline;
}




/* telefoon */


@media (max-width: 599px) {


    #telefoon_boven {
        width: 100%;
        position: absolute;
    }

    #desktop_boven {
        display: none;
    }

    #naam_titel {
        width: 30%;
        position: absolute;
        padding-top: 5%;
        padding-left: 30%;
        padding-right: 40%;

    }

    #introductie_kort {
        position: absolute;
        margin-top: 40%;
        margin-left: 8%;
        color: white;

    }

    #introductie_desktop {
        display: none;
    }

    #rectangle {
        display: none;
    }

    #telefoon_midden {
        width: 100%;
        position: absolute;
        margin-top: 140%;
    }

    #desktop_midden {
        display: none;
    }

    #profielfoto {
        width: 100%;
        padding-top: 3%;
    }

    #profielfoto_expanded {
        display: none;
    }

    #introductie {
        margin-top: 6%;
        margin-bottom: -10%;
        font-weight: bold;

    }

    main {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 30%;

    }

    h1 {
        padding-left: 10%;
        padding-right: 10%;
        margin-top: 10%;
    }

    h3 {
        opacity: 50%;
        padding-left: 10%;
        padding-right: 10%;
    }

    .omschrijving_opdr {
        padding-left: 10%;
        padding-right: 10%;
        padding-top: 5%;
        padding-bottom: 5%;
    }

    .portfolio_fotos {
        width: 80%;
        padding-bottom: 3%;
    }

    .meer_fotos {
        display: none;
        text-align: center;
    }

    .meer_button {
        cursor: pointer;
        text-decoration: underline;
        background-color: white;
        color: black;
    }

    .portfolio_videos {
        width: 80%;
        padding-bottom: 3%;
    }


}









/* tablet */

@media (min-width: 600px) and (max-width: 899px) {
    #telefoon_boven {
        width: 100%;
        position: absolute;
    }

    #desktop_boven {
        display: none;
    }

    #naam_titel {
        width: 30%;
        position: absolute;
        padding-top: 5%;
        padding-left: 30%;
        padding-right: 40%;

    }

    #introductie_kort {
        position: absolute;
        margin-top: 40%;
        margin-left: 8%;
        color: white;

    }

    #introductie_desktop {
        display: none;
    }

    #rectangle {
        display: none;
    }


    #profielfoto {
        width: 100%;
        padding-top: 3%;
    }

    #profielfoto_expanded {
        display: none;
    }



    #telefoon_midden {
        width: 100%;
        position: absolute;
        margin-top: 140%;
    }

    #desktop_midden {
        display: none;
    }



    main {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 30%;

    }

    #introductie {
        margin-top: 6%;
        font-weight: bold;

    }

    h1 {
        padding-left: 10%;
        padding-right: 10%;
        margin-top: 3%;
    }

    h3 {
        opacity: 50%;
        padding-left: 10%;
        padding-right: 10%;
    }

    .omschrijving_opdr {
        padding-left: 10%;
        padding-right: 10%;
        padding-top: 3%;
        padding-bottom: 5%;
    }

    .portfolio_fotos {
        width: 80%;
        padding-bottom: 2%;
    }

    .meer_fotos {
        display: none;
        text-align: center;
    }

    .meer_button {
        cursor: pointer;
        text-decoration: underline;
        background-color: white;
        color: black;

    }

    .portfolio_videos {
        width: 80%;
        padding-bottom: 2%;
    }
}







/* desktop */



@media (min-width: 900px) {
    #telefoon_boven {
        display: none;
    }

    #desktop_boven {
        position: absolute;
    }

    #naam_titel {
        position: absolute;
        width: 15%;
        padding-top: 1%;
        padding-left: 2%;
    }

    #introductie_kort {
        display: none;

    }

    #naam_desktop {
        font-size: 300%;
    }

    #introductie_desktop {
        position: absolute;
        margin-top: 16%;
        margin-right: 10%;
        margin-left: 40%;
        font-weight: bold;
        color: white;
    }

    #rectangle {
        position: absolute;
        height: 40%;
        width: 55%;
        margin-left: 38%;
        margin-top: 15%;
        background-color: black;
        opacity: 40%;
    }

    #telefoon_midden {
        display: none;
    }

    #desktop_midden {
        position: absolute;
        margin-top: 50%;
    }

    #profielfoto {
        display: none;
    }

    #profielfoto_expanded {
        width: 100%;
        margin-top: 1%;
    }

    main {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 10%;

    }

    #introductie {
        display: none;

    }

    h1 {
        padding-left: 10%;
        padding-right: 10%;
        margin-top: 3%;
    }

    h3 {
        opacity: 50%;
        padding-left: 10%;
        padding-right: 10%;
    }

    .omschrijving_opdr {
        padding-left: 25%;
        padding-right: 25%;
        padding-top: 1%;
        padding-bottom: 1%;
    }

    .portfolio_fotos {
        width: 50%;
        padding-bottom: 1%;
    }

    .meer_fotos {
        display: none;
        text-align: center;
    }

    .meer_button {
        cursor: pointer;
        text-decoration: underline;
        background-color: white;
    }

    .portfolio_videos {
        width: 50%;
        padding-bottom: 1%;
    }




}