.clearfix:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; } 

li {
    user-select: none;
}

html,
button,
input,
select,
textarea {  
  font-family: 'Source Sans Pro', sans-serif; font-size: 1.313em; /* 21px; */
  font-weight: 300;
  line-height: 1.5em;
 }
 

#content {
	margin: 0.8em;
}


.headerLOGO {
	background-color: white;
    background-image: url("logo_mit_schrift.png");
	background-repeat: no-repeat;
	height: 100%;
	width: 100%;
}


body { background: transparent url(bg.webp) center top no-repeat; }

/* 
+++++++++++++++++++++++++++++++++++
	.imgGalleryFlex
+++++++++++++++++++++++++++++++++++
*/

ul.imgGalleryFlex {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 5px;
	list-style: none;
	padding: 10px;
}
li.imgGalleryFlex  {
	display: flex;
}
img.imgGalleryFlex  {
	max-width: 100px;
	height: auto;
	display: block;
}

@media (max-width: 600px) {
	ul.imgGalleryFlex  {
		flex-direction: column;
	}
	li.imgGalleryFlex  {
		justify-content: center;
	}
}


/* 
+++++++++++++++++++++++++++++++++++
	Bild von Text umflossen
+++++++++++++++++++++++++++++++++++
*/

.container_imgTxTfloatLeft  img.responsive {
    float: left;
    max-width: 300px;
    height: auto;
    margin-right: 20px;
   /* margin-bottom: 20px; */
}

.container_imgTxTfloatLeft .text {
}

@media (max-width: 600px) {
    .container_imgTxTfloatLeft  img.responsive {
        float: none;
        display: block;
        margin: 0 auto 20px auto;
        width: 100%;
    }
}

/* 
+++++++++++++++++++++++++++++++++++
	.imgTxtBlock
+++++++++++++++++++++++++++++++++++
*/

.imgTxtBlock {
    display: flex;
    align-items: flex-start; 
    gap: 1em;
	margin-bottom: 35px;
}

.imgTxtBlock img { width: 185px; }
.txt {
    flex-grow: 1;
}

@media only screen and (max-width: 768px) {
.imgTxtBlock { display: block;}
.imgTxtBlock img { float: none;  width: auto; height: auto; max-width: 100%;}
.imgTxtBlock .txt { margin-left: 0em; }

}

footer {
	background-color: #a1cdd5;
}
footer a { 
	color: #FFF;
	font-family: 'Dosis', sans-serif;
	font-weight: 600;
	font-weight: 500; 
	text-transform: uppercase;
	border: none;
}

@media (prefers-contrast: more) {
	footer a { color: black; }
}

#headerWave {
	grid-area: wave;
}

/*
++++++++++++++++++++++++++++++++++
	.CLASSES
+++++++++++++++++++++++++++++++++++
*/
.textJustify { text-align:justify }
.imgWidth { width: 185px; }
.floatLeft { float:left; }
.floatRight { float:right; }
.schuetti-margin { margin: 1em; }

.schuetti-footnote {
	display: inline-block;
    line-height: 0.9;
    margin: 0;
	font-size: 10pt;
}

/* Auf Mobile */
@media only screen and (max-width: 768px) {
	.textJustify { text-align:left }
	.imgWidth { width: auto; }
	.floatLeft { float:none; }
	.floatRight { float:none; }
	.schuetti-margin { margin: auto }
}

.cBlue,
.blue { color: #71B1E7; }

.cBlue { font-family: 'Dosis', sans-serif; font-weight: 600; letter-spacing: 0.025em; text-transform: uppercase; }

p .cBlue { font-size: 1.05em !important; }

.bgBlue { background-color: #71B1E7; }

.green,
.cGreen { color: #7CAE30 !important; }
.cGreen { font-family: 'Dosis', sans-serif; font-weight: 600; letter-spacing: 0.025em; text-transform: uppercase; }

p .cGreen { font-size: 1.05em; }

.cGrey { color: #6F6F6F; }

.bold { font-weight: 600; }


.my_special-deco{
    font-variant: all-petite-caps;
	font-weight: 900;
	color: rgb(50 50 50);
}
	
.my_special-section b {
	font-variant: all-small-caps;
	font-weight: 900;
	color: rgb(50 50 50);
}
	
/* Für Screenreader */
@media (prefers-contrast: more) {
	body,
	h2,
	h3,
	h3 *,
	.termBox h3, .termBox p,
	.slogan p.slogan_txt,
	.nav-link,
	.cBlue,
	.blue,
	.green,
	.cGreen { 
		background-color: white !important; 
		color: black !important; 
	}
}


nav {
	/* padding-left: 1em; */
	text-decoration: none; /* Optional: Entfernt die Unterstreichung */
}

nav li {
  list-style: none;
}

.nav-item { 
  color: #7CAE30;
  font-family: 'Dosis', sans-serif;
  font-size: 24px;
  letter-spacing: 0.025em;
  line-height: 1.8em;
  font-weight: 500;
  text-transform: uppercase;
}

nav li ul li a {
  font-size: 18px;
}

nav .active
{
  color: #71B1E7;
  border-bottom: 1px solid #71B1E7;
}

nav li.active a {
  color: #71B1E7;
}

nav li a {
  color: #7CAE30;
  text-decoration: none;
}

@media (max-width: 768px) {
	.nav-item {
   font-size: 22px;
	}
	
	nav li ul li a {
	font-size: 10px;
	}
}


#main { background-color: #FFF; }


h3 a { color: #7CAE30; border-bottom-color: #7CAE30; }

h3 a:hover { border-bottom-color: #71B1E7; }

p + ul { margin-top: -30px; }



.slogan { margin-bottom: 35px; }

.imgTxtBlock + .slogan { margin-top: -30px; }

.slogan p.slogan_txt {
	color: #71B1E7;
	font-family: 'Bitter', serif; 
	font-style: italic; 
	font-size: 40px;
	font-weight: 400;
	line-height: 1.25em;
	text-transform: uppercase; 
	margin-bottom: 20px;
}

.slogan p.slogan_autor {
	color: #7CAE30;
	font-family: 'Dosis', sans-serif;
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0.025em;
	text-transform: uppercase;
	margin-bottom: 0;
}



.termBox {
	padding-bottom: 30px;
	border-bottom: 2px dotted #71B1E7;
	margin-bottom: 40px;
}

.termBox a { display: block; border: none; }

.termBox h3,
.termBox p {
	color: #71B1E7;
	font-family: 'Dosis', sans-serif;
	font-size: 27px;
	letter-spacing: 0.025em;
	line-height: 1.7em;
	text-transform: uppercase;
	margin: 0;
}

.termBox h3 {
	color: #7CAE30;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 1.1em;
	margin-bottom: 0.5em;
}

.termBox span.date { font-size: 1.3em; font-weight: 500; }




.separator {
	font-size: 0.01px;
	height: 0px; 
	line-height: 0.01px;  
	border-bottom: 2px dotted #7CAE30; 
	margin-bottom: 40px; 
}