<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/*####################################################
##													##
## HUMBER    										##
## 													##
## 640.CSS		           							##
## 													##
## 													##
## Estilo CSS responsive    						##
## Estilos del frontend      					    ##
##													##
##													##
####################################################*/

@charset "utf-8";

/*** ELEMENTOS COMUNES ***/

    /* Video embed */

    .video {
        height: 0;
        min-height: initial;
        padding-bottom: 56.25%;
        position: relative;
    }

        .video iframe {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
        }

    /* Cards */

    .card.normal {
        box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
        position: relative;
        border-radius: 15px;
        grid-template-columns: .5fr 1fr;
    }

    .card.normal.grid div:last-child h1 {
        font-size: 18pt;
    }

    .card.normal p {
        font-size: 11pt;
        line-height: 16pt;
    }

    .card.banner &gt; .grid {
        gap: 0;
    }

    .card.banner:not(.alt) .grid .first {
        height: 100%;
        padding-left: 20px;
        position: relative;
    }

        .card.banner:not(.alt) .grid .first img {
            width: calc(100% - 20px);
            position: absolute;
            margin-top: 0;
            bottom: 0;
        }

    /* Elementos con visibilidad condicional desktop/mobile */

    .desktop {
        display: none;
    }

        .desktop.img {
            display: none;
        }

    .mobile {
        display: block;
    }

        .mobile.img {
            display: block;
        }

    /* Padding */

    .padding {
        padding: 15px;
    }

    /* Banners */

    .banners {
        margin: 15px;
        border-radius: 20px;
        overflow: hidden;
    }

    /* Descargar App */

    #descargar-app {
        display: none;
    }

    .descarga__control:hover .descarga__popup {
        visibility: hidden;
        opacity: 0;
    }

    /* Slick Slider */

    .slide__imagenes .desktop {
        display: none;
    }

    .slide__imagenes .mobile {
        display: block;
    }

    .slide__contenido {
        font-size: 14pt;
        transform: translateY(-50%);
    }

    /* Cards en fila de 3 columnas con width y padding reducido */

    .row-cards.cards {
        padding-top: 0;
        max-width: 1024px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 15px;
    }

        .row-cards .card.compacta {
            padding: 15px;
        }

        .row-cards.cards .card.compacta h1 {
            font-size: 1em;
        }

    /* Puntitos */

    .puntitos {
        width: 20px;
        height: 60px;
    }

/*** HEADER ***/

    header .grid {
        padding: 12px 24px;
        grid-template-columns: auto 1fr auto;
        gap: 25px;
        align-items: center;
    }

    header .grid .logo img {
        width: initial;
        max-width: 35px;
    }

/*** FOOTER ***/

/*** SECCIONES ***/

section {
    margin-top: 58px;
}

    /** HOME **/

        /* Cards sub slider */

        #cards-home {
            margin-top: 0;
            grid-template-columns: 1fr;
        }

        /* Mapa de ubicaciones */

        #mapa {
            margin: 25px auto;
            padding: 25px;
            grid-template-columns: 1fr;
        }

            #mapa__ubicaciones {
                padding-right: 0;
            }

    /** DADORES DE CARGA **/

    #solucion .grid {
        grid-template-columns: 1fr;
        gap: 15px;
        text-align: center;
    }

    #partnership-shell .grid, #tarjeta-humber .grid {
        padding: 15px;
        grid-template-columns: 1fr;
        gap: 35px;
        text-align: center;
    }

    #partnership-shell &gt; div &gt; div:nth-child(1) &gt; img,
    #tarjeta-humber &gt; div &gt; div:nth-child(1) &gt; img {
        margin: auto;
        max-width: 200px;
    }

    #huella-carbono .grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    #huella-carbono &gt; div &gt; div.second.relative &gt; img {
        margin: auto;
        max-width: 200px;
    }

    /** TRANSPORTISTAS **/

    #cards-transportistas .grid {
        grid-template-columns: 1fr;
        gap: 15px;
        text-align: center;
    }
</pre></body></html>