body {
    position: relative;
    overflow-x: hidden;
    background-color: #CFD8DC;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important;
    font-size: 14px !important;
}

body,
html {
    /*height: 100%;*/
}

.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
    /*background-color: transparent;*/
    background-color: #808080 !important;
}

/*-------------------------------*/
/*           Wrappers            */
/*-------------------------------*/

#wrapper {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

    #wrapper.toggled {
        padding-left: 220px;
    }

#sidebar-wrapper {
    z-index: 1000;
    /*left: 220px;*/
    width: 0;
    height: 100%;
    /*margin-left: -220px;*/
    overflow-y: auto;
    overflow-x: hidden;
    /*background: #1a1a1a;*/
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    margin-top: 57px;
}

    #sidebar-wrapper::-webkit-scrollbar {
        display: none;
    }

#wrapper.toggled #sidebar-wrapper {
    width: 230px;
}

#page-content-wrapper {
    width: 100%;
    /*padding-top: 70px;*/
}

#wrapper.toggled #page-content-wrapper {
    position: absolute;
    margin-right: -220px;
}

/*-------------------------------*/
/*     Sidebar nav styles        */
/*-------------------------------*/
.navbar {
    padding: 0;
}

.sidebar-nav {
    position: absolute;
    top: 0;
    width: 230px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .sidebar-nav li {
        /*position: relative;*/
        position: initial !important;
        line-height: 20px;
        /*display: inline-block;*/
        width: 100%;
    }

        /*        .sidebar-nav li:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            z-index: -1;
            height: 100%;
            width: 3px;
            background-color: #1c1c1c;
            -webkit-transition: width .2s ease-in;
            -moz-transition: width .2s ease-in;
            -ms-transition: width .2s ease-in;
            transition: width .2s ease-in;
        }*/

        .sidebar-nav li:first-child a {
            /*            color: #fff;
            background-color: #1a1a1a;*/
        }

        .sidebar-nav li:nth-child(5n+1):before {
            background-color: #ec1b5a;
        }

        .sidebar-nav li:nth-child(5n+2):before {
            background-color: #79aefe;
        }

        .sidebar-nav li:nth-child(5n+3):before {
            background-color: #314190;
        }

        .sidebar-nav li:nth-child(5n+4):before {
            background-color: #279636;
        }

        .sidebar-nav li:nth-child(5n+5):before {
            background-color: #7d5d81;
        }

        .sidebar-nav li:hover:before,
        .sidebar-nav li.open:hover:before {
            width: 100%;
            -webkit-transition: width .2s ease-in;
            -moz-transition: width .2s ease-in;
            -ms-transition: width .2s ease-in;
            transition: width .2s ease-in;
        }

        .sidebar-nav li a {
            display: block;
            color: white !important;
            text-decoration: none;
            padding: 10px 15px 10px 30px !important;
        }

            .sidebar-nav li a:hover,
            .sidebar-nav li a:active,
            .sidebar-nav li a:focus,
            .sidebar-nav li.open a:hover,
            .sidebar-nav li.open a:active,
            .sidebar-nav li.open a:focus {
                color: black !important;
                text-decoration: none;
                background-color: #808080 !important;
            }

.sidebar-header {
    text-align: center;
    font-size: 20px;
    position: relative;
    width: 100%;
    display: inline-block;
}

.sidebar-brand {
    /*height: 65px;*/
    /*position: relative;*/ /*position: relative;*/
    /*    background: #212531;
    background: linear-gradient(to right bottom, #2f3441 50%, #212531 50%);*/
    /*padding-top: 1em;*/
    background-color: #ffc107;
    font-size: 16px;
    padding: 8px;
}

    .sidebar-brand a {
        color: black;
        font-variant: small-caps !important;
        font-weight: 700;
        text-transform: none;
    }

        .sidebar-brand a:hover {
            color: black;
            text-decoration: none;
        }

.dropdown-header {
    text-align: center;
    font-size: 1em;
    color: #ddd;
    background: #212531;
    background: linear-gradient(to right bottom, #2f3441 50%, #212531 50%);
}

.sidebar-nav .dropdown-menu {
    /*position: relative;*/
    position: inherit;
    width: 100%;
    padding: 0;
    margin: 0;
    border-radius: 0;
    border: none;
    background-color: #222;
    box-shadow: none;
    padding-left: 20px;
}

.dropdown-menu.show {
    top: 0;
}

/*-------------------------------*/
/*       Hamburger-Cross         */
/*-------------------------------*/

/*.hamburger {
    position: absolute;*/
/*position: fixed;*/
/*top: 20px;*/
/*z-index: 999;
    display: block;
    width: 23px;
    height: 26px;
    margin-left: 15px;
    background: transparent;
    border: none;
    margin-top: 3px;
}

    .hamburger:hover,
    .hamburger:focus,
    .hamburger:active {
        outline: none;
    }

    .hamburger.is-closed:before {*/
/*content: '';*/
/*display: block;
        width: 100px;
        font-size: 14px;
        color: #fff;
        line-height: 32px;
        text-align: center;
        opacity: 0;
        -webkit-transform: translate3d(0,0,0);
        -webkit-transition: all .35s ease-in-out;
    }

    .hamburger.is-closed:hover:before {
        opacity: 1;
        display: block;
        -webkit-transform: translate3d(-100px,0,0);
        -webkit-transition: all .35s ease-in-out;
    }

    .hamburger.is-closed .hamb-top,
    .hamburger.is-closed .hamb-middle,
    .hamburger.is-closed .hamb-bottom,
    .hamburger.is-open .hamb-top,
    .hamburger.is-open .hamb-middle,
    .hamburger.is-open .hamb-bottom {
        position: absolute;
        left: 0;
        height: 4px;
        width: 100%;
    }

    .hamburger.is-closed .hamb-top,
    .hamburger.is-closed .hamb-middle,
    .hamburger.is-closed .hamb-bottom {
        background-color: white;
    }

    .hamburger.is-closed .hamb-top {
        top: 5px;
        -webkit-transition: all .35s ease-in-out;
    }

    .hamburger.is-closed .hamb-middle {
        top: 50%;
        margin-top: -2px;
    }

    .hamburger.is-closed .hamb-bottom {
        bottom: 5px;
        -webkit-transition: all .35s ease-in-out;

    }

    .hamburger.is-closed:hover .hamb-top {
        top: 0;
        -webkit-transition: all .35s ease-in-out;
    }

    .hamburger.is-closed:hover .hamb-bottom {
        bottom: 0;
        -webkit-transition: all .35s ease-in-out;
    }

    .hamburger.is-open .hamb-top,
    .hamburger.is-open .hamb-middle,
    .hamburger.is-open .hamb-bottom {
        background-color: #1a1a1a;
    }

    .hamburger.is-open .hamb-top,
    .hamburger.is-open .hamb-bottom {
        top: 50%;
        margin-top: -2px;
    }

    .hamburger.is-open .hamb-top {
        -webkit-transform: rotate(45deg);
        -webkit-transition: -webkit-transform .2s cubic-bezier(.73,1,.28,.08);
    }

    .hamburger.is-open .hamb-middle {
        display: none;
    }

    .hamburger.is-open .hamb-bottom {
        -webkit-transform: rotate(-45deg);
        -webkit-transition: -webkit-transform .2s cubic-bezier(.73,1,.28,.08);
    }

    .hamburger.is-open:before {
        content: '';
        display: block;
        width: 100px;
        font-size: 14px;
        color: #fff;
        line-height: 32px;
        text-align: center;
        opacity: 0;
        -webkit-transform: translate3d(0,0,0);
        -webkit-transition: all .35s ease-in-out;
    }

    .hamburger.is-open:hover:before {
        opacity: 1;
        display: block;
        -webkit-transform: translate3d(-100px,0,0);
        -webkit-transition: all .35s ease-in-out;
    }*/

/*-------------------------------*/
/*            Overlay            */
/*-------------------------------*/

.overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(250,250,250,.8);
    z-index: 1;
}



/*-------------------------------*/
/*            NEW MENU BAR       */
/*-------------------------------*/

body {
    font-family: 'Work Sans', sans-serif;
    margin: 0;
    background-color: #eee;
}

/* Layout */

#container {
    padding: 0;
    margin: 0;
    background-color: #fff;
}

/*#main {
    padding: 4% 1.5em;
    max-width: 55em;
    margin: 0 auto;
}*/

#header {
    padding: 1.5em;
    margin: 0 0 1em 0;
    background-color: #eee;
}

#footer {
    padding: 1.5em;
    margin: 2em 0 0 0;
    background-color: #eee;
}


/* Menu Styles */

.primary-nav {
    position: absolute;
    z-index: 999;
    margin-top: 2px;
}

.menu {
    position: relative;
}

    .menu ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

.open-panel {
    border: none;
    background-color: #fff;
    padding: 0;
}

.hamburger {
    background: var(--yellow-header);
    position: relative;
    display: block;
    text-align: center;
    padding: 13px 0;
    /*width: 50px;*/
    width: 40px;
    height: 53px;
    left: 0;
    top: 0;
    z-index: 1000;
    cursor: pointer;
}

    .hamburger:before {
        content: "\2630"; /* hamburger icon */
        display: block;
        color: #000;
        line-height: 32px;
        font-size: 16px;
    }

.openNav .hamburger:before {
    content: "\2715"; /* close icon */
    display: block;
    color: #000;
    line-height: 32px;
    font-size: 16px;
}

.hamburger:hover:before {
    color: #777;
}

.primary-nav .menu li {
    position: relative;
}

.menu .icon {
    position: absolute;
    top: 12px;
    right: 10px;
    pointer-events: none;
    width: 24px;
    height: 24px;
    color: #fff;
}

.menu,
.menu a,
.menu a:visited {
    color: #aaa;
    text-decoration: none !important;
    position: relative;
}

    .menu a {
        display: block;
        white-space: nowrap;
        padding: 1em;
        font-size: 14px;
    }

        .menu a:hover {
            color: #fff;
        }

.menu {
    margin-bottom: 3em;
}

.menu-dropdown li .icon {
    color: #777;
}

.menu-dropdown li:hover .icon {
    color: #fff;
}



.menu label {
    margin-bottom: 0;
    display: block;
}

    .menu label:hover {
        cursor: pointer;
    }

.menu input[type="checkbox"] {
    display: none;
}

input#menu[type="checkbox"] {
    display: none;
}






.sub-menu-dropdown {
    display: none;
}

.new-wrapper {
    position: absolute;
    left: 50px;
    width: calc(100% - 50px);
    transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1);
}

#menu:checked + ul.menu-dropdown {
    left: 0;
    -webkit-animation: all .45s cubic-bezier(0.77, 0, 0.175, 1);
    animation: all .45s cubic-bezier(0.77, 0, 0.175, 1);
}

.sub-menu-checkbox:checked + ul.sub-menu-dropdown {
    display: block !important;
    -webkit-animation: grow .45s cubic-bezier(0.77, 0, 0.175, 1);
    animation: grow .45s cubic-bezier(0.77, 0, 0.175, 1);
}


.openNav .new-wrapper {
    position: absolute;
    transform: translate3d(200px, 0, 0);
    width: calc(100% - 250px);
    transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1);
}


.downarrow {
    background: transparent;
    position: absolute;
    right: 50px;
    top: 12px;
    color: #777;
    width: 24px;
    height: 24px;
    text-align: center;
    display: block;
}

    .downarrow:hover {
        color: #fff;
    }

.menu {
    position: absolute;
    display: block;
    /*left: -200px;*/
    left: -210px;
    top: 0;
    width: 250px;
    transition: all 0.45s cubic-bezier(0.77, 0, 0.175, 1);
    background-color: #000;
    z-index: 999;
}

.menu-dropdown {
    top: 0;
    overflow-y: auto;
}

.overflow-container {
    position: relative;
    height: calc(100vh - 73px) !important;
    overflow-y: auto;
    border-top: 53px solid var(--yellow-header);
    z-index: -1;
    display: block;
}

.menu a.logotype {
    position: absolute !important;
    top: 7px;
    left: 55px;
    display: block;
    font-family: 'Work Sans', sans-serif;
    text-transform: uppercase;
    font-weight: 800;
    color: #000;
    font-size: 14px;
    padding: 10px;
}

    .menu a.logotype span {
        font-weight: 400;
    }

    .menu a.logotype:hover {
        color: #777;
    }

.sub-menu-dropdown {
    background-color: #333;
}

.menu:hover {
    position: absolute;
    left: 0;
    top: 0;
}

.openNav .menu:hover {
    position: absolute;
    left: -200px;
    top 73px;
}

.openNav .menu {
    top 73px;
    transform: translate3d(200px, 0, 0);
    transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1);
}

/* label.hamburger {
		display: none;
	} */













/* look and feel only, not needed for core menu*/

@-webkit-keyframes grow {

    0% {
        display: none;
        opacity: 0;
    }

    50% {
        display: block;
        opacity: 0.5;
    }

    100% {
        opacity: 1;
    }
}

@keyframes grow {

    0% {
        display: none;
        opacity: 0;
    }

    50% {
        display: block;
        opacity: 0.5;
    }

    100% {
        opacity: 1
    }
}










/* Text meant only for screen readers. */

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

    .screen-reader-text:focus {
        background-color: #f1f1f1;
        border-radius: 3px;
        -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
        box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
        clip: auto !important;
        color: #21759b;
        display: block;
        font-size: 14px;
        font-size: 0.875rem;
        font-weight: bold;
        height: auto;
        left: 5px;
        line-height: normal;
        padding: 15px 23px 14px;
        text-decoration: none;
        top: 5px;
        width: auto;
        z-index: 100000;
        /* Above WP toolbar. */
    }











/* Resposive Typography */


body,
button,
input,
select,
optgroup,
textarea {
    color: #000;
    font-size: 1em;
    line-height: 1.5;
    font-weight: 300;
}

h1, h2, h3, h4, h5, h6 {
    clear: both;
    font-weight: 800;
}

dfn, cite, em, i {
    font-style: italic;
}

blockquote {
    margin: 0 1.5em;
}

address {
    margin: 0 0 1.5em;
}

pre {
    background: #eee;
    font-family: "Courier 10 Pitch", Courier, monospace;
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 1.6;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
    padding: 1.6em;
}

code, kbd, tt, var {
    font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    font-size: 15px;
    font-size: 0.9375rem;
}

abbr, acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}

mark, ins {
    background: #fff9c0;
    text-decoration: none;
}

big {
    font-size: 125%;
}

.light {
    color: #ddd;
}

strong {
    font-weight: 600;
}

cite,
em,
i {
    font-style: italic;
}

p.big {
    font-size: 140%;
    line-height: 1.3em;
}

p.small {
    font-size: 80%;
}

blockquote {
    display: block;
    margin: 1em 20px;
    padding: 0 1em;
    position: relative;
}

    blockquote:before {
    }

    blockquote cite,
    blockquote em,
    blockquote i {
        font-style: italic;
    }

abbr,
acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}

sup,
sub {
    height: 0;
    line-height: 1;
    vertical-align: baseline;
    position: relative;
}

sup {
    bottom: 1ex;
}

sub {
    top: .5ex;
}


p {
    font-size: 1em;
    margin: 0 0 2em 0;
}

    article:last-of-type, p:last-of-type {
        margin-bottom: 0;
    }

    p.intro {
        font-size: 1.25em;
        line-height: 1.5;
        font-weight: 300;
        margin: 0 0 1.5em 0;
    }

h1, h2 {
    letter-spacing: -1px;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
    margin: 0 0 0.5em 0;
    line-height: 1.1;
}

h1, .h1 {
    font-size: 2.074em;
}

h2, .h2 {
    font-size: 1.728em;
}

h3, .h3 {
    font-size: 1.44em;
}

h4, .h4 {
    font-size: 1.2em;
}



/* Medium Screen Typography - Scale: 1.333 Perfect Fourth (thanks http://type-scale.com/)  */

@media screen and (min-width: 42em) {

    h1, .h1 {
        letter-spacing: -2px;
    }

    h1, .h1 {
        font-size: 3.157em;
    }

    h2, .h2 {
        font-size: 2.369em;
    }

    h3, .h3 {
        font-size: 1.777em;
    }

    h4, .h4 {
        font-size: 1.333em;
    }

    p {
        font-size: 1.0625em;
    }

        p.intro {
            font-size: 1.3em;
        }
}


/* Large Screen Typography  - Scale: 1.414 Augmented Fourth (thanks http://type-scale.com/)  */

@media screen and (min-width: 72em) {

    h1 {
        letter-spacing: -3px;
    }

    h1, .h1 {
        margin-bottom: 0.35em;
        font-size: 3.998em;
    }

    h2, .h2 {
        font-size: 2.827em;
    }

    h3, .h3 {
        font-size: 1.999em;
    }

    h4, .h4 {
        font-size: 1.414em;
    }

    p {
        font-size: 1.125em;
    }

        p.intro {
            font-size: 1.4em;
        }
}


/*Tabs*/
#exTab2 h3 {
    color: white;
    background-color: #428bca;
    padding: 5px 15px;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    background: #FFBF00 !important;
    font-weight: bolder !important;
    color: black;
}

.nav-tabs > li > a {
    background: #FFD24D !important;
    margin-right: -29px !important;
    border: 1px solid black !important;
}



/*Organization Chart*/

/* RESET STYLES & HELPER CLASSES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*:root {
    --level-1: #8dccad;
    --level-2: #f5cc7f;
    --level-3: #7b9fe0;
    --level-4: #f27c8d;
    --black: black;
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

ol {
    list-style: none;
}

body {
    margin: 50px 0 100px;
    text-align: center;
    font-family: "Inter", sans-serif;
}

.container {
    max-width: 1000px;
    padding: 0 10px;
    margin: 0 auto;
}

.rectangle {
    position: relative;
    padding: 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
    font-size: 16px !important;
    font-variant: none !important;
    letter-spacing: normal;
}*/



/* LEVEL-1 STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*.level-1 {
    width: 43%;
    margin: 0 auto 40px;
    background: var(--level-1);
    margin-left: -40px;
}

    .level-1 h1 {
        text-align: center !important;
    }

    .level-1::before {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%);*/
/*width: 2px;*/
/*height: 20px;
        background: var(--black);
    }*/


/* LEVEL-2 STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*.level-2-wrapper {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

    .level-2-wrapper::before {
        content: "";
        position: absolute;
        top: -20px;
        left: -3%;
        width: 42%;
        height: 2px;
        background: var(--black);
    }

    .level-2-wrapper::after {
        display: none;
        content: "";
        position: absolute;
        left: -20px;
        bottom: -20px;
        width: calc(100% + 20px);
        height: 2px;
        background: var(--black);
    }

    .level-2-wrapper li {
        position: relative;
    }

    .level-2-wrapper > li::before {
        content: "";
        position: absolute;
        bottom: 100%;
        left: 16%;
        transform: translateX(-50%);*/
/*width: 2px;*/
/*height: 20px;
        background: var(--black);
    }

.level-2 {
    width: 70%;
    margin: 0 auto 40px;
    background: var(--level-2);
}

    .level-2::before {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%);
        width: 2px;
        height: 20px;
        background: var(--black);
    }

    .level-2::after {
        display: none;
        content: "";
        position: absolute;
        top: 50%;
        left: 0%;
        transform: translate(-100%, -50%);
        width: 20px;
        height: 2px;
        background: var(--black);
    }*/


/* LEVEL-3 STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*.level-3-wrapper {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 20px;
    width: 224%;
    margin: 0 auto;
    margin-top: 29px;
    margin-left: -12px;
}*/

/*    .level-3-wrapper::before {
        content: "";
        position: absolute;
        top: -20px;
        left: calc(25% - 5px);
        width: calc(50% + 10px);
        height: 2px;
        background: var(--black);
    }*/

/*.level-3-wrapper > li::before {
        content: "";
        position: absolute;
        top: -5px;
        left: 4%;
        transform: translate(-50%, -100%);*/
/*width: 2px;*/
/*height: 20px;
        background: var(--black);
    }

.level-3 {
    margin-bottom: 20px;
    background: var(--level-3);
}*/


/* LEVEL-4 STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*.level-4-wrapper {
    position: relative;
    width: 80%;
    margin-left: auto;
}

    .level-4-wrapper::before {
        content: "";
        position: absolute;
        top: -34px;
        left: -17px;
        width: 2px;
        height: calc(100% + 20px);
        background: var(--black);
    }

    .level-4-wrapper li + li {
        margin-top: 20px;
    }

.level-4 {
    font-weight: normal;
    background: var(--level-4);
}

    .level-4::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0%;
        transform: translate(-100%, -50%);
        width: 15px;
        height: 2px;
        background: var(--black);
    }*/


/* MQ STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*@media screen and (max-width: 700px) {
    .rectangle {
        padding: 20px 10px;
    }

    .level-1,
    .level-2 {
        width: 100%;
    }

    .level-1 {
        margin-bottom: 20px;
    }

        .level-1::before,
        .level-2-wrapper > li::before {
            display: none;
        }

    .level-2-wrapper,
    .level-2-wrapper::after,
    .level-2::after {
        display: block;
    }

    .level-2-wrapper {
        width: 90%;
        margin-left: 10%;
    }

        .level-2-wrapper::before {
            left: -20px;
            width: 2px;
            height: calc(100% + 40px);
        }

        .level-2-wrapper > li:not(:first-child) {
            margin-top: 50px;
        }
}


.downArrorLevel1 {
    text-align: center;
    margin-left: 20px;
    float: right;
}


.lblStyleLevel{
    font-weight: normal !important;
    margin: 0;
}*/




/*Tree View*/

/**
 * Framework starts from here ...
 * ------------------------------
 */

.tree,
.tree ul {
    margin: 0 0 0 1em; /* indentation */
    padding: 0;
    list-style: none;
    color: #369;
    position: relative;
}

    .tree ul {
        margin-left: .5em
    }
        /* (indentation/2) */

        .tree:before,
        .tree ul:before {
            content: "";
            display: block;
            width: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            border-left: 1px solid;
        }

    .tree li {
        margin: 0;
        padding: 0 1.5em; /* indentation + .5em */
        line-height: 2em; /* default list item's `line-height` */
        font-weight: bold;
        position: relative;
    }

        .tree li:before {
            content: "";
            display: block;
            width: 10px; /* same with indentation */
            height: 0;
            border-top: 1px solid;
            margin-top: -1px; /* border top width */
            position: absolute;
            top: 1em; /* (line-height/2) */
            left: 0;
        }

        .tree li:last-child:before {
            /*background: white;*/ /* same with body background */
            height: auto;
            top: 1em; /* (line-height/2) */
            bottom: 0;
        }



.UserLbl {
    margin-left: 20px !important;
}

#lblHeadOffice {
    color: #ffc107;
}


/*Generate Notification*/
.switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 24px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 16px;
        width: 16px;
        left: -6px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }



/*Alart PopUp*/
.popupmodalDialog {
    margin-top: 210px !important;
}

.popupHeader {
    height: 50px !important;
    border-radius: 6px !important;
    background-color: #ffea00;
}

.popupTitle {
    height: 50px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    /*margin-left: -180px !important;*/
}

.popupCloseBtnArrow {
    margin-top: -49px !important;
    color: black !important;
    margin-left: 370px !important;
    margin-top: -12px !important;
}

.popupFooter {
    height: 50px !important;
}

.popupCloseBtn {
    margin-top: -12px !important;
}

.popupBody {
    height: 70px !important;
}

/*.modal-backdrop.in {
    
     opacity: 0 !important; 
}
*/
.modal-backdrop {
    position: initial !important;
}

.hiddencol {
    display: none;
}

/*What is new Button*/
.center {
    position: absolute;
    /*    top: 50%;
    left: 50%;*/
    bottom: -132px;
    right: 73px;
    transform: translate(-50%, -50%);
}

.pulse {
    width: 100px;
    height: 100px;
    background: #FF6D4A;
    border-radius: 50%;
    color: #FFF;
    font-size: 13px;
    text-align: center;
    line-height: 100px;
    font-family: sans-serif;
    text-transform: uppercase;
    animation: animate-pulse 3s linear infinite;
    cursor: pointer
}

@keyframes animate-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255,109,74,0.7), 0 0 0 0 rgba(255,109,74,0.7);
    }

    40% {
        box-shadow: 0 0 0 50px rgba(255,109,74,0.0), 0 0 0 0 rgba(255,109,74,0.7);
    }

    80% {
        box-shadow: 0 0 0 50px rgba(255,109,74,0.0), 0 0 0 30px rgba(255,109,74,0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255,109,74,0.0), 0 0 0 30px rgba(255,109,74,0);
    }
}
/*

h1 {
    margin: 0;
    line-height: 2;
    text-align: center;
}

h2 {
    margin: 0 0 0.5em;
    font-weight: normal;
}

input {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.row {
    display: flex;
}

    .row .col {
        flex: 1;
    }

        .row .col:last-child {
            margin-left: 1em;
        }*/
/* Accordion styles */
.tabs {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5);
}

.tab {
    width: 100%;
    color: white;
    overflow: hidden;
}

.tab-label {
    display: flex;
    justify-content: space-between;
    padding: 1em;
    background: #2c3e50;
    font-weight: bold;
    cursor: pointer;
    /* Icon */
}

    .tab-label:hover {
        background: #1a252f;
    }

    .tab-label::after {
        content: "\276F";
        width: 1em;
        height: 1em;
        text-align: center;
        transition: all 0.35s;
    }

.tab-content {
    max-height: 0;
    padding: 0 1em;
    color: #2c3e50;
    background: white;
    transition: all 0.35s;
}

.tab-close {
    display: flex;
    justify-content: flex-end;
    padding: 1em;
    font-size: 0.75em;
    background: #2c3e50;
    cursor: pointer;
}

    .tab-close:hover {
        background: #1a252f;
    }

input:checked + .tab-label {
    background: #1a252f;
}

    input:checked + .tab-label::after {
        transform: rotate(90deg);
    }

input:checked ~ .tab-content {
    max-height: 100vh;
    padding: 1em;
}

.whatisnewPoint {
    margin-left: 0;
    padding: 0;
    font-family: 'Karla', sans-serif;
}

.question,
.answer {
    list-style-type: none;
}

.question {
    border-top: 1px solid grey;
    padding: 0.5em 1em 0.5em 3em;
    font-weight: bold;
    position: relative;
}

.whatisnewPoint:last-child {
    border-bottom: 1px solid grey;
}

.question:hover {
    cursor: pointer;
}

.answer {
    display: none;
    padding: 1em 0.5em 2.5em;
}

.expand-bar {
    position: absolute;
    top: 50%;
    left: 1em;
    transition: all 0.5s ease;
}

    .expand-bar,
    .expand-bar:after {
        width: 15px;
        height: 2px;
        background-color: red;
    }

        .expand-bar:after {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            transform: rotate(90deg);
            transition: all 0.5s ease;
        }

.open {
    border-bottom: none;
}

    .open .expand-bar {
        transform: rotate(180deg);
    }

        .open .expand-bar:after {
            transform: rotate(180deg);
        }



.divWaiting {
    position: absolute;
    background-color: #FAFAFA;
    z-index: 2147483647 !important;
    opacity: 0.8;
    overflow: hidden;
    text-align: center;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    padding-top: 20%;
}

.minmaxpanel{
    display:block;
    min-height:0px;
    max-height:300px;
}

.cssmarquee {
    height: 50px;
    overflow: hidden;
    position: relative;
    color: red;
    background-color: yellow;
}
#loader {
    border: 5px solid yellow;
    border-radius: 50%;
    border-top: 5px solid #444444;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

.flexpanel{
    min-height:50px;
    max-height:300px;
    overflow-y:auto;
}

.blink-row {
    animation: blink 4s step-start 0s infinite;
    color: red; /* Or use background-color for full row highlight */   
}

@keyframes blink {
    50% {
        color: yellow;        
    }    
}