body {
}

.studentPrimarySchoolDivCard {
    display: flex;
    height: 50px;
    justify-content: end;
    background-image: linear-gradient(to right, white 25%, #D0A650);
}

.studentSchoolDivCard {
    display: flex;
    height: 50px;
    justify-content: end;
    background-image: linear-gradient(to right, white 25%, #53A0E6);
}

.staffSchoolDivCard {
    display: flex;
    height: 50px;
    justify-content: end;
    background-image: linear-gradient(to right, white 25%, #CE2C32);
}

.top-card h5 {
    font-size: 20px;
    font-weight: 600;
    margin: 0px;
}

.top-card p {
    margin-top: -5px;
    font-size: 12px;
    font-weight: 600;
}

.firstDivCard {
    width: 60%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .firstDivCard h5 {
        font-size: 18px;
        font-weight: 600;
    }

    .firstDivCard h5 {
        font-size: 18px;
        font-weight: 600;
    }


.secondDivCard {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.firstLayer {
    margin-top: -81px;
    width: 189px;
    height: 189px;
    background-image: linear-gradient(0deg, #D0A650, #ffffff00 50%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.studentsFirstLayer {
    margin-top: -81px;
    width: 189px;
    height: 189px;
    background-image: linear-gradient(0deg, #53A0E6, #ffffff00 50%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.staffFirstLayer {
    margin-top: -81px;
    width: 189px;
    height: 189px;
    background-image: linear-gradient(0deg, #CE2C32, #ffffff00 50%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}


.secondLayer {
    width: 169px;
    height: 169px;
    background-image: linear-gradient(179deg, #ffffff00 50%, white 50%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}


.thirdLayer {
    width: 159px;
    height: 159px;
    background-image: linear-gradient(0deg, #D0A650 31px, white 99%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.studentsThirdLayer {
    width: 159px;
    height: 159px;
    background-image: linear-gradient(0deg, #53A0E6 31px, white 99%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.staffThirdLayer {
    width: 159px;
    height: 159px;
    background-image: linear-gradient(0deg, #CE2C32 31px, white 99%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}


.forthLayer {
    width: 139px;
    height: 139px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .forthLayer img {
        width: 139px;
        height: 139px;
        border-radius: 50%;
        object-fit: contain;
    }

.cityLogo {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -75px;
    margin-right: 35px;
    box-shadow: rgb(100 100 111 / 20%) 0px 0px 10px 0px;
    padding: 5px;
    border: 3px solid #D0A650;
    background: white;
}

.studentCityLogo {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -75px;
    margin-right: 35px;
    box-shadow: rgb(100 100 111 / 20%) 0px 0px 10px 0px;
    padding: 5px;
    border: 3px solid #53A0E6;
    background: white;
}

.staffCityLogo {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -75px;
    margin-right: 35px;
    box-shadow: rgb(100 100 111 / 20%) 0px 0px 10px 0px;
    padding: 5px;
    border: 3px solid #CE2C32;
    background: white;
}


.cityLogo img {
    width: 82px;
    height: 82px;
    border-radius: 50%;
    object-fit: contain;
}

.studentCityLogo img {
    width: 82px;
    height: 82px;
    border-radius: 50%;
    object-fit: contain;
}

.staffCityLogo img {
    width: 82px;
    height: 82px;
    border-radius: 50%;
    object-fit: contain;
}


.data-card {
    width: 60%;
    margin-top: -10px;
}

    .data-card p {
        font-size: 9px;
        font-weight: 700;
    }

    .data-card h5 {
        font-size: 17px;
        font-weight: 600;
    }

.z-index-fifth {
    z-index: 5 !important;
}

.z-index-forth {
    z-index: 4 !important;
}

.z-index-third {
    z-index: 3 !important;
}

.z-index-second {
    z-index: 2 !important;
}

.z-index-firt {
    z-index: 1 !important;
}

.z-index-firt {
    z-index: 0 !important;
}