$sidebarWidth: 272px;

clr-vertical-nav {
    width: $sidebarWidth;
    min-width: $sidebarWidth;
    height: 100%;
    max-width: 375px;
    position: relative;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.12);
    background-color: white !important;

    .sun-dropdown {
        min-height: 36px
    }

    .nav-tree {
        height: 100%;
        overflow-y: auto;
    }

    &.closed {
        margin-left: -$sidebarWidth;
    }

    .resize-handle {
        position: absolute;
        top: 0;
        bottom: 0;
        right: -3px;
        border-right: 4px solid #80b441;
        cursor: col-resize;
        opacity: 0;
        transition: all 0.1s ease-in-out;

        &:hover {
            opacity: .5;
        }

        &.resizing {
            opacity: 1;
        }
    }

    &.resizing {
        transition: none !important;
    }
}

.nav-divider {
    border: 0;
    border-top: 1px solid #d3d3d3;
    margin-bottom: 0;
}

.page-title {
    margin: 0;
    font-size: 18px;
    text-align: center;
}
.zero-margin{
    margin: 0px;
}
.user-nav-btn{
    padding: 0px;
    padding-left: 2px;
    padding-right: 2px;
}

#sidebarNav {
    z-index: 200;
}

@media (max-width: 767px) { //768
    #sidebarNav {
        position: absolute;
        bottom: 0;
        top: 0;
    }
}