.kt-header {
    background-color: white !important;
}

.kt-widget29__stats {
    font-size: 3.6rem !important;
}

.kt-header__brand .kt-header__brand-nav .btn {
    border-color: #F0443C;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    background-color: transparent;
    color: #F0443C;
}

.kt-header__brand .kt-header__brand-nav .show .btn, .kt-header__brand .kt-header__brand-nav .btn:hover {
    border-color: #F0443C;
    background-color: #F0443C;
    color: #ffffff;
}

.kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--user .kt-header__topbar-username {
    color: black;
}

.kt-header__topbar .kt-header__topbar-item .kt-header__topbar-wrapper .kt-header__topbar-icon i {
    color: #F0443C;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover > .kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover > .kt-menu__link .kt-menu__link-text {
    color: #F0443C !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__link .kt-menu__link-text {
    color: #F0443C !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__heading .kt-menu__link-icon, .kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--active > .kt-menu__link .kt-menu__link-icon {
    color: #F0443C !important;
}

.kt-font-brand {
    color: #F0443C !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover > .kt-menu__heading .kt-menu__link-icon, .kt-aside-menu .kt-menu__nav > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover > .kt-menu__link .kt-menu__link-icon {
    color: #F0443C !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--open > .kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--open > .kt-menu__link .kt-menu__link-text {
    color: #F0443C !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--open > .kt-menu__heading .kt-menu__link-icon, .kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--open > .kt-menu__link .kt-menu__link-icon {
    color: #F0443C !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--open > .kt-menu__heading .kt-menu__ver-arrow, .kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--open > .kt-menu__link .kt-menu__ver-arrow {
    color: #F0443C !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--active > .kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--active > .kt-menu__link .kt-menu__link-text {
    color: #F0443C !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--active > .kt-menu__heading .kt-menu__link-bullet.kt-menu__link-bullet--dot > span, .kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--active > .kt-menu__link .kt-menu__link-bullet.kt-menu__link-bullet--dot > span {
    background-color: #F0443C !important;
}

.full-width {
    width: 100%;
}

.kt-badge--danger {
    background: #dc3545 !important;
}

.font--danger {
    color: #dc3545 !important;
}

.selected-date {
    overflow-x: auto;
}

::-webkit-scrollbar {
    width: 10px !important;
}

::-webkit-scrollbar-track {
    background-color: #d5d5d5 !important;
    border-radius: 7px !important;
}

::-webkit-scrollbar-thumb {
    background-color: #959595 !important;
    border-radius: 7px !important;
}

@-moz-document url-prefix() {
    .browse-file {
        height: 26px !important;
        padding-bottom: 33px !important;
    }
}

.fc-event-title {
    color: #000;
    font-weight: 600;
    font-size: 11px !important;
}

/**************registration css***************/
@media (min-width:320px)  { .register-container{margin-left:2%; margin-right:2%; margin-top:2%;} }
@media (min-width:481px)  { .register-container{margin-left:2%; margin-right:2%; margin-top:2%;} }
@media (min-width:641px)  { .register-container{margin-left:2%; margin-right:2%; margin-top:2%;} }
@media (min-width:961px)  { .register-container{margin-left:2%; margin-right:2%; margin-top:2%;} }
@media (min-width:1025px) { .register-container{margin-left:15%; margin-right:15%; margin-top:2%;} }
@media (min-width:1281px) { .register-container{margin-left:15%; margin-right:15%; margin-top:2%;} }
.kt-portlet.register{box-shadow: 0px 0px 13px 0px rgb(82 63 105 / 10%)}

/****************** login **********************/
@media (min-width:320px)  { .login-container{margin-left:2%; margin-right:2%; margin-top:2%;} }
@media (min-width:481px)  { .login-container{margin-left:2%; margin-right:2%; margin-top:2%;} }
@media (min-width:641px)  { .login-container{margin-left:2%; margin-right:2%; margin-top:2%;} }
@media (min-width:961px)  { .login-container{margin-left:2%; margin-right:2%; margin-top:2%;} }
@media (min-width:1025px) { .login-container{margin-left:34%; margin-right:34%; margin-top:2%;} }
@media (min-width:1281px) { .login-container{margin-left:34%; margin-right:34%; margin-top:2%;} }
.kt-portlet.login{box-shadow: 0px 0px 13px 0px rgb(82 63 105 / 10%)}

.input-group.login {
    margin-bottom: 20px;
}

@media(max-width:640px){
    .mobile-hide-cl{
        display: none !important;
    }
    .mobile-nav{
        width: 100%;
        flex-wrap: nowrap !important;
    }
    .mobile-nav-toolbar{
        overflow-x: scroll;
    }
    ::-webkit-scrollbar {
        height: 3px;
    }
    .kt-header-mobile--fixed .kt-header__topbar{
        top: 60px;
    }
    .kt-header-mobile{
        height: 70px;
    }
    div#kt_body{
        margin: 20px 0 0;
    }

    .kt-subheader__breadcrumbs.only-for-mobile{
        padding: 6px 5px 5px 5px;
        font-size: 16px;
        font-weight: 500;
        display: block;
    }
}


@media(min-width:650px){
    .only-for-mobile.hide{
        display: none;
    }
}


@media (min-width:320px)  { .stripe-info-modal-dialog{width: 100%;margin: auto;height: inherit;} }
@media (min-width:481px)  { .stripe-info-modal-dialog{width: 100%;margin: auto;height: inherit;} }
@media (min-width:641px)  { .stripe-info-modal-dialog{width: 100%;margin: auto;height: inherit;} }
@media (min-width:961px)  { .stripe-info-modal-dialog{width: 100%;margin: auto;height: inherit;} }
@media (min-width:1025px) { .stripe-info-modal-dialog{width: 50%;margin: auto;height: inherit;} }
@media (min-width:1281px) { .stripe-info-modal-dialog{width: 50%;margin: auto;height: inherit;} }

.toggle-phone-social-security {
    position: absolute;
    z-index: 2;
    right: 20px;
    top: 14px;
}

/* ----- chat -----*/
.container{max-width:1170px; margin:auto;}
    img{ max-width:100%;}
    .inbox_people {
        background: #f8f8f8 none repeat scroll 0 0;
        float: left;
        overflow: hidden;
        width: 30%; 
        border-right:1px solid #c4c4c4;
    }
    .inbox_msg {
    border: 1px solid #c4c4c4;
    clear: both;
    overflow: hidden;
    }
    .top_spac{ margin: 20px 0 0;}


    .recent_heading {float: left; width:40%;}
    .srch_bar {
    display: inline-block;
    text-align: right;
    width: 60%;
    }
    .headind_srch{ padding:10px 29px 10px 20px; overflow:hidden; border-bottom:1px solid #c4c4c4;}

    .recent_heading h4 {
    color: #05728f;
    font-size: 21px;
    margin: auto;
    }
    .srch_bar input{ border:1px solid #cdcdcd; border-width:0 0 1px 0; width:80%; padding:2px 0 4px 6px; background:none;}
    .srch_bar .input-group-addon button {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: medium none;
    padding: 0;
    color: #707070;
    font-size: 18px;
    }
    .srch_bar .input-group-addon { margin: 0 0 0 -27px;}

    .chat_ib h5{ font-size:15px; color:#464646; margin:0 0 8px 0;}
    .chat_ib h5 span{ font-size:13px; float:right;}
    .chat_ib p{ font-size:14px; color:#989898; margin:auto}
    .chat_img {
    float: left;
    width: 11%;
    }
    .chat_ib {
    float: left;
    padding: 6px 0 0 15px;
    width: 88%;
    }

    .count_style{
        position: relative;
        padding-left: 16px;
    }

    .notify_count{
        position: absolute;
        left: 0;
        top: -4px;
        font-size: 0.6rem !important;
    }

    .chat_people{ overflow:hidden; clear:both;}
    .chat_list {
    border-bottom: 1px solid #c4c4c4;
    margin: 0;
    padding: 18px 16px 10px;
    cursor: pointer;
    }
    .inbox_chat { height: 100vh; overflow-y: scroll;}

    .active_chat{ background:#ebebeb;}

    .incoming_msg_img {
    display: inline-block;
    width: 4%;
    }
    .received_msg {
    display: inline-block;
    padding: 0 0 0 10px;
    vertical-align: top;
    width: 92%;
    }
    .received_withd_msg p {
    background: #ebebeb none repeat scroll 0 0;
    border-radius: 3px;
    color: #646464;
    font-size: 14px;
    margin: 0;
    padding: 5px 10px 5px 12px;
    width: 100%;
    }
    .time_date {
    color: #747474;
    display: block;
    font-size: 12px;
    margin: 8px 0 0;
    }
    .received_withd_msg { width: 56%;}
    .mesgs {
        float: left;
        padding: 7% 15px 0 25px;
        width: 70%;
    }

    .mesgs_monitor {
        float: left;
        padding: 30px 15px 0 25px;
        width: 100%;
    }

    .sent_msg p {
    background: #F0443C !important;
    border-radius: 3px;
    font-size: 14px;
    margin: 0; color:#fff;
    padding: 5px 10px 5px 12px;
    width:100%;
    }

    .sent_msg span.status.read {
        color: #07b0f1;
        font-size: medium;
        }
     .sent_msg span.status.unread {
         color: #58595af0;
         font-size: medium;
        }
    .sent_msg span.status i{
        font-weight: bold;
        }

    .outgoing_msg{ overflow:hidden; margin:26px 0 26px;}
    .sent_msg {
    float: right;
    width: 46%;
    }
    .input_msg_write input {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: medium none;
    color: #4c4c4c;
    font-size: 15px;
    min-height: 48px;
    width: 100%;
    padding-right: 40px;
    }

    .type_msg {border-top: 1px solid #c4c4c4;position: relative;}
    .msg_send_btn {
    background: #F0443C !important;
    border: medium none;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    font-size: 17px;
    height: 33px;
    position: absolute;
    right: 0;
    top: 11px;
    width: 33px;
    }
    .messaging { padding: 0 0 50px 0;}
    .msg_history {
        height: calc(100vh - 300px);
        overflow-y: auto;
        padding-bottom: 10px;
    }


    .chat-menu {
        top: 10%;
        width: 90%;
        height: 80%;
        background-color: #ffffff;
        position: absolute;
        display: block;
        padding: 10px;
        transform: translateX(-110%);
        transition: transform 0.2s ease-in;
        border: 1px solid gray;
    }
    
    /* When clicked, the menu background slides out to the right.*/
    .open2 {
      transform: translateX(-10px);
    }
    
    /* hamburger icon. Starts out light gray, hover state is gray. */
    .chat-menu-icon {
      width: 40px;
      height: 30px;
      background-color: none;
      transition: transform 0.2s ease-in;
      transform: translate(10px, 10px);
      z-index: 200;
    }
    .chat-menu-icon span {
      width: 40px;
      height: 3px;
      background-color: #D3D3D3;
      position: relative;
      display: block;
      transition: transform 0.2s ease-in;
    }
    .chat-menu-icon span::before {
      content: "";
      width: 40px;
      height: 3px;
      background-color: #D3D3D3;
      position: absolute;
      transform: translateY(10px);
      transition: transform 0.2s ease-in;
    }
    .chat-menu-icon span::after {
      content: "";
      width: 40px;
      height: 3px;
      background-color: #D3D3D3;
      transform: translateY(20px);
      position: absolute;
    }
    .chat-menu-icon:hover > span {
      background-color: #808080;
    }
    .chat-menu-icon:hover > span::before {
      /* background-color: #808080; */
      background-color: #000000;
    }
    .chat-menu-icon:hover > span::after {
      /* background-color: #808080; */
      background-color: #000000;
    }
    
    /* Applies to menu-item onclick through Javascript function toggleNav. Changes span and span::before to white, Changes span::after opacity to 0, and thranslates them and rotates to make an x. */
    .open {
      transform: translate(200px, 20px);
    }
    .open span.chat-board {
      /* background-color: white; */
      transform: rotate(45deg);
      background-color: #000000;
    }
    .open span.chat-board::before {
      transform: rotate(-90deg);
      /* background-color: white; */
      background-color: #000000;
    }
    .open span.chat-board::after {
      opacity: 0;
    }
    .open span.chat-board:hover, .open span.chat-board:hover::before, .open span.chat-board:hover::after {
      background-color: #D3D3D3;
    }
    
    /* Styling of nav list. When menu-icon is unclicked, list doesn't appear. */
    .chat-list {
      top: 45px;  
      color: #808080;
      list-style: none;
      font-size: 1.4em;
      line-height: 2em;
      position: absolute;
      display: none;
    }
    /* When menu-icon is clicked, list will appear. */
    .open3 {
      display: block;
      transform: translateX(3px);
    }
    
    /* When menu-icon is clicked, main section moves to the right and grays out.*/
    .open4 {
      background-color: #808080;
      z-index: -1;
    }


    @media screen and (min-width: 320px) and (max-width: 767px){
        .chat-menu-icon{
            display: block;
        }
        .inbox_msg {
            border: 1px solid #c4c4c4;
            /* clear: both; */
            overflow: visible;
            display: flex;
        }
        .inbox_people {
            background: #f8f8f8 none repeat scroll 0 0;
            /* float: left; */
            overflow: hidden;
            width: 100%;
            display: block;
            position: absolute;
            top: 6px;
        }
        .inbox_people .inbox_chat {
            display: none;
        }        
        .headind_srch {
            margin-top: 69px;
            z-index: 9999;
            /* position: absolute; */
            width: 72%;
            /* left: -38px; */
            border: none;
        }
        .kt-header-mobile--fixed .kt-header-mobile {
            z-index: 999;
        }
        .srch_bar input {
            padding: 7px 0 4px 6px;
        }
        .srch_bar {
            display: inline-block;
            text-align: start;
            width: 100%;
        }
        .recent_heading {
            display: none;
        }
        .mesgs {
            /* float: left; */
            padding: 30px 15px 0 25px;
            width: 100%;
        }
        .inbox_chat {
            height: 464px;
            overflow-y: scroll;
        }
        .open2 {
            overflow: hidden;
        }
        div#chat-menu-icon {
            width: 40px;
            height: 30px;
            background-color: none;
            transition: transform 0.2s ease-in;
            transform: scale(0.8) translate(10px, 10px)!important;
            z-index: 200;
            position: absolute;
            right: 50px;
        }
        .msg_history {
            height: 460px;
            overflow-y: auto;
            padding-bottom: 10px;
        }
    }

    @media screen and (min-width: 767px) {
       .chat-menu-icon{
         display: none;
       }
    }

    .avatar {
        vertical-align: middle;
        /* width: 50px; */
        /* height: 40px; */
        border-radius: 50%;
      }
      @media screen and (max-width: 768px) {
      .avatar {
        vertical-align: middle;
          width: 90px;
          height: 35px;
        border-radius: 50%;
      }
      }
      .toast-top-right {
        margin-top: 40px; /* Replace with your desired color code */
    }

    .delete-bg-color {
        background-color: #f0443c;
        color: white;
    }

    #kt_footer{
        position: fixed;
        bottom: 0;
        width: 100%;
        background-color: #ffffff;
        padding: 10px 0;
        z-index: 1000;
    }

    .popup-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.75);
        display: none;
        justify-content: center;
        align-items: center;
        z-index: 999999;
    }

    .popup-box {
        background: #fff;
        padding: 25px;
        width: 615px;
        border-radius: 10px;
        box-shadow: 0px 5px 25px rgba(0,0,0,0.3);
    }

    .popup-option {
        margin: 15px 0;
        font-size: 16px;
    }

    .popup-overlay.no-close {
        pointer-events: auto;
    }
    .popup-overlay.no-close * {
        pointer-events: auto;
    }