custom.scss

/*-- scss:defaults --*/

$imperial-blue: #023A75;
$grape: #B38CB4;
$brick: #FC440F;
$coral: #F67E7D;
$orange: #FF8600;
$yellow: #FFE66D;
$canary: #FFFD82;
$air-blue: #6CA6C1;
$teal-blue: #437C90;
$seaweed: #177E89;

$navbar-background: $imperial-blue;

.horizontal-list {
    list-style-type: none;
    padding-left: 0;
    display: flex;
    &__item {
        margin-right: 0.5rem;
        font-weight: bold;
        padding: 0.25rem 0.5rem;
        border-radius: 0.75rem;
        &--orange {
            background-color: $orange;
            color: white;
        }
        &--yellow {
            background-color: $yellow;
        }
        &--blue {
            background-color: $air-blue;
        }
        &--imperial-blue {
            background-color: $imperial-blue;
            color: white;
        }
        &--grape {
            background-color: $grape;
        }
        &--coral {
            background-color: $coral;
        }
        &--canary {
            background-color: $canary;
        }
        &--seaweed {
            background-color: $seaweed;
            color: white;
        }
        &--teal {
            background-color: $teal-blue;
            color: white;
        }
    }
}

.wide-grid {
    max-width: 1200px; /* Set a custom width, larger than default */
    width: 100%;
    margin: 0 auto;    /* Center the grid */
  }