:root {
    --bs-body-font-size: 0.9rem;
    --bs-body-color: #363636;
    --bs-dark-rgb: 0, 0, 0;

    --swiper-theme-color: #ffffff;
    --swiper-navigation-size: 2rem;

    --bs-gutter-x: 2rem;
    --bs-gutter-y: 2rem;
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    color: inherit;
}

.navfix {
    color: rgba(0, 0, 0, 1) !important;
    background-color: rgba(248, 249, 250, 1) !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1) !important;
}

.banner {
    height: 40rem;
}

.nav .col {
    opacity: 0.75;
    cursor: pointer;
}

.nav .col.active,
.nav .col:hover {
    opacity: 1;
    background: #ededed;
}

@media (max-width: 767.98px) {
    :root {
        --bs-body-font-size: 0.8rem;
        --bs-body-color: #363636;
        --bs-dark-rgb: 0, 0, 0;
    
        --swiper-theme-color: #ffffff;
        --swiper-navigation-size: 2rem;
    
        --bs-gutter-x: 2rem;
        --bs-gutter-y: 2rem;
    }
    .banner {
        height: 30rem;
    }
}