@charset "UTF-8";

/**********************************
 *			GENERAL
 *********************************/

@media only screen and (max-width: 430px) {

    article {
        scroll-margin-top: calc(66px + 1.8rem + 2rem);
    }

    header.header-container {

        >a {
            >img {
                margin-top: unset;
                width: auto;
                height: 66px;
            }
        }

        .cllapseMennu {

            ul {
                grid-template-columns: 1fr 1fr;
            }

        }
    }

    footer.footer-container>.mod-footer {

        padding-top: 2.7rem;
        padding-bottom: 2.8rem;
        padding-left: 2.4rem;
        padding-right: 2.4rem;
        grid-template-columns: 1fr;
        row-gap: 2.7rem;

        ul {
            list-style-type: none;

            >li {
                font-size: 1.6rem;
                margin-bottom: 0;
            }
        }

        .col2 {
            >ul li:last-child {
                display: none;
                font-weight: unset;
            }

            .mod-custom.custom {
                margin-top: 2.7rem;
            }
        }

        .col3 {
            span {
                float: unset;
                display: block;
                margin-bottom: 1rem;
            }

            img {
                float: unset;
            }
        }
    }

    main.main-container {

        div.banner-container {
            padding-left: 1rem;
            padding-right: 1rem;
            margin-bottom: 4rem;

            overflow: hidden;

            >img {
                margin-bottom: 2rem;
                padding-left: 0;
                width: 100%;
            }

            &.home {

                >img {
                    margin-left: calc(-1 * (720px - 100vw + 2rem));
                    width: unset;
                    height: 135px;
                    clip-path: inset(0 1rem 0 calc((720px - 100vw + 2rem)));
                }
            }

            .slide_controls {

                justify-content: start;
                margin-top: 3rem;

                span {

                    height: .9rem;
                    width: .9rem;

                }
            }

            &.acceso-online,
            &.soluciones-y-servicios,
            &.productos,
            &.alianzas-estrategicas {

                >div.img-container {

                    margin-bottom: 0rem;

                    >img {
                        width: 100%;
                        padding: 0;
                    }
                }
            }
        }

        div.main-container-data {

            &.productos {
                section {
                    grid-template-columns: 2rem calc(100% - 2rem);
                }
            }

            section {

                grid-template-columns: 2rem 1fr;

                margin-bottom: 4.3rem;

                >div {

                    background-color: var(--section-marcker-bc-color);
                    padding: 20px .15rem 20px .3rem;

                    h1 {
                        position: sticky;
                        top: calc(20px + 1.8rem + 2rem + 60px);
                        font-size: 1rem;
                    }
                }

                article {
                    grid-column: 2;
                    margin-left: 1.35rem;
                    margin-right: 1rem;
                    padding-top: 1rem;
                    padding-bottom: 3rem;

                    h2 {
                        font-size: 1.7rem;
                        margin-bottom: 3rem;
                    }

                }

                article:first-of-type {
                    padding-top: 1rem;
                }

                article:last-of-type {
                    padding-bottom: 0;
                }

                article.monitorear-proteger-detectar-responder-recuperar {

                    div.first-row {

                        div.img-container {
                            width: 100%;
                            margin-bottom: 2rem;

                            img {
                                width: 100%;
                            }
                        }

                        div {
                            width: 100%;

                            p {
                                font-size: 1.15rem;
                                margin-bottom: 2rem;
                            }
                        }
                    }

                    div.second-row {

                        grid-template-columns: 1fr;
                        gap: 2.3rem;
                        margin-top: 3rem;

                        span {
                            font-size: 1.1rem;
                        }

                        p {
                            font-size: 1rem;
                        }
                    }
                }

                article.que-ofrecemos {

                    div.first-row {

                        div.img-container {
                            width: 100%;

                            img {
                                width: 100%;
                            }
                        }

                        div {
                            width: 100%;

                            p {
                                font-size: 1.15rem;
                                margin-bottom: 0;
                            }

                            p:last-of-type {
                                margin-bottom: 0;
                            }
                        }
                    }

                    div.second-row {

                        grid-template-columns: 1fr;
                        gap: 1.2rem;
                        margin-top: 3rem;

                        div {
                            grid-template-rows: unset;

                            span {
                                font-weight: bold;
                                font-size: 1.1rem;
                            }

                            ul {
                                padding-left: 1rem;
                                margin-top: 1rem;
                                font-size: 1rem;
                            }
                        }
                    }
                }

                article.respuesta-a-incidentes-csirt-tilsor {

                    div.first-row {

                        flex-direction: column-reverse;

                        div.img-container {
                            width: 100%;
                        }

                        div {
                            width: 100%;
                            margin-bottom: 0rem;
                            padding-right: 0;

                            span {
                                font-size: 1rem;
                                margin-bottom: 1.5rem;
                            }

                            span:last-of-type {
                                font-size: .85rem;
                                margin-bottom: 0rem;
                            }
                        }
                    }
                }

                article.autoridades-de-certificacion-para-infraestucturas-pki-easycert-tilsor {

                    div.first-row {

                        div {
                            width: 100%;

                            span {
                                font-size: 1.1rem;
                            }

                            span:last-of-type {
                                font-size: .85rem;
                                margin-bottom: 0rem;
                            }
                        }

                        div.img-container {
                            width: 100%;
                            margin-bottom: 2rem;
                        }
                    }
                }

                article.sistema-de-factura-electronica-asf-tilsor {

                    div.first-row {

                        flex-direction: column-reverse;
                        margin-top: 3rem;

                        div {
                            width: 100%;

                            span {
                                font-size: 1.1rem;
                                padding-right: 0;
                                margin-bottom: 1.5rem;
                            }

                            span:last-of-type {
                                font-size: .85rem;
                                margin-bottom: 0rem;
                            }
                        }

                        div.img-container {
                            width: 100%;
                            padding-left: 0;
                            padding-bottom: 2.6rem;
                        }
                    }
                }

                article.redhat {

                    div.first-row {

                        div.img-container {
                            width: 100%;
                            margin-bottom: 2.6rem;
                        }

                        div {
                            width: 100%;

                            img {
                                width: 50%;
                                margin-bottom: 0;
                            }

                            span {
                                font-size: 1.1rem;
                                margin-bottom: 1.5rem;
                                display: block;
                            }

                            span:last-of-type {
                                font-size: .85rem;
                                margin-bottom: 0rem;
                            }
                        }
                    }
                }

                article.nuevos-desafios {

                    div.first-row {

                        display: flex;
                        flex-wrap: wrap;
                        margin-bottom: 3.3rem;

                        div.img-container {
                            width: 100%;
                        }

                        div {
                            width: 100%;

                            p {
                                font-size: 1.1rem;
                                margin-right: 0;
                                display: block;

                                span {
                                    color: var(--highlight-color-2);
                                }
                            }
                        }
                    }

                    div.second-row {

                        grid-template-columns: 1fr;
                        gap: 3rem;

                        div {
                            display: grid;
                            grid-template-columns: 1fr;
                            grid-template-rows: unset;
                            row-gap: 1rem;

                            span {
                                font-weight: bold;
                                font-size: 1.1rem;
                            }

                            p {
                                font-size: 1rem;
                            }
                        }
                    }
                }

                article.deteccion-y-respuesta-gestionada {

                    h3 {
                        font-size: 1.2rem;
                    }

                    div.first-row {

                        flex-direction: column-reverse;
                        margin-bottom: 0rem;

                        div.img-container {
                            width: 100%;
                            margin-bottom: 1.8rem;
                        }

                        div {
                            width: 100%;

                            p {
                                margin-right: 0;
                            }
                        }
                    }

                    div.second-row {

                        margin-bottom: 4.5rem;

                        p {
                            font-size: 1.2rem;
                            margin-bottom: 1.8rem;
                            display: block;
                        }
                    }

                    div.third-row {

                        margin-bottom: 0rem;

                        div.img-container {
                            width: 100%;
                            margin-bottom: 4.5rem;
                        }

                        div {
                            width: 100%;
                        }
                    }

                    div.quarter-row {

                        p:last-of-type {
                            margin-bottom: 0rem;
                        }
                    }
                }

                article.respuesta-a-incidentes,
                article.seguridad-de-aplicaciones-web {

                    div.first-row {

                        flex-direction: column-reverse;

                        div.img-container {
                            width: 100%;
                            margin-bottom: 1.8rem;
                        }

                        div {
                            width: 100%;

                            p {
                                margin-right: 0;
                            }
                        }
                    }

                }

                article.analisis-forense-digital {

                    div.first-row {

                        margin-bottom: 1.8rem;

                        div.img-container {
                            width: 100%;
                            margin-bottom: 1.8rem;
                        }

                        div {
                            width: 100%;

                            p {
                                margin-left: 0;
                                margin-bottom: 1.8rem;
                            }
                        }
                    }

                    div.second-row {

                        div {
                            width: 100%;
                            margin-bottom: 1.8rem;
                        }

                        div:last-of-type {
                            margin-bottom: 0;
                        }
                    }
                }

                article.inteligencia-de-amenazas {

                    div.first-row {

                        flex-direction: column-reverse;

                        div.img-container {
                            width: 100%;
                            margin-bottom: 1.8rem;
                        }

                        div {
                            width: 100%;

                            p {
                                margin-right: 0;
                            }
                        }
                    }

                }

                article.gestion-de-vulnerabilidades,
                article.arquitectura-de-seguridad-empresarial,
                article.gestion-de-cumplimiento,
                article.ciso-virtual-director-de-seguridad-de-la-informacion,
                article.evaluacion-de-riesgos,
                article.evaluaciones-tecnicas-de-seguridad,
                article.red-teaming,
                article.soporte-tecnologico {

                    div.first-row {

                        div {
                            width: 100%;
                            margin-bottom: 1.8rem;

                            span.title {
                                height: unset;
                                margin-bottom: 1rem;
                            }

                            &:last-of-type {
                                margin-bottom: 0;
                            }
                        }

                    }
                }

                article.tecnologias {

                    div.first-row {

                        grid-template-columns: 1fr;
                        column-gap: 0;
                        row-gap: 1.8rem;

                        div {

                            align-items: flex-start;
                            gap: 1rem;

                            img {
                                width: unset;
                                max-height: 7rem;
                                max-width: 80%;
                            }
                        }
                    }
                }

                article.tilsor-historia {

                    div.first-row {

                        flex-direction: column;
                        gap: 2rem;

                        div {

                            width: 100%;

                            &.img-container {
                                width: 100%;
                            }

                            p {
                                margin-left: 0;
                            }
                        }
                    }
                }

                article.socios {
                    div.cards-containre {
                        grid-template-columns: 1fr 1fr;
                    }
                }

                article.certificaciones-iso,
                article.certificaciones-first {

                    flex-wrap: wrap;
                    align-content: space-between;
                    justify-content: space-between;

                    div.iso-containre {

                        &:nth-of-type(1),
                        &:nth-of-type(2),
                        &:nth-of-type(3) {
                            width: 40%;
                        }
                    }
                }

                article.pensionuy,
                article.sirfe,
                article.servicios-de-tecnologia-de-la-informacion {

                    .first-row {
                        flex-direction: column-reverse;
                        gap: 2rem;
                        margin-bottom: 2rem;

                        div {
                            width: 100%;
                        }
                    }

                    .second-row {
                        display: grid;
                        grid-template-columns: 1fr 1fr;
                        height: unset;

                        & img {
                            max-height: 6rem;
                            width: unset;
                            max-width: 100%;
                        }
                    }

                    .third-row {
                        margin-bottom: 2rem;
                    }

                    .fourth-row {
                        grid-template-columns: 1fr;
                        row-gap: 2rem;
                    }
                }

                article.administradoras-de-fondos-de-ahorro-previsional,
                article.financiero-publico,
                article.financiero-privado,
                article.empresas-del-estado,
                article.adiministracion-publica,
                article.industria-y-consumo,
                article.salud,
                article.servicios {

                    .scroll-wrapper {

                        width: calc(100vw - 2rem - 1.35rem - 1rem);
                    }
                }
            }

            &.acceso-online {
                padding-left: 1.3rem;
                padding-right: 1.3rem;
                margin-bottom: 8rem;

                display: flex;
                flex-wrap: wrap;
                row-gap: 2.5rem;
                column-gap: 3rem;


                h1 {
                    font-size: 3rem;
                }

                >article {
                    width: 100%;
                    padding-bottom: 2rem;
                    border-bottom: 1px solid var(--separator-color);

                    h2,
                    p {
                        font-size: 1.8rem;
                    }

                    a {
                        font-size: 1.5rem;
                    }

                    &:last-of-type {
                        padding-bottom: 0;
                        border-bottom: none;
                    }
                }
            }

            &.alianzas-estrategicas {

                article {

                    &.red-hat,
                    &.ibm,
                    &.adobe,
                    &.smartfense,
                    &.dynatrace,
                    &.elastic {

                        .first-row {

                            height: unset;

                            div:not(.img-container) {

                                width: 100%;
                                padding: 0;
                                padding-top: 2rem;
                            }

                            div.img-container {
                                width: 45%;

                                img {
                                    max-height: 8rem;
                                    width: 100%;
                                }
                            }

                            div.img-container+div.img-container {
                                margin-left: 2rem;
                            }
                        }

                        &.smartfense {

                            .first-row {

                                div.img-container {

                                    img {
                                        width: 50%;
                                    }
                                }
                            }
                        }
                    }
                }
            }

            &.productos {

                article {

                    &.asf-factura-electronica,
                    &.asf-easycert,
                    &.secureit,
                    &.asf-factura-electronica-sirfe,
                    &.lava,
                    &.wisdom {

                        .first-row {
                            margin-bottom: 2rem;
                        }

                        .second-row {
                            grid-template-columns: 1fr;
                            row-gap: 2rem;

                            .col1,
                            .col2,
                            .col3 {
                                span {
                                    margin-bottom: 1rem;
                                }
                            }

                        }

                        .fifth-row {

                            flex-direction: column-reverse;
                            gap: 2rem;

                            div {
                                width: 100%;

                                &.img-container {
                                    width: 100%;

                                    &.logo-sirfe {
                                        justify-content: left;
                                    }
                                }
                            }
                        }

                    }
                }
            }
        }
    }

    .banner-home-item-1 {
        display: block;


        div {
            width: 100%;

            &.side-left {

                text-align: left;
                font-size: 2.5rem;
            }

            &.side-right {
                text-align: left;

                p {
                    font-size: 1.5rem;
                    margin-top: 2.5rem;
                    margin-bottom: 1.5rem;

                    span {
                        color: var(--highlight-color-3);
                    }
                }

                >span {
                    font-size: 1.1rem;
                }
            }
        }
    }

    .banner-ciberseguridad-item-1 {
        display: block;


        div {
            width: 100%;

            &.side-left {

                text-align: left;

                span {

                    margin-bottom: 2rem;

                    &.title {

                        font-size: 3.6rem;

                    }

                }
            }

            &.side-right {

                span {

                    margin-bottom: 2rem;

                    &.title {

                        font-size: 2.5rem;
                    }

                    &.subtitle {

                        font-size: 1.8rem;
                    }
                }
            }
        }
    }

    .banner-empresa-item-1,
    .banner-empresa-item-2 {
        height: 15rem;
    }

    .banner-alianzas-estrategicas-item-1 {

        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        gap: 2rem;
        align-content: center;
        justify-content: center;
        /* height: 8rem; */

        div.side-right {

            width: 100%;

            p {
                font-size: 1.6rem;
                margin-bottom: 2rem;
            }

            span {
                font-size: 1.2rem;
                text-align: center;
            }
        }

        div.side-left {

            width: 100%;

            img {
                width: 80% !important;
                margin: 0 !important;
                padding: 0 !important;
            }
        }
    }

    .banner-soluciones-servicios-item-1 {

        gap: 2rem;

        div.side-right,
        div.side-left {

            width: 100%;
            text-align: left;

        }
    }

    .banner-productos-item-1 {

        gap: 1rem;

        div.side-right {

            width: 100%;

            span {
                text-align: left;
            }
        }

        div.side-left {

            width: 100%;
            text-align: left;
        }
    }

    .scroll-wrapper.can-scroll-left .left-arrow {
        left: -1rem;
    }

    .scroll-wrapper.can-scroll-right .right-arrow {
        right: -1rem;
    }

    .page-404 {

        height: calc(100vh - 470px - 106px - 40px);

    }
}