@charset "utf-8";
/* CSS Document */




@media screen and (min-width: 1200px) {

    .backdrop-layout{
        position: fixed;
        background: #00000000;
        width: 100%;
        height: 100vh;
        z-index: 0;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: 0;	
        transition: all 0.2s;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
    }
    .backdrop-layout.open{
        display: none;
        opacity: 0;
        z-index: -1;
    }

    .menubar {
        transform: translate(-100% , 0px) !important;
        transition: all 0.2s;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
    }
    .menubar.open{	
        transform: translate(0% , 0px) !important;
    }
    .collapse_nav {
        display:block;
    }
    .main_body{
        margin-left: 0;
    }
    .main_body.open {
        margin-left: 230px;
    }
    .topmenubar{
         left: 0;
    }
    .main_body.open .topmenubar{
        left: 230px;
    }

}
@media screen and (min-width: 992px) and (max-width: 1199px)  {
    .dash_bx {
        padding: 20px 10px;
    }
    .dash_bx span {
        font-size: 30px;
    }
    .dash_bx h1 {
        font-size: 23px;
    }
    .dash-container {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }
    .main_body {
        margin-left: 0;
    }
    .backdrop-layout{
        position: fixed;
        background: #0000008c;
        width: 100%;
        height: 100vh;
        z-index: 0;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: 0;	
        transition: all 0.2s;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
    }
    .backdrop-layout.open{
        opacity: 1;
        z-index: 991;
    }
    .topmenubar{
        left: 0;
    }
    .menubar {
        transform: translate(-100% , 0px);	
        transition: all 0.2s;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
    }
    .menubar.open{
        transform: translate(0% , 0px);
    }
    .collapse_nav {
        display:block;
    }
    .tab_responsive_vertical {
        display: flex;
        align-items: center;
        width: 100%;
        overflow: auto;
    }
    .tab_responsive_vertical li {
        display: block;
        width: max-content;
        padding: 9px 20px;
        margin-bottom: 0;
        border-radius: 50px;
        text-align: center;
        margin: 0 3px;
    }
    .chat_section{
        padding: 0 !important;
        height: 95vh !important;
    }
} 
@media screen and (min-width: 768px) and (max-width: 991px)  {
    .dash_bx h1 {
        font-size: 27px;
    }
    .dash-container {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }
    .main_body {
        margin-left: 0;
    }
    .backdrop-layout{
        position: fixed;
        background: #0000008c;
        width: 100%;
        height: 100vh;
        z-index: 0;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: 0;	
        transition: all 0.2s;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
    }
    .backdrop-layout.open{
        opacity: 1;
        z-index: 99;
    }
    .topmenubar{
        left: 0;
    }
    .menubar {
        transform: translate(-100% , 0px);	
        transition: all 0.2s;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
    }
    .menubar.open{
        transform: translate(0% , 0px);
    }
    .collapse_nav {
        display:block;
    }
    .tab_responsive_vertical {
        display: flex;
        align-items: center;
        width: 100%;
        overflow: auto;
    }
    .tab_responsive_vertical li {
        display: block;
        width: max-content;
        min-width: 231px;
        padding: 9px 20px;
        margin-bottom: 0;
        border-radius: 50px;
        text-align: center;
        margin: 0 3px;
    }
    .chat_section{
        padding: 0 !important;
        height: 93vh !important;
    }
}
@media only screen and (max-width : 576px) {
    ::-webkit-scrollbar {
        width: 0px;
    }
    .desktop-mode{
        display: none !important;
    }
    .mobile-mode{
        display: block !important;
    }
    .main_body {
        margin-left: 0;
    }
    .backdrop-layout{
        position: fixed;
        background: #0000008c;
        width: 100%;
        height: 100vh;
        z-index: 0;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: 0;	
        transition: all 0.2s;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
    }
    .backdrop-layout.open{
        opacity: 1;
        z-index: 991;
    }
    .topmenubar{
        left: 0;
    }
    .menubar {
        transform: translate(-100% , 0px);	
        transition: all 0.2s;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
    }
    .menubar.open{
        transform: translate(0% , 0px);
    }
    .collapse_nav {
        display:block;
    }
    .dash-container {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }
    .page_title {
        font-size: 17px;
    }
    .table-profile tr{
        display: block;
    width: 100%;
    }
    .table-profile tr td {
        display: block;
        width: 100% !important;
    }
    .table-profile tr td:first-child{
        border-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
    /*-------canendar--------*/
    .fc .fc-toolbar {
        display: block;
    }
    .fc table {
        font-size: 0.8em !important;
    }
    .fc .fc-toolbar-title {
        font-size: 1.2em;
        margin: 10px 0;
    }
    .notice_bar {
        display: block;
        height: auto;
        padding: 10px;
        border-radius: 10px;
    }
    .dash_title{
        border: 0 !important;
    }
    .tab_responsive_vertical {
        display: flex;
        align-items: center;
        width: 100%;
        overflow: auto;
    }
    .tab_responsive_vertical li {
        display: block;
        width: max-content;
        min-width: 231px;
        padding: 9px 20px;
        margin-bottom: 0;
        border-radius: 50px;
        text-align: center;
        margin: 0 3px;
    }
    .cover_sec {
        width: 100%;
        height: 140px;
    }
    .cover_sec,.profile_details_pp {
        padding-left: 10px;
        padding-right: 10px;
        margin-top: 6px;
    }
    .ppp_img {
        width: 77px;
        height: 77px;
    }
    .cover_profile_imge h2 {
        font-size: 16px;
    }
    .prof_img_dp {
        max-width: 23px;
        min-width: 23px;
        height: 23px;
    }
    .chat_section{
        padding: 0 !important;
        height: 89vh !important;
    }
    .referal_contnet h1 {
        font-size: 26px;
    }
    .referal_contnet p {
        font-size: 14px;
    }
}