main{
    padding: 15px;
}
img{
    width: 60%;
    margin: 0 20%;
}

main h2,
main p{
    color: white;
}

main a{
    color: #0291cd;
}

@media screen and (min-width:650px){
    main h2,
    main p {
        padding-left: 15px;
    }

    main h2{
        font-size: 25px;
        margin:40px 0 0 0;
    }

    main p{
        font-size: 22px;
        margin-top: 10px;
    }
}

@media screen and (min-width:768px){
    main {
        overflow: hidden; /* Clear the float to prevent layout issues */
    }

    picture {
        float: right; /* or use display: inline-block; */
        max-width: 45%;
        align-items: center;
    }
    .opleiding{
        margin-top: 100px;
    }
    img {
        max-width: 100%; /* Make the image responsive */
        height: auto; /* Maintain the aspect ratio */
        
    }
}
    

@media screen and (min-width:1440px){
    main h2,
    main p{
        padding: 0 200px 0 200px;
    }

    main p{
        max-width: 80%;
    }

    picture {
        max-width: 30%;
    }
    .opleiding{
        margin-top: 100px;
    }
    img {
        max-width: 100%; /* Make the image responsive */
        height: auto; /* Maintain the aspect ratio */
        margin: 0;
        float: right;
    }
}
