:root{
    --guida-fondo: #89223d;
    --sombras-guinda:rgba(145, 18, 67, 0.48);
    --sombras-gray:rgba(162, 163, 162, 0.25);
    --fuente: white;
    --fuente-hover:#A61547;
    --gris:#A2A3A2; 
    --gris-claro:#c3c0bf;
    --gris-oscuro:#767776;

    --S-orange:#F69A17;
    --S-blue:#1c83c5;
    --S-lilac:#A894CA;
    --S-green:#96C99E;
    --S-pink:#E06091;
    --S-yellow:#FEDD1E;
}
a:hover{
    text-decoration: none;
}
li.nav-item{
    margin-left: 5px;
}
a.nav-link.nb{
    color: var(--guida-fondo);
    font-weight: 200;
    font-size:12px;
    text-align: center;
    padding: 10px 20px !important;
    text-wrap: nowrap;
    border-radius: 30px;
    /* box-shadow:1px 2px 5px var(--sombras-gray); */
    max-height: 3.1rem;
    height: 100%;     
}
a.nav-link.nb:hover{
    border-bottom: 3px solid var(--dorado);
    border-radius: 0px;
    max-height: 5rem;
    height: 100%; 
}
.m-brand__logo img {
    max-height: 3rem;
    width: auto;
}
.m-brand__logo span {
    margin-left: 1rem;
    color: var(--guida-fondo);
    text-align: center;
    vertical-align: middle;
}
/*extra smalls screens or devices*/
@media (max-width: 319px) {
    .m-brand__logo span {
        font-size: 12px;
        font-weight: 200;
    }
}
/*Mobile devices*/
@media (min-width: 320px) and (max-width: 480px) {
    .m-brand__logo span {
        font-size: 12px;
        font-weight: 200;
    }
}
/*iPads, tabs*/
@media (min-width: 481px) and (max-width: 768px) {
    .m-brand__logo span {
        font-size: 14px;
        font-weight: 200;
    }
}
/*Laptops and smallscreens*/
@media (min-width: 769px) and (max-width: 1024px) {
    .m-brand__logo span {
        font-size: 14px;
        font-weight: 200;
    }
}
/*desktops and bigscreens*/
@media (min-width: 1025px) and (max-width: 1200px) {
    .m-brand__logo span {
        font-size: 16px;
        font-weight: 200;
    }
}
/*extra big screens and TVs*/
@media (min-width: 1201px) {
    .m-brand__logo span {
        font-size: 20px;
        font-weight: 200;
    }
}