#delivering-impact {
padding-top: 80px;
position: relative;
background-color: var(--greyBg);
overflow: hidden;
}

#delivering-impact #horizontal-scoll {
padding: 50px 0
}

#delivering-impact #horizontal-scoll .swiper-button-next:after,
#delivering-impact #horizontal-scoll .swiper-button-prev:after {
display: none
}

#delivering-impact #horizontal-scoll .swiper-button-next {
right: 50px
}

#delivering-impact #horizontal-scoll .swiper-button-prev {
left: inherit;
right: 115px;
}

#delivering-impact #horizontal-scoll .swiper-button-next,
#delivering-impact #horizontal-scoll .swiper-button-prev {
top: 200px;
}

#delivering-impact .horizontal-scoll-wrapper {
overflow: visible;
height: 630px;
margin-top: 50px;
}

#delivering-impact .horizontal {
display: flex;
height: 100%
}

#delivering-impact .horizontal>div {
display: flex;
flex-shrink: 0;
padding: 0 30px
}

#delivering-impact .swiper-slide {
margin-right: 50px
}

/* #delivering-impact .swiper-slide:nth-child(1) {
margin-left: 100px
} */

#delivering-impact .horizontal .card {
align-items: stretch;
width: 1200px !important;
padding: 0px 0px;
border-radius: 20px;
color: #f6f2e8;
overflow: hidden;
position: relative
}

#delivering-impact .horizontal .card .card-content {
backdrop-filter: blur(15px);
background: rgba(255, 255, 255, .1);
position: absolute;
left: 0px;
bottom: 0px;
width: 100%;
padding: 50px;
transition: .5s
}

#delivering-impact .horizontal .card .card-content h3 {
font-size: var(--fs-32);
width: 830px;
max-width: 100%;
}

#delivering-impact .horizontal .card .card-content .impactThumb {
position: absolute;
right: 50px;
top: -110px;
border: solid 3px #fff;
border-radius: 10px;
overflow: hidden;
width: 300px;
    height: 200px;
}

#delivering-impact .horizontal .card .card-content .impactThumb img {
display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#delivering-impact .horizontal .card .card-content .common-cta {
color: var(--White);
opacity: 0;
visibility: hidden;
transition: .5s
}

#delivering-impact .horizontal .card:hover .card-content {
padding: 90px 50px
}

#delivering-impact .horizontal .card:hover .card-content .common-cta {
opacity: 1;
visibility: visible;
margin-top: 20px
}

#delivering-impact .swiper-pagination-bullet {
background-color: var(--red)
}

@media only screen and (min-width: 1400px)and (max-width: 1599px) {
#delivering-impact .horizontal-scoll-wrapper {
        /* overflow: hidden; */
        height: 500px
    }

    #delivering-impact .horizontal .card .card-content h3 {
        font-size: var(--fs-22);
        width: 630px;
        
    }
    #delivering-impact .horizontal .card {width: 1000px !important;}

    .common_tile {
        font-size: 34px;
    }
    p {
        font-size: var(--fs-14);
        line-height: 24px;
    }
    #delivering-impact #horizontal-scoll .swiper-button-next,
#delivering-impact #horizontal-scoll .swiper-button-prev {
top: 180px;
}
}


@media only screen and (min-width: 1200px)and (max-width: 1399px) {
     .common_tile {
        font-size: 34px;
    }
    p {
        font-size: var(--fs-14);
        line-height: 24px;
    }

    #delivering-impact .horizontal-scoll-wrapper {
        height: 490px
    }

    #delivering-impact .horizontal .card .card-content h3 {
        font-size: var(--fs-18);
        width: 560px;
    }

    #delivering-impact .horizontal .card .card-content {
        padding: 30px
    }

    #delivering-impact .horizontal .card:hover .card-content {
        padding: 50px 30px
    }

    #delivering-impact .horizontal .card .card-content .impactThumb {
        width: 300px
    }

    #delivering-impact .horizontal .card .card-content .impactThumb img {
        width: 100%
    }
    #delivering-impact .swiper-button-next,
    #delivering-impact .swiper-button-prev {
        top: 63%
    }
    #delivering-impact .horizontal .card {width: 980px !important;}
#delivering-impact #horizontal-scoll .swiper-button-next, #delivering-impact #horizontal-scoll .swiper-button-prev {
    top: 170px;
}

}

@media only screen and (min-device-width: 768px)and (max-device-width: 1024px)and (orientation: landscape) {


    #delivering-impact {
        padding-top: 30px
    }

    #delivering-impact .common_tile {
        margin-bottom: 20px
    }

    #delivering-impact .horizontal-scoll-wrapper {
        height: 390px
    }

    #delivering-impact #horizontal-scoll {
        padding: 30px 10px
    }

    #delivering-impact .swiper-slide:nth-child(1) {
        margin-left: 0px
    }

    #delivering-impact .horizontal .card .card-content {
        padding: 30px 15px
    }

    #delivering-impact .horizontal .card .card-content .impactThumb {
        top: -50px;
        width: 140px
    }

    #delivering-impact .horizontal .card .card-content .impactThumb img {
        width: 100%
    }

    #delivering-impact .horizontal .card .card-content h3 {
        font-size: 25px;
        padding-right: 200px
    }

    #delivering-impact .horizontal .card .card-content h3 br {
        display: none
    }

    #delivering-impact .horizontal .card:hover .card-content {
        padding: 30px 50px
    }

    #delivering-impact .swiper-pagination-bullet {
        background-color: var(--White)
    }



    #delivering-impact #horizontal-scoll .swiper-button-next {
        right: 30px
    }

    #delivering-impact #horizontal-scoll .swiper-button-prev {
        left: 30px
    }
}


@media only screen and (min-device-width: 768px)and (max-device-width: 1024px)and (orientation: portrait) {

    #delivering-impact {
        padding-top: 30px
    }

    #delivering-impact .common_tile {
        margin-bottom: 20px
    }

    #delivering-impact .horizontal-scoll-wrapper {
        height: 350px
    }

    #delivering-impact #horizontal-scoll {
        padding: 30px 10px
    }

    #delivering-impact .swiper-slide:nth-child(1) {
        margin-left: 0px
    }

    #delivering-impact .horizontal .card .card-content {
        padding: 30px 15px
    }

    #delivering-impact .horizontal .card .card-content .impactThumb {
        top: -50px;
        width: 110px
    }

    #delivering-impact .horizontal .card .card-content .impactThumb img {
        width: 100%
    }

    #delivering-impact .horizontal .card .card-content h3 {
        font-size: 25px;
        padding-right: 200px
    }

    #delivering-impact .horizontal .card .card-content h3 br {
        display: none
    }

    #delivering-impact .horizontal .card:hover .card-content {
        padding: 30px 50px
    }

    #delivering-impact .swiper-pagination-bullet {
        background-color: var(--White)
    }

    #delivering-impact #horizontal-scoll .swiper-button-next,
    #delivering-impact #horizontal-scoll .swiper-button-prev {
        top: 67%
    }

}


@media(min-width: 320px)and (max-width: 767px) {

    #delivering-impact {
        padding-top: 30px
    }

    #delivering-impact .common_tile {
        margin-bottom: 20px
    }

    #News_Insights .swiper-pagination {
        position: relative
    }

    #News_Insights .mt-5 {
        margin-top: 2rem !important
    }

    #delivering-impact #horizontal-scoll {
        padding: 30px 0px
    }

    #delivering-impact .impactimg img {
        height: 300px
    }

    #delivering-impact .swiper-slide:nth-child(1) {
        margin-left: 0px
    }

    #delivering-impact .horizontal .card .card-content {
        position: relative;
        padding: 20px;
        backdrop-filter: blur(0px);
        transform: translate(0px, 0px);
        background-color: rgba(0, 0, 0, 0)
    }

    #delivering-impact .horizontal .card .card-content h3 {
        font-size: var(--fs-22);
        color: var(--black);
        margin-top: 20px
    }

    #delivering-impact .horizontal .card .card-content .impactThumb {
        position: relative;
        right: 0px;
        top: 0px;
        display: none;
    }

    #delivering-impact .horizontal .card .card-content .impactThumb img {
        width: 170px
    }

    #delivering-impact .horizontal .card .card-content .common-cta {
        color: var(--black);
        opacity: 1;
        visibility: visible;
        margin-top: 13px
    }

    #delivering-impact .horizontal .card:hover .card-content {
        padding: 0px 15px
    }
    
    #delivering-impact #horizontal-scoll .swiper-button-next,
    #delivering-impact #horizontal-scoll .swiper-button-prev {
        top: 56%
    }

    #delivering-impact #horizontal-scoll .swiper-button-next {
        right: 40px
    }

    #delivering-impact #horizontal-scoll .swiper-button-prev {
        left: 40px
    }

    .common-cta {font-size: 16px;}
    .common-cta .arrow {transform: translate(0px, 6px);}
}