.wrapper {
    display: flex;
}

#footer
{
    background-color: #E6E6E6;
    padding: 25px;
} 

#sidebar {
    min-width: 200px;
    max-width: 200px;
    transition: all 0.3s;
    margin-left: -20px;
}   

a[data-toggle="collapse"] {
    position: relative;
}

a[aria-expanded="false"]::before, a[aria-expanded="true"]::before {
    display: block;
    position: absolute;
    right: 20px;
    font-size: 0.6em;
}


#sidebar {
    margin-left: -185px;
    border-color: transparent;
}
#sidebar.active {
    margin-left: -20px;
    border-top: 0.1px solid gray;
}

#collapseImg {
    float: right;
    margin-top: 5px;
}

@media (max-width: 768px) {
    #sidebarCollapseMobile {
        display: block;
    }
    #sidebar.active ul li #sidebarCollapse {
        display: none;
    }
    #sidebar {
        margin-left: -215px;
    }
}
@media (min-width: 768px) {
    #sidebarCollapseMobile{
        display: none;
    }
    #sidebarCollapse{
        display: block;
    }
}

#sidebarCollapse {
    background-color: transparent;
    padding-bottom: 16px;
}

#sidebarCollapseMobile {
    background-color: transparent;
    padding-bottom: 16px;
}

a, a:hover, a:focus {
    text-decoration: none;
    transition: all 0.3s;
}

#sidebar.active ul li a {
    border-top: 0.1px solid gray;
    background: #E6E6E6;
    padding: 10px 20px;
    font-size: 1.1em;
    display: block;
    color: black;
}
#sidebar ul li a {
    background: #E6E6E6;
    padding: 10px;
    display: block;
    color: black;
}
#sidebar ul li a.disabled {
    pointer-events: none;
    cursor: default;
}
#sidebar.active ul li a:hover {
    background: linear-gradient(grey, #d7d7d7);
}

#sidebarCollapse:hover {
    background: linear-gradient(grey, #d7d7d7);
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: linear-gradient(#d7d7d7, white);
}