:root {
    --rosso_carboni: rgb(105,27,37);
    --grigio_carboni: rgb(81,81,84);
    --carboni_casa: rgb(159,148,26);
}


.bg-carboni-rosso {
    background-color: var(--rosso_carboni);
}

.bg-carboni-grigio {
    background-color: var(--grigio_carboni);
}

.color-carboni-rosso {
    color: var(--rosso_carboni);
}

.color-carboni-grigio {
    color: var(--grigio_carboni);
}

.color-carboni-casa {
    color: var(--carboni_casa);
}


.div_rosso_al_centro {
    width: 45px;
    background-color: var(--rosso_carboni);
    height: 4px;
    margin: 0 auto;
}

.div_rosso {
    width: 45px;
    background-color: var(--rosso_carboni);
    height: 4px;
    margin: 0;
}

.btn-rosso-carboni {
    background-color: var(--rosso_carboni);
    color:white;
}

    .btn-rosso-carboni:hover {
        background-color: rgb(167 38 34);
        color: white;
    }

.btn-carboni-casa {
    background-color: var(--carboni_casa);
    color: white;
}

    .btn-carboni-casa:hover {
        background-color: rgb(121, 111, 5);
        color: white;
    }




/* sovrascrivo bootstrap */

.nav-link {
    color:black;
    position:relative;
}

.navbar-nav .nav-link.active {
    color: var(--rosso_carboni);
    font-weight: bold;
}

.nav-link:hover { /*sull'hover voglio la scritta rosso carboni*/
    color: var(--rosso_carboni);
}

    .nav-link::after { /* effetto sottolineatura */
        content: '';
        position: absolute;
        width: calc(100% - 10px - 10px); 
        height: 2px;
        bottom: -1px;
        left: 10px;
        background-color: var(--rosso_carboni);
        visibility: hidden;
        transform: scaleX(0);
        transition: all 0.2s ease-in-out;
    }

    .navbar-nav .nav-link:hover::after {
        visibility: visible;
        transform: scaleX(1);
    }