@import url(https://fonts.googleapis.com/css2?family=Tajawal:wght@400;700&display=swap);
body{
    direction: rtl;
    text-align: right;
    font-family:Tajawal,sans-serif;
    font-size: 16px;
    font-weight: bold;
    padding-bottom: 170px;
}
body.one-section{
    display: flex;
    align-items: center;
    min-height: 100vh;
}
h1,h2,h3,h4,h5,h6{
    font-family:Tajawal,sans-serif
}

.btn-primary{
    background-color: #6F8748!important;
    border: none!important;
}
.btn-primary:hover{
    background-color: #6F8748!important;
    border-bottom: none;
}
.btn-check:active+.btn-primary:focus,
.btn-check:checked+.btn-primary:focus,
.btn-primary.active:focus,
.btn-primary:active:focus,
.show>.btn-primary.dropdown-toggle:focus {
    box-shadow: none;
}
.btn-check:active+.btn-primary,
.btn-check:checked+.btn-primary,
.btn-primary.active,
.btn-primary:active,
.show>.btn-primary.dropdown-toggle{
    background-color: #6F8748;
    border-bottom: none;
}
.form-control:disabled, .form-control[readonly] {
    background-color: #fff;
}
.font-18{
    font-size: 18px!important;
}
.font-22{
    font-size: 22px!important;
}
.px-50{
    padding-left: 50px;
    padding-right: 50px;
}
.bg-color{
    background-color: #F7F7F7;
}
.bg-1{
    background-image: url(../portal/bg-1.svg);
}
.auth-section{
    border-radius: 20px;
    box-shadow: 0px 3px 44px 0px rgba(122, 122, 122, 0.16);
    background-color: #fff;
}
.main{
    position: relative;
    padding: 50px 100px;
    z-index: 1;
}
.main.bg{
    background-image: url(../portal/login-c.png);
    background-repeat: no-repeat;
    background-position: -55px bottom;
    background-size: 150px 150px;
}
.logo{
    margin-bottom: 10px;
    height: 90px;
}
.title{
    font-size: 24px;
    font-weight: bold;
    color: #61032D;
    margin-bottom: 20px;
}
label{
    position: relative;
    font-size: 17px;
    font-weight: 600;
    color: #454545;
}
label.required:after{
    content: '*';
    color: #CB1111;
    margin: 5px;
    font-size: 21px;
}
.form-control{
    height: 50px;
    border: 1px solid #E8E8E8;
    font-size: 22px;
    border-radius: 0px;
}
.form-control:focus {
    color: #212529;
    background-color: #fff;
    border-color: #E8E8E8;
    outline: 0;
    box-shadow: none;
}
.forget-pass{
    font-size: 14px;
    font-weight: bold;
    color: #454545;
    text-decoration: none;
    padding-bottom: 30px;
}
.forget-pass:hover{
    color: #61032D;
}
.btn{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 50px;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    border: none;
 }
.btn-check:focus+.btn-primary, .btn-primary:focus {
    color: #fff;
    background-color: #6F8748;
    box-shadow: none
}
.register .btn{
    min-width: 220px;
}
.full-width-header .right_menu_togle{
    background: #fff;
    padding: 40px 50px;
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);
    position: absolute;
}
.full-width-header .mobile-navbar-menu .nav-menu li a{
    color: #454545;
    border: none;
}
.side{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    /*padding: 50px;*/
    background-color: #6F8748;
    height: 100%;
    width: 100%;
    color: #fff;
    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
    z-index: 1;
}
.side.top{
    border-radius: 0px;
    border-bottom-right-radius: 20px;
    border-top-right-radius: 20px;
}
.side:before{
    content: '';
    position: absolute;
    height: 225px;
    width: 100%;
    top: 0px;
    right: 0px;
    z-index: -1;
    background-image: url(../portal/tree-top.png);
    background-repeat: no-repeat;
    background-position: right;
    background-size: contain;
}
.side:after{
     content: '';
     position: absolute;
     height: 250px;
     width: 100%;
     bottom: 0px;
     right: 0px;
     z-index: -1;
     background-image: url(../portal/tree-bottom.png);
     background-repeat: no-repeat;
     background-position: left;
     background-size: contain;
 }
.side h3{
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 10px;
}
.side p{
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 30px;
}
.side a{
    color: #fff;
    text-decoration: none;
}
.login .side a{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    width: 100%;
    height: 50px;
    border: 2px solid #fff;
    border-radius: 5px;
    background-color: #6F8748;
}
.register .side{
    align-items: flex-start;
    flex-direction: column;
    padding-right: 50px;
}
.register .side .list a{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    opacity: 0.7;
    margin-bottom: 40px;
}
.register .side .list a:after{
    position: absolute;
    display: none;
    content: '';
    height: 2px;
    width: 75px;
    left: 0px;
    top: 13.5px;
    background-color: #FFFFFF;
}
.register .side .list a.active, .register .side .list a.done{
    opacity: 1;
}
.register .side .list a.active:after{
    display: block;
}
.register .side .list .num-phone{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 29px;
    height: 29px;
    border-radius: 50%;
    background-color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    color: #6F8748;
    margin-left: 25px;
}
.register .side .list .text{
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}
.register .side .line{
    height: 1px;
    width: 100%;
    background-color: #fff;
    opacity: 0.4;
}
.register .side .link{
    font-size: 22px;
    font-weight: bold;
    text-decoration: none;
    margin-top: 25px;
}
.register .main{
    padding: 90px 140px;
}
.register .main:after{
    position: absolute;
    content: '';
    height: 350px;
    width: 100%;
    bottom: 0px;
    left: 0px;
    z-index: -1;
    background-image: url(../portal/form-tree.png);
    background-repeat: no-repeat;
    background-position: left;
    background-size: contain;
}
.register .main .btn{
    margin-top: 50px;
}
.register .back-btn{
    font-weight: bold;
    font-size: 24px;
    color: #6F8748;
    text-decoration: none;
    cursor: pointer;
}
.register .mobile-step{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}
.register .mobile-step .num-phone{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #F5F5F5;
    font-size: 14px;
    font-weight: bold;
    color: #6F8748;
}
.register .mobile-step .num-phone{
}
.register .mobile-step .line{
    height: 2px;
    width: 30px;
    background-color: #F5F5F5;
    margin: 0px 10px;
}
.register .mobile-step .active .num-phone, .register .mobile-step .done .num-phone{
    background-color: #6F8748;
    color: #fff;
}
.register .mobile-step .active .line, .register .mobile-step .done .line{
    background-color: #6F8748;
}
.register-login{
    display: block;
    text-align: center;
    padding-top: 10px;
    font-size: 16px;
    color: #454545;
}
.register-login a{
    color: #61032D;
}
.code-input input.form-control{
    width: 72px;
    display: inline-block;
    margin: 0px 15px;
    height: 72px;
    text-align: center;
}
.code-input p{
    font-size: 26px;
    font-weight: 500;
    color: #434E57;
    margin-bottom: 10px;
}
.code-input h4{
    font-size: 22px;
}
.code-input .not-reach{
    color: #A6A6A6;
    font-size: 21px;
    font-weight: bold;
    margin-top: 10px;
}
.code-input .not-reach a{
    color: #434E57;
    text-decoration: none;
}
.iti{
    display: block;
}
.iti__country-list{
    left: 0px;
}
input[type=tel], input.number{
    direction: ltr;
    text-align: right;
}
::placeholder{
    font-size: 16px;
    color: #707070;
}
@media (max-width: 992px) {
    .side{
        border-radius: 0px;
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
    }
}
@media (max-width: 768px) {
    body{
        padding: 0px 0px 30px;
    }
    .side:before{
        display: none;
    }
    .side:after{
        display: none;
    }
    .side.top{
        border-radius: 0px;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        padding-top: 100px;
        padding-bottom: 100px;
    }
    .register .side .list a:after{
        width: 50px;
    }
    .register .main{
        padding: 50px 30px;
    }
    .code-input input.form-control {
        width: 39px;
        margin: 10px;
        height: 40px;
    }
}
/***********************/
.container.custom {
    max-width: 95%;
    width: 100%;
}
.full-width-header{
    background-color: #fff;
}
.rs-header{
    box-shadow: 0px 3px 15px 0px rgb(0 0 0 / 16%);
}
.list-none{
    list-style: none;
}
.full-width-header .right_menu_togle .close-btn .nav-close{
    left: 10px;
    right: unset;
}
.full-width-header .rs-header .menu-area .main-menu .rs-menu ul.nav-menu li{
    margin: 0px 15px!important;
}
.full-width-header .rs-header.style2 .menu-area .main-menu .rs-menu ul.nav-menu li a{
    font-size: 16px;
    color: #000;
    font-family:Tajawal,sans-serif;
}
.full-width-header .rs-header .expand-btn-inner ul li{
    margin-right: 15px;
}
.rs-language{
    font-size: 15px;
    color: #7A7A7A !important;
}
.notification-icon{
    position: relative;
    color: #7A7A7A!important;
}
.notification-icon span{
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -5px;
    right: -10px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #4B0021;
    color: #fff;
}
.logout-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 110px;
    height: 40px;
    font-size: 15px;
    color: #CB0000;
    border: 1px solid #CB0000;
    border-radius: 5px;
}
.logout-btn:hover{
    background-color: #CB0000;
    color: #fff;
}
.profile{
    color: #7A7A7A!important;
    font-size: 16px;
}
.profile span{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(75 0 33 / 20%);
    width: 35px;
    height: 35px;
    border-radius: 50%;
    color: #4B0021;
}
.row-container{
    padding: 0px 3%;
}
.badge{
    display: inline-block;
    padding: 9px 15px;
    border-radius: 5px;
}
.badge-success{
    background-color: rgb(86 106 38 / 20%);
    color: #566A26!important;
}
.badge-danger{
    background-color: rgb(75 0 33 / 20%);
    color: #4B0021!important;
}
.badge-blue{
    background-color: rgb(0 98 182 / 20%);
    color: #0062B6!important;
}
.badge-purple{
    background-color: rgb(123 0 111 / 20%);
    color: #7B006F!important;
}
.badge-white{
    background-color: #fff;
    color: #566A26!important;
}
.p-white{
    padding: 40px;
}
.id-card{
    /*margin: 40px;*/
    padding: 45px 30px;
    background-image: linear-gradient(to right, #566A26, #303B14);
    color: #fff;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0px 3px 40px 0px rgb(78 96 34 / 36%);
    font-size: 14px;
}
.id-card p{
    font-size: 18px;
    margin-bottom: 20px;
}
.id-card .line{
    margin: 30px 0px;
    height: 1px;
    background-color: #FFFFFF;
    width: 100%;
    opacity: 0.4;
}
.id-card label{
    display: block;
    font-size: 16px;
    color: #fff;
    margin-bottom: 15px;
}
.id-card span.value{
    background: rgb(255 255 255 / 20%);
    padding: 5px 15px;
    border-radius: 5px;
}
.id-card .border-left{
    border-left: 1px solid rgb(255 255 255 / 40%);
}
.main-content .title{
    font-size: 20px;
    color: #000000;
    margin: 0px;
}
.payment{
    /*margin-top: 40px;*/
    padding: 40px;
    border-radius: 10px;
}
.payment .title{
    border-bottom: 1px solid rgb(112 112 112 / 40%);
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.payment .payment-card{
    border-bottom: 1px solid rgb(122 122 122 / 28%);
    padding-bottom: 20px;
}
.payment .payment-card:last-of-type{
    border-bottom: none;
    padding-bottom: 0px;
}
.payment .payment-card span{
    display: block;
    font-size: 16px;
    color: #000000;
}
.payment .payment-card span.label{
    color: #7A7A7A;
}
.payment .payment-card span.value{
    font-size: 16px;
    color: #454545;
}
.payment .payment-card span.badge{
    display: inline-block;
}
.card{
    border: 0px;
    background-color: #fff;
    border-radius: 10px;
    margin-top: 40px;
    padding: 30px 40px 40px;
}
.head-span{
    font-size: 16px;
    color: #707070;
}
.fund-order .header{
    border-bottom: 1px solid rgb(112 112 112 / 40%);
    padding-bottom: 20px;
}
.fund-order .status{
    border-left: 1px solid rgb(112 112 112 / 20%);
    padding: 20px 0px;
}
.fund-order .status:last-of-type{
    border-left: none;
}
.fund-order span{
    display: block;
    font-size: 16px;
    color: #707070;
}
.fund-order .number{
    font-size: 32px;
}
.text-orange{
    color: #E28100!important;
}
.text-blue{
    color: #0062B6!important;
}
.text-green{
    color: #566A26!important;
}
.text-red{
    color: #CB0000!important;
}
.btn.icon{
    width: 45px;
    height: 40px;
    border: 1px solid #566A26;
    color: #566A26;
    font-size: 24px;
}
.payment-plan{
    min-height: 539px;
}
.payment-plan .header{
    border-bottom: 1px solid rgb(112 112 112 / 40%);
    padding-bottom: 20px;
}
.payment-one{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0px;
    border-bottom: 1px solid rgb(112 112 112 / 40%);
}
.payment-one:last-of-type{
    border-bottom: none;
    padding-bottom: 0px;
}
.payment-one .payment-border{
    border-right: 4px solid #0062B6;
    padding-right: 20px;
}
.payment-one .payment-border.color-2{
    border-color: #7B006F;
}
.payment-one .money{
    display: block;
    font-size: 18px;
    color: #454545;
    margin-bottom: 0px;
}
.payment-one .money span{
    color: #000000;
    display: inline-block;
    margin-left: 10px;
    font-size: 16px;
}
.payment-one .program{
    display: block;
    font-size: 16px;
    color: #000000;
    margin-bottom: 0px
}
.payment-one .remain{
    display: block;
    font-size: 16px;
    color: #707070;
}
.payment-one .remain .value{
    color: #566A26;
}
.payment-one .badge{
    font-size: 17px;
    margin: 10px 0px;
}
.programs-charts h5{
    font-size: 18px;
    margin-bottom: 5px;
}
.programs-charts span{
    font-size: 16px;
    color: #707070;
}
.programs-charts span.value1{
    color: #0062B6;
}
.programs-charts span.value2{
    color: #7B006F;
}
.programs-charts > div{
    border-bottom: 1px solid rgb(112 112 112 / 20%);
}
.programs-charts > div:last-of-type{
    border-bottom: none;
}
.fund-program{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: 420px;
    background-size: cover;
    background-position: center;
    /*background-image: url(../portal/prog-bg.png);*/
    z-index: 1;
}
.fund-program.only{
    /*height: 85%!important;*/
    margin-top: 40px!important;
}
.fund-program:after{
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    opacity: 0.2;
    border-radius: 10px;
    background-image: linear-gradient(#FFFFFF, #000000);
    z-index: -1;
    display: none;
}
.fund-program a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 5px;
    font-size: 18px;
    width: 220px;
    height: 50px;
    display: none;
}
.side-banner{
    position: absolute;
    top: 20px;
    right: -10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #E28100;
    color: #fff;
    padding: 0px 10px 0px 40px;
    height: 50px;
    clip-path: polygon(100% 0, 100% 100%, 0% 100%, 20% 50%, 0% 0%);
}
.side-banner-rest{
    position: absolute;
    top: 70px;
    right: -10px;
    width: 15px;
    height: 15px;
    clip-path: polygon(0 0, 100% 0%, 50% 50%, 0% 100%);
    background-color: #7B4600;
}
.fund-program .side-banner{
    display: none;
}
.fund-program .side-banner-rest{
    display: none;
}
.mobile_confirm_modal .modal-dialog{
    max-width: 697px
}
.mobile_confirm_modal .modal-content{
    border-radius: 0px;
    border-top: 1px solid #F7F7F7;
}
.mobile_confirm_modal .modal-header{
    justify-content: center;
    padding: 10px;
    background-color: #F7F7F7;
    border-top: 2px solid #6F8748;
    border-radius: 0px;
}
.mobile_confirm_modal .modal-header h5{
    font-size: 20px;
    color: #6F8748;
    font-weight: bold;
}
.mobile_confirm_modal .modal-body{
    padding: 30px 70px 50px;
}
.mobile_confirm_modal .modal-content p{
    font-size: 24px;
    color: #707070;
    margin-bottom: 0px;
}
.mobile_confirm_modal .your-phone{
    display: flex;
    align-items: center;
    justify-content: center;
    direction: ltr;
    margin: 20px 0px 40px;
}
.mobile_confirm_modal .your-phone span{
    font-size: 26px;
    font-weight: normal;
    color: #434E57;
}
.mobile_confirm_modal .not-yours{
    display: block;
    color: #707070;
    font-size: 24px;
    margin-top: 20px;
    font-weight: normal;
}
.mobile_confirm_modal .edit{
    background-color: transparent;
    border: none;
    color: #4B0021;
}
.big-title{
    font-size: 30px;
}
.page-header{
    padding: 25px 0px;
    background-color: #fff;
}
.page-header h1{
    font-size: 24px;
    color: #4B0021;
    margin: 0px;
    font-weight: bold;
    line-height: 24px;
    padding-bottom: 15px;
}
.page-header p {
    color: #7A7A7A;
    margin: 0px;
}
.profile-card{
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #C2C2C2;
    padding: 0px 30px;
}
.profile-card .profile-header{
    border-bottom: 1px solid rgb(112 112 112 / 40%);
    padding: 25px 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 25px;
}
.profile-card h2{
    font-size: 18px;
    line-height: 18px;
    color: #566A26;
    margin: 0px;
}
.profile-card .edit-profile{
    color: #7A7A7A;
    font-size: 16px;
    line-height: 16px;
    background-color: transparent;
    border: none;
}
.profile-card .profile-body{
    margin-bottom: 25px;
}
.profile-card .profile-id{
    border-top: 1px solid rgb(112 112 112 / 40%);
    padding-top: 20px;
}
.profile-card .form-label{
    font-size: 14px;
    margin-bottom: 20px;
}
.profile-card .form-label.value{
    color: #707070;
}
.id-image{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgb(86 106 38 / 10%);
    height: 204px;
    border-radius: 5px;
    padding: 20px;
    margin-bottom: 25px;
}
.id-image img{
    height: 100%;
}
.profile-card .btn{
    display: block;
    padding: 0px;
    border: 1px solid #6F8748;
    height: 40px;
}
.profile-card .btn-ignore{
    width: 100px;
    color: #6F8748;
    background-color: #fff;
}
.profile-card .btn-ignore{
    color: #6F8748;
}
.profile-card .btn-save{
    width: 140px;
    color: #fff;
    background-color: #6F8748;
}
.profile-card .btn-save:hover{
    color: #fff;
}
.profile-card .form-control{
    font-size: 14px;
    color: #707070;
    font-weight: bold;
}
.profile-card .form-control[type=file]{
    padding: 13.5px 20px 20px 0px;
}
.custom-file{
    display: flex;
    align-items: center;
}
.custom-file label{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #F5F5F5;
    border-radius: 2px;
    font-size: 14px;
    font-weight: normal;
    width: 75px;
    height: 28px;
}
.custom-file span{
    font-size: 14px;
    font-weight: 500;
}
.form-check{
    display: flex;
    align-items: center;
}
.form-check label{
    margin: 0px 5px;
}
.form-check .form-check-input{
    float: none;
    margin: 0px;
}
.form-check-input:focus {
    border: none;
    outline: 0;
    box-shadow: none;
}
.form-check-input:checked[type=radio] {
    background-color: #4B0021;
    border-color: #4B0021;
}
.form-select{
    background-position: left 0.75rem center;
    padding: .375rem .75rem .375rem 2.25rem;
}
.form-control:disabled, .form-control[readonly] {
    background-color: #EEEEEE;
}
.flatdatepickr.form-control:disabled, .flatdatepickr.form-control[readonly]{
    background-color: #fff;
}
.fund-form{
    padding: 50px;
    background-color: #fff;
    border-radius: 10px;
}
.fund-form .form-control, .fund-form .form-control::placeholder{
    font-size: 16px;
    color: #707070;
    font-weight: bold;
}
.fund-form .form-check{
    background-color: #F7F7F7;
    padding: 30px 40px;
    margin: 40px 0px 50px;
}
.fund-form .form-check label{
    font-size: 16px;
    font-weight: 600;
    margin: 0px 10px;
    color: #000000;
    width: 95%;
}
.btn-save{
    display: inline-flex;
    width: 280px;
    height: 60px;
    background-color: #6F8748;
    border-radius: 5px;
}
.fund-title{
    color: #000000;
    font-size: 23px;
    line-height: 23px;
    margin: 7px 0px;
}
.fund-border{
    width: 100%;
    height: 10px;
    background-color: #6F8748;
    border-radius: 10px;
}
.my_funds{
    padding: 35px 40px;
    border-radius: 5px;
    cursor: pointer;
}
.my_funds.active{
    border: 1px solid #566A26;
    box-shadow: 0px 3px 52px 0px rgb(134 134 134 / 17%);
}
.my_funds .img{
    background-color: rgb(170 180 146 / 18%);
    padding: 15px;
    border-radius: 5px;
}
.my_funds .img img{
    height: 30px;
}
.my_funds .rest_payments {
    background-color: rgb(170 180 146 / 18%);
    padding: 5px 10px;
    font-size: 13px;
    color: #454545;
    line-height: 18px;
    border-radius: 5px;
}
.my_funds .rest_payments span {
    color: #7A7A7A;
}
.my_funds h3{
    color: #000000;
    font-size: 18px;
    margin: 40px 0px 5px;
    line-height: 24px;
}
.my_funds .date {
    font-size: 15px;
    line-height: 20px;
}
.my_funds .date span {
    color: #7A7A7A;
}
.my_funds .fund-box {
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='5' ry='5' stroke='%237070708C' stroke-width='1' stroke-dasharray='5%2c5' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
    border-radius: 5px;
    text-align: center;
    padding: 20px 10px 15px;
    margin-top: 40px;
    font-size: 13px;
}
.my_funds .label{
    font-size: 14px;
}
.my_funds .value{
    font-size: 14px;
    color: #7A7A7A;
}
.my_funds .progress{
    margin: 40px 0px 10px;
    height: 10px;
    border-radius: 0px;
    background-color: rgb(159 160 157 / 29%);
}
.my_funds .progress .progress-bar{
    background-color: #566A26;
}
.fund-table{
    background-color: #fff;
    padding: 50px;
}
.fund-table h2{
    font-size: 22px;
    line-height: 36px;
    color: #000000;
    margin-bottom: 30px;
}
.fund-table .table-responsive{
    padding: 0px 35px;
    background-color: #F5F5F5;
    border-radius: 10px;
    border: 1px solid #D3D3D3;
}
.fund-table .table th, .fund-table .table td{
    border: none;
    padding: 15px 10px;
    border-bottom: 2px dashed rgb(112 112 112 / 40%)!important;
}
.fund-table .table tr:last-of-type td{
    border-bottom: none!important;
}
.fund-table .table th{
    font-size: 16px;
    color: #000;
}
.fund-table .table td{
    font-size: 16px;
    color: #7A7A7A;
}
.order{
    position: relative;
    background-color: #fff;
    padding: 35px 30px;
    border-radius: 5px;
    cursor: pointer;
}
.order h4{
    color: #000000;
    font-size: 18px;
}
.order .label{
    color: #000;
    font-size: 16px;
}
.order .badge{
    font-size: 16px;
}
.order .line{
    background-color: rgb(122 122 122 / 40%);
    height: 1px;
    margin: 20px 0px;
}
.order .link{
    color: #566A26;
    font-size: 16px;
}
.order .side-banner{
    clip-path: polygon(100% 0, 80% 50%, 100% 100%, 0% 100%, 0% 0%);
    padding: 0px 40px 0px 20px;
    top: 25px;
    left: -15px;
    right: unset;
}
.order .side-banner-rest{
    clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 50%);
    top: 75px;
    left: -15px;
    right: unset;
}
.order .side-banner.color1{
    background-color: #2281AF;
}
.order .side-banner-rest.color1{
    background-color: #04457D;
}
.order .side-banner.color2{
    background-color: #C78021;
}
.order .side-banner-rest.color2{
    background-color: #7C4700;
}
.order .side-banner.color3{
    background-color: #566A26;
}
.order .side-banner-rest.color3{
    background-color: #3b471e;
}
.comment-box{
    padding: 30px;
    background-color: #fff;
}
.comment-box .comment-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgb(112 112 112 / 40%);
    padding-bottom: 15px;
    margin-bottom: 25px;
}
.comment-box .comment-header .line-before{
    height: 66px;
    width: 4px;
    background-color: #0062B6;
    border-radius: 5px;
    margin-left: 15px;
}
.comment-box .comment-header h4{
    font-size: 20px;
    line-height: 27px;
    margin-bottom: 10px;
    color: #000000;
}
.comment-box .comment-header .money{
    font-size: 16px;
    color: #000000;
    line-height: 21px;
    margin-bottom: 10px;
}
.comment-box .comment-header .money span{
    color: #566A26;
    font-size: 18px;
    line-height: 24px;
}
.comment-box .comment-body{
    height: 400px;
    overflow: auto;
    padding: 0px 5px;
}
.comment-box .msg{
    display: flex;
    justify-content: flex-start;
    margin-bottom: 40px;
}
.comment-box .msg:last-of-type{
    margin-bottom: 0px;
}
.comment-box .msg .sender{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 65px;
    height: 65px;
    background-color: rgb(86 106 38 / 5%);
    border-radius: 50%;
    color: #566A26;
    font-size: 21px;
}
.comment-box .msg .text{
    clip-path: polygon(100% 0, 97% 15%, 100% 100%, 0 100%, 0 0);
    background-color: rgb(86 106 38 / 5%);
    width: 400px;
    /*height: 93px;*/
    margin-top: 10px;
    padding: 5px 20px;
    display: flex;
    align-items: center;
}
.comment-box .msg.side-msg{
    justify-content: flex-end;
}
.comment-box .msg.side-msg .sender{
    background-color: rgb(75 0 33 / 5%);
    color: #4B0021;
}
.comment-box .msg.side-msg .text{
    clip-path: polygon(100% 0, 100% 100%, 0 100%, 3% 15%, 0 0);
}
.comment-box .msg .text .name{
    color: #000;
}
.comment-box .msg .text span{
    display: block;
    margin-top: 5px;
    color: #566A26;
}
.comment-box .comment-footer{
    border-top: 1px solid rgb(112 112 112 / 40%);
    margin-top: 25px;
}
.comment-box .comment-footer textarea{
    width: 100%;
    margin-top: 25px;
    border: none;
    resize: none;
    font-size: 19px;
    color: #7A7A7A;
    font-weight: bold;
}
.comment-box .comment-footer .btn-save{
    width: 155px;
    height: 41px;
}
.comment-box .comment-footer .btn-save:hover{
    color: #fff;
}
button.btn.delete-comment{
    display: inline-flex !important;
    align-items: center;
    width: auto;
    padding: 0px;
    height: auto;
}
button.btn.delete-comment span{
    padding: 0px;
    height: auto;
    color: #CB0000 !important;
    display: inline-block !important;
    width: auto;
    margin: 0px!important;
}
button.btn.delete-comment .spinner-border{
    color: #CB0000 !important;
}
.offcanvas-start{
    width: 587px;
}
.order_info{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #F5F5F5;
    padding: 30px;
}
.offcanvas-header{
    padding: 30px 30px 0px;
}
.offcanvas-body{
    padding: 30px;
}
.order_info .label{
    font-size: 18px;
    color: #000;
    line-height: 24px;
    margin: 0px;
}
.order_info span{
    display: block;
    color: #7A7A7A;
    font-size: 20px;
    line-height: 27px;
    margin-top: 15px;
}
.order_info .answer{
    color: #454545;
    font-size: 20px;
    line-height: 28px;
}
.no-data a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    border: 1px solid #6F8748;
    border-radius: 5px;
    height: 51px;
    padding: 0px 15px;
}
.mt-40{
    margin-top: 40px!important;
}
.notification_sidebar{
    width: 445px;
}
.notification_sidebar .offcanvas-header{
    border-bottom: 1px solid #566A26;
    padding-bottom: 30px;
}
.notification-box{
    display: flex;
    align-items: flex-start;
    padding: 25px 30px 10px;
    border-bottom: 1px solid #D9D9D9;
}
.notification-box:last-of-type{
    border-bottom: none;
}
.notification-box.unread{
    background-color: rgb(221 225 211 / 40%);
}
.notification-box .icon{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 51px;
    height: 51px;
    border-radius: 50%;
    margin-left: 15px;
}
.notification-box h4{
    color: #000000;
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 5px;
}
.notification-box p{
    font-size: 14px;
    color: rgb(0 0 0 / 75%);
    line-height: 19px;
    margin-bottom: 5px;
}
.notification-box span{
    font-size: 14px;
    color: rgb(0 0 0 / 57%);
}
.notification-box .icon.notif-1{
    background-color: rgb(33 133 167 / 20%);
}
.notification-box .icon.notif-2{
    background-color: rgb(241 82 36 / 20%);
}
.notification-box .icon.notif-3{
    background-color: rgb(86 106 38 / 20%);
}
.notification-box .icon.notif-4{
    background-color: rgb(75 0 33 / 20%);
}
.notification-box .icon.notif-5{
    background-color: rgb(153 0 0 / 20%);
}
.notification-box .icon.notif-6{
    background-color: rgb(228 146 0 / 20%);
}
.country_code{
    font-size: 12px;
}
.btn-check:focus+.btn, .btn:focus{
    box-shadow: none;
}
.payment-plan .dropdown-menu{
    width: 300px;
    padding: 10px;
}
.payment-plan .dropdown-toggle::after{
    display: none;
}
.notification-filter{
    cursor: pointer;
}
.confirm_modal.modal.show .modal-dialog{
    max-width: 550px;
}
.confirm_modal .modal-content{
    border-radius: 0px;
    border: none;
}
.confirm_modal .modal-header{
    background-color: #F7F7F7;
    border-top: 4px solid #6F8748;
    border-radius: 0px;
}
.confirm_modal .modal-body{
    padding: 20px 50px;
}
.confirm_modal .modal-body p{
    display: inline-block;
    width: 65%;
    margin: 15px 0px;
}
.comment-file {
    background: #fff;
    border-radius: 20px;
    padding: 5px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px dashed #000;
}
.comment-box .comment-file span{
    font-size: 12px;
    font-weight: bold;
    color: #000!important;
    margin: 0px!important;
}
.comment-box .comment-file a{
    background: #F8F9F6;
    border: 1px solid #707070;
    width: 26px;
    height: 22px;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}
@media (min-width: 991px) and (max-width: 1400px){
    .full-width-header .rs-header .menu-area .main-menu .rs-menu ul.nav-menu li{
        margin: 0px 10px!important;
    }
    .p-white {
        padding: 40px 15px;
    }
    .card{
        padding: 30px 15px 40px;
    }
}
@media (max-width: 1400px) {
    .container-fluid{
        padding-left: 50px;
        padding-right: 50px;
    }
}
@media (max-width: 991px) {
    .d-flex {
        display: flex!important;
    }
}
@media (max-width: 768px) {
    .main{
        padding: 50px 35px;
    }
    .profile-card .profile-header{
        display: block;
    }
    .profile-card .profile-header h2{
        margin-bottom: 20px;
    }
    .container-fluid{
        padding-left: 15px;
        padding-right: 15px;
    }
    .p-white {
        padding: 40px 15px;
    }
    .card{
        padding: 30px 15px 40px;
    }
    .fund-form{
        padding: 50px 15px;
    }
    .fund-table{
        padding: 50px 15px;
    }
    .fund-table .table-responsive{
        padding: 30px 15px 10px;
    }
    .fund-table .table th{
        font-size: 13px;
    }
    .fund-table .table td{
        font-size: 16px;
    }
    .fund_form{
        width: 100%;
    }
}
/* width */
.custom-scroll{
    overflow: auto;
    height: 393px;
    padding-left: 10px;
}
.custom-scroll::-webkit-scrollbar {
    width: 6px;
}
/* Track */
.custom-scroll::-webkit-scrollbar-track {
    background: #F5F5F5;
    border-radius: 5px;
}
/* Handle */
.custom-scroll::-webkit-scrollbar-thumb {
    background: #AFAFAF;
    border-radius: 5px;
}
/* Handle on hover */
.custom-scroll::-webkit-scrollbar-thumb:hover {
    background: #707070;
}
.side-h.custom-scroll{
    height: 770px;
}
.table-h.custom-scroll{
    height: 604px;
}
.fund-program{
    /*min-height: 740px;*/
    padding: 30px 20px 40px;
    height: auto!important;
}
.fund-program p {
    font-size: 12.7px;
    font-weight: bold;
    margin: 0px;
    color: #61002d;
}
.fund-program p span{
    color: #667e29;
}
.fund-program a.app-btn-two {
    background: #60012c;
    color: #fff;
    display: inline-flex;
    padding: 10px 15px;
    font-size: 16px;
    border-radius: 6px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    border: none;
    width: 100%;
}
.fund-program a.app-btn-two .btn-text {
    font-weight: 500;
    line-height: 20px;
    font-size: 12px;
}
.fund-program a.app-btn-two span {
    display: block;
}
.mr-5 {
    margin-right: 5px;
}
@media (max-width: 768px) {
    .fund-program {
        /*min-height: 780px;*/
    }
}
