| Server IP : 217.160.0.244 / Your IP : 216.73.216.25 Web Server : Apache System : Linux infong-eu155 4.4.400-icpu-108 #2 SMP Wed Feb 11 11:51:01 UTC 2026 x86_64 User : u100174116 ( 6746176) PHP Version : 8.5.10 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /homepages/13/d818981593/htdocs/GutTrechowNeu/assets/css/ |
Upload File : |
@font-face {
font-family: "CardoGT";
src: url("../fonts/cardo-regular-webfont.woff2") format("woff2"), url("../fonts/cardo-regular-webfont.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: "CardoGTBold";
src: url("../fonts/cardo-bold-webfont.woff2") format("woff2"), url("../fonts/cardo-bold-webfont.woff") format("woff");
font-display: swap;
}
@font-face {
font-family: "LatoGT";
src: url("../fonts/lato-regular-webfont.woff2") format("woff2"), url("../fonts/lato-regular-webfont.woff") format("woff");
font-display: swap;
}
:root {
--paper: rgba(248, 246, 240, 0.84);
--paper-strong: rgba(250, 248, 242, 0.94);
--paper-soft: rgba(255, 255, 255, 0.55);
--paper-line: rgba(120, 108, 87, 0.28);
--text: #463d33;
--text-dark: #2f281f;
--content-width: 1065px;
--left-width: 370px;
--left-gap: 48px;
--content-offset-x: 80px;
--ease-out: cubic-bezier(.22,.61,.36,1);
}
* { box-sizing: border-box; }
html { font-size: 62.5%; scroll-behavior: smooth; }
body {
margin: 0;
min-height: 100vh;
font-family: "LatoGT", Arial, sans-serif;
color: var(--text);
background: url("../uploads/2020/11/gt_mauer_pattern_HG.jpg") center -118px / cover fixed no-repeat;
overflow: hidden;
}
img { max-width: 100%; height: auto; }
a { color: inherit; }
.site-shell { min-height: 100vh; }
.site-header {
position: fixed;
top: 16px;
left: 60px;
width: var(--left-width);
z-index: 30;
background: transparent;
border: 0;
}
.header-inner { width: 100%; display: block; }
.brand {
display: block;
width: 325px;
padding: 12px;
background: transparent;
border: none;
text-decoration: none;
transition: transform .35s var(--ease-out), filter .35s var(--ease-out);
}
.brand:hover {
transform: translateY(-2px);
filter: drop-shadow(0 4px 12px rgba(59, 46, 30, 0.25));
}
.brand img {
display: block;
width: 100%;
max-width: none;
filter: none;
}
.brand-text { display: none; }
.nav-toggle { display: none; }
.main-nav {
margin-top: 44px;
width: 100%;
}
.main-nav ul,
.sidebar-menu {
list-style: none;
margin: 0;
padding: 0;
}
.main-nav li,
.sidebar-menu li { margin: 0 0 9px; }
.main-nav a,
.sidebar-menu a {
display: grid;
grid-template-columns: 52px 1fr;
align-items: center;
min-height: 46px;
gap: 10px;
padding: 5px 14px 5px 8px;
text-decoration: none;
background: rgba(255,255,255,0.66);
border: 1px solid rgba(120,108,87,0.24);
color: #4c4338;
font-family: "CardoGT", Georgia, serif;
font-size: 2rem;
line-height: 1.1;
box-shadow: 0 8px 16px rgba(66, 54, 39, 0.05);
transition: transform .26s var(--ease-out), background-color .26s var(--ease-out), box-shadow .26s var(--ease-out), border-color .26s var(--ease-out);
}
.main-nav a::before,
.sidebar-menu a::before {
content: "";
display: block;
width: 52px;
height: 36px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
transition: transform .3s var(--ease-out), filter .3s var(--ease-out);
}
.main-nav li.is-active a,
.main-nav a:hover,
.sidebar-menu li.is-current a,
.sidebar-menu a:hover {
background: rgba(255,255,255,0.84);
transform: translateX(6px);
box-shadow: 0 12px 22px rgba(66, 54, 39, 0.09);
border-color: rgba(120,108,87,0.34);
}
.main-nav a:hover::before,
.sidebar-menu a:hover::before {
transform: scale(1.06);
filter: saturate(1.05);
}
.main-nav a[href*="burgensemble"]::before,
.sidebar-menu a[href*="burg"]::before,
.sidebar-menu a[href*="burgensemble"]::before { background-image: url("../uploads/2020/03/gt_menu_burgensemble-93x53.jpg"); }
.main-nav a[href*="museum-der-evolution"]::before,
.sidebar-menu a[href*="museum-der-evolution"]::before { background-image: url("../uploads/2021/01/LOGO_MUSEUM_DER_EVOLUTIONEUM_II-79x53.png"); }
.main-nav a[href*="landwirtschaft"]::before,
.sidebar-menu a[href*="landwirtschaft"]::before { background-image: url("../uploads/2020/03/gt_menu_landwirtschaft-93x53.jpg"); }
.main-nav a[href*="wald"]::before,
.sidebar-menu a[href*="wald"]::before { background-image: url("../uploads/2020/03/gt_menu_wald-93x53.jpg"); }
.main-nav a[href*="see"]::before,
.sidebar-menu a[href*="see"]::before { background-image: url("../uploads/2020/03/gt_menu_see-93x53.jpg"); }
.main-nav a[href*="kapelle"]::before,
.sidebar-menu a[href*="kapelle"]::before { background-image: url("../uploads/2020/03/gt_menu_kapelle-93x53.jpg"); }
.main-nav a[href*="hofladen"]::before,
.sidebar-menu a[href*="hofladen"]::before,
.sidebar-menu a[href*="oeffnungszeiten-angebote"]::before { background-image: url("../uploads/2020/08/gt_menu_hofladen-93x53.jpg"); }
.main-nav a[href*="veranstaltungen"]::before,
.sidebar-menu a[href*="veranstaltungen"]::before,
.sidebar-menu a[href*="termine-angebote"]::before { background-image: url("../uploads/2020/03/gt_menu_veranstaltungen-93x53.jpg"); }
.main-nav a[href*="foerderkreis"]::before,
.sidebar-menu a[href*="foerderkreis"]::before,
.sidebar-menu a[href*="spendenkonto"]::before { background-image: url("../uploads/2020/03/gt_menu_foerderverein-93x53.jpg"); }
.sidebar-menu a[href*="fotogalerie"]::before { background-image: url("../uploads/2026/03/buch.png"); }
.sidebar-menu a[href*="historie"]::before { background-image: url("../uploads/2020/03/gt_menu_burgensemble-36x20.jpg"); }
.sidebar-menu a[href*="angebote"]::before,
.sidebar-menu a[href*="unterkuenfte"]::before,
.sidebar-menu a[href*="bewirtschaftung"]::before,
.sidebar-menu a[href*="produkte"]::before,
.sidebar-menu a[href*="bauvorhaben"]::before,
.sidebar-menu a[href*="taetigkeiten"]::before,
.sidebar-menu a[href*="konzepte-philosophie"]::before,
.sidebar-menu a[href*="philosophie"]::before,
.sidebar-menu a[href*="aktuelles"]::before,
.sidebar-menu a[href*="archiv"]::before,
.sidebar-menu a[href*="gaestebuch"]::before,
.sidebar-menu a[href*="presse"]::before,
.sidebar-menu a[href*="projekte"]::before,
.sidebar-menu a[href*="marstall"]::before,
.sidebar-menu a[href*="kornspeicher"]::before { background-image: url("../uploads/2020/03/gt_menu_burgensemble-93x53.jpg"); }
.page-wrap {
width: min(var(--content-width), calc(100vw - (var(--left-width) + var(--left-gap) + 180px)));
position: fixed;
top: 180px;
bottom: 118px;
left: calc(60px + var(--left-width) + var(--left-gap) + var(--content-offset-x));
margin: 0;
z-index: 1;
overflow-y: auto;
overflow-x: hidden;
scrollbar-gutter: stable;
border: 1px solid rgba(124, 110, 89, 0.26);
box-shadow: 0 16px 34px rgba(55, 44, 28, 0.09);
background: rgba(255,255,255,0.10);
}
.page-wrap::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(to bottom, rgba(252,249,242,0.14), rgba(255,255,255,0.02));
border: 14px solid rgba(236, 229, 213, 0.84);
box-shadow: inset 0 0 0 1px rgba(126, 112, 92, 0.16);
pointer-events: none;
}
.page-wrap > * { position: relative; z-index: 1; }
.breadcrumb {
margin: 0 0 12px;
padding: 10px 14px;
display: inline-block;
font-size: 1.4rem;
background: rgba(255,255,255,0.6);
color: #4c4338;
}
.breadcrumb a { text-decoration: none; }
.sep { opacity: .6; }
.hero-slider,
.hero-banner {
position: relative;
overflow: hidden;
background: #efe6d0;
border: 16px solid rgba(245,239,226,0.84);
box-shadow: inset 0 0 0 1px rgba(120,108,87,0.20);
}
.hero-slider { height: 448px; }
.hero-slide {
position: absolute;
inset: 0;
opacity: 0;
transform: scale(1.035);
transition: opacity .95s var(--ease-out), transform 1.8s var(--ease-out);
}
.hero-slide.is-active {
opacity: 1;
z-index: 1;
transform: scale(1);
}
.hero-slide img,
.hero-banner img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
transition: transform .45s var(--ease-out);
}
.hero-overlay {
position: absolute;
left: 24px;
right: 24px;
bottom: 18px;
padding: 0;
background: none;
color: #fff;
text-shadow: 0 2px 8px rgba(0,0,0,.48);
transition: transform .35s var(--ease-out);
}
.hero-kicker {
margin: 0 0 4px;
font-size: 1.2rem;
letter-spacing: .3em;
text-transform: uppercase;
}
.hero-overlay h1 {
margin: 0;
font-family: "CardoGTBold", Georgia, serif;
font-size: 7.2rem;
line-height: .92;
}
.hero-overlay h1::after,
.panel h2::after,
.home-sections h2::after,
.page-content h1::after,
.page-content h2::after,
.page-content h3::after { display: none; }
.hero-prev,
.hero-next {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 44px;
height: 44px;
border: 1px solid rgba(255,255,255,0.58);
border-radius: 50%;
background: rgba(45,52,26,0.70);
color: #fff;
font-size: 3rem;
cursor: pointer;
z-index: 2;
transition: transform .26s var(--ease-out), background-color .26s var(--ease-out), box-shadow .26s var(--ease-out);
}
.hero-prev:hover,
.hero-next:hover {
transform: translateY(-50%) scale(1.06);
background: rgba(45,52,26,0.86);
box-shadow: 0 10px 20px rgba(0,0,0,.18);
}
.hero-prev { left: 12px; }
.hero-next { right: 12px; }
.home-intro,
.content-layout,
.home-sections {
background: var(--paper-strong);
border-left: 1px solid var(--paper-line);
border-right: 1px solid var(--paper-line);
}
.home-intro { display: block; margin-top: 0; }
.panel,
.notice-card,
.page-content,
.sidebar-card,
.menu-card {
border-radius: 0;
overflow: hidden;
}
.panel,
.page-content {
background: var(--paper-strong);
border: 0;
padding: 28px 34px 36px;
}
.notice-card {
margin: 0;
padding: 0 34px 32px;
background: var(--paper-strong);
color: var(--text);
border: 0;
}
.notice-card p,
.panel p,
.page-content p,
.page-content li,
.page-content dd {
font-family: "CardoGT", Georgia, serif;
font-size: 1.8rem;
line-height: 1.65;
color: #51473b;
}
.panel h2,
.home-sections h2,
.page-content h1,
.page-content h2,
.page-content h3,
.sidebar-title {
font-family: "CardoGTBold", Georgia, serif;
color: var(--text-dark);
}
.panel h2,
.home-sections h2 { margin: 0 0 18px; font-size: 3.4rem; }
.page-content h1 { font-size: 4.2rem; margin: 0 0 18px; }
.page-content h2 { font-size: 3.2rem; margin: 24px 0 14px; }
.page-content h3 { font-size: 2.5rem; margin: 22px 0 12px; }
.page-content .content-block > p:first-of-type:first-letter { float: none; font-size: inherit; color: inherit; padding: 0; }
.page-content img,
.page-content dl.wp-caption,
.gg-link { border-radius: 0; box-shadow: none; }
.home-sections {
margin-top: 0;
padding: 0 34px 34px;
border-bottom: 1px solid var(--paper-line);
}
.menu-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0,1fr));
gap: 14px;
}
.menu-card {
display: grid;
grid-template-columns: 92px 1fr;
align-items: center;
min-height: 72px;
text-decoration: none;
border: 1px solid rgba(120,108,87,0.18);
background: rgba(255,255,255,0.58);
box-shadow: 0 10px 20px rgba(66, 54, 39, 0.04);
transition: transform .28s var(--ease-out), background-color .28s var(--ease-out), box-shadow .28s var(--ease-out), border-color .28s var(--ease-out);
}
.menu-card:hover {
transform: translateY(-4px);
background: rgba(255,255,255,0.74);
box-shadow: 0 16px 28px rgba(66, 54, 39, 0.08);
border-color: rgba(120,108,87,0.28);
}
.menu-card-image {
aspect-ratio: auto;
height: 72px;
background: none;
overflow: hidden;
}
.menu-card-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .55s var(--ease-out);
}
.menu-card:hover .menu-card-image img { transform: scale(1.06); }
.menu-card-body { padding: 10px 12px; }
.menu-card h3 { margin: 0 0 4px; font-family: "CardoGTBold", Georgia, serif; font-size: 2.1rem; color: var(--text-dark); }
.menu-card p { margin: 0; font-size: 1.4rem; line-height: 1.35; color: #5a5044; }
.content-layout { display: grid; grid-template-columns: 240px minmax(0,1fr); gap: 0; border-bottom: 1px solid var(--paper-line); }
.sidebar-card {
position: static;
padding: 22px 0 22px 18px;
background: transparent;
border: 0;
border-right: 1px solid rgba(120,108,87,0.20);
}
.sidebar-card::before { display: none; }
.sidebar-eyebrow { display: none; }
.sidebar-title { margin: 0 0 12px; font-size: 2.6rem; padding: 0 18px 0 0; }
.sidebar-title a { text-decoration: none; }
.sidebar-menu { padding-right: 14px; }
.page-content { min-width: 0; }
.page-content .page-note {
background: rgba(255,255,255,0.52);
border-left: 3px solid rgba(120,108,87,0.6);
}
.grid-gallery,
.grid-gallery-photos,
.page-content p.image-cluster { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.site-footer {
position: fixed;
left: calc(60px + var(--left-width) + var(--left-gap) + var(--content-offset-x));
bottom: 18px;
width: min(var(--content-width), calc(100vw - (var(--left-width) + var(--left-gap) + 180px)));
margin: 0;
background: transparent;
border: 0;
z-index: 2;
}
.footer-inner {
width: 100%;
padding: 16px 0 28px;
text-align: center;
}
.footer-links,
.footer-inner p {
font-family: "CardoGTBold", Georgia, serif;
color: #fff;
text-shadow: 0 1px 2px rgba(0,0,0,.5);
}
.footer-links { font-size: 1.5rem; margin-bottom: 8px; }
.footer-inner p { font-size: 1.3rem; opacity: .8; }
.readme { white-space: pre-wrap; }
.reveal {
opacity: 0;
transform: translateY(22px);
transition: opacity .75s var(--ease-out), transform .75s var(--ease-out);
transition-delay: var(--reveal-delay, 0ms);
}
.reveal.is-visible {
opacity: 1;
transform: translateY(0);
}
@media (max-width: 1100px) {
:root { --left-width: 310px; --left-gap: 28px; --content-offset-x: 48px; }
.site-header { left: 24px; }
.brand { width: 280px; }
.page-wrap,
.site-footer { margin-left: calc(24px + var(--left-width) + var(--left-gap)); width: calc(100vw - (24px + var(--left-width) + var(--left-gap) + 28px)); }
.hero-slider { height: 390px; }
.hero-overlay h1 { font-size: 6rem; }
.main-nav a,
.sidebar-menu a { font-size: 1.8rem; }
}
@media (max-width: 860px) {
body { background-attachment: scroll; overflow: auto; }
.site-header {
position: relative;
top: auto;
left: auto;
width: auto;
padding: 16px 14px 0;
}
.header-inner { display: block; }
.brand { width: min(330px, 100%); margin: 0 auto; }
.brand:hover,
.main-nav a:hover,
.sidebar-menu a:hover,
.menu-card:hover,
.hero-prev:hover,
.hero-next:hover { transform: none; }
.nav-toggle {
display: block;
margin: 12px auto 0;
border: 1px solid rgba(120,108,87,0.30);
background: rgba(255,255,255,0.74);
padding: 9px 14px;
font: inherit;
}
.main-nav {
display: none;
margin: 14px auto 0;
width: min(520px, 100%);
}
.main-nav.is-open { display: block; }
.page-wrap,
.site-footer {
position: static;
left: auto;
bottom: auto;
top: auto;
width: min(96vw, 760px);
margin: 18px auto 24px;
}
.page-wrap { max-height: none; overflow: visible; }
.page-wrap::before { border-width: 10px; }
.hero-slider { height: 330px; }
.hero-overlay h1 { font-size: 5rem; }
.content-layout { grid-template-columns: 1fr; }
.sidebar-card { border-right: 0; padding: 20px 18px 0; }
.sidebar-menu { padding-right: 0; }
.menu-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
.main-nav a,
.sidebar-menu a { font-size: 1.75rem; grid-template-columns: 44px 1fr; min-height: 40px; }
.main-nav a::before,
.sidebar-menu a::before { width: 44px; height: 30px; }
.page-wrap::before { border-width: 8px; }
.hero-slider,
.hero-banner { border-width: 10px; }
.hero-slider { height: 250px; }
.hero-banner img,
.hero-slide img { height: 250px; }
.hero-overlay { left: 14px; right: 14px; bottom: 10px; }
.hero-kicker { font-size: 1rem; }
.hero-overlay h1 { font-size: 3.8rem; }
.hero-prev, .hero-next { display: none; }
.panel, .page-content, .notice-card, .home-sections { padding-left: 16px; padding-right: 16px; }
.content-layout { display: block; }
.page-content p, .panel p, .notice-card p, .page-content li, .page-content dd { font-size: 1.7rem; }
.grid-gallery,
.grid-gallery-photos,
.page-content p.image-cluster { grid-template-columns: 1fr 1fr; }
}
/* enhanced navigation, cleaner footer, hide homepage subcards */
.main-nav a::before,
.sidebar-menu a::before {
display: none;
}
.main-nav a,
.sidebar-menu a,
.nav-flyout-link,
.nav-flyout-sub-link {
grid-template-columns: 52px 1fr;
}
.nav-thumb {
width: 52px;
height: 36px;
object-fit: contain;
display: block;
flex: 0 0 auto;
}
.nav-label {
display: block;
}
.main-nav li {
position: relative;
}
.nav-flyout {
position: absolute;
top: -2px;
left: calc(100% + 12px);
width: 33rem;
padding: 1.2rem;
background: rgba(255,255,255,0.90);
border: 1px solid rgba(120,108,87,0.22);
box-shadow: 0 18px 34px rgba(55, 44, 28, 0.12);
opacity: 0;
pointer-events: none;
transform: translateY(10px);
transition: opacity .22s var(--ease-out), transform .22s var(--ease-out);
z-index: 40;
}
.main-nav li:hover > .nav-flyout,
.main-nav li:focus-within > .nav-flyout {
opacity: 1;
pointer-events: auto;
transform: translateY(0);
}
.nav-flyout-item + .nav-flyout-item {
margin-top: .9rem;
padding-top: .9rem;
border-top: 1px solid rgba(120,108,87,0.16);
}
.nav-flyout-link,
.nav-flyout-sub-link {
display: grid;
align-items: center;
gap: 1rem;
padding: .6rem .8rem;
text-decoration: none;
color: #463d33;
background: rgba(255,255,255,0.48);
border: 1px solid rgba(120,108,87,0.16);
transition: transform .22s var(--ease-out), background-color .22s var(--ease-out), border-color .22s var(--ease-out);
}
.nav-flyout-link {
font-family: "CardoGTBold", Georgia, serif;
font-size: 1.9rem;
}
.nav-flyout-sub {
margin-top: .7rem;
display: grid;
gap: .45rem;
padding-left: 1rem;
}
.nav-flyout-sub-link {
font-family: "CardoGT", Georgia, serif;
font-size: 1.65rem;
}
.nav-flyout-link:hover,
.nav-flyout-sub-link:hover {
transform: translateX(4px);
background: rgba(255,255,255,0.78);
border-color: rgba(120,108,87,0.26);
}
.home-sections {
display: none;
}
.site-footer {
bottom: 2rem;
}
.footer-inner {
padding: 0;
}
.footer-links {
display: flex;
justify-content: center;
align-items: center;
gap: 1.2rem;
flex-wrap: wrap;
margin-bottom: .8rem;
}
.footer-links a {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 16rem;
min-height: 4.8rem;
padding: .8rem 1.6rem;
background: rgba(255,255,255,0.78);
border: 1px solid rgba(120,108,87,0.28);
color: #3f362c;
text-shadow: none;
text-decoration: none;
box-shadow: 0 10px 18px rgba(55, 44, 28, 0.08);
transition: transform .22s var(--ease-out), background-color .22s var(--ease-out), box-shadow .22s var(--ease-out);
}
.footer-links a:hover {
transform: translateY(-2px);
background: rgba(255,255,255,0.92);
box-shadow: 0 14px 24px rgba(55, 44, 28, 0.12);
}
.footer-links,
.footer-inner p {
text-shadow: 0 1px 2px rgba(255,255,255,0.35);
}
.footer-inner p {
color: rgba(60,50,39,0.8);
}
@media (max-width: 860px) {
.nav-flyout {
display: none !important;
}
.nav-thumb {
width: 44px;
height: 30px;
}
.footer-links a {
min-width: 13rem;
min-height: 4.4rem;
}
}
/* compact, wider flyout menu */
.nav-flyout {
width: 41rem;
max-height: calc(100vh - 210px);
overflow-y: auto;
overflow-x: hidden;
overscroll-behavior: contain;
padding: 1rem;
}
.nav-flyout.is-two-column {
width: 52rem;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
gap: .9rem 1rem;
align-content: start;
}
.nav-flyout-item + .nav-flyout-item {
margin-top: .65rem;
padding-top: .65rem;
}
.nav-flyout.is-two-column .nav-flyout-item + .nav-flyout-item {
margin-top: 0;
padding-top: 0;
border-top: 0;
}
.nav-flyout-link,
.nav-flyout-sub-link {
grid-template-columns: 40px 1fr;
gap: .75rem;
padding: .48rem .68rem;
}
.nav-flyout .nav-thumb {
width: 40px;
height: 27px;
}
.nav-flyout-link {
font-size: 1.68rem;
}
.nav-flyout-sub {
margin-top: .42rem;
gap: .28rem;
padding-left: .6rem;
}
.nav-flyout-sub-link {
font-size: 1.38rem;
line-height: 1.12;
}
.nav-flyout::-webkit-scrollbar {
width: 8px;
}
.nav-flyout::-webkit-scrollbar-thumb {
background: rgba(120,108,87,0.45);
border-radius: 999px;
}
.nav-flyout::-webkit-scrollbar-track {
background: rgba(255,255,255,0.25);
}
@media (max-width: 1380px) {
.nav-flyout { width: 36rem; }
.nav-flyout.is-two-column {
width: 42rem;
grid-template-columns: 1fr;
}
}
/* v14 safe medieval polish */
body {
background-position: center -104px;
}
body::before,
body::after {
content: "";
position: fixed;
width: 22rem;
height: 22rem;
border-radius: 50%;
pointer-events: none;
z-index: 0;
filter: blur(24px);
opacity: 0.08;
mix-blend-mode: screen;
}
body::before {
left: 40rem;
top: 18rem;
background: radial-gradient(circle, rgba(255,208,102,0.85) 0%, rgba(255,146,40,0.30) 32%, rgba(255,96,0,0) 72%);
animation: torchFlickerLeftSoft 4.8s infinite ease-in-out;
}
body::after {
right: 16rem;
top: 22rem;
background: radial-gradient(circle, rgba(255,214,120,0.85) 0%, rgba(255,150,44,0.28) 32%, rgba(255,96,0,0) 72%);
animation: torchFlickerRightSoft 5.4s infinite ease-in-out;
}
@keyframes torchFlickerLeftSoft {
0%,100% { transform: scale(0.98) translate(0,0); opacity: 0.05; }
30% { transform: scale(1.04) translate(4px,-3px); opacity: 0.09; }
60% { transform: scale(0.97) translate(-3px,4px); opacity: 0.04; }
}
@keyframes torchFlickerRightSoft {
0%,100% { transform: scale(1) translate(0,0); opacity: 0.05; }
35% { transform: scale(1.05) translate(-4px,-2px); opacity: 0.09; }
70% { transform: scale(0.96) translate(3px,4px); opacity: 0.04; }
}
.site-footer {
bottom: 0.6rem;
}
.footer-inner {
padding: 0;
}
.footer-inner p {
display: none !important;
}
.footer-links {
display: flex;
justify-content: center;
align-items: center;
gap: 1.3rem;
flex-wrap: wrap;
margin-bottom: 0;
}
.footer-links a {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 17rem;
min-height: 5rem;
padding: 0.9rem 1.8rem;
background: linear-gradient(180deg, rgba(186,181,170,0.98) 0%, rgba(145,141,133,0.98) 48%, rgba(114,111,105,1) 100%);
color: #f5efe4;
text-shadow: 0 1px 0 rgba(50,43,36,0.48);
border: 1px solid rgba(79,71,62,0.78);
border-radius: .2rem;
text-decoration: none;
box-shadow: inset 0 1px 1px rgba(255,255,255,0.22), inset 0 -2px 4px rgba(56,49,42,0.35), 0 10px 18px rgba(47,38,26,0.16);
transition: transform .22s var(--ease-out), filter .22s var(--ease-out), box-shadow .22s var(--ease-out);
}
.footer-links a:hover {
transform: translateY(-2px);
filter: brightness(1.04);
box-shadow: inset 0 1px 1px rgba(255,255,255,0.24), inset 0 -2px 4px rgba(56,49,42,0.38), 0 14px 24px rgba(47,38,26,0.2);
}
.guestbook-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1.6rem;
margin-top: 1.2rem;
}
.guestbook-card {
display: block;
padding: 1.6rem;
text-decoration: none;
background: rgba(255,255,255,0.56);
border: 1px solid rgba(120,108,87,0.24);
box-shadow: 0 10px 18px rgba(66,54,39,0.06);
transition: transform .24s var(--ease-out), box-shadow .24s var(--ease-out), background-color .24s var(--ease-out);
}
.guestbook-card:hover {
transform: translateY(-3px);
background: rgba(255,255,255,0.76);
box-shadow: 0 14px 22px rgba(66,54,39,0.1);
}
.guestbook-card h3 {
margin: 0 0 .8rem;
font-family: "CardoGTBold", Georgia, serif;
font-size: 2.4rem;
}
.guestbook-card p {
margin: 0;
font-family: "CardoGT", Georgia, serif;
font-size: 1.7rem;
line-height: 1.5;
}
.guestbook-form {
display: grid;
gap: 1.2rem;
margin-top: 1.4rem;
}
.guestbook-form label {
display: grid;
gap: .5rem;
font-family: "CardoGTBold", Georgia, serif;
font-size: 1.8rem;
}
.guestbook-form input,
.guestbook-form textarea {
width: 100%;
padding: 1rem 1.2rem;
border: 1px solid rgba(120,108,87,0.3);
background: rgba(255,255,255,0.82);
font: 1.6rem/1.4 "LatoGT", Arial, sans-serif;
color: #463d33;
}
.guestbook-form textarea { min-height: 15rem; resize: vertical; }
.guestbook-form button {
justify-self: start;
padding: 1rem 1.6rem;
border: 1px solid rgba(73,67,61,0.72);
background: linear-gradient(180deg, rgba(148,146,142,0.95) 0%, rgba(122,120,116,0.96) 48%, rgba(92,90,87,0.98) 100%);
color: #f2ede2;
cursor: pointer;
font: 1.7rem/1.2 "CardoGTBold", Georgia, serif;
}
.guestbook-help,
.guestbook-empty,
.guestbook-status {
margin-top: 1rem;
font-family: "CardoGT", Georgia, serif;
font-size: 1.7rem;
color: #564a3c;
}
.guestbook-list {
display: grid;
gap: 1.4rem;
margin-top: 1.6rem;
}
.guestbook-entry {
padding: 1.5rem 1.6rem;
background: rgba(255,255,255,0.58);
border: 1px solid rgba(120,108,87,0.22);
box-shadow: 0 8px 16px rgba(66,54,39,0.05);
}
.guestbook-entry-head {
display: flex;
justify-content: space-between;
gap: 1rem;
align-items: baseline;
margin-bottom: .7rem;
}
.guestbook-entry-name {
font-family: "CardoGTBold", Georgia, serif;
font-size: 2.1rem;
color: #2f281f;
}
.guestbook-entry-date {
font-size: 1.4rem;
color: #776755;
}
.guestbook-entry p {
margin: 0;
font-family: "CardoGT", Georgia, serif;
font-size: 1.8rem;
line-height: 1.55;
}
@media (max-width: 980px) {
body::before,
body::after { display: none; }
}
@media (max-width: 700px) {
.guestbook-grid { grid-template-columns: 1fr; }
}
/* ============================================================
/* ============================================================
GUT TRECHOW v13 — Design-Überarbeitung
============================================================ */
/* ── Breadcrumb: jetzt im Hero, nicht mehr als grauer Balken ── */
.breadcrumb { display: none !important; } /* altes breadcrumb verstecken */
.hero-breadcrumb {
display: flex;
align-items: center;
gap: .4rem;
flex-wrap: wrap;
margin-bottom: .9rem;
font-family: "LatoGT", Arial, sans-serif;
font-size: 1.25rem;
letter-spacing: .08em;
text-transform: uppercase;
color: rgba(255,255,255,.65);
list-style: none;
}
.hero-breadcrumb a {
color: rgba(255,255,255,.65);
text-decoration: none;
transition: color .18s;
}
.hero-breadcrumb a:hover { color: rgba(255,255,255,.95); }
.hero-breadcrumb .sep {
opacity: .45;
margin: 0 .15rem;
}
.hero-breadcrumb [aria-current="page"] {
color: rgba(255,255,255,.92);
}
/* ── Hero-Banner allgemein verfeinern ── */
.hero-banner {
position: relative;
overflow: hidden;
background: #efe6d0;
border: 16px solid rgba(245,239,226,.84);
box-shadow: inset 0 0 0 1px rgba(120,108,87,.20);
}
.hero-banner img {
width: 100%;
height: 320px;
display: block;
object-fit: cover;
transition: transform .55s var(--ease-out);
}
.hero-banner:hover img { transform: scale(1.025); }
/* ── Hero-Overlay neu ── */
.hero-overlay {
position: absolute;
left: 0; right: 0; bottom: 0;
padding: 2.4rem 2.4rem 2rem;
background: linear-gradient(
to top,
rgba(20,15,8,.72) 0%,
rgba(20,15,8,.38) 55%,
transparent 100%
);
}
.hero-kicker {
margin: 0 0 .35rem;
font-family: "LatoGT", Arial, sans-serif;
font-size: 1.15rem;
letter-spacing: .22em;
text-transform: uppercase;
color: rgba(255,255,255,.68);
}
.hero-overlay h1 {
margin: 0;
font-family: "CardoGTBold", Georgia, serif;
font-size: 5.2rem;
line-height: .95;
color: #fff;
text-shadow: 0 2px 16px rgba(0,0,0,.35);
}
/* ── Hero Slider overlay gleich ── */
.hero-slider .hero-overlay {
padding: 2.4rem 2.4rem 2rem;
background: linear-gradient(to top, rgba(20,15,8,.68) 0%, rgba(20,15,8,.25) 55%, transparent 100%);
}
/* ── Verbesserte Hero-Slider-Buttons ── */
.hero-prev, .hero-next {
width: 46px; height: 46px;
border: 1.5px solid rgba(255,255,255,.45);
border-radius: 50%;
background: rgba(18,14,8,.48);
backdrop-filter: blur(8px);
color: #fff;
font-size: 2rem;
display: flex; align-items: center; justify-content: center;
cursor: pointer;
box-shadow: 0 4px 16px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.12);
transition: transform .22s var(--ease-out), background .22s, border-color .22s, box-shadow .22s;
}
.hero-prev:hover, .hero-next:hover {
background: rgba(18,14,8,.72);
border-color: rgba(255,255,255,.75);
box-shadow: 0 6px 20px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.18);
transform: translateY(-50%) scale(1.08);
}
.hero-prev { left: 14px; }
.hero-next { right: 14px; }
/* ── Schönere Buttons (global) ── */
.guestbook-form button,
.gt-btn {
display: inline-flex;
align-items: center; justify-content: center;
gap: .5rem;
padding: 1.05rem 2rem;
border: 1px solid rgba(79,71,62,.68);
border-radius: .2rem;
background: linear-gradient(180deg,
rgba(160,150,135,.97) 0%,
rgba(128,120,106,.97) 46%,
rgba(98,92,82,.99) 100%
);
color: #f5efe4;
text-shadow: 0 1px 1px rgba(30,22,14,.42);
font: 1.65rem/1.2 "CardoGTBold", Georgia, serif;
letter-spacing: .04em;
cursor: pointer;
box-shadow:
inset 0 1.5px 1px rgba(255,255,255,.20),
inset 0 -2px 5px rgba(40,34,26,.28),
0 5px 14px rgba(40,30,18,.16);
transition: transform .18s var(--ease-out), filter .18s, box-shadow .18s;
position: relative; overflow: hidden;
}
.guestbook-form button::before, .gt-btn::before {
content: "";
position: absolute; inset: 0;
background: linear-gradient(135deg, rgba(255,255,255,.12) 0%, transparent 52%);
pointer-events: none;
}
.guestbook-form button:hover, .gt-btn:hover {
transform: translateY(-2px);
filter: brightness(1.07);
box-shadow:
inset 0 1.5px 1px rgba(255,255,255,.22),
inset 0 -2px 5px rgba(40,34,26,.32),
0 9px 22px rgba(40,30,18,.22);
}
.guestbook-form button:active, .gt-btn:active {
transform: translateY(0);
filter: brightness(.96);
}
/* ── Gästebuch-Form Inputs ── */
.guestbook-form input,
.guestbook-form textarea {
transition: border-color .18s, background .18s, box-shadow .18s;
border-radius: .15rem;
}
.guestbook-form input:focus,
.guestbook-form textarea:focus {
outline: none;
border-color: rgba(120,108,87,.65);
background: rgba(255,255,255,.96);
box-shadow: 0 0 0 3px rgba(120,108,87,.12);
}
/* ── Gästebuch-Eintrag Hover ── */
.guestbook-entry {
transition: box-shadow .22s var(--ease-out), background .22s;
}
.guestbook-entry:hover {
background: rgba(255,255,255,.78);
box-shadow: 0 10px 22px rgba(66,54,39,.09);
}
/* ── Gästebuch-Karten ── */
.guestbook-card:hover {
transform: translateY(-4px);
box-shadow: 0 16px 28px rgba(66,54,39,.10);
}
/* ── Menu-Cards ── */
.menu-card {
transition: transform .28s var(--ease-out), background .28s, box-shadow .28s, border-color .28s;
}
.menu-card:hover {
transform: translateY(-5px) scale(1.008);
box-shadow: 0 18px 32px rgba(66,54,39,.10), 0 4px 8px rgba(66,54,39,.06);
}
/* ── Verbesserte Reveal-Animationen ── */
.reveal {
opacity: 0;
transform: translateY(18px);
transition: opacity .60s var(--ease-out), transform .60s var(--ease-out);
transition-delay: var(--reveal-delay, 0ms);
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }
/* ── Sidebar active link ── */
.sidebar-menu li.is-current a {
background: rgba(255,255,255,.84) !important;
transform: translateX(6px) !important;
border-color: rgba(120,108,87,.34) !important;
font-family: "CardoGTBold", Georgia, serif;
}
/* ── Footer-Links ── */
.footer-links a {
min-width: 15rem;
min-height: 4.6rem;
}
/* ── Wartungsbildschirm (overlay) ── */
.gt-maintenance-overlay {
display: none;
position: fixed; inset: 0; z-index: 9999;
background: linear-gradient(145deg, #1e1810 0%, #171209 55%, #0e0b06 100%);
color: #f2ede2;
flex-direction: column; align-items: center; justify-content: center;
text-align: center; padding: 2rem;
}
body.gt-maintenance-on .gt-maintenance-overlay { display: flex; }
body.gt-maintenance-on .site-header,
body.gt-maintenance-on .page-wrap,
body.gt-maintenance-on .site-footer { visibility: hidden; }
.gt-maintenance-overlay .maint-logo {
width: 160px; margin-bottom: 2.2rem; opacity: .85;
filter: brightness(100) saturate(0);
}
.gt-maintenance-overlay h2 {
font-family: "CardoGTBold", Georgia, serif;
font-size: clamp(2.8rem, 5vw, 4.4rem);
margin-bottom: 1rem; letter-spacing: .02em;
}
.gt-maintenance-overlay p {
font-family: "CardoGT", Georgia, serif;
font-size: 1.85rem; opacity: .72;
max-width: 460px; line-height: 1.65;
}
.gt-maintenance-overlay .maint-ornament {
font-size: 2.2rem; opacity: .28; margin: 1.8rem 0; letter-spacing: .55em;
}
/* ── Pending-Hinweis im Gästebuch ── */
.gb-pending-notice {
display: flex; align-items: center; gap: .8rem;
margin: 1.2rem 0; padding: 1rem 1.4rem;
background: rgba(255,248,220,.82);
border: 1px solid rgba(184,147,90,.4);
border-radius: .2rem;
font-family: "CardoGT", Georgia, serif; font-size: 1.6rem; color: #5a4820;
}
.gb-pending-notice::before { content: "⏳"; font-size: 1.8rem; }
/* API-Hinweis Banner */
.gt-api-notice {
display: flex; align-items: center; gap: .8rem;
margin: 0 0 1.4rem; padding: 1rem 1.4rem;
background: rgba(220,240,255,.75);
border: 1px solid rgba(80,130,200,.3);
border-radius: .2rem;
font-family: "CardoGT", Georgia, serif; font-size: 1.5rem; color: #1a3a5a;
}
.gt-api-notice::before { content: "ℹ️"; font-size: 1.7rem; }
.gt-api-notice a { color: #1a5a9a; text-decoration: underline; }
/* ── Admin-Link im Footer (unsichtbar bis Hover) ── */
.site-footer { position: relative; }
.footer-admin-link {
position: absolute; bottom: .5rem; right: 1rem;
font-size: 1.2rem; opacity: 0; color: rgba(80,70,58,.5);
text-decoration: none;
transition: opacity .18s, color .18s;
}
.footer-admin-link:hover { opacity: 1; color: rgba(80,70,58,.9); }
/* ── Breadcrumb-Responsive im Hero ── */
@media (max-width: 560px) {
.hero-breadcrumb { font-size: 1.1rem; }
.hero-overlay h1 { font-size: 3.6rem; }
.hero-overlay { padding: 1.6rem 1.4rem 1.4rem; }
}
@media (max-width: 860px) {
.hero-banner img { height: 240px; }
}
/* ============================================================
v17 final fixes – footer down, stone buttons, readable flyouts
============================================================ */
:root {
--stone-text: #2d2216;
--stone-text-soft: #433526;
--stone-line: rgba(89, 77, 61, 0.72);
--stone-shadow: rgba(54, 42, 28, 0.20);
--stone-top: rgba(237, 232, 221, 0.96);
--stone-mid: rgba(205, 197, 185, 0.98);
--stone-bottom: rgba(162, 152, 139, 0.99);
--stone-active-top: rgba(211, 202, 188, 0.98);
--stone-active-mid: rgba(181, 168, 152, 0.99);
--stone-active-bottom: rgba(143, 130, 116, 1);
}
.main-nav a,
.sidebar-menu a,
.nav-flyout-link,
.nav-flyout-sub-link,
.footer-links a,
.guestbook-card,
.guestbook-form button,
.gt-btn {
color: var(--stone-text) !important;
font-family: "CardoGTBold", Georgia, serif;
font-weight: 700;
text-shadow: 0 1px 0 rgba(255,255,255,0.42);
}
.nav-label {
min-width: 0;
display: block;
white-space: normal;
word-break: normal;
overflow-wrap: break-word;
hyphens: none;
}
.main-nav a,
.sidebar-menu a {
grid-template-columns: 56px minmax(0, 1fr);
min-height: 5.4rem;
padding: 0.75rem 1.6rem 0.75rem 1rem;
background:
linear-gradient(180deg, var(--stone-top) 0%, var(--stone-mid) 48%, var(--stone-bottom) 100%),
linear-gradient(135deg, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0) 54%);
border: 1px solid var(--stone-line);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.34),
inset 0 -2px 5px rgba(74, 61, 48, 0.28),
0 10px 18px rgba(57, 44, 29, 0.08);
}
.main-nav .nav-thumb,
.sidebar-menu .nav-thumb {
width: 48px;
height: 34px;
object-fit: cover;
border: 1px solid rgba(109, 93, 73, 0.32);
box-shadow: 0 2px 4px rgba(48, 37, 24, 0.10);
}
.main-nav li:nth-child(4n+1) > a,
.sidebar-menu li:nth-child(4n+1) > a { border-radius: 0.25rem 0.85rem 0.28rem 0.62rem; }
.main-nav li:nth-child(4n+2) > a,
.sidebar-menu li:nth-child(4n+2) > a { border-radius: 0.7rem 0.22rem 0.72rem 0.18rem; }
.main-nav li:nth-child(4n+3) > a,
.sidebar-menu li:nth-child(4n+3) > a { border-radius: 0.45rem 0.32rem 0.92rem 0.24rem; }
.main-nav li:nth-child(4n+4) > a,
.sidebar-menu li:nth-child(4n+4) > a { border-radius: 0.22rem 0.62rem 0.22rem 0.92rem; }
.main-nav a:hover,
.sidebar-menu a:hover,
.main-nav li.is-active > a,
.sidebar-menu li.is-current > a,
.main-nav a:active,
.sidebar-menu a:active {
background:
linear-gradient(180deg, var(--stone-active-top) 0%, var(--stone-active-mid) 50%, var(--stone-active-bottom) 100%),
linear-gradient(135deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0) 58%) !important;
color: #23180f !important;
border-color: rgba(82, 69, 53, 0.88) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.24),
inset 0 -2px 6px rgba(55, 43, 30, 0.34),
0 14px 24px rgba(57, 44, 29, 0.13) !important;
}
.main-nav a:hover .nav-label,
.sidebar-menu a:hover .nav-label,
.main-nav li.is-active > a .nav-label,
.sidebar-menu li.is-current > a .nav-label {
color: #23180f;
}
.nav-flyout,
.nav-flyout.is-two-column {
display: block !important;
width: 52rem;
max-width: calc(100vw - 2rem);
min-width: 0;
padding: 1.1rem;
max-height: calc(100vh - 18rem);
left: calc(100% + 1.4rem);
background: rgba(247, 243, 235, 0.96);
border: 1px solid rgba(108, 93, 72, 0.34);
box-shadow: 0 20px 38px rgba(55, 44, 28, 0.16);
}
.nav-flyout-item + .nav-flyout-item {
margin-top: 1rem;
padding-top: 1rem;
border-top: 1px solid rgba(120,108,87,0.18);
}
.nav-flyout-link,
.nav-flyout-sub-link {
width: 100%;
grid-template-columns: 46px minmax(0, 1fr);
align-items: center;
gap: 0.95rem;
padding: 0.7rem 0.9rem;
border: 1px solid rgba(112, 98, 78, 0.22);
background:
linear-gradient(180deg, rgba(244,240,232,0.96) 0%, rgba(228,221,210,0.96) 100%),
linear-gradient(135deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0) 56%);
box-shadow: inset 0 1px 0 rgba(255,255,255,0.28);
}
.nav-flyout-link {
min-height: 4.9rem;
font-size: 2rem;
}
.nav-flyout-sub {
margin-top: 0.65rem;
display: grid;
gap: 0.48rem;
padding-left: 1.2rem;
}
.nav-flyout-sub-link {
min-height: 4.6rem;
font-size: 1.82rem;
line-height: 1.2;
}
.nav-flyout .nav-thumb {
width: 44px;
height: 31px;
object-fit: cover;
border: 1px solid rgba(109, 93, 73, 0.24);
}
.nav-flyout-link:hover,
.nav-flyout-sub-link:hover,
.nav-flyout-link:active,
.nav-flyout-sub-link:active {
transform: translateX(4px);
background:
linear-gradient(180deg, rgba(230,224,213,0.98) 0%, rgba(201,191,178,0.98) 100%),
linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0) 58%);
border-color: rgba(91, 77, 60, 0.54);
}
.site-footer {
position: fixed !important;
left: calc(60px + var(--left-width) + var(--left-gap) + var(--content-offset-x)) !important;
width: min(var(--content-width), calc(100vw - (var(--left-width) + var(--left-gap) + 180px))) !important;
bottom: 1.2rem !important;
top: auto !important;
right: auto !important;
z-index: 36;
pointer-events: none;
}
.footer-inner,
.footer-links,
.footer-links a,
.footer-admin-link { pointer-events: auto; }
.footer-inner {
padding: 0.8rem 0 0.2rem;
}
.footer-links {
display: flex;
justify-content: center;
align-items: center;
gap: 1.45rem;
margin: 0;
}
.footer-links a {
min-width: 17rem;
min-height: 5.2rem;
padding: 1rem 1.8rem;
background:
linear-gradient(180deg, rgba(234,229,219,0.98) 0%, rgba(198,188,175,0.99) 52%, rgba(155,143,128,1) 100%),
linear-gradient(135deg, rgba(255,255,255,0.24) 0%, rgba(255,255,255,0) 56%);
border: 1px solid rgba(84, 71, 55, 0.82);
color: #22170f !important;
text-shadow: 0 1px 0 rgba(255,255,255,0.45);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.34),
inset 0 -2px 4px rgba(58, 46, 32, 0.30),
0 12px 22px rgba(48, 38, 26, 0.14);
text-decoration: none;
}
.footer-links a:nth-child(1) { border-radius: 0.24rem 0.95rem 0.34rem 0.52rem; }
.footer-links a:nth-child(2) { border-radius: 0.74rem 0.24rem 0.78rem 0.20rem; }
.footer-links a:nth-child(3) { border-radius: 0.34rem 0.52rem 0.24rem 0.98rem; }
.footer-links a:hover,
.footer-links a:active {
transform: translateY(-2px);
background:
linear-gradient(180deg, rgba(220,213,201,0.99) 0%, rgba(188,176,160,1) 52%, rgba(145,132,117,1) 100%),
linear-gradient(135deg, rgba(255,255,255,0.16) 0%, rgba(255,255,255,0) 56%);
border-color: rgba(71, 59, 44, 0.92);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.24),
inset 0 -2px 4px rgba(58, 46, 32, 0.36),
0 16px 28px rgba(48, 38, 26, 0.18);
}
.footer-admin-link {
position: absolute;
right: 0.35rem;
bottom: 0.7rem;
}
@media (max-width: 1500px) {
.nav-flyout,
.nav-flyout.is-two-column {
width: 48rem;
}
}
@media (max-width: 1100px) {
.site-footer {
left: calc(24px + var(--left-width) + var(--left-gap)) !important;
width: calc(100vw - (24px + var(--left-width) + var(--left-gap) + 28px)) !important;
}
}
@media (max-width: 860px) {
.site-footer {
position: static !important;
left: auto !important;
width: min(96vw, 760px) !important;
margin: 0 auto 2.2rem !important;
pointer-events: auto;
}
.footer-links {
gap: 1rem;
}
.footer-links a {
min-width: 13.5rem;
min-height: 4.8rem;
}
.nav-flyout,
.nav-flyout.is-two-column { display: none !important; }
}
/* ============================================================
/* ============================================================
/* ============================================================
v19 — Granit-Steinbuttons · Flyout-Fix · Fackeln
============================================================ */
/* ── 1. GRANIT-STEIN: Nav-Buttons (Burgensemble, Wald usw.) ── */
/* Überschreibt den alten weißen Glaslook komplett */
.main-nav a,
.sidebar-menu a {
/* Granit-Optik: hell-grau mit leicht warmen Tönen */
background:
linear-gradient(160deg,
rgba(210,205,196,0.97) 0%,
rgba(188,182,170,0.97) 38%,
rgba(168,162,150,0.98) 70%,
rgba(148,142,132,0.99) 100%);
border: 1px solid rgba(110,104,90,0.55);
border-bottom: 1px solid rgba(90,84,72,0.65);
/* organisch unregelmäßige Ecken wie ein Stein */
border-radius: 3px 8px 5px 10px / 7px 3px 9px 4px;
box-shadow:
/* Highlight oben-links */
inset 0 2px 3px rgba(255,252,242,0.55),
inset 2px 0 3px rgba(255,250,238,0.28),
/* Dunkel unten */
inset 0 -3px 5px rgba(60,50,30,0.22),
/* Sockel-Schatten: der "Stein liegt auf etwas" */
0 4px 0 rgba(80,68,46,0.45),
0 6px 14px rgba(30,22,8,0.20);
color: #2e2618;
text-shadow: 0 1px 0 rgba(255,248,220,0.55);
font-family: "CardoGT", Georgia, serif;
font-size: 2rem;
line-height: 1.25;
/* Größe & Layout */
display: grid;
grid-template-columns: 52px 1fr;
align-items: center;
min-height: 52px;
height: auto !important;
gap: 10px;
padding: 8px 14px 8px 8px;
text-decoration: none;
white-space: normal;
overflow: visible;
position: relative;
transition:
transform .22s var(--ease-out),
filter .22s var(--ease-out),
box-shadow .22s var(--ease-out);
}
/* Granit-Körnung per Pseudo-Overlay */
.main-nav a::after,
.sidebar-menu a::after {
content: "";
position: absolute;
inset: 0;
border-radius: inherit;
/* feines Rauschen simuliert Granit-Textur */
background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='80' height='80' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");
background-size: 80px 80px;
pointer-events: none;
opacity: 0.7;
}
.main-nav a:hover,
.sidebar-menu a:hover {
transform: translateX(5px);
filter: brightness(1.06);
box-shadow:
inset 0 2px 3px rgba(255,252,242,0.60),
inset 2px 0 3px rgba(255,250,238,0.30),
inset 0 -3px 5px rgba(60,50,30,0.22),
0 5px 0 rgba(80,68,46,0.42),
0 8px 18px rgba(30,22,8,0.25);
}
.main-nav a:active,
.sidebar-menu a:active {
transform: translateX(2px) translateY(2px);
box-shadow:
inset 0 3px 5px rgba(60,50,30,0.28),
0 2px 0 rgba(80,68,46,0.45),
0 3px 8px rgba(30,22,8,0.18);
}
/* Aktiver / current Link: etwas dunkler / gedrückt */
.main-nav li.is-active a,
.sidebar-menu li.is-current a {
background:
linear-gradient(160deg,
rgba(188,182,170,0.98) 0%,
rgba(165,158,146,0.98) 45%,
rgba(142,136,124,0.99) 100%);
transform: translateX(6px) !important;
box-shadow:
inset 0 3px 6px rgba(50,40,20,0.28),
0 2px 0 rgba(80,68,46,0.42),
0 3px 10px rgba(30,22,8,0.18);
font-family: "CardoGTBold", Georgia, serif;
}
/* Nav-Label Text (umbrechen, kein Überlappen) */
.nav-label {
white-space: normal;
word-break: normal;
overflow-wrap: break-word;
line-height: 1.25;
display: block;
min-width: 0;
}
.nav-thumb { flex-shrink: 0; align-self: center; }
.main-nav li { margin: 0 0 8px; }
/* ── 2. FLYOUT-MENÜ: kein Überlagern, scrollbar ── */
.main-nav li { position: relative; }
.nav-flyout {
position: fixed !important; /* fixed statt absolute → kein overflow-clip */
left: 390px !important; /* rechts neben der Nav-Spalte */
top: auto;
width: 38rem;
max-height: min(72vh, 520px);
overflow-y: auto;
overflow-x: hidden;
overscroll-behavior: contain;
padding: 1rem;
background: rgba(242,238,228,0.97);
border: 1px solid rgba(130,116,84,0.40);
box-shadow:
0 20px 40px rgba(40,28,10,0.22),
inset 0 1px 0 rgba(255,250,230,0.60);
opacity: 0;
pointer-events: none;
transform: translateX(-8px);
transition: opacity .20s var(--ease-out), transform .20s var(--ease-out);
z-index: 200;
border-radius: 2px 8px 6px 4px / 6px 2px 8px 4px;
}
.nav-flyout::-webkit-scrollbar { width: 6px; }
.nav-flyout::-webkit-scrollbar-thumb { background: rgba(130,116,84,0.38); border-radius: 3px; }
.nav-flyout::-webkit-scrollbar-track { background: rgba(230,224,208,0.50); }
.main-nav li:hover > .nav-flyout,
.main-nav li:focus-within > .nav-flyout {
opacity: 1;
pointer-events: auto;
transform: translateX(0);
}
/* Position des Flyouts zur hovered Li berechnen via JS */
/* Fallback: immer auf Höhe der gesamten Nav beginnen */
/* Flyout-Einträge als Stein-Kacheln */
.nav-flyout-item { margin-bottom: .55rem; }
.nav-flyout-item + .nav-flyout-item {
padding-top: 0;
border-top: none;
margin-top: 0;
}
.nav-flyout-link {
display: grid;
grid-template-columns: 40px 1fr;
align-items: center;
gap: .75rem;
padding: .55rem .75rem;
text-decoration: none;
color: #2e2618;
font-family: "CardoGTBold", Georgia, serif;
font-size: 1.75rem;
line-height: 1.2;
white-space: normal;
word-break: normal;
background: linear-gradient(155deg,
rgba(205,200,188,0.96) 0%,
rgba(182,176,163,0.97) 50%,
rgba(160,154,142,0.98) 100%);
border: 1px solid rgba(120,108,80,0.42);
border-radius: 2px 7px 4px 9px / 6px 2px 8px 3px;
box-shadow:
inset 0 1.5px 2px rgba(255,250,230,0.50),
inset 0 -2px 4px rgba(55,44,20,0.18),
0 3px 0 rgba(80,68,40,0.35),
0 4px 10px rgba(25,18,6,0.14);
transition: transform .18s, filter .18s;
text-shadow: 0 1px 0 rgba(255,248,210,0.45);
}
.nav-flyout-link:hover {
transform: translateX(4px);
filter: brightness(1.07);
}
.nav-flyout-sub {
margin-top: .4rem;
display: grid;
gap: .32rem;
padding-left: .7rem;
}
.nav-flyout-sub-link {
display: grid;
grid-template-columns: 1fr;
align-items: center;
padding: .42rem .75rem;
text-decoration: none;
color: #3a3020;
font-family: "CardoGT", Georgia, serif;
font-size: 1.5rem;
line-height: 1.2;
white-space: normal;
word-break: normal;
background: linear-gradient(155deg,
rgba(220,215,204,0.90) 0%,
rgba(198,192,180,0.92) 100%);
border: 1px solid rgba(120,108,80,0.30);
border-radius: 2px 5px 3px 7px / 4px 2px 6px 2px;
box-shadow:
inset 0 1px 1.5px rgba(255,250,230,0.42),
inset 0 -2px 3px rgba(55,44,20,0.14),
0 2px 0 rgba(80,68,40,0.28),
0 3px 7px rgba(25,18,6,0.10);
transition: transform .16s, filter .16s;
text-shadow: 0 1px 0 rgba(255,248,210,0.40);
}
.nav-flyout-sub-link:hover {
transform: translateX(3px);
filter: brightness(1.07);
}
/* Zwei-Spalten-Flyout */
.nav-flyout.is-two-column {
display: grid;
grid-template-columns: 1fr 1fr;
gap: .55rem .8rem;
align-content: start;
width: 52rem;
}
.nav-flyout.is-two-column .nav-flyout-item { margin-bottom: 0; }
@media(max-width:1380px){
.nav-flyout { width: 34rem; }
.nav-flyout.is-two-column { width: 42rem; grid-template-columns: 1fr; }
}
@media(max-width:860px){
.nav-flyout { display: none !important; }
}
/* ── 3. FOOTER-BUTTONS: gleicher Granit-Look ── */
.footer-links {
display: flex;
justify-content: center;
align-items: stretch;
gap: 0;
flex-wrap: nowrap;
margin: 0;
background: rgba(18,13,7,0.92);
backdrop-filter: blur(12px);
border-top: 1px solid rgba(150,132,88,0.28);
}
.footer-links a {
flex: 1;
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 4.8rem;
padding: 1rem 1.2rem;
font-family: "CardoGT", Georgia, serif;
font-size: 1.48rem;
text-decoration: none;
text-align: center;
color: #2a2010;
text-shadow: 0 1px 0 rgba(255,248,210,0.50);
background: linear-gradient(172deg,
rgba(205,198,182,0.98) 0%,
rgba(182,174,158,0.98) 46%,
rgba(155,148,134,0.99) 100%);
border: 1px solid rgba(110,98,68,0.52);
border-right: 1px solid rgba(100,90,60,0.32);
border-radius: 0;
box-shadow:
inset 0 2px 2px rgba(255,250,225,0.48),
inset 0 -3px 4px rgba(60,48,18,0.22),
0 4px 0 rgba(85,70,35,0.42),
0 -1px 0 rgba(160,144,96,0.25);
transition: transform .18s, filter .18s;
position: relative; overflow: hidden;
}
.footer-links a::after {
content: "";
position: absolute; inset: 0;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='80' height='80' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
background-size: 80px 80px;
pointer-events: none;
}
.footer-links a:last-child { border-right: 1px solid rgba(110,98,68,0.52); }
.footer-links a:hover { filter: brightness(1.09); transform: translateY(-1px); }
.footer-links a:active { transform: translateY(1px); }
/* ── 4. GÄSTEBUCH-BUTTON: Granit ── */
.guestbook-form button {
padding: 1.1rem 2.4rem;
font-family: "CardoGTBold", Georgia, serif;
font-size: 1.7rem;
letter-spacing: .04em;
cursor: pointer;
color: #2a2010;
text-shadow: 0 1px 0 rgba(255,248,210,0.55);
background: linear-gradient(165deg,
rgba(215,208,192,0.98) 0%,
rgba(190,183,167,0.98) 46%,
rgba(162,155,140,0.99) 100%);
border: 1px solid rgba(115,103,72,0.55);
border-radius: 4px 12px 6px 14px / 10px 4px 14px 6px;
box-shadow:
inset 0 2px 3px rgba(255,250,228,0.52),
inset 2px 0 3px rgba(255,248,218,0.24),
inset 0 -3px 5px rgba(60,48,20,0.24),
0 5px 0 rgba(82,68,36,0.45),
0 7px 18px rgba(28,18,4,0.20);
position: relative; overflow: hidden;
transition: transform .18s, filter .18s, box-shadow .18s;
}
.guestbook-form button::after {
content: "";
position: absolute; inset: 0;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='80' height='80' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E");
background-size: 80px 80px;
pointer-events: none;
}
.guestbook-form button:hover { transform: translateY(-2px); filter: brightness(1.07); }
.guestbook-form button:active {
transform: translateY(2px);
box-shadow: inset 0 3px 5px rgba(60,48,20,0.30), 0 2px 0 rgba(82,68,36,0.45), 0 3px 8px rgba(28,18,4,0.18);
}
/* ── 5. FACKELN ── */
body::before {
content: ""; position: fixed; pointer-events: none; z-index: 0;
width: 320px; height: 420px; left: 18px; top: 40px;
background: radial-gradient(ellipse at 50% 78%,
rgba(255,155,35,.18) 0%, rgba(255,85,8,.07) 42%, transparent 72%);
animation: flkA 3.7s ease-in-out infinite;
filter: blur(24px); border-radius: 50%; mix-blend-mode: screen;
}
body::after {
content: ""; position: fixed; pointer-events: none; z-index: 0;
width: 270px; height: 350px; left: 30px; top: 15px;
background: radial-gradient(ellipse at 50% 82%,
rgba(255,195,60,.12) 0%, rgba(255,105,18,.05) 44%, transparent 70%);
animation: flkB 5.1s ease-in-out infinite;
filter: blur(18px); border-radius: 50%; mix-blend-mode: screen;
}
@keyframes flkA {
0%,100%{opacity:.60;transform:scale(1) translate(0,0)}
22%{opacity:1;transform:scale(1.08) translate(6px,-9px)}
55%{opacity:.40;transform:scale(.92) translate(-4px,7px)}
78%{opacity:.85;transform:scale(1.04) translate(3px,-4px)}
}
@keyframes flkB {
0%,100%{opacity:.45;transform:scale(1) translate(0,0)}
32%{opacity:.78;transform:scale(1.10) translate(-6px,-11px)}
66%{opacity:.30;transform:scale(.90) translate(5px,8px)}
}
@media(max-width:860px){body::before,body::after{display:none}}
/* ── 6. Layout-Fixes ── */
.content-layout.no-sidebar,
.content-layout:not(.has-sidebar) { grid-template-columns: 1fr; }
.events-calendar { margin-top: 1.6rem; }
.event-card {
display: grid; grid-template-columns: 80px 1fr;
margin-bottom: 1.2rem; overflow: hidden;
border: 1px solid rgba(120,108,87,.22);
background: rgba(255,255,255,.60);
box-shadow: 0 6px 16px rgba(66,54,39,.06);
transition: transform .24s, box-shadow .24s;
border-radius: 3px 8px 5px 10px / 6px 2px 8px 4px;
}
.event-card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(66,54,39,.10); }
.event-date-block {
display: flex; flex-direction: column; align-items: center; justify-content: center;
background: linear-gradient(180deg, rgba(88,76,54,.92) 0%, rgba(60,50,34,.96) 100%);
color: #f0e6cc; padding: .8rem .4rem; text-align: center;
border-right: 1px solid rgba(120,108,87,.22);
}
.event-day { font-family: "CardoGTBold",serif; font-size: 3rem; line-height: 1; }
.event-month { font-family: "LatoGT",sans-serif; font-size: 1.2rem; text-transform: uppercase; letter-spacing: .1em; opacity: .8; margin-top: .2rem; }
.event-year { font-family: "LatoGT",sans-serif; font-size: 1.1rem; opacity: .55; }
.event-body { padding: 1.2rem 1.4rem; }
.event-title { font-family: "CardoGTBold",serif; font-size: 2rem; color: var(--text-dark); margin: 0 0 .4rem; }
.event-meta { font-size: 1.35rem; color: #6a5c48; font-family: "LatoGT",sans-serif; margin-bottom: .5rem; }
.event-desc { font-family: "CardoGT",serif; font-size: 1.6rem; line-height: 1.55; color: #51473b; }
.events-empty { font-family: "CardoGT",serif; font-size: 1.7rem; color: #7a6a55; padding: 1.5rem 0; opacity: .7; }
.site-footer { position: relative; }
.footer-admin-link {
position: absolute; right: .6rem; top: 50%; transform: translateY(-50%);
font-size: 1.2rem; opacity: 0; color: rgba(80,70,50,.5);
text-decoration: none; transition: opacity .18s;
}
.site-footer:hover .footer-admin-link { opacity: 1; }
@media(max-width:860px){
.site-footer{position:static;width:min(96vw,760px);margin:0 auto 8px;}
.footer-links{flex-wrap:wrap;}
.footer-links a{flex:1 1 auto;min-width:12rem;}
}
/* ── Footer hinter Content (nicht überlappend) ── */
.site-footer {
z-index: 0 !important;
pointer-events: auto;
}
.footer-links a {
pointer-events: auto;
}