.side-bar-over-lay{position: fixed;width: 100%;height: 100%;left: 0;top: 0;background: rgba(0, 0, 0, 0.5);transition: all 0.5s;display: none;z-index: 9;} .side-bar-over-lay.show{display: block;}
.sidebar {position: fixed;left: 0;width: 200px;height: calc(100vh - 51px);top: 51px; background: #fff;padding: 5px;display: flex;flex-direction: column;transition: background 0.3s ease, color 0.3s ease, all 0.5s ease-in-out;border-right: 1px solid #ccc; z-index: 10;}
.sidebar.show{left: 0px;}     
.sidebar-menu-items {padding: 0;flex-grow: 1;overflow-y: auto;} 
.sidebar-menu-items div a{margin: 5px 0;padding:8px 10px;text-decoration: none;font-weight: 700; display: flex;align-items: center;gap: 15px;font-size: 14px;color: #444;fill:#444;stroke: #444;cursor: pointer;transition: all 0.3s ease-in-out;}
.sidebar-menu-items div a:hover, .sidebar-menu-items a.active{background: rgba(155, 0, 0, 0.1);color:#b10b0b;fill: #b10b0b;stroke: #b10b0b;}
.sidebar-menu-items a.active{pointer-events: none;}
.sidebar-menu-items svg, .sidebar-menu-items img{width: 25px;height: 25px;margin: 0 5px;border-radius:15%;} 
.sidebar-menu-items div span{font-weight: 700;pointer-events: none;}  
.footer-menu {position: relative;bottom: 0;margin-top: auto;width: 100%;}
.footer-menu ul {list-style-type: none;display: flex;flex-wrap: wrap;border-top: 1px solid #eee;padding-top: 3px;}
.footer-menu ul li a {color: #555;text-decoration: none;font-size: 10px;display: block;padding:3px;}
.footer-menu ul li a:hover {color: #b10b0b;text-decoration: underline;}
@media (max-width: 1024px) {
.sidebar{left: -202px;}  
}  
@media (max-width: 480px) { 
.sidebar-menu-items {flex-grow: unset;}  
}