@media (min-width: 768px) {
   body {
      font-size: 20px;
   }

   .btnOption span {
      font-size: 22px;
   }
}

@media (min-width: 768px) and (orientation: landscape) {
   #boxTime {
      margin: 60px auto 60px auto;
   }

   #time {
      font-size: 60px;
   }

   .twoColOnLandscape {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 0px;
   }
}

@media (min-aspect-ratio: 14/9) and (max-aspect-ratio: 17/9) {
   .hintergrund {
      background-image: url(../images/med8-5.jpg);
   }

   #slider1 {
      margin-left: 40%;
   }
   #slider2 {
      margin-left: 40%;
   }
}

@media (min-aspect-ratio: 2/3) and (max-aspect-ratio: 8/3) {
   .hintergrund {
      background-image: url(../images/med4-3.jpg);
   }

   #slider1 {
      margin-left: 40%;
   }
   #slider2 {
      margin-left: 40%;
   }

   /* Unterseite --> Optinen */

   #slider3 {
      margin-left: 50%;
      margin-top: 3%;
   }

   #slider4 {
      margin-left: 50%;
      margin-top: 0%;
   }

   #buttons {
      margin-left: 50%;
      margin-top: 0%;
      margin-right: 3%;
   }

   #flip1 {
      margin-left: 55%;
      margin-top: 3%;
      margin-right: 3%;
   }

   #flip2 {
      margin-left: 55%;
      margin-top: 1%;
   }

   #untertitel {
      font-size: 30px;

      float: right;
      margin-right: 5%;
      margin-top: -2%;
      color: rgb(197, 120, 56);
   }

   #kreis {
      position: absolute;
      float: left;
      width: 400px;
      height: 400px;
      margin-left: 8%;
      margin-top: -8%;
   }

   .ui-field-contain {
      padding: 0em 0;
      height: 40px;
      width: 100%;
   }
}
@media (min-aspect-ratio: 15/5) and (max-aspect-ratio: 17/5) {
   .hintergrund {
      background-image: url(../images/med8-5.jpg);
   }

   #slider1 {
      margin-left: 40%;
   }
   #slider2 {
      margin-left: 40%;
   }
}

@media (min-aspect-ratio: 126/75) and (max-aspect-ratio: 130/75) {
   .hintergrund {
      background-image: url(../images/med128-75.jpg);
   }

   #slider1 {
      margin-left: 40%;
   }
   #slider2 {
      margin-left: 40%;
   }
}