h1,
h2,
h3,
h4,
h5 {
    font-family: "Cormorant Garamond", serif;
    font-optical-sizing: auto;
}

h1 {
    font-size: 9vw;
}

h2 {
    font-size: 2vw;
}

h3 {
    font-size: 2vw;
}

.logo {
    height: 100px;
    width: 140px;
}

a {
    text-decoration: none;
    color: rgb(177, 0, 133);
}

.intro-section {
    min-height: 75vh;

    .opening_img {
        position: relative;
        width: fit-content;
        margin-left: 45px;

        .openingdecoration {
            height: 450px;
        }

        .openingselfie {
            position: absolute;
            top: 0;
            left: 0;
            border-radius: 50px;
            border: 2px;
            height: 400px;
            transform: translate(25%, 6%);

        }
    }

    .opening {

        display: flex;
        flex-direction: column;

        h1 {
            font-size: 9vw;
            line-height: 8vw;
            margin-top: 1.5rem;
        }

        h2 {
            color: rgb(177, 0, 133);
            font-size: 2vw;
            margin-left: 60px;
        }

        .button {
            background-image: linear-gradient(to right, rgb(153, 0, 191), rgb(255, 201, 93));
            border: none;
            border-radius: 50%;
            padding: 15px 32px;
            text-decoration: none;
            display: inline-block;
            font-size: 35px;
            margin-top: 180px;
            align-self: end;
            width: max-content;
            margin-right: 210px;
            margin-bottom: 0px;
            font-family: "Cormorant Garamond", serif;
            font-optical-sizing: auto;
        }
    }
}

.ik-section {
    padding-top: 4rem;
    min-height: 75vh;
    position: relative;

    .selfie2 {
        position: absolute;
        top: 50px;
        left: 0;
        border-radius: 50px;
        border: 2px;
        height: 400px;
        transform: translate(25%, 6%);
    }

    .mijn-info {
        position: relative;
        margin-top: 500px;
    }

    h1 {
        color: rgb(177, 0, 133);
        font-size: 5vw;
        margin-left: 150px;
    }

    p {
        font-size: 2vw;
        font-family: monospace;
        margin-left: 100px;
    }

    .blob {
        position: absolute;
    }

    .blob1 {
        right: 30px;
    }

    .blob2 {
        height: 125px;
        right: 400px;
        top: 200px;
    }

    .blob3 {
        height: 60px;
        right: 350px;
        top: 400px;
    }

    .button {
        background-image: linear-gradient(to right, rgb(153, 0, 191), rgb(255, 201, 93));
        border: none;
        border-radius: 50%;
        padding: 15px 32px;
        text-decoration: none;
        display: inline-block;
        font-size: 35px;
        margin-top: 80px;
        width: max-content;
        font-family: "Cormorant Garamond", serif;
        font-optical-sizing: auto;
    }

    .button-wrapper {
        display: flex;
        justify-content: flex-end;
        margin-right: 80px;
        margin-bottom: 40px;
    }
}

div.flex-container>div {
    font-size: 20px;
}

.project-section {
    padding-top: 4rem;
    padding-bottom: 4rem;
    min-height: 75vh;
    position: relative;
    background-image: linear-gradient(to right, rgb(153, 0, 191), rgb(255, 201, 93));

    .project_title {
        color: white;
        margin-left: 50px;
        margin-top: 50px;
    }

    .projecten {
        flex-direction: column;
        justify-content: space-between;
        display: flex;
        gap: 2rem;
    }

    .project1,
    .project2,
    .project3 {
        color: white;
        display: flex;
        align-items: center;
        gap: 20px;
    }

    .project-text {
        display: flex;
        flex-direction: column;
    }

    .project1 .beauty,
    .project2 .pokedex,
    .project3 .rekenmachine {
        height: 175px;
        width: 175px;
        border-radius: 40px;
    }

}

footer {
    padding-top: 4rem;
    min-height: 75vh;
    position: relative;

    .blob {
        position: absolute;
    }

    .blob1 {
        right: 30px;
    }

    .blob2 {
        height: 125px;
        right: 400px;
        top: 200px;
    }

    .blob3 {
        height: 60px;
        right: 350px;
        top: 400px;
    }

    p.statement {
        font-family: "Cormorant Garamond", serif;
        font-optical-sizing: auto;
        font-size: 4vw;
        margin-top: 80px;
        margin-left: 60px;
        margin-bottom: 50px;
        color: rgb(177, 0, 133);
    }

    .CVicon {
        height: 50px;
        margin-bottom: 30px;
    }
}