* {
    margin: 0;
    padding: 0;
  }
  
  body {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    max-width: 1000px;
    margin-inline: auto;
    background-image: url(img/typewriter.jpg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
  }
  
  .textcentered{
      text-align: center;
  }

  .textLeft{
      text-align: left;
  }

  .contentboxen{
      margin: 5%;
      padding: 4%;
      border-radius: 30px 10px;
      background-color: blanchedalmond;
      box-shadow: 0 0 15px 5px black;
  }
/* ==== Tab-Content ==== */

  .tab-container {
    justify-content: center;
  }
  
  .tab-button {
    padding: 8px 16px;
    border-bottom: transparent 4px solid;
    transition: border-bottom-color 0.4s;
    background-color: black;
    color: blanchedalmond;
  }
  
  .content {
    margin: 10%;
    padding: 5px;
    position: relative;
  }
  
  .tab-actor:checked + .tab-button {
    border-bottom-color: blanchedalmond;
  }

  /* ==== Tabs ==== */

  :root {
    --tab-button-order: 1;
    --tab-content-order: 10;
  }
  
  .tab-container {
    display: flex;
    flex-wrap: wrap;
  }
  
  .tab-actor {
    display: none;
  }
  
  .tab-button {
    order: var(--tab-button-order);
  }
  
  .tab-content {
    order: var(--tab-content-order);
    display: none;

    width: 100%;
  }
  
  .tab-actor:checked + .tab-button + .tab-content {
    display: block;
  }

  .tabBackground{
    height: 40px;
    width: 1050px;
    background-color: black;
    z-index: -100;
    position: absolute;
    border-radius: 0px 0px 30px 30px;
    box-shadow: 0 0 30px 20px black;
  }
  

  /* ==== Custom ==== */

  .oeffnungszeiten{
    text-align: left;
    border: 1px solid gray;
    width: 100%;
  }

  .oeffnungszeiten tr:first-child{
    background-color: grey;
    color: white;
    text-align: center;
  }

  .uebermich{
    padding: 8px;
    width: 100%;
  }

  .uebermich td{
    text-align: left;
    padding: 8px;
  }

  .preisliste{
    border: 1px solid black;
  }

  th, td, tr{
    border: 1px solid grey;
    padding: 5px 20px;
  }

  .underline{
    text-decoration: underline;
  }

  ul{
    margin-left: 25px;
  }

  ol {
    counter-reset: list;
  }
  ol > li {
      list-style-type: none;
  }
  ol > li:before {
      content: "(" counter(list) ") ";
      counter-increment: list;
  }

  

  @media screen and (max-width: 986px) {
  .tabBackground{
    height: 80px;
    width: 100vw;
  }
  
  }

  @media screen and (max-width: 538px) {

    .tabBackground{
      width: 100%;
      display: none;
    }

    .tab-button {
      border-bottom: 1px solid #ccc;
      transition: none;
      width: 100%;
      padding: 5px 5px;
    }
  
    .content{
      margin: 1% 1%;
    }

    .contentboxen{
      margin: 5% 1%;
    }

    .tab-container.full-height {
      height: 100vh;
      flex-direction: column;
    }
  
    .tab-container.full-height .tab-content {
      display: block;
      height: auto;
      flex: 0;
      overflow: hidden;
  
      transition: 300ms flex;
    }
  
    .tab-container.full-height .tab-actor:checked + .tab-button + .tab-content {
      flex: 1;
      overflow: scroll;
    }

    .tab-button,
    .tab-content {
      order: initial;
    }

    /* .tab-button {

    } */
  }