@media (max-width: 450px) {
    html {
    font-size: 2.2vw;
    }
    h1{
        font-size: 6rem;
    }
    h2{
        font-size: 4rem;
    }
    p{
        font-size: 2rem;
        text-wrap: pre-wrap;
        line-height: 1.5 !important;
    }
    .text-sm{
        font-size: 1.5rem;
    }

    /*-----------------------
    POOSIZIONE DEGLI ELEMENTI
    col = colonna angolo in alto a sinistra
    row = riga angolo in alto a sinistra
    width = numero di colonne occupate
    height = numero di righe occupate
    ------------------------*/

    .grid{
        --num-columns: 10;
    }

    /*-----------------------*/
    .logo{
        --col: 1;
        --row: 1;
        --width: 2;
        --height: 2;
    }
    .nome{
        --col: 4;
        --row: 1;
        --width: 3;
        --height: 2;
    }
    .private{
        --col: 9;
        --row: 1;
        --width: 2;
        --height: 1;
    }
    .private-menu{
        --col: 1;
        --row: 3;
        --width: 10;
        --height: 8;
        background-color: rgba(255, 255, 255, 0.6);
        backdrop-filter: blur(10px);
        border-radius: 0 0 10px 10px;
        z-index: 100;
    }
    .private-menu p{
        font-size: 2.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: start;
        padding-left: calc(100cqw / var(--num-columns) * 3);
    }
    .cit{
        --col: 1;
        --row: 5;
        --width: 10;
        --height: 7;
    }
    .autore{
        --col: 1;
        --row: 12;
        --width: 10;
        --height: 1;
    }

    /*-----------------------*/

    .n1{
        --col: 1;
        --row: 16;
        --width: 2;
        --height: 2;
    }
    .n1-titolo{
        --col: 4;
        --row: 16;
        --width: 6;
        --height: 2;
    }
    .n1-text{
        --col: 1;
        --row: 18;
        --width: 9;
        --height: 8;
        flex-direction: column;
        justify-content: center;
    }

    /*-----------------------*/

    .n2{
        --col: 1;
        --row: 27;
        --width: 3;
        --height: 2;
    }
    .n2-titolo{
        --col: 4;
        --row: 28;
        --width: 6;
        --height: 2;
    }
    .n2-text{
        --col: 1;
        --row: 29;
        --width: 9;
        --height: 8;
        flex-direction: column;
        justify-content: center;
    }

    /*-----------------------*/

    .n3{
        --col: 1;
        --row: 38;
        --width: 3;
        --height: 2;
    }
    .n3-titolo{
        --col: 4;
        --row: 39;
        --width: 6;
        --height: 1;
    }
    .n3-text{
        --col: 1;
        --row: 40;
        --width: 9;
        --height: 8;
    }

    /*-----------------------*/

    .email{
        --col: 1;
        --row: 50;
        --width: 10;
        --height: 2;
        justify-content: center;
    }

    /*-----------------------*/

    .copyright{
        --col: 1;
        --row: 53;
        --width: 10;
        --height: 1;
    }
    .dati{
        --col: 1;
        --row: 54;
        --width: 7;
        --height: 1;
    }
}