:root {
    --green: #0f7179;
    --green-active: #0a565d;
    --gold: #c59944;
    --gold-active: #a37b2c;
    --green-rgb: 15, 113, 121;
}

.btn-primary {
    color: #fff;
    background-color: var(--green);
    border-color: var(--green);
}

    .btn-primary:hover,
    .btn-primary:focus {
        color: #fff;
        background-color: var(--green-active);
        border-color: var(--green-active);
    }

.btn {
    display: inline-flex;
    padding: .5rem 1.5rem;
    border-radius: 50px;
    min-width: 130px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 5px;
    position: relative;
    /*color: #fff;
    border: none;*/
}

    .btn * {
        position: relative;
    }

    .btn::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 100%;
        height: 100%;
        transition: all .3s ease;
        z-index: 0;
    }

.btn-green {
    color: #fff;
    background-color: var(--green);
    border: 1px solid var(--green);
}

.btn-gold {
    color: #fff;
    background-color: var(--gold);
    border: 1px solid var(--gold);
}

    .btn-gold:hover {
        background-color: var(--gold-active);
        border: 1px solid var(--gold-active);
    }

.btn-white {
    color: #fff;
    background-color: white;
    border: 1px solid white;
}

.btn-green-bordered {
    /* color: var(--green); */
    border: 1px solid var(--green);
    background-color: transparent;
}

.btn-gold-bordered {
    /* color: var(--gold); */
    border: 1px solid var(--gold);
    background-color: transparent;
}

.btn-blue-bordered {
    /* color: var(--green); */
    border: 1px solid var(--green);
    background-color: transparent;
}

.btn-white-bordered {
    /* color: var(--green); */
    border: 1px solid white;
    background-color: transparent;
}

.btn-green:hover,
.btn-green-bordered:hover,
.btn-gold:hover,
.btn-gold-bordered:hover {
    color: #fff;
}

.btn-white:hover,
.btn-white-bordered:hover {
    color: #333;
}

button,
.btn-check:focus + .btn,
.btn:focus {
    outline: none;
    box-shadow: none;
}

.text-gold {
    color: var(--gold) !important;
}

.text-green {
    color: var(--green) !important;
}


.bg-gold {
    background-color: var(--gold);
}

.bg-green {
    background-color: var(--green);
}

.bg-blue {
    background-color: var(--green);
}


.main_navbar {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    background-color: #fff;
    z-index: 99;
}

main {
    padding-top: 90px;
    min-height: calc(100vh - 58px);
    background-color: #f5f5f5;
}

.navbar {
    padding-top: 0;
    padding-bottom: 0;
    border-bottom: 1px solid rgba(33, 33, 33, .16);
}

.top_nav .navbar-nav {
    padding: 0;
}

.kfu_logo_wrap,
.fif_logo_wrap {
    /* width: 190px; */
    height: 70px;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 10px 0;
}

    .kfu_logo_wrap img,
    .fif_logo_wrap img {
        max-width: 100%;
        max-height: 100%;
    }

.top_nav .nav-link {
    padding: 1.8rem 1rem !important;
    color: #202020;
    font-weight: 600;
}

.hero_section {
    margin: 2rem 0;
}

.hero_section__content {
    background-image: url(../imgs/hero.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    color: #fff;
    padding: 7rem 4rem;
    border-radius: 3rem;
    width: 100%;
}

    .hero_section__content h1 {
        color: var(--gold);
        font-size: 3rem;
        margin-bottom: 1rem;
    }

    .hero_section__content p {
        max-width: 45%;
        font-size: 1.2rem;
    }

.item_card {
    background-color: #fff;
    border-radius: 1.5rem;
    overflow: hidden;
    border: 1px solid rgb(var(--green-rgb), 15%);
    transition: all .2s ease;
}

    .item_card:hover {
        background-color: rgb(var(--green-rgb), 5%);
    }

.card_header {
    padding: 1.5rem;
}

    .card_header span {
        position: relative;
    }

        .card_header span::after {
            content: "";
            position: absolute;
            height: 50px;
            width: 50px;
            top: -15px;
            right: 0;
            background-color: var(--gold);
            border-radius: 50%;
            z-index: 0;
        }

    .card_header img {
        height: 40px;
        max-width: 70px;
        z-index: 1;
        position: relative;
    }

    .card_header h5 {
        margin-top: 1.5rem;
        font-size: 1.1rem;
    }

.card_body {
    background-color: rgb(var(--green-rgb), 5%);
    padding: 1.5rem;
    border-top: 1px solid rgb(var(--green-rgb), 10%);
}

    .card_body p {
        font-size: 1.1rem;
        min-height: 120px;
    }

.modal-body {
    padding: 2rem;
}

.modal-content {
    border-radius: 2rem;
    background-image: url(../imgs/mask.png);
    background-repeat: no-repeat;
    background-size: 100%;
}

.page_header {
    margin-top: 2rem;
    margin-bottom: 2rem;
    background-color: var(--green);
    padding: 2rem;
    border-radius: .7rem
}

    .page_header h3 {
        margin-bottom: .5rem;
        color: #fff;
    }

    .page_header .breadcrumb a {
        text-decoration: none;
        color: var(--gold)
    }

    .page_header .breadcrumb .breadcrumb-item.active {
        text-decoration: none;
        color: #fff;
    }

.breadcrumb-item + .breadcrumb-item::before {
    color: #fff;
}

.page_content {
    background-color: #fff;
    border: 1px solid #eaeaea;
    border-radius: .5rem;
}

.block {
    background-color: #fff;
    border: 1px solid #eaeaea;
    border-radius: 10px;
    /*box-shadow: var(--kt-box-shadow-xs);*/
    /* padding: 1rem 1.5rem; */
}

.block-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    border-bottom: 1px solid #dee2e6;
}

    .block-header h5,
    .block-header h3,
    .block-title {
        font-weight: 600;
        font-size: 1.1rem;
        margin: 0;
    }

.block-body,
.block-content {
    padding: 2rem;
}

.tab_nav {
    display: flex;
    align-items: center;
    gap: .5rem;
    min-width: 50%;
}

    .tab_nav .tabevent {
        background-color: rgb(15 113 121 / 7%);
        border: 1px solid rgb(15 113 121 / 7%);
        padding: 3px 1rem;
        border-radius: 5px;
        display: inline-flex;
        align-items: center;
        gap: 1rem;
        color: var(--green);
        cursor: pointer;
        transition: all .2s ease;
    }

        .tab_nav .tabevent span {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background-color: rgb(15 113 121 / 25%);
            color: var(--green);
            height: 20px;
            width: 20px;
            border-radius: 50%;
            font-size: .85rem;
        }

        .tab_nav .tabevent:hover {
            background-color: rgb(15 113 121 / 10%);
            border: 1px solid rgb(15 113 121 / 10%);
        }

    .tab_nav .eventselected,
    .tab_nav .eventselected:hover {
        background-color: rgb(15 113 121 / 100%);
        border: 1px solid rgb(15 113 121 / 100%);
        color: #fff;
    }
        .tab_nav .eventselected span {
            background-color: #fff;
            color: var(--green);
        }
.table_action_btn {
    border: none;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 35px;
    width: 35px;
    cursor: pointer;
    background-color: rgb(15 113 121 / 10%);
    color: var(--green);
    transition: all .2s ease;
}
    .table_action_btn:hover {
        background-color: rgb(15 113 121 / 15%);
    }
    .table_action_btn:after {
        display: none;
    }
.table_actions_dd .dropdown-menu {
    padding: .5rem
}
.dropdown-item {
    border-radius: 5px;
}

.tl_item {
    display: flex;
    gap: 1.5rem
}
.tl_item p {
    margin: 0;
}
    .tl_item .date {
        padding-top: 2rem;
        min-width: 200px;
        text-align: left;
        position: relative;
    }
        .tl_item .date:after {
            content: "";
            position: absolute;
            top: 2.3rem;
            left: -2rem;
            height: 15px;
            width: 15px;
            background-color: var(--gold);
            border: 4px solid var(--green);
            border-radius: 50%;
        }
        .tl_item .tl_cntnt {
            display: flex;
            flex-direction: column;
            gap: .5rem;
            padding-top: 2rem;
            padding-bottom: 2rem;
            padding-right: 1.5rem;
            border-right: 1px solid rgb(15 113 121 / 25%);
        }
    .tl_item .status {
        font-weight: 700;
        margin-bottom: -5px;
    }
.ss_tab {
    background-color: rgb(15 113 121 / 5%);
    border: 1px solid rgb(15 113 121 / 15%);
    padding: 1.5rem;
    border-radius: 1rem;
}
    .ss_tab label {
        color: var(--green)
    }

.sa-button-container .cancel {
    background-color: #8b8b8b;
    color: #fff;
}
    .sa-button-container .cancel:hover {
        background-color: #686868;
        color: #fff;
    }

@media only screen and (max-width: 540px) {
}