// default bootstrap elements

.row {
    margin: 0;
}

.col,
[class^="col-"] {
    padding: 0;
}

@for $i from 1 through 12 {
    .col-w#{$i} {
        max-width: #{$i}rem;
    }
}

.nav-pills {
    .nav-link {
        margin: 0.2rem;
        font-size: 1.1rem;
        font-weight: 600;
        color: $primary-color;
        background-color: rgb(255, 255, 255);
        padding: 0.25rem 1rem;
        transition: background-color 0.4s;
        border-radius: 1rem;

        &.active {
            background-color: $primary-color;
            color: white;
        }

        &:hover:not(.active) {
            background-color: $primary-color;
            color: white;
        }
    }
}

.bg-muted{
    background-color: rgb(95, 95, 95);
}