:root {
    --carousel-row-height: 65vh;
    --vertical-view-card-size: 12vw;
}

:root {
    --carousel-new-height: 60vh;
}

.ar-3-4 {
    aspect-ratio: 3 / 4 !important;
    object-fit: cover;
}

.vertical_view img {
    aspect-ratio: 3 / 4 !important;
    /* height: 100%; commentato ed agginto witdh per folder verticali */
    width: 100%;
}

#filesContainerNEW .swiper-slide {
    height: fit-content;
}

.imgSwiperNetwork .box_image,
.search_element_folder img,
.search_element_video img {
    aspect-ratio: 3 / 4 !important;
    width: 100%;
}

#artistVideoContainer {
    grid-template-columns: repeat(5, calc(100% / 5));
}

#rowCategoriesSearch .vertical_view {
    width: auto !important;
}

div.imgSwiperNetworkVerticalView,
#firstSectionOverlay .mouseover_videoOverlaySection,
#rowVideosContainer {
    display: grid;
    grid-template-rows: auto;
    grid-auto-rows: auto;
    /* OLA 08/09/2023 - Posto a 6 slide per riga come da documento di requisiti [Paragrafo 2.34.1]*/
    grid-template-columns: repeat(6, calc(100% / 6));
}

.imgSwiperNetworkVerticalView {
    object-fit: cover;
}

.h4_index_video_element {
    overflow: hidden;
}

/*.imgSwiperNetworkVerticalView .vertical_view{*/
/*    width: 100% !important;*/
/*}*/

#RowVideoCase {
    grid-template-columns: repeat(6, calc(100% / 6));
}

/* #fileOverlayInfoTitle{
    max-width: 18vw;
} */

.imgSwiperNetworkVerticalView img {
    aspect-ratio: 3 / 4 !important;
    padding: 10px;
}

#rowCategoriesSearch {
    grid-template-columns: repeat(4, calc(100% / 4));
}

#rowVideoSearch {
    grid-template-columns: repeat(5, calc(100% / 5));
}

#rowCataloguesFoldersCointaner {
    grid-template-columns: repeat(5, calc(100% / 5));
}

@media screen and (max-width: 1440px) {
    :root {
        --carousel-row-height: 65vh;
        --vertical-view-card-size: 23vw;
    }
}

@media screen and (max-width: 991px) {
    :root {
        --carousel-row-height: 55vh;
        --vertical-view-card-size: 15vw;
    }

    #RowVideoCase,
    #firstSectionOverlay .mouseover_videoOverlaySection,
    #rowVideosContainer,
    div.imgSwiperNetworkVerticalView {
        grid-template-columns: repeat(3, calc(100% / 3));
    }

    #rowCataloguesFoldersCointaner {
        grid-template-columns: repeat(3, calc(100% / 3));
    }

    #rowCategoriesSearch {
        grid-template-columns: repeat(3, calc(100% / 3));
    }

    #rowVideoSearch {
        grid-template-columns: repeat(4, calc(100% / 4));
    }
}

@media screen and (max-width: 768px) and (orientation: landscape) {
    :root {
        --carousel-row-height: 80vh;
        --vertical-view-card-size: 20vw;
    }

}

@media screen and (max-width: 768px) and (orientation: portrait) {
    :root {
        --carousel-row-height: 48vh;
        --vertical-view-card-size: 35vw;
    }

    #RowVideoCase,
    #firstSectionOverlay .mouseover_videoOverlaySection,
    #rowVideosContainer,
    #rowCataloguesFoldersCointaner {
        grid-template-columns: repeat(2, calc(100% / 2));
    }

    div.imgSwiperNetworkVerticalView,
    #firstSectionOverlay .mouseover_videoOverlaySection,
    #rowVideosContainer {
        grid-template-columns: repeat(2, calc(100% / 2));
    }

    .vertical_view .h4_index_video_element {
        display: block;
        max-width: 45vw;
        overflow: hidden;
    }

    .vertical_view .carousel_video_image_bab {
        padding: 0;
    }

    #rowCategoriesSearch {
        grid-template-columns: repeat(2, calc(100% / 2));
    }

    #rowVideoSearch {
        grid-template-columns: repeat(3, calc(100% / 3));
    }
}