img {
  max-width: 100%;
  height: auto;
  display: block;
}
/*=========================================================
           SOLO TABLET E TELEFONO
=========================================================*/

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

/* Header */
.header{
    gap:20px;
    height:auto;
    flex-wrap:wrap;
}

/* immagine */
.header img{
    max-width:45%;
}

/* titolo */
.header h1{
    font-size:32px;
}

.header h3{
    font-size:20px;
}

/* pulsanti */
.pannello{
    min-width:180px;
}

/* le tre colonne restano affiancate */
.sinistra{ width:22%; }

.centro{ width:48%; }

.destra{ width:30%; }

/* video */
.destra video{
    width:100%;
    height:auto;
}

}


/*=========================================================
                TELEFONO
=========================================================*/

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

.header{

    flex-direction:column;
    align-items:center;
    height:auto;
    gap:10px;

}

.header img{

    max-width:95%;

}

.header h1{

    font-size:24px;
    text-align:center;

}

.header h3{

    font-size:18px;
    text-align:center;

}

.pannello{

    width:95%;
    min-width:0;

}

.main{

    flex-direction:column;

}

.sinistra,
.centro,
.destra{

    width:100%;

}

/* IMPORTANTISSIMO:
   continua a scorrere SOLO il testo */

#contenuto{

    height:50vh;
    overflow-y:auto;

}

.destra video{

    width:100%;
    height:auto;

}

}