*,*::before,*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: helvetica;
    color: white;
    overflow-x: hidden;
}

body {
    background-color: black;
}

a {
    text-decoration: none;
}
main h1 {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align: center;
    padding-bottom: 1rem;
}

main .homeText {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    gap: 2em;
    align-items: center;
}

main .homeText .homeSubText {
    display: flex;
    width: 80%;
    flex-direction: column;
    gap: 1rem;
    align-items: center;

}

main .homeText .homeSubText a {
    color: blue;
    text-decoration: underline;
    
}

@media(max-width: 1000px)
{
    main .snowblitz {
        display: flex;
        width: 100%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2em;
    }
    main .snowblitz .snowblitz_subsection_one {
        width: 90%;
        display: flex;
        flex-direction: column;
        gap: 2em;
    }

    main .snowblitz figure {
        max-width: 100%;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
    main .snowblitz figure img {
        max-width: 80%;
    }
    footer {
        bottom: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 40px;
        background-color: darkgray;
        color: whitesmoke;
    }
}

@media(min-width:1000px){
    nav {
        position: fixed;
        top: 0;
        width: 70%;
        z-index: 100;
        margin-left: 15%;
        margin-right: 15%;
        opacity: 1;
    }
    nav .navbar {
        display: flex;
        flex-direction: row;
        justify-content: left;
        align-items: center;
        font-family: serif;
    }
    nav .navbar a {
        flex: 1; /* Allow flex to adjust size dynamically */
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: x-large;
    }
    nav .navbar a:hover {
        color: black;
        background-color: lightgray;
    }
    header {
        width: 100%; /* Adjusted to avoid overflow */
        position: relative;
    }
    header .logo {
        display: flex;
        justify-content: left;
        align-items: center;
    }
    main {
        margin-top: 25px;
        margin-bottom: 25px;
        max-width: 100vw;
    }
    footer {
        bottom: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 80px;
        background-color: darkgray;
        color: whitesmoke;
    }
    .about {
        margin: auto 10vw auto;
    }
    .about h1 {
        width: 100%;
        display: flex;
        justify-content: center;
        height: 5rem;
        font-size: xx-large;
    }
    .about figure {
        display: flex;
        width: 100%;
        justify-content: center;
    }
    .about caption {
        display: flex;
        width: 100%;
        justify-content: center;
        margin-top:5em;
        margin-bottom: 5em;

    }
    .about caption .blurb {
        width: 40%;   
    }
    .blurb {
        font-size: 20px;
    }

    main .homeText h2 {
        text-align: center;
        padding: 20px;
    }
    main .validator {
        display: none;
        width: 100%;
        height: 100%;
        opacity: .6;
    }
    main .validator .question {
        display: none;
        width: 50%;
        height: 50%;
        margin: auto auto auto auto;
        color: black;
        font-size: 25px;
        flex-direction: row;
    }
    main .validator .question .answer {
        font-size: 15px;
        color: black;
    }
    .pageHead {
        text-align: center;
        width: 100%;
    }
    main .contact .messageForm {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        gap: 2em;
    }
    main .contact .messageForm input { 
        width: 60%;
        font-size: 25px;
        margin: auto auto auto auto;
    }
    main .contact .messageForm textarea {
        width: 60%;
        margin: auto auto auto auto;
    }
    input, textarea {
         color: black;
    }
    main .contact {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2em;
    }
    main h1 {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        text-align: center;
        padding-bottom: 1rem;
    }

    main .games {
        display: flex;
        width: 100%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2em;
    }

    main .games a {
        max-width: 50%;
        border: 2px solid white;
    }

    main .games a:hover {
        border: 2px solid red;
    }

    main .games a img{
        max-width: 100%;
    }

    main .snowblitz {
        display: flex;
        width: 100%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2em;
    }
    main .snowblitz figure {
        max-width: 50%;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
    
    main .snowblitz figure img{
        max-width: 100%;
    }
    main .snowblitz .snowblitz_subsection_one {
        width: 60%;
        display: flex;
        flex-direction: column;
        gap: 0.5em;
    }

    main .snowblitz .snowblitz_subsection_one ul {
        list-style-type: circle;
    }
}