* {
    margin: 0;
    padding: 0;
}

body {
    display: flex;
    flex-direction: column;
}

header {
    height: 10vh;
    background-color: lightgreen;
}

nav {
    height: 6vh;
    background-color: yellow;
}

main {
    height: 73vh;
    background-color: rosybrown;
    overflow-y: hidden;
}

footer {
    height: 10vh;
    background-color: red;
}

/*Mehr lesen / weniger lesen Funktionalität (bis Zeile 72)*/
input[type="checkbox"] {
    display: none;
  }
  
  label {
    /*Den Button-Effekt stylen*/
    border: darkgreen 3px solid;
    border-top: rgb(0, 182, 0) 3px solid;
    border-left: rgb(0, 182, 0) 3px solid;
    border-radius: 10px;
    width: 100px;
    height: 40px;
    background-color: lightgreen;
    color: black;
    text-align: center;
    padding-top: 5px;
    margin-top: 5px;
    cursor: pointer;
    display: inline-block;
  }
  
  label:after {
    content: "mehr";
  }
  
  input:checked~label:after {
    content: "weniger";
  }
  
  .inner {
    /*Falls nicht angewählt, was zuviel ist ausblenden*/
    max-height: 85%;
    overflow: hidden;
    transition: all .3s ease;
  }
  
  input:checked+.inner {
    /*Falls angewählt, Scroll-Balken zeigen*/
    overflow-y: scroll;
  }