@font-face {
    font-family: 'SF_Pro_Display_Bold';
    src: url(../assets/fonts/SFPRODISPLAYBOLD.OTF);
}

@font-face {
    font-family: 'SF_Pro_Display_Medium';
    src: url(../assets/fonts/SFPRODISPLAYMEDIUM.OTF);
}

.log_into_txt{
    color: #212529;
    font-size: 32px;
}

.welcome_txt{
    color: #6C757D;
    font-size: 16px;
}

.login_card{
    width: 450px;
    border: none;
    background-color: white;
    border-radius: 10px;
}

.login_button{
    width: 100%;

}
.login_page{
    background-color: #F8F9FA;
}
.remember_forgot{
    width: 100%;
}

.forgot_password_txt{
    margin-left: 90px;
}


.current_date{
    color: #000000;
    font-family: SF_Pro_Display_Bold;
    font-size: 30px;
    position: relative;
    margin-left: 20px;
}

.user_name{
    color: #ffffff;
    font-family: SF_Pro_Display_Medium;
    font-size: 15px;
}

.user_privilege{
    color: #efefef;
    font-family: SF_Pro_Display_Medium;
    font-size: 13px;
}

.user_sign_out {
    font-family: SF_Pro_Display_Medium;
    font-size: 12px;
    cursor: grab;
    
}

.big_button{
    background-color: #008bc1;
    border-radius: 10px;
    width: 16rem;
    height: 8rem;
}

.big_button_lower{
    background-color: #008bc1;
    border-radius: 10px;
    width: 16rem;
    height: 6rem;
    line-height: 1.2;
}

.big_button_big{
    background-color: #000000;
    border-radius: 10px;
    width: 16rem;
    height: 12.8rem;
    line-height: normal;
}
.figure_text_big{
    font-family: SF_Pro_Display_Bold;
    font-size: 150px;
}

.big_button:hover{
    background-color: #015f84;
}

.page_heading{
    font-family: SF_Pro_Display_Bold;
    font-size: 35px;
    color: #000000;
}

.big_button_text{
    font-family: SF_Pro_Display_Bold;
    font-size: large;
}

.big_button_text_lower{
    font-family: SF_Pro_Display_Bold;
    font-size: large;
    line-height: normal;
}

.figure_text{
    font-family: SF_Pro_Display_Bold;
    font-size: 60px;
}

.figure_text_lower{
    font-family: SF_Pro_Display_Bold;
    font-size: 50px;
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transform: rotate(360deg) !important;
}

.accordion-button:not(.collapsed) {
    color: #000000;
    background-color: #ffffff;
}

.accordion-button:is(.collapsed) {
    color: #000000;
    background-color: #ffffff;
}



.list-group .list-group-item:hover {
    background-color: #f5f5f5;
}

.list-group .list-group-item:active {
    background-color: #afafaf;
}


#comorosRect:hover{
    cursor: grab;

}

#mauritiusRect:hover{
    cursor: grab;

}

#seychellesRect:hover{
    cursor:grab;
}

#capeVerdeRect:hover{
    cursor:grab;
}

#saoTomeRect:hover{
    cursor:grab;
}

#gambiaRect:hover{
    cursor:grab;
}

#gambia:hover{
    cursor:grab;
}

.recentEvents{
    overflow-y: scroll;
    height: 80vh;
}

.popover-body {
    max-height: 450px;
    overflow-y: auto;
}