/*style.css*/
/*
Theme Name: tpl_schwangau
Theme URI: http://localhost/wordpress/
Description: Template ...
Author: Markus Martini
Author http://localhost/wordpress/
*/
body {
    color: #333; 
    background: yellow;
    margin: 0;
    padding: 0;
    height: 100vh;
    background-color: black; /* Fallback-Farbe */
    overflow: auto; /* Damit der Vordergrund scrollen kann */
    font-family: 'Arial', sans-serif, verdana;  /* Schriftart */
    font-size: 16px;                   /* Grundschriftgröße */
    line-height: 1.6;                  /* Zeilenabstand */
}



#wrapper    {width: 890px; margin: auto; text-align: left; background: #fff; border: 0px solid #008000; /*#ccc*/
            
}
#header        {height: 160px; padding: 20px; border-bottom: 0px solid yellow; /*#ccc*/}
#main       {width: 850px; padding: 20px; float: left; border: 0px solid #008000; }
#sidebar    {width: 270px; padding: 10px; padding-top: 200px; float: left;  border: 0px solid red;}
#footer        {clear: both; height: 100px; padding: 20px; border: 0px solid #008000; }



.top_platzhalter {
    width: 100%;
    height: 50px;
    border: 0px solid #333; /* Schwarzer Rand */
    /*background-color: #ffffff;*/ /* Hellgrauer Hintergrund – optional */
}

#menubox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    /*background-color: #fff;*/ /* oder transparent, je nach Design */
    z-index: 1000; /* hoch genug, damit es über dem Inhalt liegt */
    box-shadow: 0 2px 5px rgba(0,0,0,0.2); /* optional: leichter Schatten für mehr Tiefe */
  }

#div_menu {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 10px; /* Abstand zwischen den Buttons */
    justify-content: center;
  }
  
  #div_menu li {
    background-color: #e6f2ff; /* sanftes Hellblau */
    border-radius: 15px;
    transition: background-color 0.3s ease;
  }
  
  #div_menu li a {
    display: block;
    padding: 12px 20px;
    text-decoration: none;
    color: #000;
    font-weight: bold;
  }
  
  #div_menu li:hover {
    background-color: #3579df; /* dunkleres Blau bei Hover */
  }
  
  #div_menu li a:hover {
    color: #fff; /* Weiß beim Hover */
  }

  #div_menu li a {
    color: #000; /* Standard-Schriftfarbe */
    transition: color 0.3s ease;
  }


  #div_menu li.highlighted {
    background-color: #b4e6b2; /* zartes Grün */
    font-weight: bold;
    border-radius: 15px;
    color: #ffffff;
  }

  #div_menu li.highlighted:hover {
    background-color: #457245; /* z. B. etwas dunkleres Grün beim Hover */
    color: #ffffff;               /* Optional: bleibt gut lesbar */
    cursor: pointer;           /* Zeigt an, dass es klickbar ist */
  }

  #div_menu li.highlighted a:hover {
    color: #fff; /* Weiß beim Hover */
  }

  #div_menu li.highlighted a {
    color: #000; /* Standard-Schriftfarbe */
    transition: color 0.3s ease;
  }








/*Menü*/
.tpl-schwangau-navigation {
    list-style: none;
    display: flex;
    gap: 20px;
}
.tpl-schwangau-navigation li {
    display: inline-block;
}
.tpl-schwangau-navigation a {
    text-decoration: none;
    color: #333;
    font-weight: bold;
}

nav ul {
    border: 0px solid #333; /* 2 Pixel dicke, schwarze Umrandung */
    padding: 0px; /* Abstand innerhalb des Rahmens */
    list-style: none; /* Entfernt die Standard-Punkte */
}
nav ul li {
    /*background-color: gray;  Standard-Grau */
    border: 0px solid yellow; /* Gelbe Umrandung */
    padding: 1px; /* Abstand innerhalb des Rahmens */
    list-style: none; /* Entfernt die Standard-Punkte */
}

.menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #333;
    color: white;
    padding: 10px;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.menu a {
    text-decoration: none;
    color: white;
    font-weight: bold;
    padding: 10px;
    background: #555;
}

.menu a:hover {
    background: #b35f00;
}




  #menu-menue-tpl_schwangau.tpl-schwangau-navigation li a {
    display: inline-block;
    padding: 10px 10px;
    border-radius: 20px;                  /* Runde Ecken */
    background-color: rgb(129, 179, 255);            /* Hintergrundfarbe */
    color: #000000;
    text-decoration: none;
    transition: all 0.3s ease;
  }
  
  #menu-menue-tpl_schwangau.tpl-schwangau-navigation li a:hover {
    background-color: rgb(0, 0, 255);               /* Hover-Farbe */
    color: rgb(255, 255, 255);
  }
  
  #menu-menue-tpl_schwangau.tpl-schwangau-navigation li.current-menu-item a,
  #menu-menue-tpl_schwangau.tpl-schwangau-navigation li.current_page_item a {
    background-color: hsl(128, 100%, 33%);            /* Aktive Seite */
    color: rgb(0, 0, 0);
  }

  #menu-menue-tpl_schwangau.tpl-schwangau-navigation li.current-menu-item a:hover,
  #menu-menue-tpl_schwangau.tpl-schwangau-navigation li.current_page_item a:hover {
    background-color: rgb(0, 0, 255);               /* Hover-Farbe */
    color: rgb(255, 255, 255);
  }

  



        /* Hintergrund-Bildcontainer */
        #background-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            z-index: -1; /* Hintergrund bleibt hinter anderen Elementen */
            display: flex;
            justify-content: center;
            align-items: center;
            overflow: hidden;
        }

        #background-image {
            position: absolute;
z-index: 1;
            object-fit: cover;
        }

        /* Vordergrund mit scrollbarem Inhalt */
        #foreground-container {
            position: relative;
z-index: 2;
            width: 80%;
            margin: auto;
            padding: 20px;
            background-color: rgba(255, 255, 255, 0.8); /* Leicht transparente Hintergrundfarbe */
            border-radius: 10px;


            content: "";
            display: block;
            clear: both;
        }

        .scroll-content {
            padding: 20px;
            font-size: 18px;
height: auto;
/*height: 150vh; --- Inhalt ist größer als das Browserfenster */
            
        }


.scroll-content::after {
    content: "";
    display: block;
    clear: both;
}

.spacer {
    height: 100vh; /* 100% der sichtbaren Fensterhöhe */
    width: 100%; /* Falls gewünscht, die volle Breite */
}

/*start: Bildunterschrift*/


.wp-caption,
figure.wp-caption {
    background-color: rgb(251, 255, 0);
  display: block;
  text-align: center;
  margin: 1em auto;
}

.wp-caption img {
    background-color: rgb(251, 255, 0);
  display: block;
  margin: 0 auto;
}

.wp-caption-text,
figcaption.wp-caption-text {
    background-color: rgb(251, 255, 0);
  font-size: 0.9em;
  color: #555;
  margin-top: 0.5em;
  font-style: italic;
  position: static; /* Wichtig: nicht absolut positioniert */
/*ende: Bildunterschrift*/
}
.wp-block-image figcaption {
    background-color: #ff0000;
  display: block;
  text-align: center;
  font-size: 0.9em;
  color: #555;
  margin-top: 0.5em;
  position: static !important;
}


/* Galerie */
<!--
.blocks-gallery-caption {
  white-space: normal !important;
  word-wrap: break-word;
  overflow-wrap: break-word;
  position: static !important;
  display: block;
  text-align: center;
  font-size: 0.9em;
  color: #555;
  margin-top: 0.5em;
  font-style: italic;
}


.blocks-gallery-caption {
  background-color: #f0f0f0; /* hellgrau */
  padding: 0.5em 0.75em;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  text-align: center;
  font-size: 0.9em;
  color: #333;
  margin-top: 0.5em;
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
  position: static !important;
}


.blocks-gallery-caption {
  background-color: rgb(251, 255, 0);
  padding: 0.75em 1em;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  display: block;
  text-align: center;
  font-size: 0.9em;
  color: #333;
  margin-top: 0.5em;
  font-style: italic;
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
  position: static !important;
  width: 100%;
  box-sizing: border-box;
}
-->

.blocks-gallery-caption {
  position: static !important;
  display: block;
  background-color: #f0f0f0;
  padding: 0.75em 1em;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  text-align: center;
  font-size: 0.9em;
  color: #333;
  margin-top: 0.5em;
  font-style: italic;
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
  width: 100%;
  box-sizing: border-box;
}



/*start: meine-galerie*/
<!--.meine-galerie {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1em;
  margin: 2em 0;
}-->
.meine-galerie {
  width: 850px; 
  margin: 2em auto;
  padding: 20px; 
  /*float: left; */
  border: 1px solid #008000; 
}

.meine-galerie figure {
  background: rgb(185, 185, 185);
  border-radius: 0 0 15px 15px;
  overflow: hidden;
  margin: 0;
  /*  margin-bottom: 1.5em; */
}

.meine-galerie img {
  width: 100%;
  height: auto;
  display: block;

  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
}

.meine-galerie img:hover {
  transform: scale(1.02);
}

.meine-galerie figcaption {
  padding: 0.75em;
  font-size: 0.9em;
  color: #333;
  text-align: center;
  white-space: normal;
  word-wrap: break-word;
}

/*ende: meine-galerie*/


/* style.css */