@import url(https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Raleway:wght@800&display=swap);

body {
    font-family: Lato, sans-serif;
    overflow-x: hidden
}

.menu {
    position: fixed;
    width: 100vw;
    background-color: #15218a;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 10
}

.contenedor {
    width: 90%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.menu__logo {
    margin: .75rem 0;
    width: 50px;
    height: auto;
    -o-object-fit: contain;
    object-fit: contain
}

.menu__opciones {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    margin: 0
}

.menu__opciones li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    list-style: none
}

.menu__opciones .menu__elemento {
    color: #fff;
    text-decoration: none;
    margin-right: 2.5rem
}

.menu__elemento:hover::after {
    content: "";
    display: block;
    height: 3px;
    -webkit-animation: seleccionar .2s;
    animation: seleccionar .2s;
    background-color: #fff
}

@-webkit-keyframes seleccionar {
    0% {
        height: 0
    }

    100% {
        height: 3px
    }
}

@keyframes seleccionar {
    0% {
        height: 0
    }

    100% {
        height: 3px
    }
}

.menu__opciones .ultimo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: .9rem;
    margin-right: 0;
    background-color: #e8c227;
    color: #000;
    padding: .05rem 2rem;
    border-radius: .5rem;
    transition: 0.3s;
}

.insaforp {
    width: 100px;
    height: auto;
    -o-object-fit: contain;
    object-fit: contain
}

.menu__movil {
    display: none
}

.menu__background {
    position: fixed;
    width: 100%;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    background-color: rgba(51, 51, 51, .5);
    z-index: 20
}

.menu__lateral {
    background-color: #fff;
    width: 90%;
    -webkit-animation: salir .6s ease;
    animation: salir .6s ease
}

.menu__lateral ul {
    margin: 0;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.menu__lateral ul li {
    margin: 1.5rem 0;
    list-style: none
}

.menu__lateral ul li a {
    cursor: pointer;
    color: #000;
    text-decoration: none;
    font-size: 1.2rem;
    font-weight: 700
}

.cerrar__menu {
    cursor: pointer
}

.menu__background {
    display: none
}

.animado {
    -webkit-animation: salir .5s ease-out;
    animation: salir .5s ease-out
}

.slider__banner {
    position: absolute;
    top: 50%;
    color: #fff;
    margin-left: 4rem
}

.title {
    font-family: Raleway, sans-serif;
    font-size: 2.5rem
}

.icon-bar {
    position: fixed;
    z-index: 30;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.icon-bar a {
    display: block;
    text-align: center;
    padding: 16px;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    color: #fff;
    font-size: 20px
}

.icon-bar a:hover {
    background-color: #000
}

.facebook {
    background: #3b5998;
    color: #fff
}

.twitter {
    background: #55acee;
    color: #fff
}

.google {
    background: #dd4b39;
    color: #fff
}

.linkedin {
    background: #007bb5;
    color: #fff
}

.youtube {
    background: #b00;
    color: #fff
}

.galeria {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 3rem 1fr 3rem 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    justify-items: center;
    gap: 3rem
}

footer {
    background-color: #15218a;
    color: #fff
}

.seccion__titulo {
    font-weight: 700;
    font-size: 1.2rem
}

.seccion {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 3rem 0
}

.seccion__img {
    display: block;
    width: 100px;
    -o-object-fit: contain;
    object-fit: contain
}

.seccion__form {
    width: 80%
}

.seccion__btnenviar {
    width: 100%;
    display: block;
    background: #e8c227;
    text-align: center;
    color: #000;
    border-radius: .5rem;
    padding: .5rem 0;
    text-decoration: none
}

.seccion__btnenviar:hover {
    color: #000;
    text-decoration: none
}

.seccion__redes {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: row;
    -ms-flex: row;
    flex: row
}

.seccion__redes img {
    width: 40px;
    margin-right: 1rem
}

.copyrigth {
    background: #0d155e;
    color: #fff
}

.page {
    padding: 8rem 0
}

.perfil img {
    width: 80%;
    display: block;
    margin: auto
}

.descripcion__titulo {
    color: #15218a
}

.descripcion__texto {
    line-height: 2rem
}

.experticia ul li {
    padding: 1rem 0
}

.experticia {
    line-height: 2rem
}

.img__clientes {
    width: 300px;
    height: 300px;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s
}

.img__clientes:hover {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2)
}

.animacion {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

/* Inicio Slider */

.contenedor-slider {
    padding-top: 79px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
}

.slider {
    /*border-radius: 10px;  Modificar para movil */
    width: 100%;
    /* Modificar para movil */
    height: calc(100vh - 79px);
    ;
    overflow: hidden;
}

.slides {
    width: 500%;
    height: calc(100vh - 79px);
    ;
    display: flex;
}

.slides input {
    display: none;
}

.slide {
    width: 20%;
    transition: 1s;
    position: relative;
    text-align: left;
}

.texto-encima {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
}

.banner_paginas {
    background-image: url(../img/silder_1.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 6rem 0;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner_paginas p {
    font-size: 2.7rem;
    letter-spacing: 0.4rem;
}

.banner_paginas_c {
    background-image: url(../img/slider_2.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 6rem 0;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner_paginas_c p {
    font-size: 2.7rem;
    letter-spacing: 0.4rem;
}

.banner_paginas_p {
    background-image: url(../img/slider_2.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 6rem 0;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner_paginas_p p {
    font-size: 2.7rem;
    letter-spacing: 0.4rem;
    text-align: center;
}

.p_movil {
    display: none;
}

.texto-p {
    font-size: 3rem;
    white-space: nowrap;
    letter-spacing: 0.8rem;
}

.texto-c {
    font-size: 2rem;
    letter-spacing: 0.8rem;
    padding: 1rem 0 2rem 0;
}

.btn-buscar {
    text-decoration: none;
    color: #A5A8A9;
    background: #fff;
    padding: 1rem 2rem;
    transition: 0.4s;
}

.btn-buscar:hover {
    text-decoration: none;
    color: #fff;
    background: #A5A8A9;
    padding: 1rem 2rem;
}

.slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.navigation-manual {
    position: absolute;
    width: 100%;
    margin-top: -40px;
    display: flex;
    justify-content: center;
}

.manual-btn {
    border: 1px solid #fff;
    padding: 5px;
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}




.contenido_nuevo a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-decoration: none;
    border: 1px solid #fff;
    padding: 0.3rem 1rem;
    margin-right: 3rem;
    transition: 0.3s;
}

.contenido_nuevo a img {
    width: 43px;
    height: auto;
    margin-right: 0.5rem;
    object-fit: contain;
}

.contenido_nuevo a:hover{
    background-color: #fff;
    color: #15218a;
}


.nuevo_btn {
    color: #fff;
    margin-right: 2.5rem;
}

.nuevo_btn:hover {
    color: #fff;
}

.contenido_nuevo_dos{
    display: block;
    margin: 0 auto;
}

.contenido_nuevo_dos img{
    width: 50px;
    height: auto;
    object-fit: contain;
}

.contenido_nuevo_dos a{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 0.3rem;
    text-align: center;
}

.manual-btn:not(:last-child) {
    margin-right: 40px;
}

.manual-btn:hover {
    background: #15218a;
}

#radio1:checked~.first {
    margin-left: 0;
}

#radio2:checked~.first {
    margin-left: -20%;
}

#radio3:checked~.first {
    margin-left: -40%;
}

#radio4:checked~.first {
    margin-left: -60%;
}

.navigation-auto {
    position: absolute;
    display: flex;
    width: 100%;
    justify-content: center;
    margin-top: calc(100vh - 119px);
    /* Modificar con el alto de la imagen*/
}

.navigation-auto div {
    border: 1px solid #fff;
    padding: 5px;
    border-radius: 10px;
    transition: 0.3s;
}

.navigation-auto div:not(:last-child) {
    margin-right: 40px;
}

#radio1:checked~.navigation-auto .auto-btn1 {
    background: #15218a;
}

#radio2:checked~.navigation-auto .auto-btn2 {
    background: #15218a;
}

#radio3:checked~.navigation-auto .auto-btn3 {
    background: #15218a;
}

#radio4:checked~.navigation-auto .auto-btn4 {
    background: #15218a;
}

/* Fin Slider */

@-webkit-keyframes salir {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes salir {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@media only screen and (max-width:1350px){
    .menu__opciones .menu__elemento {
        margin-right: 1rem
    }

    .contenido_nuevo a {
        margin-right: 1rem;
    }

    .nuevo_btn {
        color: #fff;
        margin-right: 1rem;
    }

    .menu__opciones .ultimo {
        font-size: .9rem;
        margin-right: 0;
        background-color: #e8c227;
        color: #000;
        padding: .05rem 1rem;
        border-radius: .5rem;
        transition: 0.3s;
    }

    .contenedor {
        width: 95%;
    }
}

@media (max-width:810px) {
    .icon-bar {
        display: none;
    }

    .slider {
        /*border-radius: 10px;  Modificar para movil */
        width: 100%;
        /* Modificar para movil */
        height: calc(80vh - 79px);
        ;
        overflow: hidden;
    }

    .slides {
        width: 500%;
        height: calc(80vh - 79px);
        ;
        display: flex;
    }

    .navigation-auto {
        position: absolute;
        display: flex;
        width: 100%;
        justify-content: center;
        margin-top: calc(80vh - 119px);
        /* Modificar con el alto de la imagen*/
    }

    .texto__mr {
        margin: 0 2rem
    }

    .correos {
        padding-top: 5rem
    }

    .descripcion {
        text-align: center
    }

    .espacio {
        padding-top: 4rem
    }

    .menu__opciones {
        display: none
    }

    .menu__movil {
        display: block;
        color: #fff;
        cursor: pointer
    }

    .contenedor {
        width: 85%
    }

    .title {
        font-family: Raleway, sans-serif;
        font-size: 2.3rem
    }

    .slider__banner {
        text-align: center;
        width: 85vw;
        position: absolute;
        color: #fff;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -30%);
        -ms-transform: translate(-50%, -30%);
        transform: translate(-50%, -30%);
        margin-left: 0
    }

    .icon-bar a {
        padding: 10px 25px;
        font-size: 20px
    }

    .galeria {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 3rem
    }
}

@media (max-width:1125px) and (min-width:810px) {
    .galeria {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 1fr 3rem 1fr;
        grid-template-columns: 1fr 1fr;
        justify-items: center;
        gap: 3rem
    }
}