@font-face {
font-family: 'Nunito';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('nunito-v32-latin-regular.woff2') format('woff2'); 
}
html, body {
overflow-x: hidden;
}
body {
background: linear-gradient(
to right,
#000000 calc(50% - 600px),
#fffdd0 calc(50% - 600px),
#fffdd0 calc(50% + 600px),
#000000 calc(50% + 600px)
);
font-family: 'Nunito', sans-serif;
font-size: 1.3em;
margin: 0;
padding: 0;
box-sizing: border-box;
}

h1 {
background: radial-gradient(circle at top left, red 0%, red 20%, yellow 60%);
text-align: center;
display: flex;
justify-content: center;
align-items: center;
width: 100vw;
height: 100vh;
margin: 0;
font-size: 10vw;
white-space: normal;
flex-direction: column;
}
span.subtext {
font-size: 0.5em; 
display: block;
}
p, ul, ol, h2, h3, h4, details, footer, figure, table {
max-width: 1000px;
width: 100%; 
margin-left: auto;
margin-right: auto;
padding-left: 5vw; 
padding-right: 5vw;
box-sizing: border-box;
}
ul {
padding-left: 8vw;
}
a {
text-decoration: none;
color: #cc0000;
font-size: 1.2em;
}
a.quelle {
font-size: 1em;
}
a:hover {
font-weight: bold;
}
img {
border: solid;
max-width: 100%;
height: auto;
display: block;
}
hr {
border: none;
border-top: 2vh solid #000000; 
margin: 0 0;
}
summary {
padding-top: 0.5em;
cursor: pointer;
color: #cc0000;
font-size: 1.2em;
}
summary:hover {
font-weight:bold;
}
img.intext {
border: none;
height: 1em;
width: auto;
vertical-align: middle;
}
.back {
border: none;
height: 3em;
width: auto;
display: block;
margin-left: auto;
margin-right: 0;
}
figcaption, cite {
font-size: 0.8em;
font-style: normal;
}
.center {
text-align: center;
width 100vw;
font-size: 0.8em;
}
.center1 {
text-align: center;
width 100vw;
}
sup {
font-size: 0.6em;
}
p.zitat {
padding-left: 8vw;
font-style: italic
}
p.lorberzitat {
padding-left: 8vw;
font-weight: bold;
font-style: italic
}
p.right {
text-align: right;	
}
.footnote-ref {
position: relative;
display: inline-block;
text-decoration: none;
}
.footnote-ref::after {
content: "";
position: absolute;
top: -40px;
bottom: -40px;
left: -20px;
right: -20px;
z-index: 1; 
}
p.next {
background: white;
text-align: center;
border: 4px solid black;
padding-top: 40px;
padding-bottom: 40px;
margin-top: 50px;
margin-bottom: 50px;
}
table {
 border-collapse: collapse;
}
th {
font-weight: bold;
border: 3px solid;
border-bottom: 6px solid black;
border-top: 6px solid black;
}
td {
font-size: 1rem;
border: 3px solid;
min-width: 5vw;
}
.jj {
background: white;
}
.ddt {
background: #eeddb0;
}
.gej_red {
background: #ee9999;
}
blockquote {
margin: 0;
padding: 0;
}
/* Seitengalerie */
div.seitengalerie {
margin: 0 auto;
background: #900000;
padding-top: 10px;
padding-left: 10px;
max-width: 1100px;
}
a.seitengalerie {
    display: inline-block; /* Links nebeneinander */
    margin: 0px;           /* Abstand zwischen Bildern */
	border: 0px;
}

img.seitengalerie {
    display: block;        /* Bild füllt den Link */
    height: auto;
	border: 0px;
}



/* Mondbild

        /* --- RADIKALER CSS ISOLATIONS-BLOCK --- */

        /* Das feste Sichtfenster (Zwingt alle globalen DIV-Regeln in die Knie) */
        div.pano-isolated-window {
            all: unset !important;
            box-sizing: border-box !important;
            display: block !important;
            width: 400px !important;
            height: 390px !important;
            position: relative !important;
            overflow: hidden !important;
            border: 3px solid #333 !important;
            background-color: #000 !important;
            margin: 20px auto !important;
            padding: 0 !important;
            float: none !important;
            clear: both !important;
            box-shadow: 0 4px 10px rgba(0,0,0,0.15) !important;
        }

        /* Das Bild im Hintergrund (Hebt jede Verzerrung und max-width: 100% hart auf) */
        img.pano-isolated-image {
            all: unset !important;
            box-sizing: border-box !important;
            display: block !important;
            position: absolute !important;
            top: 0px !important;
            left: 0px !important;
            
            /* Erzwingt exakt die native Pixelgröße des Panoramas */
            width: 3840px !important;
            min-width: 3840px !important;
            max-width: 3840px !important;
            height: 390px !important;
            min-height: 390px !important;
            max-height: 390px !important;
            
            /* Verhindert jegliche Skalierungsmethoden des Browsers */
            transform: none !important;
            object-fit: none !important;
            
            /* Schiebt das Bild flüssig hin und her */
            transition: left 0.3s ease-out !important;
        }

        /* Button-Container (Verhindert, dass Flexboxen oder Floats das Layout zerstören) */
        div.pano-isolated-controls {
            all: unset !important;
            box-sizing: border-box !important;
            display: block !important;
            width: 400px !important;
            margin: 15px auto !important;
            text-align: center !important;
            padding: 0 !important;
            float: none !important;
            clear: both !important;
        }

        /* Die SVG-Buttons (Löscht absolut alle vorkonfigurierten Button-Styles) */
        button.pano-isolated-btn {
            all: unset !important; /* Vernichtet Rahmen, Backgrounds, Paddings, Hover deines CSS */
            box-sizing: border-box !important;
            display: inline-block !important;
            width: 55px !important;
            height: 55px !important;
            margin: 0 15px !important;
            padding: 0 !important;
            cursor: pointer !important;
            vertical-align: middle !important;
            transition: opacity 0.2s !important;
        }

        button.pano-isolated-btn:hover {
            opacity: 0.8 !important;
            background: none !important;
        }

        /* Deaktivierter Zustand */
        button.pano-isolated-btn:disabled {
            opacity: 0.25 !important;
            cursor: not-allowed !important;
        }

        /* Schützt das SVG vor fremden CSS-Einflüssen */
        button.pano-isolated-btn svg {
            all: unset !important;
            display: block !important;
            width: 55px !important;
            height: 55px !important;
            margin: 0 !important;
            padding: 0 !important;
            pointer-events: none !important; /* Klicks gehen direkt an den Button */
        }