@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&family=Roboto+Slab:wght@100..900&display=swap');
/*controladores*/
h1,h2,h3,h4,h5{
    font-family: "Roboto Slab", serif;    
}
p,li,ul,a,i{
    font-family: "Quicksand", sans-serif;
}
/*fin controladores*/
.navsec{
    padding-top: 8.6rem;
}

/*sliders*/
.slider{
    background: url(../img/background-silder.webp)center no-repeat fixed;
    background-size: cover;
}
.slider .container-fluid{
    padding: 5rem 12rem;
    background: rgba(88, 88, 88, 0.7);
}
.slider .container-slider{
    background: rgba(198, 198, 198, 0.7);
    border-radius: 1rem;
}
.slider .container-slider .tittle{
    padding-top: 2rem;
    color: #ff0000;
    text-shadow: 1px 0px 4px #fff;
}
.slider .container-slider .parrafo{
    color: antiquewhite;
    padding: 0rem 2rem;
    text-align: justify;
    padding-bottom: 3rem;
}
.slider a{
    text-decoration: none;
    background: #ff0000;
    padding: 0.5rem 0.8rem;
    border-radius: 0.2rem;
    color: #e3e3e3;
    font-weight: bold;
}
.slider a:hover{
    padding: 0.6rem 0.9rem;
    transition: 0.5s;
}
/*fin sliders*/
/*llamado*/
.llamado{
    padding: 2rem 0rem;
    text-align: center;
    background: #0d4c7b;
}
.paractio1{
    color: #dfdada;
}
.llamado a{
    text-decoration: none;
    background: #ff0000;
    padding: 0.5rem 0.8rem;
    border-radius: 0.2rem;
    color: #e3e3e3;
    font-weight: bold;
}
/*fin llamado*/
/*information*/
.information .contpri{
    background: #0d4c7b;
    padding: 0 3rem;
}
.information .contpri h3{
    color: #ff0000;
    padding-top: 3rem;
}
.information .parinfo{
    color: #dfdada;
}
.information .contsec{
    padding: 1rem 0rem;
    text-align: center;
}
.information .imginformation{
    height: 500px;
    border: 3px solid #000000;
    border-radius: 0.3rem;
}
/*fin information*/
/*Nosotros*/
.about{
    padding: 3rem 0rem;
}
.about .tittle{
    text-align: center;
    color: #ff0000;
}
.about .parratittle{
    padding: 0.5rem 0rem 2rem 0rem;
}
.about .contabout{
    padding: 1rem 2rem;
    border: 1px solid #111;
    background: rgba(255, 255, 255, 0.7);
    cursor: pointer
}
.about .contabout:hover{
    transform: scale(1.05);
    filter: contrast(1);
    transition: 0.5s;
}
.about .contabout h3{
    text-align: center;
    font-size: 1.3rem;
    color: #ff0000;
}
.about .contabout .parraabout{
    text-align: justify;
}
/*fin nosotros*/
/*services*/
.services h3{
    color: #ff0000;
}
.services .paraserv{
    text-align: center;
    padding: 0rem 5rem;
}
.services .row{
    padding-top: 2rem;
}
.services .contaipri{
    padding: 3rem;
}
.services .contaisecu{
    background: #0d4c7b;
    padding: 3rem;
}
.services .tittleservi{
    padding-top: 3rem;
    text-align: center;
}
.services .row h4{
    color: #ff0000;
    font-size: 1.3rem;
}
.services .row p{
    text-align: justify;
    font-size: 0.9rem;
}
.services .row .contaisecu p{
    color: #e6e6e6;
}
/*fin services*/
/*bene*/
.beneficios{
    background: #0d4c7b;
}
.beneficios .tittlebene{
    color: #ff0000;
    padding-top: 3rem;
    text-align: center;
}
.beneficios .parraben{
    text-align: center;
    padding-bottom: 3rem;
    color: #e6e6e6;
}
.beneficios .row{
    padding-bottom: 3rem;
}
.beneficios .row h4{
    font-size: 1.3rem;
    color: #ff0000;
}
.beneficios .row p{
    color: #e6e6e6;
    font-size: 0.9rem;
    text-align: justify;
}
/*fin bene*/
/*testimonios*/
.testimony{
    padding: 4rem 0rem;
}
.testimony h2{
    text-align: center;
    padding-bottom: 3rem;
}
.testimony .d-flex{
    justify-content: center;
}
.testimony .contatestimo{
    position: relative;
    background: #fff;
    border-radius: 0.5rem;
    padding: 1rem 0.5rem;
    margin: 0.5rem 0rem;
}
.testimony .contatestimo .imggoogle{
    height: 3.5rem;
    width: 3.5rem;
    border-radius: 50%;
}
.testimony .contatestimo .google{
    width: 1rem;
    height: 1rem;
    position: absolute;
    top: 0.3rem;
    right: 0.3rem;
}
.testimony .contatestimo .nombreg{
    font-size: 1.1rem;
    padding-left: 1rem;
    line-height: 0.5rem;
}
.testimony .contatestimo .fechagoo{
    color: rgb(163, 163, 163);
    font-size: 0.7rem;
    padding-left: 1rem;
}
.testimony .contatestimo i{
    color: rgb(246 188 5);
}
.testimony .testigoogle{
    height: 8rem;
    font-size: 0.9rem;
    text-align: justify;
    overflow-y: scroll;
    scrollbar-width: thin;
}
/*fin testimonios*/
/*contacto*/
.contact .contaicont{
    background: #0d4c7b;
    padding: 3rem;
}
.logocontact{
    height: auto;
    width: auto;
}
.contact h3{
    text-align: center;
}
.contact p{
    padding: 1rem 2rem 0rem 2rem;
    text-align: justify;
}
/*fin contacto*/
/*footer*/
.footer{
    background: #0d4c7b;
    color: #e6e6e6;
}
/*fin footer*/
/*consulta*/
.consulta .img-logo{
    height: 150px;
}
/*fin consulta*/



 /* whatsapp */
 .socialwhat{
    position: fixed; /* Hacemos que la posición en pantalla sea fija para que siempre se muestre en pantalla*/
    right: 15px; /* Establecemos la barra en la izquierda */
    bottom: 3rem; /* Bajamos la barra 200px de arriba a abajo */
    z-index: 2000; /* Utilizamos la propiedad z-index para que no se superponga algún otro elemento como sliders, galerías, etc */
}    
.socialwhat ul {
    list-style: none;
    padding: 0px;
}
.socialwhat ul li a {
    display: inline-block;
    color:#fff;
    background: rgb(22, 168, 46);
    margin-top: 3px;
    padding: 15px 15px;
    text-decoration: none;
    -webkit-transition:all 500ms ease;
    -o-transition:all 500ms ease;
    transition:all 500ms ease; /* Establecemos una transición a todas las propiedades */
    border-radius: 50%;
}
.socialwhat img{
    height: 2rem;
    filter: invert(1);
    width: 2rem;
}
.socialwhat ul li .icon-whatsapp {
    box-shadow: 0rem 0rem 1rem rgb(22, 168, 46);
}
.socialwhat ul li a:hover {
    color: rgb(250, 250, 250); /* Cambiamos el fondo cuando el usuario pase el mouse */
    transform: scale(1.2);
}
@media(max-width: 530px) {
    .socialwhat {
        position: fixed; /* Hacemos que la posición en pantalla sea fija para que siempre se muestre en pantalla*/
        left: 15px; /* Establecemos la barra en la izquierda */
        bottom: 3rem; /* Bajamos la barra 200px de arriba a abajo */
        z-index: 2000; /* Utilizamos la propiedad z-index para que no se superponga algún otro elemento como sliders, galerías, etc */
    }
    .slider .container-fluid {
        padding: 5rem 1rem;
    }
    .information .imginformation {
        height: 400px;
    }
    .logocontact{
        height: auto;
        width: 300px;
    }
}
/* fin whatsapp */