.welcomename {
    display: inline;
}


.varsity-app-banner {
    position: relative;
    
    a:link {
        display: block;
        position: absolute;
        inset: 0;
        z-index: 2;
    }
}

#root {
    z-index: 1;
}

.webwrapper {
    border-radius: 0.5rem;
    overflow: hidden;

    &:after {
        top: 40px;
        left: 40px;
    }
}

.varsitygames {
    display: none;
}

.varsityscores {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr 10% 10% 1fr;
    grid-template-areas: "ourscore logo logo theirscore";

    margin-bottom: 1rem;

    .varsityscores-logo h1,
    .varsityscores-logo h2 {
        font-size: clamp(1rem, 25%, 2rem);

        @media (width, 770px) {
            display: none;
        }
    }

    .varsityscores-logo img {
        height: unset;
        max-height: unset;
        aspect-ratio: 601 / 399;
    }

    .varsityscores-us {
        grid-area: ourscore;
    }

    .varsityscores-logo {
        grid-area: logo;
    }

    .varsityscores-them {
        grid-area: theirscore;
    }

    @media (width < 550px) {
        grid-template-areas:
            "logo logo logo logo"
            "ourscore ourscore theirscore theirscore";

        .varsityscores-them,
        .varsityscores-us {
            font-size: 5rem;
        }
    }
}