html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0px;
    padding: 0px;
}

p, ul, li, div, nav {
    padding: 0;
    margin: 0;
}

body {
    font-family: Open sans;
    margin: 0px;
}

nav a {
    cursor: pointer;
}

#tdMenu {
    width: 50px;
    vertical-align: top;
}

#tdbody {
    vertical-align: top;
}
/*=================================================================*/
#menu {
    /*overflow: auto;*/
    position: relative;
    z-index: 10;
}

.parent-menu {
    background-color: #4E546D;
    width: 50px;
    padding: 0px;
    height: 100%;
    margin: 0px;
    padding-bottom: 8px;
}
    
    .parent-menu li .bookmark_inactive svg path {
        fill: transparent !important;
        stroke: #BBBECE !important;
    }
      .parent-menu li .bookmark_inactive:hover svg path {
        fill: transparent !important;
        stroke: #fff !important;
    }
    
    .parent-menu li .bookmark_active svg path {
        fill: #3cbbc9;
        stroke: transparent !important;
    }
    .parent-menu li .bookmark_active:hover svg path {
        fill: #3cbbc9;
        stroke: transparent !important;
    }

    .parent-menu li .bookmark_active:hover svg path {
        stroke: transparent !important;
        fill: #3cbbc9 !important;
    }
    .parent-menu .menuhome svg path {
        fill: #BBBECE;
        stroke: transparent !important;
    }
.parent-menu .menuhome a.active svg path {
    stroke: transparent !important;
    fill: #fff;
}
    .parent-menu .menuhome a:hover svg path {
        stroke: transparent !important;
        fill: #fff;
    }
    
    #menu ul {
        list-style-type: none;
    }

#menu li {
    padding: 0px;
}

#menu ul li a {
    padding: 10px 10px;
    text-align: center;
    display: block;
    height: 17px;
    color: #D8DAE3;
    text-decoration: none;
}

#menu ul li a.email {
    padding: 10px 10px;
    text-align: left;
    display: block;
    height: 17px;
    color: #D8DAE3;
    text-decoration: none;
}

hr.home-border {
    background: linear-gradient(270deg, #4DB4F0 0%, #50F8F3 100%);
    box-shadow: 0px 16px 16px rgba(0, 0, 0, 0.15), 0px 8px 8px rgba(0, 0, 0, 0.15), 0px 4px 4px rgba(0, 0, 0, 0.15), 0px 2px 2px rgba(0, 0, 0, 0.15);
    height: 1px;
    border: 0px;
    width: 35px;
    margin: 0px auto;
    margin-bottom: 7px;
}

hr.menu-partition {
    background: #646C8C;
    height: 1px;
    border: 0px;
    width: 35px;
    margin: 10px auto;
}

#menu ul li a:hover {
    background-color: #59607D;
}

#menu .submenu-container ul li a:hover {
    background-color: transparent !important;
}

#menu ul li:hover .sub-menu::after {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI4IiB2aWV3Qm94PSIwIDAgOCA4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNNi42OTgzNiAzLjU5Nzg1TDMuOTczMTYgMS41ODQ0OEMzLjY0MzEgMS4zNDA2MyAzLjE3NjA1IDEuNTc2MjcgMy4xNzYwNSAxLjk4NjYzTDMuMTc2MDUgNi4wMTMzN0MzLjE3NjA1IDYuNDIzNzMgMy42NDMxIDYuNjU5MzcgMy45NzMxNiA2LjQxNTUyTDYuNjk4MzYgNC40MDIxNUM2Ljk2ODg5IDQuMjAyMjkgNi45Njg4OSAzLjc5NzcxIDYuNjk4MzYgMy41OTc4NVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=")
}

#menu ul li a:hover svg path {
    stroke: #fff;
}
.action-button li a:hover svg path {
    stroke: transparent !important;
}

#menu .action-button li a:hover {
    background-color: transparent !important;
}


/*#menu ul li:hover > ul {
    left: 50px;
    padding: 0px;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
}*/

#menu ul li > .submenu-container {
    position: absolute;
    overflow: hidden;
    padding-right: 5px;
    background-color: #242733;
    top: 0;
    left: -215px;
    min-width: 225px;
    z-index: -1;
    height: 100%;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
}
    #menu ul li > .submenu-container ol li:hover a {
        
        color: #fff;
        font-weight: 600;
    }

    #menu ul li > .submenu-container ul {
        overflow: auto;
        height: 100%;
        margin-right: 5px;
    }

    #menu ul li > .submenu-container h1 {
        padding-top: 37px;
        padding-left: 35px;
        margin: 0px;
        padding-bottom: 20px;
    }

    #menu ul li > .submenu-container b {
        font-size: 15px;
        display: block;
        font-family: Open Sans;
        font-style: normal;
        font-weight: normal;
        color: #7F86A4;
        margin-top: 5px;
    }

    #menu ul li > .submenu-container ol {
        margin: 0px;
        padding: 0px;
        list-style: none;
    }

        #menu ul li > .submenu-container ol li {
            font-family: Open Sans;
            font-style: normal;
            font-weight: normal;
            font-size: 11px;
            position: relative;
            line-height: 15px;
            color: #D8DAE3;
        }
            #menu ul li > .submenu-container ol li:hover {
                background-color: #2F3241;
            }

            a.bookmark::before {
                content: "";
                position: absolute;
                height: 16px;
                left: 18px;
                width: 10px;
                background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxMCAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuMDgzMTEgMTQuNjc5MUM5LjA4MzExIDE1LjAyMTEgOC44ODUzOSAxNS4xMDI1IDguNjQzNTIgMTQuODYxM0w1LjA0MTU2IDExLjI1OTNMMS40Mzk2IDE0Ljg2MTNDMS4xOTc3MyAxNS4xMDI1IDEgMTUuMDIxMSAxIDE0LjY3OTFWMS42MjE3OEMxIDEuNDU2ODcgMS4wNjU1MSAxLjI5ODcyIDEuMTgyMTEgMS4xODIxMUMxLjI5ODcyIDEuMDY1NTEgMS40NTY4NyAxIDEuNjIxNzggMUg4LjQ2MTM0QzguNjI2MjQgMSA4Ljc4NDM5IDEuMDY1NTEgOC45MDEgMS4xODIxMUM5LjAxNzYxIDEuMjk4NzIgOS4wODMxMSAxLjQ1Njg3IDkuMDgzMTEgMS42MjE3OFYxNC42NzkxWiIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=")
            }

a.sub-menu {
    position: relative;
}

    a.sub-menu::after {
        content: "";
        position: absolute;
        height: 6px;
        left: 38px;
        top: 15px;
        width: 7px;
        background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI4IiB2aWV3Qm94PSIwIDAgOCA4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNNi42OTgzNiAzLjU5Nzg1TDMuOTczMTYgMS41ODQ0OEMzLjY0MzEgMS4zNDA2MyAzLjE3NjA1IDEuNTc2MjcgMy4xNzYwNSAxLjk4NjYzTDMuMTc2MDUgNi4wMTMzN0MzLjE3NjA1IDYuNDIzNzMgMy42NDMxIDYuNjU5MzcgMy45NzMxNiA2LjQxNTUyTDYuNjk4MzYgNC40MDIxNUM2Ljk2ODg5IDQuMjAyMjkgNi45Njg4OSAzLjc5NzcxIDYuNjk4MzYgMy41OTc4NVoiIGZpbGw9IiMyQjJEM0IiLz4KPC9zdmc+Cg==")
    }

a.active svg path {
    stroke: #fff;
}

li:hover a.sub-menu svg path {
    stroke: #fff;
}

a.sub-menu.active::after {
    content: "";
    position: absolute;
    height: 6px;
    left: 38px;
    top: 15px;
    width: 7px;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI4IiB2aWV3Qm94PSIwIDAgOCA4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNNi42OTgzNiAzLjU5Nzg1TDMuOTczMTYgMS41ODQ0OEMzLjY0MzEgMS4zNDA2MyAzLjE3NjA1IDEuNTc2MjcgMy4xNzYwNSAxLjk4NjYzTDMuMTc2MDUgNi4wMTMzN0MzLjE3NjA1IDYuNDIzNzMgMy42NDMxIDYuNjU5MzcgMy45NzMxNiA2LjQxNTUyTDYuNjk4MzYgNC40MDIxNUM2Ljk2ODg5IDQuMjAyMjkgNi45Njg4OSAzLjc5NzcxIDYuNjk4MzYgMy41OTc4NVoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=")
}

#menu ul li > .submenu-container ol li a.submenulink {
    text-align: left;
    padding-left: 35px !important;
    padding: 5px 10px;
}

#menu ul li > .submenu-container ol h2 {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    padding-left: 35px;
    font-size: 11px;
    line-height: 15px;
    color: #646C8C;
    padding-bottom: 10px;
}

#menu ul li > .submenu-container ol li:last-child {
    margin-bottom: 20px;
}


.avatar {
    width: 30px;
    height: 30px;
    position: absolute;
    left: 0px;
    top: 0px;
    right:0px;
    bottom: 0px;
    margin: auto;
    border-radius: 50%;
    background-color: #d8d8d8;
    overflow: hidden;
    cursor: pointer;
}

.mat-card-avatar {
    height: auto;
    width: auto;
    max-width: 100%;
    min-width: 100%;
    min-height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: -100%;
    left: -100%;
    right: -100%;
    bottom: -100%;
    margin: auto;
    display: block;
}

.avatar-profile {
    width: 50px;
    height: 50px;
    margin-top: 50px;
    margin-left: 35px;
    border-radius: 50%;
    background-color: #d8d8d8;
    overflow: hidden;
    position: relative;
}
.menuhome{
color:#000;
}
.avatar-profile .mat-card-avatar {
    height: auto;
    width: auto;
    max-width: 100%;
    min-width: 100%;
    min-height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: -100%;
    left: -100%;
    right: -100%;
    bottom: -100%;
    margin: auto;
    display: block;
}

.profile h1 {
    font-family: Open Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    margin-bottom: 0px;
    line-height: 20px;
    MARGIN-TOP: 30PX;
    color: #7F86A4;
    padding-left: 35px;
}

.profile h2 {
    font-family: Open Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 10px;
    margin: 5px 0px 0px;
    line-height: 14px;
    color: #4E556F;
    padding-left: 35px;
}

.profile a.email {
    font-family: Open Sans;
    padding: 0px !important;
    font-style: normal;
    font-weight: normal;
    font-size: 10px;
    MARGIN-TOP: 5PX;
    text-decoration: none;
    line-height: 14px;
    color: #3CBBC9 !important;
    margin-left: 35px;
    max-width: 170px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: block;
}
    .profile a.email:hover {
        background-color:transparent !important;
    }

    .profile-button-container {
        margin: 0px;
        margin-top: 20px;
    }
    .profile-button-container a:hover {
        background-color: #2F3241 !important;
        color: #fff !important;
        font-weight: 600;
    }

.profile-button-container a {
    text-align: left !important;
    font-family: Open Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 11px !important;
    text-decoration: none;
    color: #D8DAE3 !important;
    padding: 5px 5px 5PX 35PX !important;
    display: block;
}

.profile {
    height: 461px;
    /*display: none;*/
    width: 225px;
    position: absolute;
    left: -215px;
    bottom: 0px;
    z-index:-1;
    background-color: #242733;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;    
}

.profile .action-button {
    margin: 0px;
    padding: 0px;
    list-style: none;
    margin-left: 35px;
    margin-top: 20px;
}

.profile .action-button li {
    border: 1px solid #646C8C;
    border-radius: 50px;
    display: inline-block;
    height: 15px;
    width: 15px;
    padding: 10px !important;
    text-align: center;
    margin-right: 5px;
}

.profile .action-button li:hover {
    border: 1px solid #fff;
    cursor: pointer;
}

.profile .action-button li:hover svg path {
    fill: #fff;
}

.profile .action-button .calender:hover svg path {
    stroke: #fff !important;
    fill: transparent !important;
}

.action-button li svg {
    vertical-align: top;
    margin: auto;
    HEIGHT: 15PX;
    WIDTH: 15PX;
}

.profile-devider {
    height: 1px;
    background: #393E51;
    border: 0px;
    margin: 20px auto;
    width: 157px;
}

.logout {
    font-family: Open Sans;
    font-style: normal;
    font-weight: bold;
    font-size: 11px;
    margin-left: 35px;
    text-align: left !important;
    padding: 0px !important;
}
    .logout:hover {
        color: #fff !important;
        background-color:transparent !important;
    }



/*==========================================================================================================*/
.menuTitleShow {
    left: 60px !important;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
    display: block !important;
}

div.menuHover {
    position: absolute;
    overflow: hidden;
    background-color: #242733;
    top: 0;
    left: -200px;
    min-width: 109px;
    z-index: 999;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
    padding: 5px;
    text-align: center;
    vertical-align: middle;
    line-height: 20px;
    height: 20px;
    color: #D8DAE3;
    text-decoration: none;
    font-size: 11px;
    font-weight: 500;
    display: none;
    border-radius: 3px;
}

.subMenuTitleShow {
    /*left: 200px !important;*/
    display: block !important;
}

div.subMenuHover {
    position: fixed;
    overflow: hidden;
    background-color: #4E556F;
    top: 0;
    left: -200px;
    min-width: 109px;
    z-index: 999;
    padding: 5px;
    text-align: center;
    vertical-align:middle;
    line-height:20px;
    height: 20px;
    text-decoration: none;
    font-style: normal;
    font-weight: 600;
    font-size: 11px;
    color: #D8DAE3;
    display: none;
    border-radius: 3px;
}

.show-sub-menu {
    left: 50px !important;
    padding: 0px;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
}

.submenu-container ul::-webkit-scrollbar {
    width: 7px;
}

.submenu-container ul::-webkit-scrollbar-thumb {
    -webkit-border-radius: 20px;
    border-radius: 20px;
    background: #0E1015;
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 50%);
}

.select-main-main {
    background-color: #59607D;
}

.profile .action-button {
    margin: 0px;
    padding: 0px;
    list-style: none;
    margin-left: 35px;
    margin-top: 20px;
}

.profile .action-button li {
    border: 1px solid #646C8C;
    border-radius: 50px;
    display: inline-block;
    height: 15px;
    width: 15px;
    padding: 10px !important;
    text-align: center;
    margin-right: 5px;
}



.profile .action-button li:hover {
    border: 1px solid #fff;
    cursor: pointer;
}

.profile .action-button li:hover svg path {
    fill: #fff;
}

.profile .action-button .calender:hover svg path {
    stroke: #fff;
    fill: transparent !important;
}

.action-button li svg {
    vertical-align: top;
    margin: auto;
}

.action-button li a {
    padding: 0px !important;
}

.bookmark_active {
    opacity: 0;
    position: absolute !important;
    top: 5px !important;
    left: 13px !important;
    cursor: pointer !important;
    padding: 0px !important;
}

.bookmark_inactive {
    opacity: 0;
    position: absolute !important;
    top: 5px !important;
    left: 13px !important;
    cursor: pointer !important;
    padding: 0px !important;
}

.add_new {
    opacity: 0;
    position: absolute !important;
    top: 7px !important;
    right: 30px !important;
    cursor: pointer !important;
    padding: 0px !important;
}

.add_new1 {
    opacity: 0;
    position: absolute !important;
    top: 7px !important;
    right: 50px !important;
    cursor: pointer !important;
    padding: 0px !important;
}

.add_search {
    opacity: 0;
    position: absolute !important;
    top: 7px !important;
    right: 10px !important;
    cursor: pointer !important;
    padding: 0px !important;
}
.menubookmark_cancel {
    opacity: 0;
    position: absolute !important;
    top: 7px !important;
    left: 13px !important;
    cursor: pointer !important;
    padding: 0px !important;
}
    .menubookmark_cancel:hover svg rect{
        fill:#fff;
    }
    
    .fixed_menu {
        position: absolute;
        bottom: 0px;
    }

.notification {
    /*display: none;*/
    width: 312px;
    position: absolute;
    left: -265px;
    bottom: 0px;
    background-color: #242733;
    /* overflow: hidden; */
    height: 300px;
    z-index: -1;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
}
.recentVisits {
    /*display: none;*/
    width: 312px;
    position: absolute;
    left: -265px;
    bottom: 0px;
    background-color: #242733;
    /* overflow: hidden; */
    height: 300px;
    z-index: -1;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
}

.DataNotExists {
    position: absolute;
    margin: auto;
    left: 0px !important;
    right: 0px;
    bottom: 0px;
    height: 70px;
    top: 0px;
    text-align: center;
}
.DataNotExists h1 {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    text-align: center;
    color: #646C8C;
    padding: 0px !important;
}

.DataNotExists p {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 11px;
    text-align: center;
    color: #646C8C;
    width: 200px;
    margin: auto;
}

.Initial-profile {
    border-radius: 50%;
    text-transform: uppercase;
    background: #d8d8d8;
    position: relative;
    overflow: hidden;
    font-size: 20px;
    line-height: 47px;
    font-family: Open Sans;
    font-style: normal;
    font-weight: 700;
    color: #fff;
    text-align: center;
    width: 50px;
    height: 50px;
    margin-top: 50px;
    margin-left: 35px
}
.wfx-menu-tab-count {
    background: #408C7F;
    padding: 1px 3px;
    border-radius: 3px;
    line-height: 11px;
    font-style: normal;
    font-weight: 600;
    font-size: 8px;
    color: #d8dae3;
    Position: absolute;
    top: 22px;
    text-align: center;
    left: 25px;
    font-weight: bold;
}
li:hover .wfx-menu-tab-count {
    color: #fff;
}

@media only screen and (min-height: 800px) and (max-height: 1079px) {
    #menu ul li a {
        padding: 17px 10px;
    }
    .wfx-menu-tab-count {
        top:29px;
    }
    #profilelink {
        height:31px;
    }
        #profilelink .Initial-lg {
            top: 8px;
        }

        #profilelink .avatar {
            top: 8px;
        }

    a.sub-menu::after {
        top: 22px;
    }

    a.sub-menu.active::after {
        top: 22px;
    }
}
 #menu ul li:hover > .submenu-container, #menu ul li:hover > .notification,#menu ul li:hover > .recentVisits,  #menu ul li:hover > .profile {
    left: 50px;
    padding: 0px;
    -webkit-transition: left 200ms ease-in;
    -moz-transition: left 200ms ease-in;
    -ms-transition: left 200ms ease-in;
    transition: left 200ms ease-in;
}

#profilelink{
    padding:10px 12px !important;
}

#div_mnuBookmarks, #div_mnuAdmin{
    bottom: 0 !important;
    top:unset !important;
}