/* =======================================================================
   IMAGES für Seite 
========================================================================== */    
.image-container {
  display: flex;
  gap: 10px;
  width: 100%;
}

.image-container > div {
  flex: 1;
}

.image-container img {
  width: 100%;
  max-height: 200px;
  object-fit: contain;
}
/*=============================================================================================
Gallery mit Bildunterschriften für Seite
===============================================================================================*/
.gallery-container{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;   /* statt center */
    align-items:flex-start;
    gap:40px;

    margin-left:0;
    padding-left:0;
}

.gallery{
    width:410px;                  /* Breite der Bild-/Textbox alt:260px */
    text-align:center;
}

.gallery img{
    width:400px;                  /* Bild größer alt250px*/
    height:auto;                  /* Seitenverhältnis beibehalten */
    display:block;
    margin:0 auto;
}

.desc{
    margin-top:10px;
    font-size:0.95rem;
}

/*****************************************
/+++++++++++Bild links ausgerichtet Text umfließen*************/
.imglinks {
    float: left;
    width: 300px;
    margin: 0 20px 10px 0;
}

.imglinks img {
    display: block;
    width: 100%;
    height: auto;
}
 /*Nächste H2-Übersicht beginnt wieder linksbündig unter dem Bild*/
 .imglinks ~ h2 {
        clear: both;
    }

@media (max-width: 600px) {
    .imglinks {
        float: none;
        width: 100%;
        max-width: 400px;
        margin: 0 auto 15px auto;
    }
}
/************Grid 3 Spalten -Typenübersicht****************
jedes Feld optisch vollständig abgegrenzt ist, aber die gemeinsamen Innenlinien nicht doppelt erscheinen.*/
.grid-3Sp {
    display: grid;
    grid-template-columns: max-content max-content max-content;
    grid-template-rows: auto auto auto;
    width: max-content;
    border: 1px solid #999;
}

.grid-3Sp > div {
    padding: 8px 10px;
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
    box-sizing: border-box;
}

/* Rechte Außenkante */
.grid-3Sp > div:nth-child(3n) {
    border-right: none;
}

/* Untere Außenkante bei 3 Spalten */
.grid-3Sp > div:nth-last-child(-n+3) {
    border-bottom: none;
}

/* Headline */
.grid-3Sp .headline {
    font-weight: bold;
    background-color: #e6e6e6;
}
/****************Ende Grid 3 Spalten************************/



/* Responsive */
@media (max-width: 600px) {
    .gallery-wrapper {
        flex-direction: column;
        align-items: center;
    }
}