.oc-resources {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 2;
  top: 46px;
  right: 0;
  background-color: #fff;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
  color: #000;
  box-shadow: -1px 2px 2px 2px #555;
  border-radius: 5px 0 0 0;
}

.oc-resources a {
  padding: 5px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.4s;
}

.oc-resources a:hover {
  color: #f1f1f1;
}

.oc-resources .closebtn {
  position: absolute;
  top: -15px;
  right: 260px;
  font-size: 36px;
  margin-left: 50px;
  color: #333 !important;
}

#lc-content-box-ajax {
  transition: margin-left .5s;
}

@media screen and (max-height: 450px) {
  .oc-resources {padding-top: 15px;}
  .oc-resources a {font-size: 18px;}
}

.oc-resource-button {
  position: fixed;
  top: 152px;
  right: -3px;
  background: yellow;
  padding: 5px 3px 5px 0px;
  border: 1px solid #555;
  border-radius: 4px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  color: #000 !important;
  transition: 0.5s;
}

.oc-top-header {
  position: absolute;
  top: 3px;
  //right: 190px;
  font-size: 20px;
  margin-left: 5px;
  font-weight: bold;
  color: #333 !important;
  white-space: nowrap;
}

.oc-resource-content {
  color: #000;
  width: inherit;
  border-top: 1px solid #333;
  margin-top: -10px;
  padding: 10px 5px 5px 5px;
  overflow-y: auto;
  overflow-x: hidden;
}

.oc-resource-content a {
  font-size: 1rem;
  color: #000 !important;
}

.oc-resource-content ul {
  list-style: none;
  padding: 0;
}

.oc-resource-content ul li {
  display: ruby;
}

.oc-course-header {
  background: #00558c;
  margin-bottom: .1em !important;
  margin: 0 -5px;
  padding-left: 5px;
  color: #fff !important;
  font-size: 1em !important;
  border-radius: 3px 3px 0 0;
  padding-right: 5px;
  margin-top: 10px;
}

.oc-resource-content-lp a {
  font-size: 1rem;
  color: #000 !important;
}

.oc-resource-content-lp {
  color: #000;
  width: inherit;
  margin-top: -10px;
  padding: 10px 5px 5px 5px;
  overflow-y: auto;
  overflow-x: hidden;
}

.oc-resource-content-lp ul {
  list-style: none;
  padding: 0;
}

.oc-resource-content-lp ul li {
  display: ruby;
}

.lc-lp-card {
  max-height: 125px;
  overflow-x: hidden;
  overflow-y: auto;
}

.lc-lp-card .card-body {
  padding: .5rem !important;
}

/* OC Filter */

.oc-filter {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 2;
  top: 46px;
  left: 0;
  background-color: #fff;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 30px;
  color: #000;
  box-shadow: -1px 2px 2px 2px #555;
  border-radius: 0 5px 0 0;
}

.oc-filter a {
  padding: 5px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.4s;
}

.oc-filter a:hover {
  color: #f1f1f1;
}

.oc-filter .closebtn {
  position: absolute;
  top: -15px;
  right: 0px;
  font-size: 36px;
  margin-left: 50px;
  color: #333 !important;
}

@media screen and (max-height: 450px) {
  .oc-filter {padding-top: 15px;}
  .oc-filter a {font-size: 18px;}
}

.oc-filter-button {
  position: fixed;
  top: 152px;
  right: -3px;
  background: yellow;
  padding: 5px 3px 5px 0px;
  border: 1px solid #555;
  border-radius: 4px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  color: #000 !important;
  transition: 0.5s;
  display: none;
}

.oc-filter-content {
  padding: 5px;
  
}

.module-filter-box ul {
  list-style: none;
  padding-left: 0;
}

.filter-checkbox {
  margin-right: 5px;
}

.module-filter-title {
  font-weight: bold;
  margin-top: 10px;
}