.mc-offcanvas-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 85%);
  z-index: 14;
  display: none;
}

.mc-offcanvas-wrapper {
  position: fixed;
  width: calc(20% + 56px);
  height: 100%;
  top: 0;
  right: -20%;
  z-index: 15;
  transition: .5s;
}

.mc-offcanvas-button-wrapper {
  position: relative;
  top: 180px;
  width: 56px;
  height: auto;
}

.offcanvas--open-button-outer {
  position: relative;
  text-align: center;
  font-size: 32px;
  margin-bottom: 20px;
}

.offcanvas--open-button-outer.active {
  background-color: #FBB800 !important;
}

.offcanvas--open-button-outer a img {
  /* max-width: 31px; */
  display: block;
  height: auto;
  margin: 0 auto;
}

.mc-offcanvas-content-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  width: calc(100% - 56px);
  height: 100%;
}

.mc-offcanvas {
  position: relative;
  height: 100%;
  width: 100%;
  top: 0;
/*   z-index: 9; */
  background-color: #fff;
  overflow-x: hidden;
  visibility: hidden;
  padding: 15px 25px;
  padding-top: 60px;
}

.offcanvas-visible {
  visibility: visible;
}

.mc-offcanvas .offcanvas--close-button-outer {
  text-align: center;
  margin-bottom: 40px;
}

.mc-offcanvas .offcanvas--closebtn {
  background: #000000;
  color: #fff;
  font-size: 25px;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: block;
  margin-left: auto;
  line-height: 1.35;
}

.offcanvas--open-button-outer a i {
  color: #fff;
}

.mc-offcanvas .opening-countdown i {
  display: none;
}

.mc-offcanvas .opening-countdown counttext {
  font-size: 30px;
  font-weight: 500;
  color: #000000;
  font-family: 'Avenir Next Condensed';
  display: block;
}

.mc-offcanvas .opening-countdown hours, .mc-offcanvas .opening-countdown minutes, .mc-offcanvas .opening-countdown seconds, .mc-offcanvas .opening-countdown span {
  width: 20%;
  float: left;
}

.mc-offcanvas .opening-countdown span {
  font-size: 40px;
  font-family: 'Avenir Next Condensed';
  color: #000000;
  text-align: center;
}

.mc-offcanvas .opening-countdown hours span, .mc-offcanvas .opening-countdown minutes span, .mc-offcanvas .opening-countdown seconds span {
  width: 100%;
}

.mc-offcanvas .opening-countdown small {
  text-align: center;
}

.mc-offcanvas .opening-countdown:after {
  clear: both;
  content: ' ';
  display: block;
}

/** Responsive ab hier **/
@media screen and (max-width: 768px) {
  .mc-offcanvas-wrapper {
    width: 100%;
    right: calc(-100% + 56px);
  }
}