/* --- FONTS --- */

@font-face {
    font-family: 'arista';
    src: url('./assets/arista.ttf') format('truetype');
}

/* --- GENERAL --- */

* {
    font-family: 'arista';
    user-drag: none;
    -webkit-user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    transition: all 0.2s;
}

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
}

body {
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url('./assets/bg.jpg');
    background-position: center center;
    background-size: cover;
}

h1 {
    font-size: 2rem;
    background-image: linear-gradient(60deg, #45BC89, #82C446);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    text-align: center;
}

img {
    width: 20rem;
}

/* --- CLASSES --- */

.container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
}

/* --- MOBILE --- */

@media(max-width: 500px) {

    img {
        width: 15rem;
    }

    h1 {
        font-size: 1.6rem;
    }

}