body,
     html {
         padding: 0;
         margin: 0;
         /* box-sizing: border-box; */
         background-color: #FAF9F6;
         overflow-x: hidden;
     }


     ::selection {
         background-color: #C0181C;
         color: #FAF9F6;
     }

     h1,
     h2,
     h3,
     h4,
     h5 {
         font-family: 'Open Sans', sans-serif;
         color: #C0181C;
         margin: 0;
     }

     p {
         font-family: 'Inter', sans-serif;
         font-size: 0.8em;
         line-height: 1.5em;
         color: #333;
     }

     p a {
         color: #C0181C;
         text-decoration: none;
         font-weight: 600;
     }

     #burger-menu-button.burger {
         width: 25px;
         height: 25px;
         position: absolute;
         top: 20px;
         right: 20px;
         z-index: 111100;
         display: none;
         flex-direction: column;
         justify-content: space-around;
         cursor: pointer;
         background-color: #C0181C;
         padding: 15px;
         border-radius: 80%;
         scale: .9;
     }


     #home .mob {
         display: none !important;
     }

     #burger-menu-button.burger span {
         height: 3px;
         background: #a2533b;
         background: white;
         border-radius: 2px;
         transition: 0.3s;
         width: 100%;
     }

     #mobile-slideout-menu {
         position: fixed;
         top: 0;
         right: -100%;
         width: 80%;
         max-width: 300px;
         height: 100%;
         background-color: rgba(255, 255, 255, .5);
         box-shadow: -2px 0 10px rgba(0, 0, 0, 0.5);
         z-index: 1000;
         transition: right 0.3s ease;
         padding-top: 150px;
         backdrop-filter: blur(10px);
     }

     #mobile-slideout-menu.open {
         right: 0;
     }


     #mobile-slideout-menu ul {
         list-style: none;
         padding: 0;
         margin: 0;
     }

     #mobile-slideout-menu ul li {
         border-bottom: 1px solid white;
         background-color: #C0181C;
     }


     /* #mobile-slideout-menu ul li a {
         display: block;
         padding: 15px 25px;
         color: white;
         font-size: 18px;
         text-decoration: none;
         text-transform: uppercase;
     } */

     #mobile-slideout-menu ul li a {
         display: block;
         padding: 15px 20px;
         color: white;
         font-size: 14px;
         text-decoration: none;
         text-transform: uppercase;
     }

     .container {
         width: 1200px;
         height: auto;
         margin: 0 auto;
         min-height: 100px;

     }

     header {
         height: 167px;
         position: relative;
     }

     header .container {
         height: 100%;
         display: flex;
         align-items: center;
         overflow: hidden;
     }

     .content.container {
         margin-top: 90px;
         display: flex;
         /* width: 1200px; */
         height: 100%;
         width: 1200px;
         transform: translateX(2px);
         min-height: calc(100vh - 437px);
         border: solid 1px transparent;
     }

     .teamsmall {
         max-width: 90%;
         display: block;
         margin-top: 17px;
         margin-bottom: 20px;
     }

     #home .content.container {
         margin-left: calc((100% - 1200px)/2);
         width: calc(100% - ((100% - 1200px) / 2));
     }

     .logo {
         height: 132px;
     }

     .flexdiv {
         display: flex;
         flex-wrap: wrap;
     }

     .thumbs {
         width: 100%;
         height: 100px;
         background-color: #C0181C;
     }

     .physiopartner {
         width: 130px;
         height: auto;
         display: block;
         margin-left: -20px;
         margin-top: 30px;
         transition: all 0.2s ease;
     }

     .physiopartner:hover {
         scale: 1.1;
     }

     footer {
         width: 100%;
         height: 150px;
         background-image: url(bogen-unten.svg);
         background-repeat: no-repeat;
         background-size: contain;
         background-position: bottom;
         margin-top: 30px;
         display: flex;
         align-items: flex-end;
         justify-content: center;
     }

     footer a {
         color: white !important;
     }

     .footer__text p {
         color: white;
         text-transform: uppercase;
         padding-bottom: 6px;
         font-size: 12px;
     }

     .bogen-oben {
         position: absolute;
         right: -2px;
         top: -2px;
         width: 914px;
     }

     .bogen-unten {
         position: absolute;
         left: 0px;
         bottom: -1px;
         width: 100vw;
         height: 150px;
     }

     .menu-container {
         position: relative;
         padding-left: 15px;
         width: 252px;
         min-width: 252px;
         padding-right: 30px;
         margin-left: 51px;
         padding-top: 14px;
         padding-top: 23px;
         font-family: 'Open Sans', sans-serif;
         max-height: 400px;
     }

     /* Der graue Seitenstrich */
     .menu-container::before {
         content: "";
         position: absolute;
         left: 0;
         top: 0;
         bottom: 0;
         width: 1px;
         background-color: #ACAAAB;
     }

     .menu {
         list-style: none;
         margin: 0;
         padding: 0;
         position: relative;
         font-family: 'Open Sans', sans-serif;
         text-transform: uppercase;
     }

     .menu li {
         /* statt margin: 15px 0; */
         padding: 5px 0;
         /* 15px oben/unten ergibt etwa 30px Abstand gesamt */
         display: flex;
         /* neuer Flex–Container */
         align-items: center;
         /* Text immer vertikal zentriert */

         color: #C0181C;
         cursor: pointer;
         position: relative;
         z-index: 1;

     }

     li {
         font-family: 'Inter', sans-serif;
         font-size: 0.8em;
         line-height: 1.5em;
     }

     .menu li a {
         text-decoration: none;
         font-size: 1.2rem;
         color: #C0181C;
         width: 100%;
         padding: 5px;
         /* füllt li, damit hover-fläche groß bleibt */
         font-weight: 300;
     }

     .menu li:not(.active) a:hover {
         color: #333;
     }

     .menu li.active a {
         font-weight: 700;
     }

     /* Die rote Kugel */
     .dot {
         position: absolute;
         left: 0;
         transform: translateX(-50%);
         /* auf den Strich treffen */
         width: 18px;
         height: 18px;
         background-color: #C0181C;
         border-radius: 50%;
         transition: top .6s ease;
         /* transition: top 0.6s cubic-bezier(1, 0, 2, 1); */
         z-index: 0;
         /* unter den Texten */
     }

     .social {
         width: 100%;
         height: 30px !important;
         display: flex;
         gap: 5px !important;
         justify-content: flex-start;
         width: fit-content !important;
         margin-top: -10px;
         margin-bottom: 20px;
     }

     .social a {
         display: block;
     }

     .social a img {
         height: 100%;
         max-height: 100%;
         display: block;
         width: auto;
         filter: grayscale(0);
     }

     .social a img:hover {
         filter: grayscale(1);
     }


     .intro {
         padding: 0;
         padding-top: 3px;
         position: relative;
     }

     #home .intro {
         display: flex;
         flex-wrap: wrap;
         justify-content: space-between;
     }

     .gallery {
         width: fit-content;
         height: auto;
         padding: 10px;
         display: flex;
         gap: 10px;
         flex-wrap: wrap;
     }

     .gallery .gal_row {
         height: 184px;
         width: 100%;
         display: grid;
         grid-template-columns: repeat(3, 1fr);
         gap: 10px;

     }

     .gal_row img {
         width: 275px;
         height: 184px;
         display: block;
     }

     .gal_row:nth-of-type(even) {
         margin-left: -30px;
     }

     .chefs {
         width: 230px;
         height: auto;
         display: block;
         float: left;
         margin: 0 20px;
         box-shadow: 0 0px 10px rgba(0, 0, 0, .09);
     }

     .legalactive {
         font-weight: bold !important;
         color: #C0181C !important;
     }

     .legalactive::before {
         content: "» ";
     }

     .physioflyer {
         width: 260px;
         height: auto;
         display: block;
         float: left;
         margin-right: 30px;
         box-shadow: 0 0px 10px rgba(0, 0, 0, .09);
     }



     .content__text::after {
         content: "";
         clear: both;
         display: table;
     }

     .wenner {
         width: 720px;
         height: 250px;
         background-color: #e3e9e1;
         margin-top: 25px;
         display: flex;
         align-items: flex-end;
         padding: 25px;
         position: relative;
         margin-bottom: 25px;
     }

     .wenner .inhalt {
         width: 100%;
         height: 240px;

         text-align: right;
         display: flex;
         flex-wrap: nowrap;
         justify-content: right;
         align-items: flex-end;
     }

     .wenner .inhalt img {

         height: 86%;
         display: block;
         max-height: 100%;
         box-shadow: 0 0px 10px rgba(0, 0, 0, .05);
     }

     .wenner .inhalt p {
         width: 60ch;
         padding: 10px 20px;
     }

     .wenner .inhalt a {
         text-decoration: none;
         color: #C0181C;
         font-weight: 700;
     }

     .leistungen-container {
         display: flex;
         margin-top: 20px;
         flex-wrap: wrap;
         gap: 20px;
         width: 100%;
         max-width: 100%;
         align-items: center;
         font-family: sans-serif;
     }

     .leistung_item {
         display: flex;
         align-items: center;
         background-color: #EDECEC;
         padding: 5px 10px;
         border-radius: 20px;
         font-weight: 600;
         color: #c00000;
         width: 190px;
         font-size: 13px;
         scale: 1.03;
         cursor: pointer;
         /* background-color: #e5e5e5; */
         transition: all 0.3s ease;
         cursor: help;
     }

     .leistung_info {
         display: none;
     }

     .leistung_item:hover {
         scale: 1.1;
         box-shadow: 0px 0px 10px rgba(0, 0, 0, .4);
         background-color: #EDECEC;
         background-color: transparent;
     }

     .icon {
         display: inline-flex;
         justify-content: center;
         align-items: center;
         width: 28px;
         height: 28px;
         background-color: #333;
         color: white;
         border-radius: 50%;
         font-size: 16px;
         font-weight: 500;
         color: #FAF9F6;
         margin-right: 10px;
         flex-shrink: 0;
         margin-left: -5px;
         font-family: 'Times New Roman', Times, serif;
     }

     .leistung_item.logo {
         background: none;
         height: 32px;

     }

     .leistung_item.logo img {
         height: 24px;
         width: auto;
         display: inline-block;
         margin: 0 auto;
     }


     .teaser {
         display: flex;
         align-items: flex-start;
         width: 100%;
     }

     .teaser h2 {
         font-size: 1.3em;
         line-height: 1.2em;
         margin-top: -1px;
         text-transform: uppercase;
     }

     .teaser h2 span {
         display: block;
         font-weight: 200;
         line-height: 20px;
         font-size: 1em;
     }

     .teaser .claim {
         font-size: 13px;
         width: 500px;
         margin-left: 50px;
         font-weight: 400;
         color: #333;
         transform: translateY(2px);

     }

     .claim {
         line-height: 1.15em;
     }

     .legal a {
         display: block;
         font-size: 12px;
         color: #333;
         text-decoration: none;
         padding: 2px 0;
         text-transform: uppercase;
         font-weight: 600;
     }

     .legal a:hover {
         color: #C0181C;
     }

     .legal {
         margin-top: 50px;
         padding-bottom: 50px;
     }

     .content__text {
         width: 80%;
     }

     #home .content__text {
         width: 42%;
         padding-top: 16px;
     }

     #praxis .content__text {
         width: 100%;
         margin-top: 25px;
     }

     #ueber-uns .content__text p {
         padding: 10px;
     }

     #ueber-uns .content__text {
         padding: 10px;
     }

     .content__bilder {
         box-sizing: border-box;
         right: 0;
         width: 52%;
         height: 440px;
         top: 0;
         transform: translateY(-45px);
     }


     .hero {
         transform: translateX(25px);
     }


     .content__bilder {
         display: grid;
         grid-template-columns: repeat(3, 1fr);
         gap: 10px;
     }

     .content__bilder img:nth-child(1) {
         grid-column: 1 / -1;
         width: 100%;
         height: auto;
         object-fit: cover;
     }


     .content__bilder img {
         display: block;
         width: 100%;
         height: auto;
         object-fit: cover;
     }


     #popup-overlay {
         position: fixed;
         inset: 0;
         background: rgba(0, 0, 0, 0.6);
         display: none;
         z-index: 1000;
         width: 100%;
         height: 100%;
     }

     #popup {
         position: fixed;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%);
         background: white;
         padding: 40px 50px;
         border-radius: 10px;
         max-width: 500px;
         width: 60%;
         box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
         display: none;
         z-index: 1001;
     }

     #popup h4 {
         color: #c00000;
         margin-top: 0;
         display: flex;
         align-items: center;
     }

     #popup h4::before {
         content: "i";
         display: inline-flex;
         justify-content: center;
         align-items: center;
         width: 20px;
         height: 20px;
         background: #555;
         color: white;
         border-radius: 50%;
         font-size: 13px;
         margin-right: 10px;
         flex-shrink: 0;
     }

     #popup-close {
         position: absolute;
         display: flex;
         top: 10px;
         right: 10px;
         cursor: pointer;
         font-size: 18px;
         justify-content: center;
         align-items: center;
         width: 13px;
         height: 13px;
         line-height: 13px;
         color: #000;
         font-weight: bold;
         padding: 8px;
         border-radius: 50%;
         border: solid 1px #333;
         color: #333;
     }

     @media (max-width: 1260px) {
         .bogen-oben {
             width: 800px;
         }

         .logo {
             height: 100px;
             margin-left: 10px;
         }

         .content.container {
             margin-top: 30px;
         }
     }

     @media (max-width: 1200px) {
         .content.container {

             display: flex;
             /* width: 1200px; */
             margin-left: 0;
             width: 100%;
             max-width: 100%;
             transform: translateX(0px);
             margin-top: 30px;
         }

         .mapsrot {
             margin: 0 !important;
             margin-bottom: 20px !important;
             float: none !important;
             width: 90% !important;

         }


         .intro {
             flex-direction: column;
             flex: 1;
         }


         #home .content__text {
             width: 80%;
         }

         #home .content.container {
             margin: 0;
             width: 100%;
             height: fit-content !important;
             margin-bottom: 100px;
             margin-top: 30px;
         }

         .hero {
             transform: translateX(0);
             margin-top: 40px;
         }

         .menu-container {
             margin-left: 25px;
             max-height: 350px;
             min-width: 202px;
             width: 202px;
         }

         .teaser {
             flex-wrap: wrap;
         }


         #home .teaser .claim {
             display: none;
         }

         .teaser .claim {
             width: 100%;

             margin: 0;
             margin-top: 10px;
             margin-bottom: 30px;
         }

         #home .content__bilder {
             width: 90%;
             max-width: 100%;
             height: auto;
         }

         .content__bilder {
             transform: translateY(0px);
         }

         .menu li {
             padding: 0;
         }

         .dot {
             width: 15px;
             height: 15px;
         }

         .menu li a {
             font-size: 1rem;
         }

         /* .content__bilder {
            width: 80%;
         } */


     }

     @media (max-width: 1260px) {
         .bogen-oben {
             width: 900px;
             width: 70%;
             right: -4px;
         }

     }

     @media (max-width: 1150px) {

         .osteo {
             flex-wrap: wrap !important;
             width: 90% !important;
             /* box-sizing: border-box !important; */
             height: fit-content !important;
             max-height: fit-content !important;
         }

         .wenner {
             width: 100% !important;
             height: fit-content !important;
         }

         .wenner .inhalt {
             display: flex;
             flex-wrap: wrap;
             height: fit-content !important;
             text-align: left !important;
             justify-content: left;
         }

         .wenner .inhalt img {
             width: 225px !important;
             height: auto !important;
             max-height: max-content !important;
             float: left !important;
         }

         .gal_row:nth-of-type(2n) {
             margin: 0 !important;
         }

         .gallery {
             padding: 0;
         }

         .gallery .gal_row {
             display: flex;
             flex-wrap: wrap;
             height: auto;
             box-sizing: border-box !important;
             align-items: center;
         }

         .gal_row a {
             display: block !important;
         }

         .gallery .gal_row img {
             width: 70%;
             height: auto;
             display: block;
         }



         .wenner .inhalt p {
             width: auto !important;
             padding: 0;
             margin-bottom: 10px;
         }

         .vodi {
             width: 100% !important;
         }

     }

     @media (max-width: 800px) {

         header {
             height: 150px;
             position: relative;
         }

         .logo {
             height: 90px;
         }

         #popup {
             position: fixed;
             top: 50%;
             left: 50%;
             transform: translate(-50%, -50%);
             background: white;
             padding: 20px !important;
             border-radius: 10px;
             max-width: 500px;
             width: 65%;
             box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
             display: none;
             z-index: 1001;
         }

         .nomob {
             display: none !important;
         }


         #ueber-uns .content__text p {
             padding: 0;
         }

         .job-box {
             margin: 20px 0 !important;
         }


         .content__text {
             width: 90% !important;
         }

         #jobs .content__text {
             width: 88% !important;
         }

         .jobsdiv ul {
             padding-left: 0 !important;
             margin: 10px 0 10px 0;
         }

         .form-row {
             display: block !important;
         }

         .form-row>* {
             width: 100% !important;
             margin-bottom: 10px;
             flex-shrink: 0 !important;
         }

         #physiofit .content__text {
             display: flex;
             flex-wrap: wrap;
             flex-direction: column-reverse;
         }

         #physiofit .content__text>* {
             width: 100%;
             margin-bottom: 35px;
         }

         .teamsmall {
             max-width: 100%;
             display: block;
             margin-top: 17px;
             margin-bottom: 20px;
             margin-left: -26px;
             height: auto;
         }

         .chefs {
             float: none;
             width: 100%;
             margin: 0 !important;
             width: 70%;
             height: auto;
             display: block;
         }



         #ueber-uns .content__text {
             padding: 0px;
             display: flex;
             flex-wrap: wrap;
             flex-direction: column-reverse;
             align-items: center;
             gap: 15px;
         }

         .mob {
             display: block;
         }

         #home .mob {
             display: block !important;
         }

         .hero {
             display: none !important;
         }

         .menu-container {
             display: none;
         }

         .content.container {
             width: 100%;
             padding: 25px;
         }

         #datenschutz .content.container {
             width: 90%;
             padding: 25px;
         }

         footer {
             background-color: #C0181C;
             background-image: none;
             padding: 20px;
             height: fit-content;
         }

         .content {
             width: 100%;
         }

         #home .content__text {
             width: 90%;
         }

         .bogen-oben {
             display: none;
         }

         header {
             box-shadow: 2px 0 15px rgba(0, 0, 0, .2);

             background-color: white;
             z-index: 999;
             display: flex;
         }

         #burger-menu-button {
             display: flex !important;
             z-index: 11000 !important;
             top: 50px !important;
             scale: 1.2;
             right: 30px !important;
         }


         .intro {
             max-width: 100%;
         }

         .content__bilder {
             margin-top: 35px !important;
             grid-template-columns: repeat(1, 1fr);
             gap: 10px;
             width: 88% !important;
         }

     }

     @media (max-width: 500px) {
         .leistung_item {
             width: 85%;
             padding: 20px;
             flex-wrap: wrap;
             font-size: 1rem;
         }

         .leistung_item p {
             font-weight: 500;
         }

         .leistung_item h4 {
             display: none;
         }


         .leistung_item .leistung_info {
             display: block;
             margin-top: 10px;
             width: 100% !important;
         }

         #popup,
         #popup-overlay {
             display: none !important;
         }

         .gallery .gal_row img {
             width: 95%;
             height: auto;
             display: block;
         }


     }