:root {
    /* Dark Color Pallette */
    --color-charcoal: #121212;
    --color-light-gray: #E0E0E0;
    --color-medium-gray: #B0B0B0;
    --color-dark-gray: #444444;
    --color-soft-gray: #888888;
    --primary-accent: #007BFF;
    --secondary-accent: #00C2B2;
    --tertiary-accent: #B2FF59;

    /* Transitions */
    --default-transition: all 0.155s ease-in;

    /* Font Families */
    --primary-font: "Roboto", sans-serif;
    --secondary-font: "Lato", sans-serif;

    --body-font: var(--primary-font);
    --heading-font: var(--secondary-font);
}


body{
    background-color: var(--color-charcoal);
}
h1{
    text-align: center;
    color: var(--color-light-gray);
    font-family: var(--primary-font);
    text-transform: uppercase;
}
#cubeLogo{
    padding-bottom: 32px;
    transition: var(--default-transition);
}

.wrapper{
    height: 100dvh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}