

/*@media (min-width: 1247px) and (max-width: 1366px) {
    .grid-wrapper .big {
        grid-column: span 4;
        grid-row: span 2;
    }

}



@media (min-width: 1367px) and (max-width: 1600px) {
    .grid-wrapper .big {
        grid-column: span 5;
        grid-row: span 2;
    }

}

@media (min-width: 1601px) {
    .grid-wrapper .big {
        grid-column: span 6;
        grid-row: span 2;
    }

}*/



@media (min-width: 1921px) {
    .page-container {
        max-width: 100%;
    }

    /* Getione pop-up*/

    /* caso mini */
    .popup.popup-mini .popup-inner {
        max-width: calc(1700px * 0.75); /* 90% della "pagina" */
    }

    /* caso immagini */
    /* horizontal */
    .portrait-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((1700px * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((1700px * 0.8) - 2em);
        max-height: calc(75vh - 2em);
    }
    /* vertical */
    .portrait-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((1700px * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((1700px * 0.5) - 2em); /* aggiunta divisione per 16:9 problemi di proporzioni */
        max-height: calc(75vh - 2em);
        /* nota: sarebbe da * per form factor */
    }

    /*.popup.popup-image .popup-inner-content .horizontal {
        max-width: calc(1700px * 0.8);
    }
    .popup.popup-image .popup-inner-content .vertical {
        max-width: calc(1700px * 0.5);
    }*/

    .page-disclamer.horizontal {display: none;}
    .p-disclamer {display: none!important;}
}


@media (min-width: 1423px) and (max-width: 1598px) {
    .grid-wrapper .big {
        grid-column: span 5;
    }

}

@media (min-width: 1599px) and (max-width: 1920px) {
    .grid-wrapper .big {
        grid-column: span 6;
    }

    .grid-wrapper .wide {
        grid-column: span 3;
    }
}


@media (min-width: 1366px) and (max-width: 1920px) {
    .page-container {
        max-width: 100%;
    }

    /* Getione pop-up*/

    /* caso mini */
    .popup.popup-mini .popup-inner {
        max-width: calc(1200px * 0.75); /* 90% della "pagina" */
    }

    /* caso immagini */
    /* horizontal */
    .portrait-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((1200px * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((1200px * 0.8) - 2em);
        max-height: calc(75vh - 2em);
    }
    /* vertical */
    .portrait-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((1200px * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((1200px * 0.5) - 2em); /* aggiunta divisione per 16:9 problemi di proporzioni */
        max-height: calc(75vh - 2em);
    }

    /*.popup.popup-image .popup-inner-content .horizontal {
        max-width: calc(1200px * 0.8);
    }
    .popup.popup-image .popup-inner-content .vertical {
        max-width: calc(1200px * 0.5);
    }*/

    .page-disclamer.horizontal {display: none;}
    .p-disclamer {display: none!important;}


}


@media (min-width: 1024px) and (max-width: 1365px) {

    .page-container {
        max-width: 100%;
    }

    /* Getione pop-up*/

    /* caso mini */
    .popup.popup-mini .popup-inner {
        max-width: calc(960px * 0.75); /* 90% della "pagina" */
    }

    /* caso immagini */
    /* horizontal */
    .portrait-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((960px * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((960px * 0.8) - 2em);
        max-height: calc(75vh - 2em);
    }
    /* vertical */
    .portrait-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((960px * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((960px * 0.5) - 2em); /* aggiunta divisione per 16:9 problemi di proporzioni */
        max-height: calc(75vh - 2em);
    }


    /*.portrait-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc(960px * 0.8);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .horizontal {
        max-height: calc(100vh * 0.8);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .vertical {
        !*max-width: calc(960px * 0.5);*!
        max-width: calc((960px * 0.5) / 1.3);
    }
    .portrait-mode .popup.popup-image .popup-inner-content .vertical {
        !*max-height: calc(100vh * 0.5);*!
        max-height: calc((100vh * 0.5) / 1.3);
    }*/

    .page-disclamer.horizontal {display: none;}

    .p-disclamer {display: none!important;}
}




@media (min-width: 769px) and (max-width: 1023px) {
    .page-container {
        max-width: 100%;
    }

    /* Getione pop-up*/

    /* caso mini */
    .popup.popup-mini .popup-inner {
        max-width: 75%; /* 90% della "pagina" */
    }

    /* caso immagini */
    /* horizontal */
    .portrait-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((100vw * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((100vw * 0.8) - 2em);
        max-height: calc(75vh - 2em);
    }
    /* vertical */
    .portrait-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((100vw * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((100vw * 0.5) - 2em); /* aggiunta divisione per 16:9 problemi di proporzioni */
        max-height: calc(75vh - 2em);
    }

    /*.portrait-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc(100vw * 0.8);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .horizontal {
        max-height: calc(100vh * 0.8);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc(100vw * 0.5);
    }
    .portrait-mode .popup.popup-image .popup-inner-content .vertical {
        max-height: calc(100vh * 0.5);
    }*/

    .page-disclamer.vertical { display: none}

}

@media (max-width: 768px) {
    .grid-wrapper .small.last {
        grid-row: span 2;
        grid-column: span 3;
    }
    .page-container {
        max-width: 100%;
    }

    /* Getione pop-up*/

    /* caso mini */
    .popup.popup-mini .popup-inner {
        max-width: 75%; /* 90% della "pagina" */
    }

    /* caso immagini */
    /* horizontal */
    .portrait-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((100vw * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc((100vw * 0.8) - 2em);
        max-height: calc(75vh - 2em);
    }
    /* vertical */
    .portrait-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((100vw * 0.75) - 2em);
        max-height: calc(80vh - 2em);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc((100vw * 0.5) - 2em); /* aggiunta divisione per 16:9 problemi di proporzioni */
        max-height: calc(75vh - 2em);
    }


    /*.portrait-mode .popup.popup-image .popup-inner-content .horizontal {
        max-width: calc(100vw * 0.75);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .horizontal {
        max-height: calc(100vh * 0.75);
    }
    .landscape-mode .popup.popup-image .popup-inner-content .vertical {
        max-width: calc(100vw * 0.75);
    }
    .portrait-mode .popup.popup-image .popup-inner-content .vertical {
        max-height: calc(100vh * 0.75);
    }*/

    body {
        font-size: 11px;
    }

    video + p {
        top: 30%;
    }
    .page-disclamer.vertical { display: none;}
    .page-disclamer.horizontal { display: block; }

    .pd-bm-25-mobile {
        padding-bottom: 25px;
    }


    .element-border-test {
        background-size: 35%;
        background-position: 50% 30%;
    }

    .left-10 {
        left: 0;
        right: 0;
        margin: auto;
    }

    .w-35-mobile {
        width: 35%!important;
    }


    .w-60 {width: 45%;}

    .no-mobile-mr-b {
        margin-bottom: 0!important;;
    }

    .no-mobile-pd-b {
        padding-bottom: 0!important;
    }

    .no-mobile-pd-top {
        padding-top: 0!important;
    }

    .pd-r10-mobile {
        padding-right: 10px!important;
    }
    .pd-l10-mobile {
        padding-left: 10px!important;
    }

    .no-pd-left-mobile {
        padding-left: 0px!important;
    }

    .no-pd-right-mobile {
        padding-right: 0px!important;
    }

    .no-padding-mobile {
        padding: 0!important;
    }
    .no-margin-mobile {
        margin: 0!important;
    }

    .x1.x0 {font-size: 0.7em!important;line-height:1.2em;}

    .x1.x02 {font-size: 0.8em!important;line-height:1.2em;}



    /* accessibilità  */

    /*.grid-wrapper {*/
    /*    display: inherit;*/
    /*}*/

    /*.grid-wrapper figure {*/
    /*    margin-bottom: 15px;*/
    /*    width: 100%;*/
    /*    display: block;*/
    /*}*/

    /*.box-container figure figcaption {*/
    /*    position: relative;*/
    /*}*/

}



@media (min-width: 577px) and (max-width: 767px) {

    .pd-h40 {padding-left: 25px; padding-right: 25px;}
    .mr-h50 {margin-left: 25px; margin-right: 25px;}
    .pd-l10-mob-tab { padding-left: 10px!important; }
    .pd-r10-mob-tab { padding-right: 10px!important;  }
    .no-pd-l10-mob-tab {padding-left: 0!important;}
    .no-pd-r10-mob-tab {padding-right: 0!important;}
    .no-pd-r-l-mob-tab {padding-left: 0!important; padding-right: 0!important;}
}

@media (max-width: 576px) {

    .connect .col-4 {
        width:100%;
    }

    .grid-wrapper {grid-auto-rows: 100px;}
    .box-container figure figcaption h2 {font-size: 1.7rem;}
    .grid-wrapper .big {grid-row: span 2; grid-column: span 2;}
    .grid-wrapper .small {grid-row: span 2!important;grid-column: span 2!important;;}
    .grid-wrapper .wide {grid-row: span 2;grid-column: span 2;}
    .title-skoda.h2 { font-size: 1.6rem;}
    .icon-service-1 { max-width: 48%; }
    .icon-service-2 { max-width: 55%; }
    .icon-service-3 { max-width: 70%; }
    .icon-service-4 { max-width: 55%; }
    .icon-service-5 { max-width: 80%; }
    .icon-service-6 { max-width: 80%; }
    .pb-bm-120 {padding-bottom: 120%;}
    .br-details {width: 55px;}
    .space-page-box { margin-top: 56px;}
    .slider-wrapper .slider {
        padding: 3rem 0;
    }
    .slider-wrapper .slider {
        height: 35rem;
    }

    .slider-wrapper .slide .slide-txt {
        top: 45%!important;
        left: 0%!important;
    }

    .slider-wrapper .slide-navigation__txt li {
        font-size: 1em;
    }

    .slider-wrapper .slide-navigation__squares {
        display: none;
    }

    .slider-wrapper .slides-container {
        width: 85%;
        padding-left: 10%;
    }
/*    .logo {
        left: 2rem;
    }*/

   .search > div {
       width: 100%!important;
   }

    .arrow-back {
        left: 5px;
        top: 2px;
    }
    .popup-inner{
        height: auto!important;
        padding: 2rem;
    }

    .popup-inner-content {
        /*height: calc(100% - 25px);*/
        /*max-height: calc(90vh - 25px);*/
        /*padding-bottom: 25px;*/
    }

    .no-pd-r-l-mobile {padding-left: 0!important; padding-right: 0!important;}
    .no-pd-top-mobile {padding-top: 0!important;}
    .no-pd-bottom-mobile {padding-bottom: 0!important;}
    .pd-h40 {padding-left: 20px; padding-right: 20px;}
    .mr-h50, .mr-h40 {margin-left: 10px; margin-right: 10px;}
    .mr-v25-mobile {margin-top: 25px; margin-bottom:25px;}
    .pd-v10-mobile {padding-top: 10px;}
    .pd-v25-mobile {padding-top: 25px; padding-bottom: 25px;}
    .element-trasporto {padding-bottom: 50%;}

    .lasciati-tentare { float: none!important; margin: 0 auto;}
     video + p { top: 30%!important; }

     .pd-bm-100-mobile {padding-bottom: 100%!important;}

    .height-box-servizi {min-height: 320px; }

    .buy-online { max-width: 100%!important;   }

    .element-novita { width: 3em; height: 3em; margin-bottom:0.3em;}


    /*.popup.popup-mini .popup-inner {
        max-height: 60%;
        min-height: 90%;
        height: 100%;
    }*/

    .popup .slick-details .slick-dots {
        bottom: 10px;
        left: 0;
        background-color: white;
        position: fixed;
    }


    img.img-fluid.tronco-1 {transform: rotate(90deg);}
    img.img-fluid.tronco-2 {transform: rotate(90deg);}

    .section {
        padding-top:1em;
        padding-bottom:1em;
    }
}


@media (max-width: 480px) {
    .bg-bed h2 {
        font-size: 2rem;
    }

    .bg-bed h1 {
        bottom: auto;
        top:5%;
    }
        body {
            font-size: 16px;
        }

    .nav-p-container.nav-p-next .nav-p-title {
        padding-right: 5px;
        font-size: 12px;
    }

    .header-bar {
        line-height: 40px;
    }
    .header-bar .toggle-menu {
        top: 0;
    }

    .lista-popup {
        padding-left: 0px;
    }

    .search-icon {
        height: 56px;
        line-height: 64px;
    }

}


@media (min-width: 320px)  and (max-width: 360px) {

    .pd-bm-130 {
        padding-bottom: 130%;
    }
    .br-details {
        width: 40px;
    }

}
