/*
    Root variables for defining color values.
*/
:root
{
    --main-color: #f8f8f8;
    --main-bg-color: #080808;
}

/*
    Apply the 'Garet-Book' font family to all elements.
*/
*
{
    font-family: 'Garet-Heavy';
}

/*
    Define a @font-face rule for the "Garet-Heavy" font.
*/
@font-face
{
    font-family: Garet-Heavy;
    src: url(../font/Garet-Heavy.woff2);
}

/*
    Styling for the body element.
*/
body
{
    align-items: center;
    background-color: var(--main-bg-color);
    display: flex;
    height: 100vh;
    justify-content: center;
    margin: 0;
}

/*
    Styling for the h1 element.
*/
h1
{
    color: var(--main-color);
    font-size: 8vw;
    text-transform: uppercase;
}