:root{
/* --bg:#fefdfb; */
/* --card:#ffffff; */
--text:#003366;
/* --lighttext:#fefdfb; */
--lighttext:#f5fff8;
/* <!-- --text:#1a1a1a; --> */
/* --muted:#555; */
/* --gold:#f2b705; */
--gold:#FFB900;
/* --ring:#ff8e00; */
	--gradient:linear-gradient(90deg,#002347,#003366,#003F7D,#FF8E00,#FD7702,#FF5003);
/* html,body { */
    /* height:100%; */
/* } */

--c1:#002347;
--c2:#003366;
--c3:#003F7D;
--c4:#FF8E00;
--c5:#FD7702;
--c6:#FF5003;



/* BOOTSTRAP Änderungen */

--bs-border-radius: 0rem !important;


 /* ENDE */

}

.navbar-toggler:focus{
box-shadow:0 0 0 0;
}	

.txt-gold{color:var(--gold);}


body{ 
font-family: 'Rethink Sans', sans-serif;
color:var(--lighttext);
margin:0;

}

.transparent {
	background-bolor:rgba(0,0,0,0);
	
}

#c1 {background-color:#002347;}
#c2 {background-color:#003366;}
#c3 {background-color:#003F7D;}
#c4 {background-color:#FF8E00;}
#c5 {background-color:#FD7702;}
#c6 {background-color:#FF5003;}
    

h1, h2, h3, h4, h5, h6{
	font-family: 'Staatliches', sans-serif;
	letter-spacing:1px;
}

.flex-container {
  display: flex;
  flex-wrap: nowrap;
}

.flex-container > div {
	width: 100%;
	height:100%;
	  display: flex;
  justify-content: center;
  align-items: center;
}
/* Fixed Hintergrund (unterste Ebene) */
.fixed-bg {
	position: fixed;
	inset: 0; /* top:0; right:0; bottom:0; left:0; */
		/* background-image: url("https://picsum.photos/1600/900"); */
	z-index: 0;
	height:100%;
}



/* Grundlayout für Sektionen */
.section {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative; /* damit z-index wirkt */
	z-index: 1;         /* Inhalte über dem fixed Background */
	box-sizing: border-box;
	overflow:hidden;
}

.banner {
	min-height: 5vh;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative; /* damit z-index wirkt */
	z-index: 1;         /* Inhalte über dem fixed Background */
	box-sizing: border-box;
}


/* Platzhalter damit der Flow Platz für die "fixe" Sektion lässt */
.section-2-placeholder {
	height: 100vh;

}

/* Beispiel: Sektionen leicht transparent, damit der Background durchscheint */
/* .section-1 { background: rgba(0,0,0,1); z-index: 3} */
/* .section-1 { background: var(--c1); z-index: 3} */
.section-1 { background: linear-gradient(rgba(0,0,0,1),var(--c1)); z-index: 3}
/* .section-3 { background: rgba(255,255,255,0.85); } */
/* .section-4 { background: rgba(255,255,255,0.9); } */
/* .section-5 { background: rgba(255,255,255,0.9); } */
/* .section-6 { background: rgba(255,255,255,0.9); } */


/* .section-2 ist blau / transparent */
.section-3 { background:rgba(0, 63, 125, 1) ;}
.section-4 { background:rgba(255, 142, 0, 1); }
.section-5 { background:rgba(253, 119, 2, 1); }
.section-6 { background:rgba(255, 80, 3, 1) ;}




/* Kleine Typo/Responsive Verbesserungen */
h1 { margin: 0 0 0.5rem 0; font-size: clamp(1.5rem, 3vw, 2.5rem); }
p { margin: 0; font-size: clamp(1rem, 2vw, 1.25rem); }


/* a.btn{ */
/* color:var(--lighttext) !important;} */
.btn{
color:var(--lighttext);
font-family: 'Staatliches', sans-serif;
letter-spacing:1px;
}

a.mail{
	color:var(--c3) !important;
}

a.mail:hover{
	color:var(--gold) !important;
}

.navbar a{
	text-decoration:none;
	color:var(--lighttext);
	font-family: 'Staatliches', sans-serif;
	letter-spacing:1px;
	width:100%;
}


.navbar a:hover{
	letter-spacing:2px;
}


.sek5{
	color: var(--c4);
	background:#fff;
	/* max-width: max-content; */

}


.horizontal-scrolling-items {
  display: flex;
  width: 2600px;
  animation-name: infiniteScroll;
  animation-duration: 25s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
.horizontal-scrolling-items__item {
  white-space: nowrap;
}

@keyframes infiniteScroll {
  0%{transform: translateX(0)}
 100%{transform: translateX(-100%)}
  /* Rückwärts */
  /* 50%{transform: translateX(-50%)} */
  /* 100% {transform: translateX(0%)} */
}

/* CHANGE: Zusätzliche Styles für das neue Hamburger-Menü und bessere Mobile-Darstellung */

/* Stellt sicher, dass Bilder responsiv skaliert werden */
img { max-width: 100%; height: auto; }

/* Hamburger Icon sichtbar auf dunklem Hintergrund */
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Leichte Polsterung und Abstand für Nav-Links, damit die farbigen Felder wirken */
.navbar-nav .nav-link {
  margin: 0.25rem;
  padding: 0.45rem 0.9rem;
  border-radius: 6px;
  font-family: 'Staatliches', sans-serif;
  letter-spacing: 1px;
  white-space: nowrap;
}

/* Auf kleineren Bildschirmen: Nav-Links in der Collapse-Ansicht mittig und mit leichtem Abstand */
@media (max-width: 991.98px) {
  .navbar-collapse {
    padding: 0.5rem 1rem 1rem 1rem;
  }
  .navbar-nav {
    justify-content: center;
  }
}

/* Brand-Fontgröße anpassen (kleiner auf Mobilgeräten) */
.navbar-brand {
  font-size: 1.25rem;
}
@media (max-width: 576px) {
  .navbar-brand { font-size: 1rem; }
}


@media (max-width: 991.98px) { 
.disap{display:none;}

}
@media (min-width: 992px) { 
.appear{display:none;}
.disap{display:flex;}
}

.email {
	height: 2em;
	margin: 0 0;
	vertical-align: middle;
}

.adr {
height: 3em;
	margin: 0em 0 1em 0;
	vertical-align: middle;
width: 100%;
}

.name {
	height: 1.25em;
	margin: 1em 0 0 0;
	vertical-align: middle;
width: 100%;
}

.blob{

background: rgba(255,255,255,0.85);
/* border: 1px solid rgba(255,255,255,0.6); */
border-radius: 200px;
width: min-content;
margin: 0 auto;
padding: 0.6em 0.7em;
}

.modi:hover{
	  transform:scale(1.02);
	  cursor:pointer;

}
