body {
     margin: 0 auto;
     text-align: left;
     font-family: 'Roboto', sans-serif;
     font-size: 16px;
     line-height: 1.3;
 }

 h1 {
     font-size: 18px;
     font-weight: 500;
     margin-top: 15px;
 }

 .textbox h1 {
     font-size: 24px;
 }


 .textbox p {
     margin-top: 15px;
 }

 p {
     font-size: 16px;
     line-height: 1.25em;
     margin-top: 20px;
 }

 #adresse {
     text-align: left;
 }

 a:link {
     text-decoration: none;
 }

 a:-webkit-any-link {
     cursor: pointer;
     text-decoration: none;
 }

 p a {
     text-decoration: none;
     color: black;
 }

 .adress a {
     text-decoration: none;
     color: black;
 }

 p a:visited {
     color: black;
 }

 p a:hover {
     color: green;
 }

 .biologo img {
     position: relative;
     background-color: white;
     text-align: right;
     z-index: 100;
     margin-top: -80px;
     padding-top: -50px;
 }

 .biologo_familie img {
     background-color: white;
     width: 100px;
     padding: 8px;
 }

 #adresse img {
     margin-top: 40px;
     background-color: white;
     text-align: right;
 }

 .keybild {
     margin-top: -2px;
 }

 .keybild_inhalt {
     margin: -15px -15px 0;
 }

 img {
     max-width: 100%;
     height: auto;
 }

 header {
     margin: 0 auto;
     height: auto;
 }

 #logo {
     margin: 0 auto;
     padding: 20px;
     width: 150px;
     text-align: center;
 }

 .content {
     background-color: rgb(243, 238, 200);
     padding: 13px;
     margin-top: 8px;
     margin-bottom: 7px;
 }

 .adress {
     margin-right: 40px;
     width: 100%;
 }

 .textbox_home {
     padding: 0 15px;
     text-align: center;
 }

 #bildergalerie img {
     margin-top: 10px;
 }

 #bildergalerie {
     clear: both;
 }

 #bestellbutton {
     background-color: green;
     padding: 7px 10px 5px;
     width: 120px;
     color: white;
     text-align: center;
     border-radius: 11px;
     margin-top: 10px;
     font-size: 14px;
 }

 .biologo {
     float: right;
     margin-top: -30px;
     width: 40px;
     clear: both;
     padding-right: 20px;
 }

 .biologo img {
     background-color: white;
     z-index: 100;
     padding: 5px;
     margin-top: -80px;
     padding-top: -50px;
 }


 /*-------- navigation --------*/

 .menubutton {
     margin-bottom: -10px;
     padding-bottom: -10px;
     margin: 0 auto;
     margin: 50px;
     padding: 5px;
     margin: 0 auto;
     text-align: center;
     background-color: rgb(185, 213, 130);
     width: auto;
 }

 .menubutton img {
     width: 100px;
     margin-top: 5px;
 }

 nav ul li a.current {
     color: white;
 }

 nav {
     font-weight: 100;
 }

 nav ul {
     padding: 0;
     margin: 0;
     list-style: none;
     padding-bottom: 10px;
          color: black;
 }

 nav ul li {
     background-color: rgb(185, 213, 130);
     display: inline- block;
     text-align: center;
     margin-right: 20px;
     margin-left: 20px;
     margin-top: 10px;
     font-size: 20px;
     font-weight: 400;
     color: black;
 }

 nav ul li a {
     font-family: 'Merriweather', serif;
     font-weight: 700;
     width: auto;
     height: 25px;
     display: block;
     padding: 5px 20px;
     color: black;
 }

 nav ul li a:hover {
     background: rgb(120, 120, 120);
     color: white;
 }

 nav ul li a:visited {
     color: black;
 }

 nav ul li a:checked {
     color: white;
 }

 footer {
     background-color: rgb(185, 213, 130);
     height: 15px;
 }

 #back-top {
     position: fixed;
     width: 50px;
     height: 50px;
     bottom: 20px;
     right: 10px;
     z-index: 999;
     display: none;
     clear: both;
 }

 #back-top a:hover {
     text-decoration: none;
 }

 @media only screen and (min-width: 501px) {

     .content {
         background-color: rgb(243, 238, 200);
         padding: 25px;
         margin-top: -2px;
         margin-bottom: 7px;
     }

     .keybild_inhalt {
         margin: -5px -5px 0;
     }
 }

 /* ------------------media queries------------------- */

 @media only screen and (min-width: 601px) {

     #bestellbutton {
         padding: 8px 14px 5px;
         width: 140px;
         color: white;
         text-align: center;
         border-radius: 11px;
         float: right;
         margin-top: -60px;
         font-size: 16px;
         clear: both;
     }

     .content {
         padding: 20px 35px;
     }

     .content h1 {
         padding: 0px;
     }

     h1 {
         font-size: 21px;
         padding: 0 40px;
         margin-top: 10px;
     }

     .textbox_home {
         padding: 20px 15px 10px;
         text-align: center;
     }
 }

 @media only screen and (min-width: 701px) {

     .content {
         padding: 25px;
         margin-top: 8px;
         margin-bottom: 7px;
     }

     .textbox_home {
         margin-top: -54%;
     }

     .textbox_home h1 {
         font-size: 17px;
     }

     .menubutton {
         display: none;
     }

     .keybild_inhalt {
         margin: -5px 30px 0;
     }

     #logo {
         width: 150px;
         padding-bottom: 5px;
     }

     p {
         font-size: 18px;
     }

     .keybild {
         margin-top: 7px;
         margin-bottom: 2px;
     }

     nav ul li a.current {
         color: white;
     }

     nav ul li a.current {
         color: red;
     }

     nav {
         margin: 0 auto;
         text-align: center;
     }

     nav ul {
         background-color: rgb(185, 213, 130);
         padding: 5px;
         list-style: none;
     }

     nav ul li {
         margin: 0 auto;
         color: black;
         display: inline-block;
         font-size: 14px;
         text-align: center;
         padding-right: 30px;
     }

     nav ul li a {
         color: black;
         padding: 10px 0 0 0;
     }

     nav ul li a:hover {
         color: white;
         background-color: rgb(185, 213, 130);

     }

     nav ul li a:visited {
         color: black;
     }

     .textbox {
         margin: 20px 30px 2px 30px;
     }

     .biologo {
         margin-top: -40px;
         width: 55px;
         padding-right: 30px;
     }

     .biologo img {
         padding: 7px;
         margin-top: -80px;
         padding-top: -50px;
     }

     .biologo_familie {
         padding: 20px 30px;
     }

     .biologo_familie img {
         background-color: white;
         width: 100px;
         padding: 8px;
         20px 30px 2px 30px;
     }

     footer {
         position: relative;
         clear: both;
     }


     @media only screen and (min-width: 801px) {

         #bestellbutton {
             padding: 8px 14px 5px;
             width: 210px;
             border-radius: 11px;
             margin-top: -40px;
             font-size: 18px;
         }

         #bildergalerie img {
             width: 47%;
             margin-right: 10px;
             column-count: 2;
         }

         .textbox {
             padding: 2px 9%;
             margin-bottom: -20px;
             margin-top: 5px;
         }
         
              .biologo_familie {
         padding: 20px 9%;
                  margin-left: 30px;
     }

         .keybild_inhalt {
             padding: 5px 9% 0;
         }

         .textbox_home h1 {
             font-size: 19px;
             padding: 0 60px;
         }

         nav ul li {
             font-size: 15px;
         }
     }

     @media only screen and (min-width: 1001px) {

         .textbox_home h1 {
             font-size: 22px;
             padding: 0 100px;
         }

         #bestellbutton {
             padding: 8px 14px 5px;
             width: 210px;
             border-radius: 11px;
             font-size: 20px;
         }

         .biologo_familie img {
             background-color: white;
             float: right;
             margin-right: 40px;
             margin-top: 40px;
         }

         #bildergalerie img {
             width: 31.4%;
             margin-right: 14px;
             column-count: 3;
         }
     }

     @media only screen and (min-width: 1201px) {

         .textbox_home h1 {
             font-size: 24px;
             padding: 0 150px;
         }

         .biologo_familie {
             margin: 0 auto;
             width: 800px;
         }

         .textbox {
             margin: 0 auto;
             width: 750px;
         }

         .keybild_inhalt {
             padding-top: 0;
             margin: 0 auto;
             width: 750px;
         }

         .textbox p {
             font-size: 18px;
         }

         .textbox h1 {
             font-size: 36px;
         }
     }

     @media only screen and (min-width: 1401px) {
         .textbox_home h1 {
             font-size: 30px;
             padding: 0 250px;
         }

         nav ul li {
             margin-right: 10px;
             font-size: 16px;
             padding-bottom: 5px;
         }

         .biologo {
             margin-top: -40px;
             margin-right: 40px;
         }

         .biologo img {
             max-width: 90px;
         }
     }


     @media only screen and (min-width: 1801px) {

         .textbox_home h1 {
             padding: 0 330px;
         }

         .textbox_home {
             padding-top: 40px;
         }

         .textbox {
             width: 750px;
         }

         .biologo_familie {
             width: 800px;
         }

         .keybild_inhalt {
             margin: 0 auto;
             width: 750px;
         }
     }

     @media only screen and (min-width: 2001px) {

         .textbox {
             margin: 0 auto;
             width: 850px;
             margin-bottom: -20px;
         }

         .keybild_inhalt {
             padding-top: 0;
             margin: 0 auto;
             width: 850px;
         }

         .textbox_home h1 {
             padding: 0 450px;
         }

         nav ul li {
             margin-right: 5px;
             font-size: 17px;
         }

         .textbox_home {
             padding-top: 70px;
         }
         
               .biologo_familie {
             width: 900px;
         }
     }

     @media only screen and (min-width: 2301px) {

         .textbox_home h1 {
             padding: 0 600px;
         }

         .textbox_home {
             padding-top: 90px;
         }
     }


     /* -----------Print Queries--------------------------- */

     @media print {
         body {
             background-color: transparent;
             font-size: 10pt;
             font-family: Arial, SunSans-Regular, Sans-Serif;
             color: #000;
         }

         h2 {
             font-size: 18px;
             color: black;
         }

         a,
         a:visited {
             color: blueviolet;
         }

         a[href]:after {
             content: " ("attr(href) ")";
             color: #777;
             font-size: 10pt;
         }

         navigation,
         header img {
             display: none;
         }

         #footer {
             display: none;
         }

         .pint-only {
             display: block;
         }

         img {
             display: none;
         }