/*Estilos generales: Importante*/
:root{
    --azulP: #4282F7;
    --verdeP: #46BECE;
    --azulS: #1678F2;
    --verdeS: #21D0C3;
    --verdeClaro: #F4FEFF;
    --morAzul: #4461F2;
    --gris: #8A8585;
    --gradienteAzul: linear-gradient(96.14deg, #3A8EF6 -10.84%, #6F3AFA 196.74%);
    --gradienteVerde: linear-gradient(90.29deg, #45BDBF 0.21%, #005C7B 99.79%);

    --fontMedium: 400;
    --fontBold: 700;
    --fontSemibold: 600;
}
html{
    font-size: 6.25%;    
}
*{
    margin: 0;
    padding: 0;
}
nav {
    top: 0;
  }
  
body{
    margin: 0;
    font-family: 'Poppins', sans-serif;
}
/*Fin Estilos generales: Importante*/

/*Barra navegación*/
nav{
    display: flex;
    padding: 0 20px;
    box-shadow: 0px 0px 4px var(--gris);
    box-sizing: border-box;
    width: 100%;
    /*navbar fixed*/
    position: fixed;
    background: white;
    z-index: 999;

}
    /*menu desktop*/
    nav .nav-left{
        display: none;
    }
    /*nav mobile*/
    .nav-mobile{
        display: inherit;
        width: 100%;
        justify-content: space-between;

    }
    .nav-mobile img {
        object-fit: cover;
        margin: 12px 0px 12px 0px;
    }
    .nav-mobile .logoMobile{
        margin-right: 8px;
    }
        /*menu mobile collapse*/
        .nav-mobile .menuMobile{
            display: flex;
            cursor: pointer;
        }
        #closeMenu{
            display: none;
        }
        .nav-mobile .menuMobile img{
            justify-self: end;
            align-self: center;
            width: 28px;
            height: 26px;
            margin-left: 8px;
        }
        #idMenu-mobile{
            display: none;
            position: relative;
            top: 68px;
        }
        .menu-mobileC div{
            position: absolute;
            height: 100vh;
            width: 100%;
            display: flex;
            flex-direction: column;
            background: white;
            z-index: 10;
        }
        .menu-mobileC div ul{
            display: inherit;
            flex-direction: column;
            padding: 20rem 50rem;
            list-style: none;
            font-size: 20rem;
            margin-top: 20px;
        }
        .menu-mobileC div ul li{
            margin-bottom: 16px;

        }
        .menu-mobileC div ul li a{
            text-decoration: none;
            color: var(--gris);
        }
        .menu-mobileC div ul li a:hover{
            font-weight: var(--fontSemibold);
            color: var(--morAzul);
        }
/*Fin barra navegación*/


/*Footer*/
footer{
    padding: 0 20px;
    /*para borrar segun el contenido*/
    position: relative;
    top: 66px;
}
footer li {
    list-style: none;
}
.footer-content{
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
}
    /*footer items*/
    .footer-item{
        width: 350rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        font-size: 16rem;
        padding: 4rem 0 20rem 0;
        border-bottom: 1px solid var(--gris) ;    
    }
    .footer-item:nth-child(3) ul li{
        display: flex;
        align-items: center;
    }
    .footer-item:nth-child(3) ul li img{
        margin-right:4px;
    }
    .footer-item1{
        display: flex;
        align-items: center;
    }
    .footer-item h3{
        color: var(--morAzul);
        margin-bottom: 4px;
    }
    .footer-item ul li{
        color: var(--gris);
    }
    .footer-item ul li a{
        text-decoration: none;
        color: var(--gris);
    }
    .footer-item1 p{
        max-width: 325rem;
        text-align: center;
        padding: 12px 0px;
    }
    .footer-item1 ul{
        width: 325rem;
        display: flex;
        flex-direction: row;
        justify-content: space-evenly;
    }
    .footer-item1 ul li{
        display: flex;
        align-items: center;
    }
.logoFooter{
    object-fit:contain;
    width:250px;
    cursor: pointer;
}
.rights-area{
    display: flex;
    justify-content: center;
    margin-top: 8px;
}
.rights-area ul{
    width: 325rem;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    flex-wrap: wrap;    
}
.rights-area ul li{
    font-size: 14rem;
    margin: 2px;
}
/*Fin footer*/

/*contenido de la pagina container*/
.container{
    position: relative;
    top: 66px;
}
/*Fin contenido de la pagina container*/

/*Pantalla-vista desktop*/
@media(min-width: 750px){
    /*barra de navegación desktop*/
    .nav-mobile{
        display: none;
    }
    #idMenu-mobile{
        display: none !important;
    }
    nav .nav-left{
        display:flex;
        flex-direction: row;
        width: 100%;
        justify-content: space-between;
    }
    .nav-left .logoDesktop{
        width: 248px;
        cursor: pointer;
    }
    .nav-left ul{
        justify-self: flex-end;
        display: flex;
        align-items: center;
        flex-direction: row;
        list-style: none;
    }
    .nav-left ul li{
        box-sizing: border-box;
    }
    .nav-left ul li:not(:last-child):hover{
        border-bottom: 2px solid var(--morAzul);
    }
    .nav-left ul li a{
        text-decoration: none;
        padding: 8px;
        font-size: 16px;
        text-align: center;
    }
    ul li a{
        color: black;
        display: inline-block;
    }
    .ul-nav li a:hover {
        font-weight: var(--fontSemibold);    
    }
    /*Posible codigo para el fontweight no afecte el tamaño de la caja*/
    /*.ul-nav li a:hover::after{
        content: attr(data-text);
        content: attr(data-text) / "";
        height: 0;
        visibility: hidden;
        overflow: hidden;
        user-select: none;
        pointer-events: none;
        font-weight: var(--fontSemibold);
    }*/
    .btn-client{
        display: flex;
        margin-left: 8px;
        height: 40px;
        width: 140px;
        align-items: center;
        justify-content: center;
        background: var(--gradienteAzul);
        border-radius: 12rem;
    }

    .btn-client a{
        color: aliceblue;
    }
    /*barra de navegación desktop*/
    
    /*footer desktop*/
    .footer-content{
        flex-direction: row;
        justify-content: space-evenly;
        border-bottom: 1px solid var(--gris) ; 
    }
    .footer-item{
        width: auto;
        font-size: 14rem;
        padding: 4rem 0 20rem 0;
        border-bottom: none;    
    }
    .rights-area ul{
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;    
    }
    /*fin footer desktop*/
    
}



