

#slider-bar {
  position: relative;
  width: 100%;
  height: 100%;
}

/* Navbar Menu Component */

.slider-menu-left {
  width: 300px;
  height: calc(100vh - 28px);
        background-color: #fff;
      -webkit-background-clip: padding-box;
      background-clip: padding-box;
      border: 1px solid #ccc;
      border: 1px solid rgba(0, 0, 0, .15);
      -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
      box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  position: fixed;
  top: 0;
  left: -300px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  overflow: auto;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  -webkit-transform: translateX(0) translateZ(0);
  transform: translateX(0) translateZ(0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
  transition: all 0.3s cubic-bezier(0.32, 1.25, 0.375, 1.15);
  z-index: 10;
 padding-top: 68px;
}

.slider-menu-left.show-nav {
  -webkit-transform: translateX(300px);
  -ms-transform: translateX(300px);
  transform: translateX(300px);
  -webkit-transform: translateX(300px) tranlateZ(0);
  -ms-transform: translateX(300px) tranlateZ(0);
  transform: translateX(300px) tranlateZ(0);
  -webkit-transform: translate3d(300px, 0, 0);
  transform: translate3d(300px, 0, 0);
}


.nav-toggle {
  position: fixed;
  top: 50%;
  left: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  -webkit-transform: translateX(0) translateZ(0);
  transform: translateX(0) translateZ(0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition: all 0.4s cubic-bezier(0.32, 1.25, 0.375, 1.15);
  transition: all 0.4s cubic-bezier(0.32, 1.25, 0.375, 1.15);
  z-index: 11;
      background: transparent;
}

.nav-toggle span {
  color: #4c4c4c;
  color: rgba(0, 0, 0, 0.7);
  padding: 5px;
  font-size: 1.875em;
}



.nav-toggle.show-nav {
  top: 50%;
  left: 300px;
}