*{
        margin-bottom: 0;
        margin-left: 0px;}

       


body 
   {background-image:url('../pics/kunstbackground.jpg');text-align: center;}
        

h3{color: blue;}




/* *************************************************** I D *************************************************** 
Container beinhaltet Naviline (das ist die graue Seite mit dem rostroten Streifen) die nach unten verlängert wird
***************************************************************************************************************/
#container {
        background-image:url(../pics/naviline.jpg); 
        background-repeat: repeat-y;
        width: 1000px;
        margin-bottom: 0;
        text-align: left;
        margin-top: 0;
        margin-right: auto;
        margin-left: auto;}

/* ************************************************Fußleiste****************************************************
Fußleiste ist die schmale gelbe Leiste am unteren Rand der Seite
***************************************************************************************************************/

#fussleiste {
        background-color: #CF0;
        font-size: 12px;
        width: 1000px;
        //*clear: left;
        float: left;*//
}

#inhalt {
        margin-left: 11em;
        background-color: #ccc;
        padding-top: 10px;
        padding-right: 10px;
        padding-bottom: 0;
        padding-left: 50px;
        width: 755px;
        height: auto;
        
}
#inhalt p {
        font-size: 20px !important; /* Verwendung von !important */
    }

/* *************************************************** I M A G E hover *************************************************/
img.beispiel4 {
        transition: transform 0.5s;
    }
    
    img.beispiel4:hover {
        transform: scale(2.0);
    }

 /* ********************************************** Gallery und Images *************************************************/   


 @media (max-width: 768px) {
        .caption {
          font-size: 12px; /* Kleinere Schriftgröße für mobile Geräte */
          margin-top: 3px; /* Weniger Abstand */
        }
 }


 /*Gallery*/

 

 .gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 10px; /* Abstand zwischen den Bildern */
  justify-content: center; /* Zentriert die Bilder */
  margin-top: 20px;
}

.gallery a {
  width: calc(50%-10px); /* Zwei Bilder pro Zeile */
  max-width: 300px;
  box-sizing: border-box; /* Verhindert Überlauf */
}
.image-container {
        width: calc(50% - 10px); /* Zwei Bilder nebeneinander, abzüglich des Abstands */
        box-sizing: border-box; /* Stellt sicher, dass Padding und Border in der Breite enthalten sind */
      }

.gallery img {
  max-width: 100%;
  height: auto;
  border-radius: 8px; /* Abgerundete Ecken */
  transition: transform 0.3s ease; /* Weicher Übergang für Hover-Effekt */
}
.caption {
  font-size: 16px; /* Schriftgröße der Bildunterschrift */
  color: #555; /* Schriftfarbe */
  text-align: center; /* Zentriert die Bildunterschrift */
  margin-top: 5px; /* Abstand zwischen Bild und Unterschrift */
  font-style: italic; /* Optional: Kursivschrift */
}

/*@media (max-width: 768px) {
        .image-container {
          width: 100%; /* Ein Bild pro Zeile auf kleineren Bildschirmen 
        }*/

/**************************************************** Gallery Ende *************************************************/





#logo_2024_spanien {
  display: flex; /* Ermöglicht die Zentrierung des Textes */
  align-items: flex-end; /* schiebt den text an de unteren rand */
  justify-content: flex-start; /* Zentriert den Text horizontal linke seite*/
  height: 261px; /* Höhe des Logos */
  width: 100%; /* Breite des Logos */
  margin-top: -40px;
  background-image: url(../pics/logo/2024_spanien.webp);/* Hintergrundbild */
  background-size: contain; /* Skaliert das Bild proportional */
  background-repeat: no-repeat; /* Verhindert Wiederholung */
  background-position: center; /* Zentriert das Bild */
  text-align: center; /* Zentriert den Text */
}
#logo_2024_spanien h1 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 48px; /* Schriftgröße */
  color: #A10202; /* Schriftfarbe */
  margin:10px 0; /* Entfernt Standardabstände */
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Optional: Schatten für bessere Lesbarkeit */
}

  #logo_2024_oe {
        display: flex; /* Ermöglicht die Zentrierung des Textes */
        align-items: flex-end; /* schiebt den text an de unteren rand */
        justify-content: flex-end; /* Zentriert den Text horizontal */
        height: 261px; /* Höhe des Logos */
        width: 100%; /* Breite des Logos */
        margin-top: -40px;
        background-image: url(../pics/logo/2024_oe.webp); /* Hintergrundbild */
        background-size: contain; /* Skaliert das Bild proportional */
        background-repeat: no-repeat; /* Verhindert Wiederholung */
        background-position: center; /* Zentriert das Bild */
        text-align: center; /* Zentriert den Text */
      }
      #logo_2024_oe h1 {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 48px; /* Schriftgröße */
        color: #A10202; /* Schriftfarbe */
        margin:10px 0; /* Entfernt Standardabstände */
        margin-right: 20px;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Optional: Schatten für bessere Lesbarkeit */
      }
/* *************************************************** N A V I L I N E *************************************************/

/*#navi formatierung f&uuml;r Index Seite*/
#navi {
        width: 175px;
        float: left;
        background-color: #A30101;
        font-size: 14px;
        font-weight: bold;}
#navi h1{font-size:10mm;}
#navi h3{color:#000;}
li {font-size:16px;}
a:link { text-decoration:none; font-weight:bold; color:#000000; }
a:visited { text-decoration:none; font-weight:bold; color:#47D804; }
a:hover { text-decoration:none; font-weight:bold; background-color:#ff0; }
a:active { text-decoration:none; font-weight:bold; background-color:#cff; }
a:focus { text-decoration:none; font-weight:bold; background-color:#080; }

li {margin-left:-5px;}
ul{margin-left:-15px;}


#navitext {
        width: 175px;
        float: left;
        background-color: #A30101;
        font-size: 14px;
        font-weight: bold;}
#navi h1{font-size:10mm;}
#navi h3{color:#000;}
li {font-size:16px;}
a:link { text-decoration:none; font-weight:bold; color:#01317E; }
a:visited { text-decoration:none; font-weight:bold; color:#47D804; }
a:hover { text-decoration:none; font-weight:bold; background-color:#ff0; }
a:active { text-decoration:none; font-weight:bold; background-color:#cff; }
a:focus { text-decoration:none; font-weight:bold; background-color:#080; }

li {margin-left:-5px;}
ul{margin-left:-15px;}


/* nav formatierung f&uuml;r  js*/
nav {
        width: 175px;
        float: left;
        background-color: #A30101;
        font-size: 14px;
        font-weight: bold;}
#navi h1{font-size:10mm;}
#navi h3{color:#000;}
#navi_reise{font-size:10mm;color:rgb(0,200,0);}

li {font-size:16px;}
a:link { text-decoration:none; font-weight:bold; color:#000011; }
a:visited { text-decoration:none; font-weight:bold; color:#47D804; }
a:hover { text-decoration:none; font-weight:bold; background-color:#ff0; }
a:active { text-decoration:none; font-weight:bold; background-color:#cff; }
a:focus { text-decoration:none; font-weight:bold; background-color:#080; }

li {margin-left:-5px;}
ul{margin-left:-20px;}

#newsbox {
        width: 600px;
        height: 50px;
        margin-top: -60px;
        margin-right: auto;
        margin-bottom: 0px;
        margin-left: auto;
        border: thick ridge #FF0;
        color: blue;}
h2 #newsbox {color:blue;}



/* *************************************************** C L A S S *************************************************



