a#sp-slider-inner-item-1546329979694-num-2-key{
    display:none;
}

/*
.sp-slider-title span {
    font-size: 2.6rem !important; 
    font-family: 'Rokkitt', serif;
}
*/

/* Header - Side Show */
.sppb-addon-sp-slider.sp-slider .sp-slider-content-wrap > div .sppb-sp-slider-title:first-child {
	  color: #dcb381 !important;}

.burger-icon {width: 25px;cursor: pointer;}
.burger-icon > span {
  display: block;
  height: 3px;
  background-color: #eee;
  margin: 5px 0;
}

body.ltr #offcanvas-toggler.offcanvas-toggler-right {
  position: relative;
  right: 0;
  top: 30px;
}

/* Mobile Menu */
.offcanvas-menu .offcanvas-inner .sp-module ul > li a,
.offcanvas-menu .offcanvas-inner .sp-module ul > li span {
    display: block;
    font-size: 1.4rem !important; /* Passe die Größe nach Bedarf an */
    padding: 0.125rem 0;
    position: relative;
}

/* GDPR Message */

span.cc-message-text {
    font-size: 0.8rem;
}

/* ———— FONTS ———— */

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/HankenGrotesk-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/HankenGrotesk-Medium.woff2') format('woff2');
    font-weight: 500; /* Medium */
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/HankenGrotesk-SemiBold.woff2') format('woff2');
    font-weight: 600; /* SemiBold */
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/HankenGrotesk-Bold.woff2') format('woff2');
    font-weight: bold;
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/HankenGrotesk-Italic.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
}


@font-face {
    font-family: 'Rokkitt';
    src: url('../fonts/rokkitt-regular-webfont.woff2') format('woff2'),
         url('../fonts/rokkitt-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Rokkitt';
    src: url('../fonts/rokkitt-bold-webfont.woff2') format('woff2'),
         url('../fonts/rokkitt-bold-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}


/* variabel */ 

@font-face {
    font-family: 'HankenGroteskVariable';
    src: url('../fonts/HankenGrotesk-VariableFont_wght.woff2') format('woff2-variations');
    font-weight: 100 900; /* Von Light bis Black */
    font-style: normal;
}

@font-face {
    font-family: 'HankenGroteskVariableItalic';
    src: url('../fonts/HankenGrotesk-Italic-VariableFont_wght.woff2') format('woff2-variations');
    font-weight: 100 900; /* Von Light bis Black */
    font-style: italic;
}

@font-face {
    font-family: 'RalewayVariable';
    src: url('../fonts/Raleway-VariableFont_wght.woff2') format('woff2-variations');
    font-weight: 100 900; /* Von Light bis Black */
    font-style: normal;
}


a:hover, a:focus, a:active {
  color: #cfa0d7 !important;
}

/* HEADER / TOP */
#sp-top-bar {
    position: relative; /* Oder absolute, je nach Bedarf */
    z-index: 999; /* Höherer Wert, damit es über dem Main-Menü bleibt */
    background-color: rgba(0, 0, 0, 0.8); /* Sicherstellen, dass es sichtbar ist */
}

#sp-header {
    position: relative; /* Sicherstellen, dass es hinter dem Top-Menü bleibt */
    z-index: 1; /* Niedrigerer Wert als #sp-top-bar */
    margin-top: 44px; /* Verschiebt das Main-Menü nach unten, passe den Wert nach Bedarf an */
	padding-top: 40px;
}

#sp-header.header-sticky {
  position: fixed;
  z-index: 9999;
  margin-top: 0px;
}

#sp-below-menu {
    margin-top: 20px !important;
}


/*
#sp-header .sp-dropdown-inner  {
    background: #FCE8D1
	}
*/

/* LOGO */
/* Mobile adjustments */
@media (max-width: 768px) {
    .logo-image-phone {
        padding-top: 20px; /* Increase padding to move the logo further down */
        height: auto; /* Allow for auto scaling */
        max-height: 130px; /* Increase the max height for a larger logo */
        width: auto; /* Maintain aspect ratio */
        margin-top: 10px; /* Add more margin to push it further down */
    }

    .logo {
        display: flex; /* Use flex to center it within its container */
        justify-content: center; /* Center horizontally */
        align-items: center; /* Center vertically */
    }
}


@media screen and (max-width: 580px) {
  .logo-image-phone {height: 40px; padding-top: 0; margin-top: 0;}
   #sp-header.header-sticky {margin-top: 0;}
}

 
/* ####### */

/* --- Existing CSS code --- */

/* Redundant background color setting removed */
.sp-dropdown-inner {
    background-color: #f4ece2 !important;
}

/* Mobile-specific logo settings consolidated */
#sp-logo {
    padding-top: 4px; /* Kontrolliert die vertikale Position */
    display: flex; /* Sicherstellen, dass Flexbox-Eigenschaften hier nicht zu Größe führen */
    align-items: flex-start; /* Beeinflusst die Position innerhalb des Containers */
}

.logo-image-phone {
    height: 80px; /* Feste Größe beibehalten */
    max-height: none !important; /* Verhindert Größenanpassung durch übergeordnete Flex-Einstellungen */
}

/* --- Other existing CSS code --- */

/* Other CSS rules are preserved here, no optimizations or formatting changes were made */

/* BODY */

body {
    font-family: 'Rokkitt', serif;
    font-size: 16px; /* oder eine andere Größe, die du bevorzugst */
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Rokkitt', serif;
    /* Du kannst hier auch spezifische Schriftgrößen für Überschriften festlegen */
}

/* Beispiele für Schriftgrößen bei Überschriften */
h1 {
    font-size: 2rem; /* 32px, wenn die Basisgröße 16px beträgt */
}

h2 {
    font-size: 1.5rem; /* 24px bei einer Basis von 16px */
}

/* usw. für h3, h4, h5, h6 */

p {
    font-family: 'Rokkitt', serif;
    font-size: 1.4rem; /* 16px */
}

/*
span {
    font-family: 'Rokkitt', serif;
    font-size: 1.4rem; 
}
*/

/* Du kannst auch die Schriftgröße für kleinere Elemente anpassen */
small {
    font-size: 0.8rem; /* kleiner als der Standardtext */
}


sp-megamenu-parent {
	    font-family: 'Rokkitt', serif;
}

/* Text-Formatierungen */

.text-uppercase {
    text-transform: uppercase;
}

/* NAV MENU */
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
  background: #FCE8D1;
}


/* Body */
body, p {
line-height:1.2 !important;	
}

@media (max-width: 768px) {
    body p {
        font-size: 1.1rem !important;
    }
}

/* IMAGES */

.inline-imgs img {
  display: inline;
  vertical-align: middle;
}




/* Footer */
/* CSS Formatierung für den Fußbereich mit der Klasse text-footer */
.text-footer {
    font-weight: normal; /* Standard: nicht fett */
    font-size: 14px; /* Standard-Schriftgröße */
    line-height: 1.1; /* Standard-Zeilenabstand */
}

/* Formatierung für Überschriften innerhalb des Fußbereichs */
.text-footer h1, 
.text-footer h2, 
.text-footer h3, 
.text-footer h4, 
.text-footer h5, 
.text-footer h6 {
    font-weight: bold; /* Überschriften fett */
    font-size: 18px; /* Überschriften größer als Standardtext */
    line-height: 1.4; /* Zeilenabstand für Überschriften */
    margin-bottom: 10px; /* Abstand nach unten */
}


#sp-footer {
  background-color: rgb(45, 11, 51) !important;
}

/* Formatierung für Absätze innerhalb des Fußbereichs */
.text-footer p {
    font-weight: normal; /* Absätze nicht fett */
    font-size: 14px; /* Gleiche Schriftgröße wie der Standardtext */
    line-height: 1.1; /* Angepasster Zeilenabstand für Absätze */
    margin-bottom: 8px; /* Abstand nach unten */
}

#sp-bottom1 h3.sp-module-title,
#sp-bottom2 h3.sp-module-title,
#sp-bottom3 h3.sp-module-title,
#sp-bottom4 h3.sp-module-title {
    margin-bottom: 20px !important;
}

/* Listen */
ul, ol, li {
    font-size: 1.2rem; /* Ensure font size consistency */
    line-height: 1.2; /* A more balanced line-height for list readability */
}


/* Footer */
#sp-bottom {
    padding: 90px 0 70px; /* Anpassung des Abstands */
    background-color: unset; /* Hintergrundfarbe nicht gesetzt */
    background-image: linear-gradient(60deg, #260b2f 0%, rgba(47, 12, 60, 0.97) 81.5%); /* Hintergrundbild */
    font-size: 18px; /* Schriftgröße für den Bereich */
    line-height: 1.2; /* Zeilenabstand */
}
#sp-bottom .sp-module {
    margin-bottom: 30px;
}
#sp-bottom .sp-module .sp-module-title {
    font-weight: 700;
    font-size: 18px;
    margin: 0 0 30px;
}
#sp-bottom .sp-module ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
#sp-bottom .sp-module ul > li {
    display: block;
    margin-bottom: 15px;
}
#sp-bottom .sp-module ul > li:last-child {
    margin-bottom: 0;
}
#sp-bottom .sp-module ul > li > a {
    display: block;
}

/* Bottom Menü-Schriftgröße */
#sp-bottom3.col-lg-3 .menu li a {
    font-size: 1rem; /* Passe die Schriftgröße hier an */
}

/* Footer specific */
#sp-footer {
    font-size: 14px;
    padding: 0;
}
#sp-footer .container-inner {
    padding: 30px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
#sp-footer ul.menu {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0 -10px;
}
#sp-footer ul.menu li {
    display: inline-block;
    margin: 0 10px;
}
#sp-footer ul.menu li a {
    display: block;
}
#sp-footer ul.menu li a:hover {
    background: none;
}
#sp-footer #sp-footer2 {
    text-align: right;
}


/* KARTEN */
/* Getraenke */

.getraenke-liste {
	margin-bottom: 5px;
}

/* Speisekarte */

.karten-speisen-pizza-teig {
    position: absolute;
    right: -10%; /* Position -> R */
    top: 0;
    width: 50%;
    transform: rotate(10deg);
}

@media (max-width: 768px) {
    .karten-speisen-pizza-teig {
        position: relative;
        display: block;
        margin: 0 auto;
        transform: none;
    }
}

.pricelist-title {
    font-size: 1.4rem; /* Setzt die Schriftgröße auf 1.2em */
}

.sppb-addon-pricelist .sppb-addon-content {
  color: #816b5f;
}

.sppb-column, .sppb-column-addons {
  position: relative;
  z-index: 1;
  width: 100%;
}


.pricelist-price {
    font-size: 1.2rem; /* Setzt die Schriftgröße auf 1.2em */
}

@media (max-width:576px) {
.sppb-addon-pricelist .pricelist-title {
flex:0 0 auto
}

/* Formatierungs-Fix */

/* === PRICELIST FIX start == */

.sppb-addon-pricelist .pricelist-text-content p {
    color: #564842 !important;
    font-style: italic !important;
}

.sppb-addon-pricelist .pricelist-text-content p::before,
.sppb-addon-pricelist .pricelist-text-content p::after {
    content: "";
    display: block;
}

/*    font-size: 16px !important; /* or your desired size */
/* ================ */


/* Container für Titel, Linie und Preis */
.pricelist-title-content {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap; /* Erlaubt Umbrüche innerhalb des Containers */
    gap: 10px;
}


/* Titel: Stellt sicher, dass der Text umbricht */
.pricelist-title {
    margin: 0;
    padding: 0;
    display: block; /* Stellt sicher, dass der Textblock umbricht */
    white-space: normal !important; /* Erlaubt Zeilenumbrüche */
    overflow-wrap: break-word; /* Bricht lange Wörter um */
    word-break: break-word; /* Erzwingt Umbruch bei langen Wörtern */
    max-width: 100%; /* Begrenzung der Breite auf den Container */
}

/* Linie: Hält die Linie unten */
.pricelist-line {
    flex: 1;
    display: flex;
    align-items: flex-end;
}

/* Stil der gepunkteten Linie */
.pricelist-line-style-dashed {
    width: 100%;
    margin: 0;
    border-bottom: 1px dashed #979797;
}

.pricelist-line-style-dotted {
    border-bottom: 1px dotted #979797; /* Definiert die Linie als gepunktet */
}

/* Preis: Positionierung am unteren Rand */
.pricelist-price {
    margin: 0;
    padding: 0;
    align-self: flex-end;
    white-space: nowrap;
    margin-left: auto;
    text-align: right;
}

/* === PRICELIST FIX end == */
	
/* Öffnungszeiten */

/* Container: Flexbox für Desktop */
.oeffi-feiertage {
    display: flex;
    align-items: center; /* Vertikale Zentrierung */
    justify-content: space-between; /* Gleichmäßige Verteilung */
    gap: 20px; /* Abstand zwischen den Elementen */
    max-width: 1000px; /* Maximale Breite des Containers */
    margin: 0 auto; /* Zentrierung auf der Seite */
    padding: 20px;
}

/* Bilder */
.oeffi-image {
    width: 200px; /* Breite der Bilder */
    height: auto; /* Proportionale Skalierung */
}

/* Textblock */
.oeffi-text {
    text-align: center;
    font-size: 1.2rem;
    line-height: 1.6;
    flex: 1; /* Der Textblock nimmt den verfügbaren Platz ein */
}

/* Tablet und Handy: Stacken der Elemente */
@media (max-width: 1024px) {
    .oeffi-feiertage {
        flex-direction: column; /* Stapeln der Elemente */
        gap: 10px; /* Kleinere Abstände */
    }

    .oeffi-image {
        width: 60%; /* Bilder füllen mehr Breite aus */
    }
}







/* Deko / Deco */

.line-container {
    display: flex;
    justify-content: center;
    padding: 8px 0; /* 8px Padding oben und unten */
    width: 100%; /* Breite auf 100% */
}

.line-container svg {
    display: block;
}

/* Buttons */

/* Hintergrundfarbe und Textfarbe beim Hover */
body .sppb-btn:hover {
  color: #ffffff !important; /* Textfarbe auf Weiß setzen */
  background-color: #8b002b !important; /* Hintergrundfarbe beim Hover */
  position: relative;
}

/* Pseudo-Elemente beim Hover vollständig entfernen */
body .sppb-btn:hover::after,
body .sppb-btn:hover::before {
  content: none !important; /* Entfernt den Inhalt der Pseudo-Elemente */
  background-color: transparent !important; /* Hintergrundfarbe der Pseudo-Elemente auf transparent setzen */
  border: none !important; /* Rahmen entfernen */
  height: 0 !important; /* Höhe auf 0 setzen, falls noch vorhanden */
}
  

.login-forgot-password, .login-forgot-username {
    display: none;
}

/* Martin's Fun */

/* Keyframes für die Shake-Animation */
@-webkit-keyframes shake {
    0%, 100% {
        transform: translateX(0);
    }
    25%, 75% {
        transform: translateX(-5px);
    }
    50% {
        transform: translateX(5px);
    }
}

@keyframes shake {
    0%, 100% {
        transform: translateX(0);
    }
    25%, 75% {
        transform: translateX(-5px);
    }
    50% {
        transform: translateX(5px);
    }
}

/* Icon-Animation */
.martins-phone-shaker {
    display: inline-block;
    -webkit-animation: shake 0.4s ease-in-out 4; /* Animation für 4 Zyklen */
    animation: shake 0.4s ease-in-out 4;
    animation-delay: 1s; /* Startet nach 1 Sekunde */
    animation-fill-mode: forwards; /* Beendet die Animation */
}