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

    .logo {
        margin-top: 10px;
    }

    .title {
        margin-bottom: 30px;
    }

    .counter {
        flex-direction: column;
        padding: 0;
        margin-bottom: 0;
    }

    .counter-info {
        width: 100%;
        height: 300px;
        margin-right: 0;
        margin-bottom: 15px;
    }

    .counter-interaction {
        display: flex;
        flex-direction: row;
        height: auto;
        width: auto;
    }

    .counter-interaction button {
        width: 47%;
        height: 100px;
        margin-right: 0;
        margin-bottom: 15px;
    }
}

@media (orientation: portrait) {
    body {
        height: 100%;
        width: 100%;
        font-size: 1.1rem;
    }

    h1 {
        font-size: 2.3rem;
    }

    h2 {
        font-size: 2rem;
    }

    h3 {
        font-size: 1.7rem;
        font-style: italic;
    }

    h4 {
        font-size: 1.5rem;
    }

    h5 {
        font-size: 1.2rem;
        font-style: italic;
    }

    h6 {
        font-size: 1.1rem;
    }

    .h1Heading {
        font-size: 1.0rem;
    }

    .h2Heading {
        font-size: 0.9rem;
    }

    .h3Heading {
        font-size: 0.8rem;
    }

    .header {
        min-width: 105vw;
    }

    #areaVideo {
        border-radius: 5vh;
        min-width: 96vw;
        min-height: 31vh;
        width:  96vw;           /* % viewpoint larghezza  */
        height: 31vh;           /* % viewpoint altezza    */
        top: 15%;
    }

    #areaConsensoCookies {
        width: 90vw;
    }

    .content {
        width: 90vw;
    }

    .contentTest {
        width: 90%;
    }

    .areaVideoContainer {
        border-radius: 5vh;
        min-height: 31vh;
        height: 31vh;           /* % viewpoint altezza    */

        min-width: 89vw;
        width: 89vw;           /* % viewpoint larghezza  */

        top: 15%;
    }

    .areaVideoContainerTest {
        border-radius: 5vh;

        min-height: 31vh;
        height: 31vh;           /* % viewpoint altezza    */

        min-width: 89vw;
        width:  89vw;           /* % viewpoint larghezza  */

        top: 15%;
    }

    .areaVideoContainerTitle {
        top: 10%;
    }

    .areaVideoContainerIconYouTube {
        top: 15%;
    }

    #areaMaps {
        border-radius: 5vh;
        min-width: 96vw;
        width:  96vw;           /* % viewpoint larghezza  */
        /* min-height: 31vh; */
        /*height: 31vh;           /* % viewpoint altezza    */
        min-height: 56vh;
        height: 56vh;           /* % viewpoint altezza    */
        top: 55%;
    }

    .areaMapsContainer {
        border-radius: 5vh;

        min-height: 70vh;
        height: 70vh;           /* % viewpoint altezza    */

        min-width: 89vw;
        width:  89vw;           /* % viewpoint larghezza  */

        margin-top: 20px;
    }

    .areaMapsContainerTest {
        border-radius: 5vh;

        min-width: 89vw;
        width:  89vw;           /* % viewpoint larghezza  */

        min-height: 70vh;
        height: 70vh;           /* % viewpoint altezza    */

        margin-top: 20px;
    }

    .areaMapsFullContainer {
        border-radius: 5vh;

        min-width: 89vw;
        width:  89vw;           /* % viewpoint larghezza  */

        min-height: 72vh;
        height: 72vh;           /* % viewpoint altezza    */
        margin-top: 0px;
    }

    .areaPOI {
        min-width: 45vw;
        width:  45vw;
        margin-right: 3px;
    }

    .areaPOIbox {
        /*min-height: 30vh; */
        height:  30vh;
    }

    .areaPOI2 {
        min-width: 46vw;
        /*width:  46vw; */
    }

    /*.areaPOI2box {
        min-width: 50vw;
        width:  50vw;
    } */

    .playerYouTubeIconClose {
        /* icona per chiusura YouTube (IOS) */
        position: absolute;
        top: 30px;
        left: 80%;
        z-index: 1000;
    }

    #logoBussetoClick {
        /*width: 90%; */
        /*height: auto; */
        height: 45px;
    }

    #logoBussetoClick01 {
        height: 45px;
    }

    #logoBussetoClick02 {
        height: 45px;
    }


    #iconMenuOpen {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 45px;
        height: 45px;
    }

    #iconMenuClose {
        /* width: auto; */
        /*width: 25px; */
        /* height: auto; */
        width: 45px;
        height: 45px;
    }

    #iconReturn {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 45px;
        height: 45px;
    }

    #iconClose {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 45px;
        height: 45px;
    }

    #iconTop {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 45px;
        height: 45px;
    }

    #youTubeIcons {
        width: 25%;
        height: auto;
    }

    .imgLogo {
        width: 120vw;
    }

    img {
        max-width: none;
    }

    .imgGallery01 {
        /*height: 30vh; */
        height: auto;
        width:  65vw;
    }

    .imgGallery02 {
        height: 30vh;
        width: auto;
    }

    .gallery-itemPortrait img {
        height: 30vh;          /* altezza fissa di esempio */
        width: auto;
    }

    .imgFoot01 {
        width: 40%;
    }

    .locandinaContainer {
        top: 10%;
        min-width: 94vw;
        max-width: 94vw;
    }

    .genericTextContainer {
        top: 10%;
        width: 90%;
    }

    .footer {
        bottom: 5%;
        display: block;
    }

    .videoYouTube {
        height: auto;
    }

    .column-3 {
        margin-right: 5%;
    }

}

@media (orientation: landscape) {
    body {
        height: 100%;
        width: 100%;
        font-size: 1rem;
    }

    #areaVideo {
        border-radius: 20vh;
    }

    .areaVideoContainer {
        border-radius: 20vh;
    }

    .areaVideoContainerTest {
        border-radius: 20vh;
    }


    #areaMaps {
        border-radius: 20vh;
    }

    .areaMapsContainer {
        border-radius: 20vh;
    }

    .areaMapsContainerTest {
        border-radius: 20vh;
    }

    .areaMapsFullContainer {
        border-radius: 20vh;
    }

    .header {
        min-width: 100vw;
        min-height: 10vh;
    }

    .footer {
        display: none;
    }

}

@media (max-width: 479px) and (orientation: landscape) {
    body {
        font-size: 1.1rem;
        height: 100vh;
        /* width: 460px; */
    }

    #avviso-orientamento {
        display: block;
    }

    .header {
        min-width: 100vw;
        min-height: 20vh;
    }

    .areaPOI {
        min-height: 55vh;
        height:  55vh;
    }

    .areaPOIbox {
        /* min-height: 50vh; */
        height:  50vh;
    }

    .areaPOI2 {
        min-height:  70vh;
        height:      70vh;
    }

    .areaPOI2box {
        min-height: 60vh;
        height:  60vh;
    }

    .areaVideoContainerTitle {
        top: 15%;
    }

    .areaVideoContainerIconYouTube {
        top: 17%;
    }

    #logoBussetoClick {
        /*width: 90%; */
        /*height: auto; */
        height: 50px;
    }

    #logoBussetoClick01 {
        height: 50px;
    }

    #logoBussetoClick02 {
        height: 50px;
    }

    #iconMenuOpen {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 50px;
        height: 50px;
    }

    #iconMenuClose {
        /* width: auto; */
        /*width: 25px; */
        /* height: auto; */
        width: 50px;
        height: 50px;
    }

    #iconReturn {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 50px;
        height: 50px;
    }

    #iconClose {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 50px;
        height: 50px;
    }

    #iconTop {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 50px;
        height: 50px;
    }


}

@media (max-width: 479px) and (orientation: portrait) {
    body {
        font-size: 1.2rem;
        /* height: 460px; */
        width: 100%;
    }

    h1 {
        font-size: 2.3rem;
    }

    h2 {
        font-size: 2rem;
    }

    h3 {
        font-size: 1.7rem;
        font-style: italic;
    }

    h4 {
        font-size: 1.5rem;
    }

    h5 {
        font-size: 1.2rem;
        font-style: italic;
    }

    h6 {
        font-size: 1.1rem;
    }

    .bottonHelp {
        font-size: xx-small;
    }

}

/*@media (min-width: 480px) and (max-width: 767px) and (orientation: landscape) { */

@media (min-width: 480px) and (max-width: 800px) and (orientation: landscape) {
    body {
        font-size: 1.1rem;
        height: 100vh;
        /* width: 640px; */
    }

    .header {
        min-width: 100vw;
        min-height: 20vh;
    }

    .areaPOI {
        min-height: 60vh;
        height:  60vh;
    }

    .areaPOIbox {
        /* min-height: 55vh; */
        height:  55vh;
    }

    .areaPOI2 {
        min-height:  80vh;
        height:  80vh;
    }

    .areaPOI2box {
        min-height: 70vh;
        height:  70vh;
    }

    .areaVideoContainerTitle {
        top: 15%;
    }

    .areaVideoContainerIconYouTube {
        top: 20%;
    }

    #logoBussetoClick {
        /*width: 90%; */
        /*height: auto; */
        height: 50px;
    }

    #logoBussetoClick01 {
        height: 50px;
    }

    #logoBussetoClick02 {
        height: 50px;
    }

    #iconMenuOpen {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 50px;
        height: 50px;
    }

    #iconMenuClose {
        /* width: auto; */
        /*width: 25px; */
        /* height: auto; */
        width: 50px;
        height: 50px;
    }

    #iconReturn {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 50px;
        height: 50px;
    }

    #iconClose {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 50px;
        height: 50px;
    }

    #iconTop {
        /*width: 25px; */
        /* height: auto; */
        /* width: auto; */
        width: 50px;
        height: 50px;
    }
}

/*@media (min-width: 480px) and (max-width: 767px) and (orientation: portrait) { */
@media (min-width: 480px) and (max-width: 800px) and (orientation: portrait) {
    body {
        font-size: 1.2rem;
        /* height: 640px; */
        width: 100%;
    }

    h1 {
        font-size: 2.2rem;
    }

    h2 {
        font-size: 2rem;
    }

    h3 {
        font-size: 1.8rem;
        font-style: italic;
    }

    h4 {
        font-size: 1.6rem;
    }

    h5 {
        font-size: 1.2rem;
        font-style: italic;
    }

    h6 {
        font-size: 1.1rem;
    }

}

@media (prefers-color-scheme: dark) {
    body {
        font-palette: dark;
        background-color: black;
        color: #93d5f6;
    }

    a {
        color: #93d5f6;
    }

    nav li:hover {
        background-color: #265aa6;
    }

    nav ul li:hover > ul {
        background-color: #265aa6;
    }


    th, td {
        border: 1px solid #323539;
    }

    th {
        background-color: #2b2f32;
    }

    tr:nth-child(even) {
        background-color: #000000;
    }

    /*
    tr:hover {
        background-color: #4d5154;
    } */

    .tr_title1 {
        background-color: #4d5154;
    }

    details > summary {
        background-color: #000000;
        /*box-shadow: 1px 1px 2px #323539; */
        box-shadow: none;
    }

    details > p {
        background-color: #000000;
        /* box-shadow: 1px 1px 2px #323539; */
        box-shadow: none;
    }

    .svgIcons {
        fill: #93d5f6;
    }

    .colorSchemaFonts {
        color: #93d5f6;
    }

    . colorDarkSchemaFonts {
        color: #265aa6;
    }

    #areaVideo {
        border-color: #93d5f6;
    }

    .areaVideoContainer {
        border-color: #93d5f6;
    }

    .areaVideoContainerTest {
        border-color: #93d5f6;
    }

    #areaMaps {
        border-color: #93d5f6;
    }

    .areaMapsContainer {
        border-color: #93d5f6;
    }

    .areaMapsContainerTest {
        border-color: #93d5f6;
    }

    .areaMapsFullContainer {
        border-color: #93d5f6;
    }


    .areaPOIbox {
        border-color: #93d5f6;
    }

    .header {
        background-color: black;
    }

    .menu {
        background-color: black;
    }


    .foot {
        border-color: #93d5f6;
    }

    .locandinaContainer {
        /*border-color: #265aa6; */
        border-color: #93d5f6;
    }

    .genericTextContainer {
        border-color: #93d5f6;
    }

    .genericText {
        color: #93d5f6;
    }

    .videoYouTube {
        border-color: #93d5f6;
    }

    #areaConsensoCookies {

        border-color: #265aa6;

        color: black;
        background-color: white;
    }
}

@media (max-width: 1600px) and (orientation: landscape)  {
    .imgFoot01 {
        width: 15%;
    }
}