main {
    margin-top: 8rem !important;
}

.ytplayer {
    pointer-events: none;
    /* position: absolute; */
    width: 660px;
    height: 358px;
}

.swiper-slide-youtube {
    width: 660px !important;
    height: 340px !important;
}

img.img-landscape {
    width: 660px;
    height: 358px;
}

/*
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {
}

/*
##Device = Laptops, Desktops
##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {
    .ytplayer {
        pointer-events: none;
        /* position: absolute; */
        width: 292px;
        height: 237px;
    }

    .swiper-slide-youtube {
        width: 292px !important;
        height: 237px !important;
    }

    img.img-landscape {
        width: 292px !important;
        height: 237px !important;
    }
}

/*
##Device = Tablets, Ipads (portrait)
##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
    .ytplayer {
        pointer-events: none;
        /* position: absolute; */
        width: 292px;
        height: 237px;
    }

    .swiper-slide-youtube {
        width: 292px !important;
        height: 237px !important;
    }

    img.img-landscape {
        width: 292px !important;
        height: 237px !important;
    }
}

/*
##Device = Tablets, Ipads (landscape)
##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .ytplayer {
        pointer-events: none;
        /* position: absolute; */
        width: 292px;
        height: 237px;
    }

    .swiper-slide-youtube {
        width: 292px !important;
        height: 237px !important;
    }

    img.img-landscape {
        width: 292px !important;
        height: 237px !important;
    }
}

/*
##Device = Low Resolution Tablets, Mobiles (Landscape)
##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
    .ytplayer {
        pointer-events: none;
        /* position: absolute; */
        width: 292px;
        height: 194px;
    }

    .swiper-slide-youtube {
        width: 292px !important;
        height: 194px !important;
    }

    img.img-landscape {
        width: 292px !important;
        height: 194px !important;
    }
}

/*
##Device = Most of the Smartphones Mobiles (Portrait)
##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {
    .ytplayer {
        pointer-events: none;
        /* position: absolute; */
        width: 292px;
        height: 221px;
    }

    .swiper-slide-youtube {
        width: 292px !important;
        height: 221px !important;
    }

    img.img-landscape {
        width: 292px !important;
        height: 221px !important;
    }
}

@media (min-width: 390px) and (max-width: 413px) {
    .ytplayer {
        pointer-events: none;
        /* position: absolute; */
        width: 292px;
        height: 231px;
    }

    .swiper-slide-youtube {
        width: 292px !important;
        height: 231px !important;
    }

    img.img-landscape {
        width: 292px !important;
        height: 231px !important;
    }
}

@media (min-width: 414px) and (max-width: 429px) {
    .ytplayer {
        pointer-events: none;
        /* position: absolute; */
        width: 292px;
        height: 248px;
    }

    .swiper-slide-youtube {
        width: 292px !important;
        height: 248px !important;
    }

    img.img-landscape {
        width: 292px !important;
        height: 248px !important;
    }
}

@media (min-width: 430px) and (max-width: 450px) {
    .ytplayer {
        pointer-events: none;
        /* position: absolute; */
        width: 292px;
        height: 260px;
    }

    .swiper-slide-youtube {
        width: 292px !important;
        height: 260px !important;
    }

    img.img-landscape {
        width: 292px !important;
        height: 260px !important;
    }
}

/* Keep #BEINGZAP cards uniform height and full width */
.proud-content .swiper-slide {
    width: 320px !important;
    height: 320px !important;
    overflow: hidden;
}

.proud-content .swiper-slide.is-video-slide {
    width: 600px !important;
}

.proud-content .swiper-slide .vidioYoutube {
    width: 100% !important;
    height: 320px !important;
}

.proud-content .swiper-slide .yt-preview-fill {
    width: 100% !important;
}

@media (max-width: 599px) {
    .proud-content .swiper-slide,
    .proud-content .swiper-slide.is-video-slide {
        width: 100% !important;
        max-width: calc(100vw - 2rem) !important;
        height: 250px !important;
    }

    .proud-content .swiper-slide .vidioYoutube {
        height: 250px !important;
    }
}

.proud-content .swiper-slide > img,
.proud-content .swiper-slide > a,
.proud-content .swiper-slide > a > img,
.proud-content .swiper-slide > a > video {
    width: 100% !important;
    height: 100% !important;
    display: block;
}

.proud-content .swiper-slide > img,
.proud-content .swiper-slide > a > img,
.proud-content .swiper-slide > a > video {
    object-fit: cover;
    object-position: center;
}

.proud-content .swiper-slide .vidioYoutube .yt-preview-fill {
    transform: none;
    transform-origin: center;
}

.proud-content .swiper-slide .vidioYoutube .yt-preview-icon {
    width: 44px !important;
    height: 44px !important;
}

.proud-content .swiper-slide .proud-gallery-image {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    object-fit: cover;
    object-position: center;
    display: block;
}

.proud-content .swiper-slide .vidioYoutube:focus,
.proud-content .swiper-slide .vidioYoutube:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}
