@media screen and (max-width: 768px) {
    /****** HEADER ******/
    header {
        position: fixed;
        top: 0;
        left: 0;
        padding: 0 var(--padding-pag);
        box-shadow: 0px 0px 10px black;
        background: white;
    }
    header, #header-logos {
        height: var(--h-header-logos-mov);
    }
    section {
        margin-top: var(--h-header-logos-mov);
    }
    #header-marca {
        width: calc(100% - 3em);
    }
    #header-logo {
        display: none;
    }
    .menu-nav {
        border-top: 3px solid var(--verd);
        position: fixed;
        height: calc(100vh - var(--h-header-logos-mov));
        top: var(--h-header-logos-mov);
        margin: 0;
        padding: 0;
        background: var(--col-40);
        box-shadow: 2px 0 8px rgba(0,0,0,.4);
        z-index: 2;
        display: block;
    }
    .menu-nav li {
        width: 100%;
        background: inherit;
    }
    .header-langs {
        width: 5em;
        right: -5em;
        display: block;
        border-left: 3px solid var(--verd);
        transition: right .35s cubic-bezier(0.25,0.8,0.25,1);
    }
    #menu {
        height: 0;
    }
    .header-langs li {
        aspect-ratio: 1;
        width: 100%;
        padding: .75em;
        height: auto !important;
        border-bottom: 1px solid var(--verd);
    }
    .header-langs img {
        aspect-ratio: 1;
        width: 100%;
        margin: 0;
        height: auto !important;
    }
    .header-seccions {
        border-right: 3px solid var(--verd);
        margin-top: .46em;
        left: -85%;
        width: 85%;
        transition: left .35s cubic-bezier(0.25,0.8,0.25,1);
    }
    header nav ul {
        height: 100%;
        margin: 0px;
        padding: 0px;
    }
    header nav ul li {
        display: block;
        border-bottom: 1px solid #388F35;
        width: 100%;
        text-align: left;
    }
    .nav-toggle-label,
    .nav-toggle-globe-label,
    .nav-overlay,
    .nav-globe-overlay,
    #header-menu,
    #header-globe
    { display: block; }

    /****** GALERIA ******/
    .galeria-container {margin-top: 0em;}

    /****** CONTINGUT ******/
    #ul-beneficis        {max-width: 100%;}
    #img-beneficis       {flex-direction: column;}
    #img-beneficis-float {position: static;}
    #img-beneficis img {
        width: 100%;
        margin: .2em 0;
    }
    #div-horaris {
        margin-top: var(--h-header-logos-mov);
    }
    #horaris-btns {
        display: flex;
        width: 100%;
        gap: 1%;
        justify-content: flex-start;
    }
    #horaris-btns a {
        padding: 1em;
        background: var(--col-100);
        color: var(--blanc);
        font-weight: bold;
        width: 100%;
        text-align: center;
        transition: background 0.4s;
    }
    #horaris-btns a:hover {
        background: var(--verd) !important;
    }
    #horaris-btns a:nth-child(1) {
        background: var(--verd);
    }
    #horaris {
        table-layout: auto;
        margin: 2em 0;
    }
    #horaris th:nth-child(1) {
        width: 30%;
    }
    #horaris td:nth-child(n + 3), #horaris th:nth-child(n + 3) {
        display: none;
    }
    .td-mobil {
        display: table-cell !important;
    }
    .td-mobil-none {
        display: none !important;
    }
    #img-curri {
        width: 100%;
        margin-bottom: 1em;
    }
    .box-vertical {
        height: calc(100vh - var(--h-header-logos-mov));
        margin-top: var(--h-header-logos-mov);
    }
    .box-bottom > footer {
        height: 100% !important;
    }
    .contacte {
        display: block;
        text-align: center;
        line-height: 2em;
        margin: 1.5em auto;
    }
    .contacte a { display: block; }

    /****** PEU ******/
    footer { height: auto; }
    footer > div { display: inline-block; }
    footer > div > div { margin: .9em 0; width: 100%; }
    .footer-left, .footer-right { text-align: center !important; }
}