.card-background {
    position: relative;
}

    .card-background:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 60%; /* Adjust width of shadow */
        height: 100%;
        background: linear-gradient(to right, rgba(0, 0, 0, 0.6), transparent);
        pointer-events: none;
    }

.main-content {
    background: url('/en-za/eeipv3/images/bg.jpg') no-repeat left top;
    background-size: 100% 100%;
}

.c-placement {
    border-radius: 24px;
}

    .c-placement picture img {
        padding: 10px;
        border-radius: 24px;
        background: #fff;
    }

    .c-placement .card-body {
        padding: 16px;
    }

.cp-difference .card-body span {
    color: #0078D4;
    font-weight: 700;
    font-size: 36px;
}

.btn-black {
    background: #0E1726
}

.initiative-position {
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    padding: 12px !important;
}

    .initiative-position .card-body {
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 100%;
        width: 100%;
    }

        .initiative-position .card-body .link-group {
            bottom: 0;
            position: absolute;
            left: 0;
        }

@media (min-width: 1084px) {
    .containerCOE {
        width: 90%;
    }
}

@media(max-width:1084px) {
    .text-white {
        color: #000 !important;
        margin-top: 16px;
    }
}

.special-card {
    padding: 12px;
    background: white;
    border-radius: 12px;
}

.btn-blue {
    background: #0078D4
}

.material-surface-custom {
    background: #fff;
    border-radius: 24px;
}

.special-glyph-btn::before {
    left: -0.625em;
    right: inherit !important;
    background: #091F2C;
    color: #fff;
    padding: 4px;
    border-radius: 4px;
    margin-top: -10px !important;
    margin-left: -10px;
    transform: translate(-.25em, 0);
}

.special-card2 {
    padding: 12px;
    border-radius: 12px;
}

.collapse {
    border-left: 4px solid #000;
    padding-left: 15px;
    margin-bottom: 15px;
    margin-top: 15px;
}

.btn-orange {
    background: #ce492c;
}

.section-bg {
    background: url('/en-za/eeipv3/images/bg2.jpg') repeat left top;
    background-size: 100% 100%;
}
.special-container {
    background: linear-gradient(180deg, #FFF3F0 15.02%, #FFFFFF 52.58%) repeat left top;
    background-size: 100% 100%;
}



.btn-green {
    background: rgba(34, 91, 98, 1);
}
.btn-green2 {
    background: rgba(7, 100, 29, 1);
}
.btn-purple {
    background: rgba(112, 37, 116, 1);
}
.special-container-township {
    background: linear-gradient(180deg, #E9EFEF 15.02%, #FFFFFF 52.58%) repeat left top;
    background-size: 100% 100%;
}


.cp-bg {
    padding: 4px;
}
    .cp-bg img {
        background: rgba(225, 209, 225, 1) !important;
    }

.special-container-research {
    background: linear-gradient(180deg, rgba(225, 209, 225, 1) 15.02%, #FFFFFF 52.58%) repeat left top;
    background-size: 100% 100%;
    background-repeat:repeat;
}

.cp2-bg {
    padding: 4px;
}
    .cp2-bg img {
        background: rgba(255, 239, 235, 1) !important;
    }
.cp3-bg {
    padding: 4px;
}

    .cp3-bg img {
        background: rgba(233, 239, 239, 1) !important;
    }

.special-container-smme {
    background: linear-gradient(180deg, rgba(233, 239, 239, 1) 15.02%, #FFFFFF 52.58%) repeat left top;
    background-size: 100% 100%;
    background-repeat: repeat;
}

.icon-img{
    width:24px !important;
    height:24px !important;
}
.carouselbody{
    padding:24px !important;
}

.c-placement2 {
    border-radius: 24px;
}

    .c-placement2 picture img {
        margin-left: 18px;
        margin-top: 18px;
    }

    .c-placement2 .card-body {
        padding: 16px;
    }

.cp4-bg {
    padding: 4px !important;
}

    .cp4-bg img {
        background: rgba(230, 239, 232, 1)     !important;
    }

.special-container-township {
    background: linear-gradient(180deg, rgba(230, 239, 232, 1) 15.02%, #FFFFFF 52.58%) repeat left top;
    background-size: 100% 100%;
    background-repeat: repeat;
}

.cp5-bg {
    padding: 4px !important;
}

    .cp5-bg img {
        background: rgba(236, 235, 240, 1)        !important;
    }

.special-container-skills {
    background: linear-gradient(180deg, rgba(236, 235, 240, 1) 15.02%, #FFFFFF 52.58%) repeat left top;
    background-size: 100% 100%;
    background-repeat: repeat;
}
.special-container-supplier {
    background: linear-gradient(180deg, rgba(222,221,221,255) 15.02%, #FFFFFF 52.58%) repeat left top;
    background-size: 100% 100%;
    background-repeat: repeat;
}

.requirements-container{
    background-image: url('../images/bg3.jpg')
}

.carousel-control-next, .carousel-control-prev, .carousel-heading {
    color: #fff !important;
}