@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@100;200;400;600;800;900&display=swap');

    * {
       
        box-sizing: border-box;
        font-family: 'Barlow';
    }

    html {
        scroll-behavior: smooth;
    }

    body {
        background-color: #dde1e9;
    }

    /* *********** */
    /* ENCABEZADO - MENU */
    /* *********** */
    .contenedor-header {
        width: 100%;
        position: fixed;
        border-bottom: 1px solid #1f283e;
        background-color: black;
        z-index: 99;
        padding: 0 20px;
    }

    .contenedor-header header {
        max-width: 1100px;
        margin: auto;
        width: 100%;
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 8px 0;
        color: #fff;
        
    }

    .txtRojo {
        color: #ff1133;
    }

    .contenedor-header header nav a {
        display: inline-block;
        text-decoration: none;
        color: #fff;
        padding: 10px;
        text-transform: uppercase;
    }

    .contenedor-header header nav a:hover {
        color: #ff1133;
    }

    .contenedor-header header .redes a {
        text-decoration: none;
        color: #fff;
        display: inline-block;
        padding: 5px 8px;
    }

    .contenedor-header header .redes a:hover {
        color: #ff1133;
    }

    .nav-responsive {
        display: none;
        font-size: 25px;
    }

    /* *********** */
    /* SECCIÓN INICIO */
    /* *********** */
    .inicio {
        height: 100vh;
        background: linear-gradient(rgba(0, 1, 3, 0.5), rgba(0, 0, 0, .7)), url(img/conexit-fondo.png);
        background-size: cover;
        background-position: center center;
        color: #fff;
        position: relative;
    }

    .inicio .contenido-seccion {
        max-width: 1100px;
        margin: auto;
    }

    .inicio .info {
        width: fit-content;
        margin: auto;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
    }

    .inicio .info h2 {
        font-size: 4rem;
        letter-spacing: 3px;
    }

    .inicio .info p {
        margin: 20px;
        color: #797e8e;
        font-size: 16px;
        letter-spacing: 3px;
        text-transform: uppercase;
    }

    .inicio .info .btn-mas {
        width: 50px;
        margin: auto;
        height: 50px;
        border: 2px solid #ff1133;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        color: #ff1133;
        margin-top: 50px;
        text-decoration: none;
    }

    .opciones {
        position: absolute;
        display: flex;
        justify-content: space-between;
        bottom: 30px;
        left: 50%;
        transform: translateX(-50%);
    }

    .inicio .opciones .opcion {
        border-top: 2px solid #797e8e;
        padding: 7px;
        color: #797e8e;
        margin: 0 20px;
    }

    /* *********** */
    /* SECCION NOSOTROS */
    /* *********** */
    .nosotros {
        max-width: 1100px;
        margin: auto;
        background-color: #dde1e9;
        padding: 150px 20px;
    }

    .nosotros .fila {
        display: flex;
        align-items: center;
    }

    .nosotros .fila .columna {
        width: 50%;
    }

    .nosotros .fila .columna img {
        width: 90%;
        display: block;
        margin: auto;
    }

    .nosotros .fila .columna .contenedor-titulo {
        display: flex;
        align-items: center
    }

    .nosotros .fila .columna .contenedor-titulo .numero {
        color: #ff1133;
        font-weight: bold;
        display: block;
        font-size: 5rem;
    }

    .nosotros .fila .columna .contenedor-titulo .info {
        margin-left: 30px;
    }

    .nosotros .fila .columna .contenedor-titulo .info .frase {
        color: #ff1133;
    }

    .nosotros .fila .columna .contenedor-titulo .info h2 {
        font-size: 3rem;
    }

    .nosotros .fila .columna p {
        margin-bottom: 10px;
        line-height: 28px;
    }

    .nosotros .fila .columna .p-especial {
        font-weight: bold;
    }


    /* ********** */
    /* SERVICIOS */
    /* ********** */

    .servicios {
        color: #fff;
        position: relative;
    }

    .servicios .contenido-seccion {
        background: linear-gradient(rgba(0, 14, 41, 0.6), rgba(0, 7, 78, 0.7)), url(img/fondo-servicio.jpeg);
        background-size: cover;
        background-position: center center;
        margin: auto;
        padding: 0 20px;
    }

    .servicios .contenido-seccion .fila {
        max-width: 1100px;
        margin: auto;
        display: flex;
        align-items: center;
        padding: 100px 0;
    }

    .servicios .contenido-seccion .fila .columna {
        width: 50%;
    }

    .servicios .contenido-seccion .fila .columna img {
        display: block;
        width: 50%;
        margin: auto;
    }

    .servicios .fila .columna .contenedor-titulo {
        display: flex;
        align-items: center;
    }

    .servicios .fila .columna .contenedor-titulo .numero {
        color: #ff1133;
        font-weight: bold;
        display: block;
        font-size: 5rem;
    }

    .servicios .fila .columna .contenedor-titulo .info {
        margin-left: 30px;
    }

    .servicios .fila .columna .contenedor-titulo .info .frase {
        color: #ff1133;
    }

    .servicios .fila .columna .contenedor-titulo .info h2 {
        font-size: 3rem;
    }

    .servicios .fila .columna p {
        margin-bottom: 10px;
        line-height: 28px;
    }

    .servicios .fila .columna .p-especial {
        font-weight: bold;
    }

    .servicios .info-servicios {
        max-width: 800px;
        margin: auto;
    }

    .servicios .info-servicios table {
        text-align: center;
        background-color: #fff;
        color: #1f283e;
        border-collapse: collapse;
        position: relative;
        bottom: 100px;
    }

    .servicios .info-servicios table td {
        padding: 30px;
        border: 1px solid #dde1e9
    }

    .servicios .info-servicios table td i {
        color: #ff1133;
        font-size: 2.5rem;
        margin-bottom: 20px;

    }

    .servicios .info-servicios h3 {
        margin-bottom: 20px;
        text-transform: uppercase;
    }

    .servicios .info-servicios p {
        line-height: 30px;
    }

   

    /* ********** */
    /* GALERIA */
    /* ********** */
    .galeria {
        color: #fff;
        background: linear-gradient(rgba(0, 14, 41, 0.6), rgba(0, 7, 78, 0.7)), url(img/fondo-galeria2.jpeg);
        background-size: cover;
        background-position: center center;
        padding: 100px 0;
    }

    .galeria .contenido-seccion {
        max-width: 1100px;
        margin: auto;
        padding: 0 20px;
    }

    .galeria .contenedor-titulo {
        display: flex;
        align-items: center;
        margin-bottom: 40px;
    }

    .galeria .contenedor-titulo .numero {
        color: #ff1133;
        font-weight: bold;
        display: block;
        font-size: 5rem;
    }

    .galeria .contenedor-titulo .info {
        margin-left: 30px;
    }

    .galeria .contenedor-titulo .info .frase {
        color: #ff1133;
    }

    .galeria .contenedor-titulo .info h2 {
        font-size: 3rem;
    }

    .galeria .fila {
        display: flex;
    }

    .galeria .fila .columna img {
        width: 100%;
        display: block;
    }

  

    /* *********** */
    /* CONTACTO */
    /* *********** */
    .contacto {
        color: #fff;
        background: linear-gradient(rgba(0, 14, 41, 0.6), rgba(0, 7, 78, 0.7)), url(img/fondo-contacto.jpeg);
        background-size: cover;
        background-position: center center;
        padding: 100px 20px;

    }

    .contacto .contenido-seccion {
        max-width: 800px;
        margin: auto;
    }

    .contacto .contenedor-titulo {
        display: flex;
        align-items: center;
        width: fit-content;
        margin: auto;
    }

    .contacto .contenedor-titulo .numero {
        color: #ff1133;
        font-weight: bold;
        display: block;
        font-size: 5rem;
    }

    .contacto .contenedor-titulo .info {
        margin-left: 30px;
    }

    .contacto .contenedor-titulo .info .frase {
        color: #ff1133;
    }

    .contacto .contenedor-titulo .info h2 {
        font-size: 3rem;
    }

    .contacto .fila {
        display: flex;
        margin-top: 50px;
        justify-content: space-between;
    }

    .contacto .fila .columna {
        width: 48%;
    }

    .contacto .fila input {
        width: 100%;
        padding: 15px;
        border: none;
        border-radius: 5px;
        font-size: 20px;
        outline: none;
    }

    .contacto textarea {
        display: block;
        margin-top: 20px;
        padding: 15px;
        font-size: 20px;
        outline: none;
        width: 100%;
        height: 200px;
    }

    .contacto button {
        display: block;
        width: fit-content;
        margin: auto;
        margin-top: 30px;
        border: none;
        background-color: #ff1133;
        color: #fff;
        font-size: 18px;
        padding: 10px 25px;
        border-radius: 5px;
        cursor: pointer;
    }

    .contacto .fila-datos {
        display: flex;
        justify-content: space-around;
        margin-top: 100px;
        font-size: 18px;
        text-align: center;
    }

    .contacto i {
        color: #ff1133;
        display: inline-block;
        margin-right: 10px;
    }

    /* *********** */
    /* FOOTER */
    /* *********** */
    footer {
        background-color: #151623;
        padding: 30px 0;
    }

    footer .info {
        display: flex;
        max-width: 1100px;
        margin: auto;
        justify-content: space-between;
        padding: 0 20px;
    }

    footer .info p {
        color: #797e8e;
    }

    footer .info a {
        text-decoration: none;
        color: #797e8e;
        display: inline-block;
        margin: 0 15px;
    }

    /* *********** */
    /* RESPONSIVE */
    /* *********** */
    @media only screen and (max-width: 900px) {
        header nav {
            position: initial;
            display: none;
            transform: translate(0);
        }

        header .redes {
            display: none;
        }

        .nav-responsive {
            display: block;
        }

        nav.responsive {
            display: flex;
            flex-direction: column;
            justify-content: center;
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100vh;
            background-color: #151623;
            z-index: 99;
        }

        nav.responsive a {
            display: block;
            width: fit-content;
            margin: 10px auto;
            font-size: 30px;
        }

        .inicio .opciones {
            display: none;
        }

        .nosotros .fila {
            display: block;
        }

        .nosotros .fila .columna {
            width: 100%;
            margin: auto;
        }

        .nosotros .fila .columna img {
            max-width: 400px;
            display: block;
            margin: auto;
        }
        .servicios .contenido-seccion .fila {
            display: block;
        }
        .servicios .contenido-seccion .fila .columna {
            width: 100%;
        }
        .contacto .fila {
            display: block;
        }
        .contacto .fila .columna {
            width: 100%;
            margin-bottom: 20px;
        }

        .contacto .fila-datos {
            display: block;
        }

        .contacto .fila-datos .columna {
            margin-bottom: 20px;
        }

        footer .info {
            display: block;
            text-align: center;
        }

        footer .info p {
            margin-bottom: 10px;
        }
    }