.slide {
    min-height: 29.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

/* For desktop screens with width 1920px and above */
@media (min-width: 1920px) {
    /* Your styles for large desktop screens */
    .slide1 {
        background: url(../img/leadersbanner/nm/pm_1920_600.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide2 {
        background: url(../img/leadersbanner/dm/dm_1920_600.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide3 {
        background: url(../img/leadersbanner/dp/dp_1920_600.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide4 {
        background: url(../img/leadersbanner/jc/jc_1920_600.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }
}

/* For desktops with width between 1366px and 1920px */
@media (min-width: 1366px) and (max-width: 1919px) {
    /* Your styles for standard desktop screens */
   
    .slide1 {
        background: url(../img/leadersbanner/nm/pm_1366_480.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide2 {
        background: url(../img/leadersbanner/dm/dm_1366_480.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide3 {
        background: url(../img/leadersbanner/dp/dp_1366_480.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide4 {
        background: url(../img/leadersbanner/jc/jc_1366_480.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }


}

/* For tablets in landscape mode (min-width: 1024px) */
@media (min-width: 1024px) and (max-width: 1365px) {
    /* Your styles for tablets */
    .slide1 {
        background: url(../img/leadersbanner/nm/pm_1200_400.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide2 {
        background: url(../img/leadersbanner/dm/dm_1200_400.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide3 {
        background: url(../img/leadersbanner/dp/dp_1200_400.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide4 {
        background: url(../img/leadersbanner/jc/jc_1200_400.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }
}



/* For mobile devices (portrait mode) */
@media (min-width:481px) and (max-width: 768px) {
    /* Your styles for mobile devices */
    .slide1 {
        background: url(../img/leadersbanner/nm/pm_640_360.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide2 {
        background: url(../img/leadersbanner/dm/dm_600_480.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide3 {
        background: url(../img/leadersbanner/dp/dp_640_360.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide4 {
        background: url(../img/leadersbanner/jc/jc_640_360.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }
}


/* For mobile devices (portrait mode) */
@media (max-width: 480px) {
    /* Your styles for mobile devices */
    .slide1 {
        background: url(../img/leadersbanner/nm/pm_480_360.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide2 {
        background: url(../img/leadersbanner/dm/dm_480_360.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide3 {
        background: url(../img/leadersbanner/dp/dp_480_360.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .slide4 {
        background: url(../img/leadersbanner/jc/jc_480_360.png);
        content: attr(href);
        background-size: contain;
        background-repeat: no-repeat;
    }
}