@import url('https://fonts.googleapis.com/css2?family=Prompt&display=swap');

* {
    font-family: 'Prompt', sans-serif;
}

.header-content {
    min-height: 25vh;
    background: linear-gradient(rgba(0, 0, 0, 15%), rgba(0, 0, 0, 20%)),
        url("../img/title.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.header-content-header {
    padding-top: 20vh;
    padding-bottom: 15vh;
    padding-left: 10vw;
}

.header-content-title {
    font-size: 50px;
    color: #fff;
}

.header-content-text {
    font-size: 30px;
    color: #fff;
}

.grade-table {
    /* width: fit-content; */
    /* height: 100%; */
    margin-top: 10px;
    /* border: 1px solid red; */
    padding: 8px;
    /* box-shadow: 10px 10px lightblue; */
    background-color: rgb(205, 234, 255);
    box-shadow: calc(clamp(0px, var(--horiz), 2px)) calc(clamp(0px, var(--vert), 2px)) 2px calc(var(--spread)) rgba(0, 0, 0, 0.233), calc(2 * var(--horiz)) calc(2 * var(--vert)) calc(var(--blur)) calc(var(--spread)) rgba(0, 0, 0, 0.20), calc(3 * var(--horiz)) calc(3 * var(--vert)) calc(var(--blur)) calc(var(--spread)) rgba(0, 0, 0, 0.123), calc(5 * var(--horiz)) calc(5 * var(--vert)) calc(var(--blur)) calc(var(--spread)) rgba(0, 0, 0, 0.076), calc(8 * var(--horiz)) calc(8 * var(--vert)) calc(var(--blur)) calc(var(--spread)) rgba(0, 0, 0, 0.047), calc(13 * var(--horiz)) calc(13 * var(--vert)) calc(var(--blur)) calc(var(--spread)) rgba(0, 0, 0, 0.028);
    border: 1px solid rgba(0, 0, 0, 0.068);
    border-radius: 16px;
}