/**
* Template Name: TheEvent - v4.6.0
* Template URL: https://bootstrapmade.com/theevent-conference-event-bootstrap-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
#main {
  flex: 1 0 auto;         /* nimmt den ganzen übrigen Platz ein */
  padding-bottom: 150px;
}

#footer {
  flex-shrink: 0;         /* Footer wird nicht nach oben gedrückt */
}
#adventskalender {
  padding: 100px 0 0 0;
  position: relative;
}
#adventskalender .container {
  max-width: 1800px !important; /* nach Geschmack 1400/1600/1800 */
}
/* Adventskalender als Grid-Layout */
#adventskalender .row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 20px;
}

/* Ein einzelnes Fenster im Grid */
.fenster {
  width: 100%;
}

/* Karte/Türchen-Rahmen (immer gleiche Größe) */
.fenster .speaker {
  position: relative;
  width: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  overflow: hidden;
}

/* Rückseite liegt vollflächig über der Vorderseite */
.fenster .speaker a {
  display: block;
}

/* Rückseiten-Bild füllt die Karte */
.fenster .speaker img {
  width: 100%;
  height: auto;          /* WICHTIG: Bild bestimmt Höhe */
  display: block;
  object-fit: unset;     /* optional, kann auch einfach weg */
}

/* Wenn Rückseite aktiv (a ohne .invisible) → Vorderseite verstecken */
.fenster .speaker:has(> a:not(.invisible)) {
  background-image: none !important;
}

body.advent {  
  font-family: "Open Sans", sans-serif;
  background-color: #FAF8F8;
  /*background: url(../img/background_1.jpg) center center no-repeat;*/
  background-size: cover;
  background-attachment: fixed;

  padding-bottom: 70px; /* Wert ggf. an Footer-Höhe anpassen */
  min-height: 100vh;      /* volle Fensterhöhe */
  display: flex;
  flex-direction: column;
}
a {
  color: #9c0f16;
  text-decoration: none;
  transition: 0.5s;
}

a:hover, a:active, a:focus {
  color: #9c0f16;
  outline: none;
  text-decoration: underline;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  background: #eee;
  padding: 5px 0 10px 0; /* vorher: 0 0 25px 0 */
  color: #262626;
  font-size: 13px;       /* minimal kleiner, optional */
}

#footer .copyright {
  text-align: center;
  padding-top: 5px;      /* vorher: 30px */
}

#footer .credits {
  text-align: center;
  font-size: 12px;       /* optional */
  color: #262626;
}

/* Responsive Adventskalender – Footer immer sichtbar unten */
.responsivefoot {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  box-shadow: -5px 5px 10px rgba(0,0,0,0.6);
  z-index: 1000; /* damit er über allem liegt */
}

