:root{
    --bck: #f16823;
   --light-bck: #f16823;
   /* --Sup-light-bck: #55ff00; */
   /* --light-background: red; */
   --greys: #e3e3e3;
   --grays: #fefeff;
   --shadow-large: 0px 4px 40px #33333359;
   --shadow-small: 0px 4px 6px #33333359;
   --dark-bakground: #013f09;
   --reds: red;
   --light-background: #f16823;
   --light-background2: aquamarine;
   --shadow-large: 0px 4px 40px #33333359;
   --shadow-small: 0px 4px 6px #33333359;
}

a{
    text-decoration: none;
}



.programs-hero{
    width: 100%;
    height: 400px;
    background-image: url(Transfer/Programes\ \(1\).jpg);
    background-position: center;
    background-size: cover;
}

.causez{
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 80px;
}

/* impactsection styles */

.collective-impact{
    background: #f7f7f7;
}

.impact-top{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 60px;
}

.impact-top h1{
    text-transform: capitalize;
    border-bottom: 2px solid rgb(74, 189, 74);
}

.impact-details{
    width: 100%;
    display: flex;
}

.mpt-map .img{
    width: 80%;
}

/* .impacts */
.impacts{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.impacts-top, .impacts-mid{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.imp-1{
    display: flex;
    flex-direction: column;
    grid-area: 20px;
    background: white;
    padding: 12px 24px;
    border-radius: 12px;
    box-shadow: 0px 4px 12px #33333325;
}

.impt-number {
    font-size: 1.7rem;
    font-weight: 500;
    text-align: center;
}

.impact-foot {
    width: 400px;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #ff5e00;
    padding: 12px 14px;
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-radius: 12px;
    box-shadow: 0px 4px 120px #ff5e0081;
}

.impact-foot a{
    color: #013f09;
    background: #fff;
    padding: 8px 16px;
    border-radius: 24px;
}

.impact-foot h1{
    text-align: center;
}