/* Variables 
------------ */
/* Background options, remnant of old version 
--------------------------------------------- */
.bg-color, .bg-video, .bg-gradient, .bg-animation, .bg-image {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    background-size: cover !important; }
  
  .dot {
    background-image: url("../../images/Blatt.png");
    width: 140px !important;
    height: 133px !important; }
  
  /* Audio */
  #audio-switch {
    position: absolute;
    top: 15px;
    left: 20px;
    font-size: 50px;
    z-index: 2; }
  
 
  /* Perfect scrollbar */
  .ps .ps__rail-x:hover, .ps .ps__rail-y:hover, .ps .ps__rail-x:focus, .ps .ps__rail-y:focus, .ps .ps__rail-x.ps--clicking, .ps .ps__rail-y.ps--clicking {
    opacity: 0.6; }
  
  .ps__rail-y {
    opacity: 0.6 !important;
    background-color: transparent !important;
    z-index: 1; }
    .ps__rail-y .ps__thumb-y {
      background-color: grey; }
    .ps__rail-y.ps--clicking, .ps__rail-y:hover {
      background-color: transparent !important; }
      .ps__rail-y.ps--clicking .ps__thumb-y, .ps__rail-y:hover .ps__thumb-y {
        background-color: grey;
        width: 6px; }
  
  .svg-wrap {
    background: #000;
    border-radius: 100%;
    width: 50px;
    height: 50px;
    fill: #fff; }
    .svg-wrap svg {
      display: block;
      margin: 0 auto;
      position: relative;
      top: 46%;
      -webkit-transform: translateY(-46%);
      -ms-transform: translateY(-46%);
      transform: translateY(-46%); }
  
  .audio-toggle {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 1; }
    .audio-toggle .audio-toggle__icon--hidden {
      display: none; }
    .audio-toggle .svg-wrap {
      margin-top: 0; }
  
  .rotate-device-notice {
    display: none;
    position: absolute;
    top: 16px;
    left: 50%;
    font-family: "Roboto", sans-serif;
    text-align: center;
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    color: #fff; }
    .rotate-device-notice p {
      font-size: 50px;
      margin-top: 18px; }
    @media (orientation: landscape) {
      .rotate-device-notice {
        display: none !important; } }