@CHARSET "UTF-8";

/*
@font-face {
    font-family: 'BookmanOldStyleRegular';
    src: url('bookos.eot');
    src: url('bookos.eot') format('embedded-opentype'),
         url('bookos.woff') format('woff'),
         url('bookos.ttf') format('truetype'),
         url('bookos.svg#BookmanOldStyleRegular') format('svg');
}
                  

@font-face {
    font-family: 'ScriptMTBoldRegular';
    src: url('scriptbl.eot');
    src: url('scriptbl.eot') format('embedded-opentype'),
         url('scriptbl.woff') format('woff'),
         url('scriptbl.ttf') format('truetype'),
         url('scriptbl.svg#ScriptMTBoldRegular') format('svg');
}

*/
@font-face {
    font-family: 'SanukTF-LightRegular';
    src: url('sanuktf-light-webfont.eot');
    src: url('sanuktf-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('sanuktf-light-webfont.woff') format('woff'),
         url('sanuktf-light-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}


            
*{margin:0;padding:0;}




HTML,BODY,DIV,SPAN,APPLET,OBJECT,IFRAME,H1,H2,H3,H4,H5,H6,P{font-family: SanukTF-LightRegular;}
a{ text-decoration:none; color:#262726;}
a:hover{color:#fffacf;}

img{border:none; vertical-align:text-bottom;}
strong,b,h1,h2,h3,h4,h5,h6{
color:#2B231C;	
}
h1,h2,h3,h4,h5,h6{
	font-weight: normal;
  color:#2B231C;
	   
}

html, body {
    min-height: 100%;
}
body {
     background: url(bg3.jpg) repeat top center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
 font-family: SanukTF-LightRegular !important;
      font-size:14px;

      color:#2B231C;
        width:100%;
        height:100%;
     

}
@media (min-width: 1120px), (min-height: 630px) {
    body { background-size: auto; }
}


.top{
position: relative;
}
.inn{
position: absolute;
    z-index: 999;
    width:100%;

}
.org{
background: url(org.png) repeat-x top left;
height:180px;
position: absolute;
z-index:2;
width:100%;
}
.waper{
	width:100%;
	max-width:1024px;
	margin:auto;
  background:#e1cfb2;
position: relative;
}
#sdx{


}
#sdx img{
width:100%;

}
 
 .menu{
 
 
 width:100%;
 text-align: center;
 font-family: SanukTF-LightRegular;
 }
 .menu a{
 
 
 }
 .menu a:hover{

 
 
 }
 .mhover{
   background:url(op.png) ;
  color:#000;
 }
 .oline{
     background:url(op.png) ;
     height:10px;
     
 
 }
 .acontent{
 
 padding:15px 10px;
 
 
 }
  .bcontent{

 padding:15px 10px;
 
 
 }
 
 
 .ti{
 font-family: SanukTF-LightRegular;
 font-weight: bold;
 font-size:22px;
 color:#2B231C;
 padding-bottom:10px;
 border-bottom: 1px solid #2B231C;
 }
 
 .ti1{
 font-family: SanukTF-LightRegular;
 font-weight: bold;
 font-size:22px;
 color:#2B231C;
 padding-bottom:10px;
 
 }
 .tix{
  font-family: SanukTF-LightRegular;
 font-weight: bold;
 font-size:28px;
 color:#918E81;
 padding:5px 0;
 }
 .inline{
 display: inline-block;
 vertical-align: top;
 text-align: left;
 }
 .tline{
 background: #938A86;
 width:100%;
 height:5px;
 }
 .footer{
  color:#918E81;
  padding:10px 30px;
 }
 .footer a{
 font-family: SanukTF-LightRegular;
  color:#918E81;
 }
 
 .hmenu{
display:none;
position: absolute;
z-index:99999;
background:#000;
color:#fff;   
font-size:13px;
padding:5px 10px;

  list-style: none;
}
.hmenu a{
    color:#fff; 

}
#nav, #nav ul{
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:1.5em; 
font-family:inherit;
z-index:20;

}

#nav a{
display:block;
padding:0px 0px 0px 2px;

color:#5f4c3f;
text-decoration:none;
text-align:left;
font-size:14px;


}

#nav a:hover{

color:#fffacf;

}

#nav li{
float:left;
position:relative;
margin-left:4px;

}             

#nav li a{

 color:#2d231c;
 font-size:22px;
 display: inline-block;
 padding:15px 25px 15px 25px;

}
    


#nav ul {
position:absolute;
display:none;
width:12em;
top:40px;
left:10px;
}
#nav li ul{

}

#nav li ul a{
width:10em;
word-wrap:break-word;
height:auto;
float:left;
padding:4px 4px 4px 8px;
  font-size:18px;
    background:#e1cfb2;

}
#nav li ul a:hover{
	
	
}

#nav ul ul{
top:auto;
}	

#nav li ul ul {
left:13em;
margin:0px 0 0 6px;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul{
display:none;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul{
display:block;
}



.oe_overlay{
	background:#000;
	opacity:0;
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}
ul.oe_menu{
	list-style:none;
	position:relative;
	margin:0px 0px 0px 0px;
	width:800px;
	float:left;
	clear:both;

}
ul.oe_menu > li{
	

	padding-bottom:2px;
	float:left;
	position:relative;
padding-top:3px;
}
ul.oe_menu > li > a{
      color:#40261E;
 font-size:22px;
 display: inline-block;
 padding:60px 15px 25px 15px;
}
ul.oe_menu li a:hover{

 background:url(op.png) ;
  color:#000;
}
ul.oe_menu > li > a:hover,
ul.oe_menu > li.selected > a{

          background:url(op.png) ;
  color:#000;
	
}
.oe_wrapper ul.hovered > li > a{
	          background:url(op.png) ;
  color:#000;
                 
}
ul.oe_menu div{
	position:absolute;
	top:115px;
	left:0px;
	
	
	min-height:50px;
	padding:10px 30px;
	display:none;  

  z-index:99999999999999999999;
  text-align:left;
   background:url(op.png) ;
}


ul.oe_menu div ul li a{
	           padding:5px 10px !important;
             font-size:18px !important;
             display:block;
             
           
             
}



ul.oe_menu div ul.oe_full{
               
}
ul.oe_menu div ul li a:hover{

background:none !important;

}


#navx { width: 900px;z-index:999;position:absolute;margin-top:385px;margin-left:20px;}

#navx li { width: 80px; float: left; margin: 0px; list-style: none }

#navx a { width: 80px; padding: 0px; display: block; border: 1px solid #fff; }

#navx li.activeSlide a { background: #88f }

#navx a:focus { outline: none; }

#navx img { border: none; display: block }
.leftcon{
width:25%;
margin-left:3%;
background: #5B5B5A;
color:#fff;
min-height:620px;

}
.rightcon{
width:67%;
margin-left:2%;
padding:25px 0;


}
.rightcon p{
padding-top:10px;
}

/* ==========================================================
   Responsive Anpassungen - Schritt 1+2 (03.07.2026)
   Grundlayout fluid machen, Sidebar/Hauptbereich stapeln,
   feste Breiten aus dem alten Template entschaerfen.
   ========================================================== */
@media (max-width: 768px) {

	.leftcon, .rightcon{
		display:block !important;
		width:94% !important;
		margin-left:3% !important;
		margin-right:3%;
		min-height:0 !important;
		height:auto !important;
	}

	#navx{
		width:100% !important;
		margin-left:0;
		margin-top:0 !important;
		position:static !important;
		box-sizing:border-box;
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
	}
	#navx li{
		float:none !important;
		width:60px !important;
		margin:3px !important;
	}
	#navx a{
		width:60px !important;
	}

	ul.oe_menu{
		width:100% !important;
	}

	#nav li a{
		font-size:16px;
		padding:10px 12px;
	}

	.tix{
		font-size:20px;
	}

	.ti, .ti1{
		font-size:18px;
	}

	/* Bilder aus dem CMS-Content (oft mit Inline-float/-width vom
	   WYSIWYG-Editor) auf Mobile erzwungen responsive machen */
	.rightcon img{
		float:none !important;
		width:100% !important;
		max-width:100% !important;
		height:auto !important;
		margin:0 0 15px 0 !important;
		display:block;
	}

	/* Ausnahme: kleine Icon-Bilder aus dem CMS-Content (z.B. die
	   Sprachumschalter-Flaggen mit width="20" height="20") sollen
	   NICHT auf volle Breite gezogen werden */
	.rightcon img[width="20"],
	.rightcon img[height="20"]{
		width:20px !important;
		max-width:20px !important;
		height:20px !important;
		display:inline-block !important;
		float:none !important;
		margin:0 4px !important;
		vertical-align:middle !important;
	}

	/* Hartkodierte Wrapper-Boxen im CMS-Content (z.B. width:900px mit
	   zwei float-Spalten fuer Bild/Text) auf Mobile entschaerfen */
	.rightcon > div{
		width:100% !important;
		height:auto !important;
	}
	.rightcon > div > div{
		width:100% !important;
		float:none !important;
		height:auto !important;
	}

	/* ==================================================
	   Header-Bereich (Schritt 3, 18.07.2026):
	   Kleinlinks, Logo und Hauptnavigation fuer Mobile
	   ================================================== */

	/* Die "> Speisekarte / Tagesessen / Impressum / Datenschutz"-Box
	   komplett ausblenden: Speisekarte/Tagesessen stehen schon in der
	   Sidebar, Impressum/Datenschutz sind jetzt im Hamburger-Menue */
	.waper > div[style*="position: absolute"][style*="right:5%"]{
		display:none !important;
	}

	.waper > p[align="center"] img{
		max-width:60%;
		height:auto;
		width:auto;
	}

	/* Hauptnavigation: statt nebeneinander (float) auf Mobile
	   untereinander stapeln, damit nichts mehr umbricht/abgeschnitten wird */
	#nav li{
		float:none;
		display:block;
		margin-left:0 !important;
		border-bottom:1px solid rgba(0,0,0,0.08);
	}

	#nav li a{
		display:block;
		text-align:center;
		padding:12px 10px;
	}

	#nav ul{
		position:static !important;
		display:block !important;
		width:100% !important;
		top:auto !important;
		left:auto !important;
	}

	#nav li ul{
		position:static !important;
	}

	#nav li:hover ul{
		position:static !important;
	}

	#nav li ul a{
		width:100%;
		box-sizing:border-box;
		text-align:center;
		float:none !important;
	}

	/* ==================================================
	   Buchungsleiste (booking-script/calendar.css):
	   dort ist ALLES mit festen Pixel-Werten absolut
	   positioniert (z.B. .checkout{left:427px}) - auf
	   Mobile auf normalen Dokumentenfluss umstellen.
	   ================================================== */
	.searchbox2{
		height:auto !important;
		padding:15px 10px !important;
		box-sizing:border-box;
	}

	.searchbox2 .headtop{
		position:static !important;
		display:block;
		margin-bottom:10px;
	}

	.searchbox2 .checkin,
	.searchbox2 .checkout,
	.searchbox2 .button{
		position:static !important;
		width:100% !important;
		left:auto !important;
		right:auto !important;
		top:auto !important;
		display:block;
		margin:0 0 10px 0 !important;
		box-sizing:border-box;
	}

	.searchbox2 .checkin input,
	.searchbox2 .checkout input{
		width:100% !important;
		box-sizing:border-box;
		float:none !important;
		margin-right:0 !important;
	}

	.searchbox2 .button{
		text-align:center;
	}

	.searchbox2 .button input{
		width:100% !important;
		height:38px !important;
	}
}

/* ==================================================
   Hamburger-Menue (Schritt 3b, 18.07.2026)
   Button nur auf Mobile sichtbar, Desktop unveraendert
   ================================================== */
.nav-toggle{
	display:none;
}
.btn-mobile-search{
	display:none;
}
.nav-close{
	display:none;
}

@media (max-width: 768px) {

	.nav-toggle{
		display:block;
		width:36px;
		height:28px;
		margin:0 auto 10px auto;
		cursor:pointer;
		position:relative;
		z-index:10000;
	}
	.nav-toggle span{
		display:block;
		height:4px;
		background:#2B231C;
		margin-bottom:6px;
		border-radius:2px;
	}
	.nav-toggle span:last-child{
		margin-bottom:0;
	}

	.nav-close{
		display:none;
		position:fixed;
		top:15px;
		right:20px;
		font-size:36px;
		line-height:1;
		color:#2B231C;
		cursor:pointer;
		z-index:10002;
	}
	.nav-close.nav-open{
		display:block;
	}

	/* Navigation standardmaessig ausgeblendet, oeffnet sich
	   als Vollbild-Overlay ueber den Hamburger-Button */
	#nav{
		display:none;
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background:#e1cfb2;
		z-index:10001;
		overflow-y:auto;
		padding-top:70px;
		box-sizing:border-box;
	}
	#nav.nav-open{
		display:block !important;
	}
}

/* Impressum/Datenschutz nur im mobilen Hamburger-Menue zeigen,
   auf Desktop stehen sie schon in der oberen Kleinlinks-Box */
.mobile-only-nav-item{
	display:none;
}
@media (max-width: 768px) {
	.mobile-only-nav-item{
		display:block !important;
	}
}

/* ==================================================
   Feinschliff Buchungsleiste (Schritt 3c, 18.07.2026):
   groesserer Kalender, groessere Eingabefelder,
   sauberer "Pruefen"-Button statt gestrecktem Bild
   ================================================== */
@media (max-width: 768px) {

	/* Eingabefelder Ankunft/Abfahrt: groesser, besser antippbar */
	.searchbox2 .checkin input,
	.searchbox2 .checkout input{
		font-size:16px !important;
		height:40px !important;
		padding:0 10px !important;
	}

	.searchbox2 .headtop{
		font-size:15px !important;
	}
	.searchbox2 .checkin > span,
	.searchbox2 .checkout > span{
		font-size:13px !important;
	}

	/* Original-Bild-Button ausblenden (laesst sich nicht sauber
	   skalieren, da es ein echtes <input type="image"> ist),
	   stattdessen den neuen, sauberen Mobile-Button zeigen */
	.searchbox2 .button input#sb{
		display:none !important;
	}

	.btn-mobile-search{
		display:block;
		width:100%;
		border:none;
		border-radius:6px;
		background:#e8a513;
		color:#2B231C;
		font-weight:bold;
		font-size:16px;
		padding:12px 0;
		-webkit-appearance:none;
		appearance:none;
	}

	/* Kalender-Popup vergroessern, besser antippbar */
	div#tcal{
		width:260px !important;
	}
	div#tcal th{
		font-size:13px !important;
		padding:6px 0 !important;
	}
	div#tcal td{
		font-size:15px !important;
		padding:8px 0 !important;
		width:auto !important;
	}
}

/* ==================================================
   Feinschliff Sidebar/Navigation (Schritt 3d, 18.07.2026)
   ================================================== */
@media (max-width: 768px) {

	/* Wetter-Widget zentrieren statt am festen padding-left
	   hängenzubleiben */
	.leftcon div[style*="padding-left:40px"]{
		padding-left:0 !important;
		margin:0 auto !important;
	}

	/* Klare optische Hierarchie im Hamburger-Menue:
	   Hauptpunkte (Hotel, Kulinarisches, ...) deutlich groesser/
	   fetter als ihre Unterpunkte */
	#nav > li > a{
		font-size:20px !important;
		font-weight:bold !important;
		background:rgba(0,0,0,0.06);
		padding:14px 10px !important;
	}

	#nav li ul li a{
		font-size:15px !important;
		font-weight:normal !important;
		padding:9px 10px !important;
		color:#5a4a3a;
	}
}

/* ==================================================
   Buchungstabelle -> Karten-Ansicht (Schritt 4, 18.07.2026)
   Betrifft booking1.php (Zimmerauswahl-Tabelle)
   ================================================== */
@media (max-width: 768px) {

	.room-daterange-mobile{
		display:block;
		font-size:15px;
		font-weight:bold;
		background:rgba(0,0,0,0.05);
		padding:8px 10px;
		border-radius:4px;
		margin-top:8px;
	}

	.room-table-header{
		display:none !important;
	}

	.room-table,
	.room-table tbody,
	.room-table tr.room-row{
		display:block;
		width:100%;
	}

	.room-table{
		border:none !important;
	}

	.room-row{
		border:1px solid #ccc !important;
		border-radius:6px;
		margin-bottom:15px;
		padding:10px;
		box-sizing:border-box;
		background:#fff;
	}

	.room-row td{
		display:block;
		width:100% !important;
		box-sizing:border-box;
		border:none !important;
		padding:6px 0 !important;
		text-align:left !important;
	}

	.room-row td[data-label]:before{
		content: attr(data-label) ": ";
		font-weight:bold;
		color:#918E81;
		display:inline-block;
		min-width:100px;
	}

	/* Zimmertyp-Zeile: Checkbox+Name soll nicht das "vor dem Text"-
	   Label bekommen wie die anderen (sieht sonst komisch aus) */
	.room-row td[data-label="Zimmertyp"]:before{
		display:none;
	}
	.room-row td[data-label="Zimmertyp"]{
		font-size:17px;
		font-weight:bold;
		border-bottom:1px solid #eee !important;
		margin-bottom:6px;
		padding-bottom:10px !important;
	}

	.room-row td[data-label="Gesamtpreis"]{
		font-size:16px;
		font-weight:bold;
		color:#2B231C;
		border-top:1px solid #eee !important;
		margin-top:6px;
		padding-top:10px !important;
	}

	.room-row select{
		font-size:16px;
		height:36px;
	}
}

/* ==================================================
   Sidebar (Telefon/Oeffnungszeiten/Wetter) auf allen
   Unterseiten (nicht Startseite) auf Mobile ausblenden
   (Schritt 4b, 18.07.2026)
   ================================================== */
@media (max-width: 768px) {
	.page-sub .leftcon{
		display:none !important;
	}
	.page-sub .rightcon{
		width:94% !important;
		margin-left:3% !important;
	}
}

/* ==================================================
   "Anfragen"/"Loeschen"-Buttons vergroessern (Schritt 4c)
   ================================================== */
@media (max-width: 768px) {
	input[name="submit_btn1"],
	input[name="submit_btn2"]{
		font-size:16px !important;
		padding:12px 24px !important;
		margin:6px !important;
		border-radius:6px;
		min-width:130px;
	}
	input[name="submit_btn1"]{
		background:#e8a513;
		border:none;
		font-weight:bold;
		color:#2B231C;
	}
	input[name="submit_btn2"]{
		background:#fff;
		border:1px solid #ccc;
	}
}

/* ==================================================
   booking2.php: Gaeste-/Rechnungsformular (Schritt 5,
   18.07.2026) - alle verschachtelten Tabellen auf Mobile
   in normalen Blockfluss umwandeln (Karten-Look wie bei
   booking1.php wuerde hier zu viele Einzelaenderungen im
   PHP brauchen, generische Loesung stattdessen)
   ================================================== */
@media (max-width: 768px) {

	.booking-step2-form table,
	.booking-step2-form tbody,
	.booking-step2-form tr,
	.booking-step2-form td{
		display:block !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		box-sizing:border-box;
		overflow:visible !important;
	}

	.booking-step2-form{
		padding:0 3%;
	}

	/* Eingabefelder/Dropdowns/Textareas groesser und antippbar */
	.booking-step2-form input[type="text"],
	.booking-step2-form textarea,
	.booking-step2-form select{
		width:100% !important;
		box-sizing:border-box;
		font-size:16px !important;
		height:auto !important;
		min-height:40px;
		padding:8px !important;
		margin:2px 0 10px 0 !important;
	}

	.booking-step2-form textarea{
		min-height:70px;
	}

	/* Radiobutton-/Checkbox-Zeilen (Anrede, Bestaetigungsmail,
	   Buchungsbedingungen akzeptieren) - groesser fuer Touch */
	.booking-step2-form input[type="radio"],
	.booking-step2-form input[type="checkbox"]{
		width:22px !important;
		height:22px !important;
		margin-right:8px !important;
		vertical-align:middle;
	}

	/* Leere Abstandshalter-Zellen (border-top ohne definierte Farbe,
	   faellt auf Schwarz zurueck) - Rahmen komplett unterdruecken */
	.booking-step2-form td{
		border:none !important;
	}

	/* Schrittueberschriften (Schritt 1/2/3/4) etwas Luft geben */
	.booking-step2-form td.header{
		margin-top:15px;
		padding:10px 5px !important;
		font-size:15px;
	}

	/* "Kostenpflichtig buchen" / "Abbrechen"-Buttons */
	.booking-step2-form input[name="submit_btn2"]{
		width:100% !important;
		height:46px !important;
		font-size:16px !important;
		margin:8px 0 !important;
		background-image:none !important;
	}
}

/* ==================================================
   booking2.php: Zimmer-/Options-Tabellen (Schritt 6,
   18.07.2026) - Label direkt vor den Wert setzen statt
   getrennte Listen (Header ausblenden, data-label zeigen)
   ================================================== */
@media (max-width: 768px) {

	.booking-step2-form tr.head_rooms{
		display:none !important;
	}

	.booking-step2-form td[data-label]:before{
		content: attr(data-label) ": ";
		font-weight:bold;
		color:#754807;
		display:inline;
	}
}

/* ==================================================
   Buchungsleiste auf Unterseiten kompakt/einklappbar
   machen (Schritt 7, 18.07.2026). Startseite (page-home)
   zeigt das Formular immer voll ausgeklappt.
   ================================================== */
.searchbox-toggle-btn{
	display:none;
}

@media (max-width: 768px) {

	.page-sub .searchbox-toggle-btn{
		display:block;
		text-align:center;
		background:#e8a513;
		color:#2B231C;
		font-weight:bold;
		padding:12px 0;
		margin:8px 3% 0 3%;
		border-radius:6px;
		cursor:pointer;
	}

	/* Formularinhalt auf Unterseiten standardmaessig verstecken,
	   bis auf den Toggle-Button geklickt wurde */
	.page-sub .searchbox2 .checkin,
	.page-sub .searchbox2 .checkout,
	.page-sub .searchbox2 .button{
		display:none !important;
	}

	.page-sub .searchbox2.expanded .checkin,
	.page-sub .searchbox2.expanded .checkout,
	.page-sub .searchbox2.expanded .button{
		display:block !important;
	}

	/* Grundhoehe der Box reduzieren, wenn eingeklappt
	   (searchbox2 hatte urspruenglich eine feste Hoehe) */
	.page-sub .searchbox2{
		height:auto !important;
		padding-bottom:12px;
	}
}

/* ==================================================
   Bilder-Slider (#sdx) auf Mobile (Schritt 8c, 18.07.2026)
   Karussell laeuft weiter automatisch durch (siehe
   lib/template.php), aber ohne Thumbnail-Leiste. Das
   Plugin positioniert die Bilder fuer den Fade-Effekt
   absolut - deshalb feste Bildhoehe via aspect-ratio,
   damit der Container nicht auf 0 zusammenfaellt.
   ================================================== */
@media (max-width: 768px) {
	#sdx{
		width:100% !important;
		max-width:100% !important;
		aspect-ratio: 3 / 2 !important;
		height:auto !important;
		overflow:hidden;
		position:relative !important;
		display:none;
	}
	#sdx img{
		width:100% !important;
		height:100% !important;
		max-width:100% !important;
		object-fit:cover;
		top:0 !important;
		left:0 !important;
	}
	/* Thumbnail-Pager wird auf Mobile nicht mehr erzeugt,
	   zur Sicherheit trotzdem ausblenden falls doch vorhanden */
	#navx{
		display:none !important;
	}
}

/* ==================================================
   Generelle Absicherung gegen horizontales Wegziehen/
   Scrollen auf Mobile, falls irgendwo noch ein Element
   breiter als der Viewport ist (Schritt 8c, 18.07.2026)
   ================================================== */
@media (max-width: 768px) {
	html, body{
		overflow-x:hidden !important;
		max-width:100vw !important;
	}
	.waper{
		overflow-x:hidden !important;
	}
}

/* ==================================================
   Service-/Kategorie-Karten (Zimmer/Rooms, Fruehstueck,
   Motorrad etc. - generiert in lib/template.php an 4
   Stellen mit "width:41%;margin:5px 25px") auf Mobile
   zentriert stapeln statt mit festem 25px-Rand schief
   anzuordnen (Schritt 9, 19.07.2026)
   ================================================== */
@media (max-width: 768px) {
	div[style*="width:41%"][style*="margin:5px 25px"]{
		width:94% !important;
		margin:10px 3% !important;
		display:block !important;
		box-sizing:border-box;
	}
}
