.sidebar {
  position: fixed;
  width: 100%;
  height: 100%;
  visibility:hidden;

  top: 0;
  left: 0;
  z-index: 1500;
  max-width: 300px;
  background: #fff;
  box-sizing: border-box;
  box-shadow: 10px 0 30px rgba(0,0,0,0.15);
  transform: translateX(-120%);
  transition: all 0.3s cubic-bezier(0.35, 0.38, 0.07, 0.83);
  overflow: auto
}
.sidebar td input {color:#222;}
.sidebar .close .btn-close {
  background: #cf2828;
  float: right;
  box-shadow: none
}

.sidebar .close::after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden
}

.sidebar.right {
  left: initial;
  right: 0;
  box-shadow: -10px 0 30px rgba(0,0,0,0.15);
  transform: translateX(120%)
}

.sidebar.right .close .btn-close { float: left }

.sidebar.active { visibility:visible; transform: translateX(0) }

.sidebar .content { padding: 10px }

.sidebar .content {
  line-height: 1.5;
  font-size: 0.875em
}

.sidebar .content ul, .sidebar .content ol { margin: 20px 0 20px 20px }