@charset "utf-8";
/* CSS Document für Phase3 Engineering */


/* Kopfabstände beim automatischen Scrollen */
#angebot, #themen, #uber, #kontakt, #imp_ds {
	scroll-margin-top: 100px;
};

/* Farbanpassungen - Abweichungen von Bootstrap */

/* Primäre Farbe an CI Phase3 angepasst */
:root {
	--bs-primary: rgb(90, 140, 56);
	--bs-primary-rgb: 90, 140, 56;
}

.bg-primary {
  background-color: rgb(90, 140, 56) !important;
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: rgb(90, 140, 56);
  --bs-btn-border-color: rgb(90, 140, 56);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: rgb(75, 118, 47);
  --bs-btn-hover-border-color: rgb(67, 105, 42);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: rgb(67, 105, 42);
  --bs-btn-active-border-color: rgb(58, 91, 37);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: rgb(90, 140, 56);
  --bs-btn-disabled-border-color: rgb(90, 140, 56);
}


/* Animation im Begrüßungsbild */

/* Alle h1 im Teaser */
#teaser h1 {
  position: absolute;
  width: 100%;
  top: 75%;
  opacity: 0;
  transform: scale(2);
  animation: slideUp 30s ease-in-out infinite;
  text-align: center;
}

/* Animation zeitversetzt pro Element */
#teaser h1:nth-of-type(2) {animation-delay: 3s;}
#teaser h1:nth-of-type(3) {animation-delay: 6s;}
#teaser h1:nth-of-type(4) {animation-delay: 9s;}
#teaser h1:nth-of-type(5) {animation-delay: 12s;}
#teaser h1:nth-of-type(6) {animation-delay: 15s;}
#teaser h1:nth-of-type(7) {animation-delay: 18s;}
#teaser h1:nth-of-type(8) {animation-delay: 21s;}
#teaser h1:nth-of-type(9) {animation-delay: 24s;}
#teaser h1:nth-of-type(10) {animation-delay: 27s;}

/* Animation: Text nach oben bewegen, verkleinern und ausblenden */
@keyframes slideUp {
  10% {
    opacity: 1;
    top: 50%;
    transform: scale(1);
  }
  20% {
    opacity: 0;
    top: 25%;
    transform: scale(0.5);
  }
}

/* Anzeige */
.secondary {display: none;}

/* Modalbreite auf 80% definieren bis XL */
.modal-phase3 {
  width: 90%;
  max-width: 1140px; /* untere XL Bildschrimbreite */
  margin-left: auto;
  margin-right: auto; /* zentriert, vertikale Margins bleiben von Bootstrap */
}


/* Canvas für Grafiken mit fester Höhe ausstatten */
#chartWrap1, #chartWrap2 { height: 400px; }
#timeSeriesChart, #resultChart { display:block; width:100%; height:100%; }