/**
 * @file
 * Visual styles for Base+'s slideout region.
 */
.slideout {
  padding: 60px 20px;
  display: none;
}
.slideout-toggle {
  font-size: 22px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  padding: 31px;
  line-height: 1;
  color: #ffffff;
  border-width: 0;
  outline: none;
  display: none;
}
.slideout-toggle:after {
  content: "\f0c9";
  font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Pro';
  font-weight: 900;
}
.slideout-toggle.js-slideout-toggle--fixed-open:after {
  content: "\f00d";
}
.onscroll .slideout-toggle {
  padding: 26px;
}
.onscroll .mt-count-down ~ .slideout-toggle {
  top: 0;
}
.slideout-side-right .slideout-menu {
  left: auto;
}
.slideout-side-right .slideout-toggle {
  left: auto;
  right: 0;
}
.slideout-toggle--fixed {
  backface-visibility: hidden;
  position: fixed;
  z-index:2;
  transition: transform 300ms ease, padding 200ms ease;
}
.js-slideout-toggle--fixed-open {
  transform: translate3d(300px, 0px, 0px);
}
.slideout-side-right .js-slideout-toggle--fixed-open {
  transform: translate3d(-300px, 0px, 0px);
}
@media (max-width: 767px) {
  .slideout-toggle {
    padding: 26px;
  }
}
