* {
    font-family: "Libre Franklin";
    font-weight: 400;
    font-style: normal;
    color: white;
}

html, body {
    padding: 0;
    margin: 0;
    background-color: #00b400;
}

div.wrapper {
    background-image: url('./images/worms.png');
    min-height: 100vh;
    width: 100vw;
    box-sizing: border-box;
    overflow-x: hidden;
    padding: 20px 0;
}

    h2 {
        margin: 20px 0;
        font-weight: 700;
        text-transform: uppercase;
        text-align: center;
        font-size: 25px;
        letter-spacing: 2px;
        position: relative;
        z-index: 1;
    }

    img.logo {
        width: 90%;
        max-width: 500px;
        display: block;
        margin: 25px auto;
    }

    img.photo {
        max-width: 650px;
        width: 90%;
        margin: 0 auto;
        display: block;
        border: 10px groove rgb(255, 237, 135);
        transform: rotate(-5deg);
    }

    p {
        display: block;
        max-width: 500px;
        padding: 35px 40px;
        box-sizing: border-box;
        background-color: #caaeff;
        margin: 0 auto;
        position: relative;
        z-index: 1;
    }

    a {
        font-family: "Rubik Gemstones", system-ui;
        text-decoration: none;
        text-transform: uppercase;
        color: #8247f0;
        font-size: 40px;
        text-align: center;
        width: 100%;
        display: block;
        margin: 50px 0;
    }

        a:hover {
            -webkit-text-stroke: #caaeff 1px;
        }