:root {
    --sponsor-background: #E7CC98;
}

#sponsors-table {
    text-align: center;
}

.gold {
    color: var(--gold)
}

.silver {
    color: var(--silver)
}

.bronze {
    color: var(--bronze)
}


.tier-sponsors{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 50px;
    overflow: visible;
}
.side-content {
    overflow: visible;;
}

.sponsor{
    width: 100%;
    height: 150px;
    object-fit: contain;
    border-radius: 8px;
    text-align: center;
}

div.sponsor {
    height: 120px;
    margin: 20px 0;
    background-color: var(--sponsor-background);
    box-shadow: 10px 5px 5px grey;
    padding: 0 5px;

    h3 {
        margin-top: 10%;
    }
    p {
        font-size: smaller;
    }
}

.side-navigation .side-nav-chapter h2 a[href="#gold"]:hover,
.side-navigation .side-nav-chapter h2 a[href="#gold"].active{
    text-decoration: underline;
    text-decoration-thickness: 0.2rem;
    text-decoration-skip-ink: none;
    text-decoration-color: var(--gold);
}

.side-navigation .side-nav-chapter h2 a[href="#silver"]:hover,
.side-navigation .side-nav-chapter h2 a[href="#silver"].active{
    text-decoration: underline;
    text-decoration-thickness: 0.2rem;
    text-decoration-skip-ink: none;
    text-decoration-color: var(--silver);
}

.side-navigation .side-nav-chapter h2 a[href="#bronze"]:hover,
.side-navigation .side-nav-chapter h2 a[href="#bronze"].active{
    text-decoration: underline;
    text-decoration-thickness: 0.2rem;
    text-decoration-skip-ink: none;
    text-decoration-color: var(--bronze);
}