/* #region START*/

* {
	margin: 0;
	padding: 0;
	border: 0;
	border:  none;
	font-size: 100%;
	font: inherit;
	box-sizing: border-box;
}

html {
    height: 100vh;
    color: #333333;
}

body {
    height: 100vh;
    margin: 0 auto;
	width: 100%;
    font: normal 62.5%/160% 'Roboto', sans-serif;
    font-weight: 400;
}

.outwraplogineo {
	width: 100%; 
	text-align: center;
}

.wrapper {
	margin: auto;
}


main {
	margin: 0 auto;
	margin-top: 100vh;
}

.startframe {
	position: absolute;
	top: 0px;
	width: 100%;
	height: 100vh;
	max-width: 1600px;
	max-height: 1100px;
	background: #003366 url('../img/start/feldsieper_grundschule_bochum_VFL2026_1400.webp') no-repeat top center;
	background-size: cover;
}

.titelcontainer {
	position: relative;
	top: 90%;
	left: 53%;
	height: 30px;
	width: 360px;
	color: #fff;
	padding: 6px;
	background: rgba(0, 0, 0, 0.6);
	font-size: 1.3em;
	text-align: center;
	font-variant: small-caps;
	letter-spacing: normal;
}


  .sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* #endregion */
/* #region FONT*/

@font-face {
	font-family: 'Poiret One';
	font-style: normal;
	font-weight: 400;
	src:  url("../fonts/PoiretOne-Regular.ttf");
   }

@font-face {
	font-family: 'Roboto Serif';
	font-style: normal;
	font-weight: 300;
	src:  url("../fonts/RobotoSerif-Light.ttf");
   }

 @font-face {
	font-family: 'Roboto Serif';
	font-style: italic;
	font-weight: 300;
	src:  url("../fonts/RobotoSerif-LightItalic.ttf");
   }
   
@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 400;
  src:  url("../fonts/RobotoSerif-Regular.ttf");
 }

 @font-face {
	font-family: 'Roboto Serif';
	font-style: italic;
	font-weight: 400;
	src:  url("../fonts/RobotoSerif-Italic.ttf");
   }
 
 @font-face {
	font-family: 'Roboto Serif';
   font-style: normal;
   font-weight: 600;
   src:  url("../fonts/RobotoSerif-SemiBold.ttf");
  }
   
 @font-face {
	font-family: 'Roboto Serif';
	font-style: italic;
	font-weight: 600;
	src:  url("../fonts/RobotoSerif-SemiBoldItalic.ttf");
   }

 @font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 300;
	src:  url("../fonts/Roboto-Light.ttf");
   } 
 
   @font-face {
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 300;
	src:  url("../fonts/Roboto-LightItalic.ttf");
   }
 
   @font-face {
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 500;
	src:  url("../fonts/Roboto-Medium.ttf");
   }

 @font-face {
   font-family: 'Indie Flower';
   font-style: cursive;
   font-weight: 400;
   src:  url("../fonts/IndieFlower-Regular.ttf") format("truetype");
  }


/* #endregion */
/* #region HEADER*/

header {
	position: relative;
	top: 0;
	margin: 0 auto;
	width: 100vw;
	max-width: 1600px;
	color: #fff;
	text-align: left;
/*     background: -webkit-linear-gradient(top,  rgb(115, 145, 200,),  rgba(41, 105, 176, 0));
    background: -moz-linear-gradient(top,  rgba(115, 145, 200,, 1),  rgba(41, 105, 176, 0));
    background: linear-gradient(top,  rgba(115, 145, 200,, 1),  rgba(41, 105, 176, 0));
    background: -moz-linear-gradient(top,  rgb(0, 13, 27),  rgba(0, 51, 102, 0));
    background: linear-gradient(top,  rgba(0, 13, 27, 1),  rgba(0, 51, 102, 0));  */
	height: 90px;
	z-index: 200;	
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	-ms-justify-content: flex-start;
	-o-justify-content: flex-start;
	justify-content: flex-start;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	-ms-align-items: flex-start;
	-o-align-items: flex-start;
	align-items: flex-start;
}

.header-color-start {
	background: -webkit-linear-gradient(top, rgb(168,148,185), rgba(115, 145, 200, 0.6));
    background: -moz-linear-gradient(top, rgb(168,148,185), rgba(115, 145, 200, 0.6));
    background: linear-gradient(top,  rgb(168,148,185), rgba(115, 145, 200, 0.6));
    background: -moz-linear-gradient(top, rgb(168,148,185), rgba(115, 145, 200, 0.6));
    background: linear-gradient(top,  rgb(168,148,185), rgba(115, 145, 200, 0.6));
	}

.header-color-start-red {
	background: -webkit-linear-gradient(top,  rgb(205, 53, 37, 1),  rgba(156, 37, 205, 0.6));
    background: -moz-linear-gradient(top,  rgba(205, 53, 37, 1),  rgba(156, 37, 205, 0.6));
    background: linear-gradient(top,  rgba(205, 53, 37, 1),  rgba(156, 37, 205, 0.6));
    background: -moz-linear-gradient(top,  rgb(205, 53, 37, 1),  rgba(156, 37, 205, 0.6));
    background: linear-gradient(top,  rgba(205, 53, 37, 1),  rgba(156, 37, 205, 0.6)); 
	}

.header-color-start-bluetogreen {
	background: -webkit-linear-gradient(top,  rgb(0, 140, 217, 1),  rgba(141, 177, 138, 0.6));
    background: -moz-linear-gradient(top,  rgba(0, 140, 217, 1),  rgba(141, 177, 138, 0.6));
    background: linear-gradient(top,  rgba(0, 140, 217, 1),  rgba(141, 177, 138, 0.6));
    background: -moz-linear-gradient(top,  rgb(0, 140, 217, 1),  rgba(141, 177, 138, 0.6));
    background: linear-gradient(top,  rgba(0, 140, 217, 1),  rgba(141, 177, 138, 0.6)); 
	}

	.header-color-start-magenta {
		background: -webkit-linear-gradient(top,  rgb(139, 0, 75, 1),  rgba(250, 6, 63, 0.6));
		background: -moz-linear-gradient(top,  rgba(139, 0, 75, 1),  rgba(250, 6, 63, 0.6));
		background: linear-gradient(top,  rgba(139, 0, 75, 1),  rgba(250, 6, 63, 0.6));
		background: -moz-linear-gradient(top,  rgb(139, 0, 75, 1),  rgba(250, 6, 63, 0.6));
		background: linear-gradient(top,  rgba(139, 0, 75, 1),  rgba(250, 6, 63, 0.6)); 
		}

		.header-color-start-magenta-reverse {
			background: -webkit-linear-gradient(top,  rgb(250, 6, 63, 0.6),  rgba(139, 0, 75, 1));
			background: -moz-linear-gradient(top,  rgba(250, 6, 63, 0.6),  rgba(139, 0, 75, 1));
			background: linear-gradient(top,  rgba(250, 6, 63, 0.6),  rgba(139, 0, 75, 1));
			background: -moz-linear-gradient(top,  rgb(250, 6, 63, 0.6),  rgba(139, 0, 75, 1));
			background: linear-gradient(top,  rgba(250, 6, 63, 0.6),  rgba(139, 0, 75, 1)); 
			}

.header-color-wir {
	background: -webkit-linear-gradient(top,  rgb(183, 217, 242,1),  rgba(150, 194, 145, 0.6));
    background: -moz-linear-gradient(top,  rgba(183, 217, 242,1),  rgba(150, 194, 145, 0.6));
    background: linear-gradient(top,  rgba(183, 217, 242,1),  rgba(150, 194, 145, 0.6));
    background: -moz-linear-gradient(top,  rgb(183, 217, 242,1),  rgba(150, 194, 145, 0.6));
    background: linear-gradient(top,  rgba(183, 217, 242,1),  rgba(150, 194, 145, 0.6)); 
}
.header-color-wir-reverse {
	background: -webkit-linear-gradient(top,  rgb(115, 145, 200, 0.9),  rgba(150, 194, 145, 1));
    background: -moz-linear-gradient(top,  rgba(115, 145, 200, 0.9),  rgba(150, 194, 145, 1));
    background: linear-gradient(top,  rgba(115, 145, 200, 0.9),  rgba(150, 194, 145, 1));
    background: -moz-linear-gradient(top,  rgb(115, 145, 200, 0.9),  rgba(150, 194, 145, 1));
    background: linear-gradient(top,  rgba(115, 145, 200, 0.9),  rgba(150, 194, 145, 1)); 
}

.header-color-termine {
	background: -webkit-linear-gradient(top, rgb(183, 217, 242,1), rgba(186, 187, 41, 0.6));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(186, 187, 41, 0.6));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(186, 187, 41, 0.6));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(186, 187, 41, 0.6));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(186, 187, 41, 0.6));
}

.header-color-ogs {
	background: -webkit-linear-gradient(top, rgb(183, 217, 242,1), rgba(235, 117, 142, 0.6));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(235, 117, 142, 0.6));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(235, 117, 142, 0.6));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(235, 117, 142, 0.6));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(235, 117, 142, 0.6));
}
.header-color-ogs-reverse {
	background: -webkit-linear-gradient(top, rgb(235, 117, 142, 1), rgba(183, 217, 242,1));
    background: -moz-linear-gradient(top, rgb(235, 117, 142, 1), rgba(183, 217, 242,1));
    background: linear-gradient(top, rgb(235, 117, 142, 1), rgba(183, 217, 242,1));
    background: -moz-linear-gradient(top, rgb(235, 117, 142, 1), rgba(183, 217, 242,1));
    background: linear-gradient(top, rgb(235, 117, 142, 1), rgba(183, 217, 242,1));
}


.header-color-wir2024 {
	background: -webkit-linear-gradient(top, rgb(168,148,185, 1), rgba(115, 145, 200, 0.9));
    background: -moz-linear-gradient(top, rgb(168,148,185, 1), rgba(115, 145, 200, 0.9));
    background: linear-gradient(top, rgb(168,148,185, 1), rgba(115, 145, 200, 0.9));
    background: -moz-linear-gradient(top, rgb(168,148,185, 1), rgba(115, 145, 200, 0.9));
    background: linear-gradient(top, rgb(168,148,185, 1), rgba(115, 145, 200, 0.9));
}
.header-color-wir2024-reverse {
	background: -webkit-linear-gradient(top, rgb(115, 145, 200, 0.9), rgba(168,148,185, 1));
    background: -moz-linear-gradient(top, rgb(115, 145, 200, 0.9), rgba(168,148,185, 1));
    background: linear-gradient(top, rgb(115, 145, 200, 0.9), rgba(168,148,185, 1));
    background: -moz-linear-gradient(top, rgb(115, 145, 200, 0.9), rgba(168,148,185, 1));
    background: linear-gradient(top, rgb(115, 145, 200, 0.9), rgba(168,148,185, 1));
}


.header-color-schwerpunkte {
	background: -webkit-linear-gradient(top, rgb(154, 139, 78, 1), rgba(164, 119, 100, 0.6));
    background: -moz-linear-gradient(top, rgb(154, 139, 78, 1), rgba(164, 119, 100, 0.6));
    background: linear-gradient(top, rgb(154, 139, 78, 1), rgba(164, 119, 100, 0.6));
    background: -moz-linear-gradient(top, rgb(154, 139, 78, 1), rgba(164, 119, 100, 0.6));
    background: linear-gradient(top, rgb(154, 139, 78, 1), rgba(164, 119, 100, 0.6));
}


.header-color-schwerpunkte-reverse {
	background: -webkit-linear-gradient(top, rgb(164, 119, 100, 0.9), rgb(154, 139, 78, 1));
    background: -moz-linear-gradient(top, rgb(164, 119, 100, 0.9), rgba(154, 139, 78, 1));
    background: linear-gradient(top, rgb(164, 119, 100, 0.9), rgba(154, 139, 78, 1));
    background: -moz-linear-gradient(top, rgb(164, 119, 100, 0.9), rgba(154, 139, 78, 1));
    background: linear-gradient(top, rgb(164, 119, 100, 0.9), rgba(154, 139, 78, 1));
}

.header-color-kontakt {
	background: -webkit-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
}

.header-color-kontakt2024 {
	background: -webkit-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 0.6));
}

.header-color-kontakt2024-reverse {
	background: -webkit-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 1));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 1));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 1));
    background: -moz-linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 1));
    background: linear-gradient(top, rgb(183, 217, 242,1), rgba(168,148,185, 1));
}

.header-color-green {
	background: -webkit-linear-gradient(top, rgb(73, 215, 133), rgba(250, 245, 230, 0.67));
    background: -moz-linear-gradient(top, rgb(73, 215, 133), rgba(250, 245, 230, 0.67));
    background: linear-gradient(top, rgb(73, 215, 133), rgba(250, 245, 230, 0.67));
    background: -moz-linear-gradient(top, rgb(73, 215, 133), rgba(250, 245, 230, 0.67));
    background: linear-gradient(top, rgb(73, 215, 133), rgba(250, 245, 230, 0.67));
	}

.header__logo {
	flex-grow: 1;
	max-width: 200px;
	background-image: url(../img/start/feldsieper-grundschule-bochum-logo-2022.png);
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	margin-top: 16px;
	width: 100px;
	height: 75px;
	opacity: 1;
	text-indent: -9999em;
}

.header__h1 {
	flex-grow: 3;
	margin: 50px auto;
	font-size: 3.5vw;
	letter-spacing: 2pt;
	font-family: 'Poiret One', normal;
	text-shadow: 2px 2px 10px rgba(0,0,0,0.8);
}

.backtostart {
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 90%; 
	height: 80px; 
	text-decoration: none;
}

.dropdown {
	display: none;
}

.header__nav {
	position: absolute;
	top: 30px;
	right: 30px;
	width: 90px;
	height: auto;
	z-index: 500;
	 
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;  
	
	-webkit-flex-wrap: nowrap;
	-moz-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	-o-flex-wrap: nowrap;
	flex-wrap: nowrap;
	
	-webkit-justify-content: flex-end;
	-moz-justify-content: flex-end;
	-ms-justify-content: flex-end;
	-o-justify-content: flex-end;
	justify-content: flex-end;
}

.header__figcaption{
	height: auto;
	width: auto;
	margin-left: 30px;
}

.header__h1-wir  {
	padding-top: 30px;
	margin-left: 50px;
	font-size: 5vw; 
	font-family: 'Poiret One', normal;
}

.header__h2 {
	font-family: 'Indie Flower', cursive;
	width: 100%;
	text-align: left;
	font-size: 1.6em;
	padding-top: 15px;
	letter-spacing: normal;
	color: #b9352f;
}

.header__h3 {
	width: 100%;
	text-align: right;
	padding-right: 150px;
	font-size: 1.2em;
	letter-spacing: normal;
	color: #563982;
}

.header__btn-home {
	text-align: center;
	height: 65px;
	width: 65px;
	margin: 0 auto;
	margin-top: 5px;
	margin-right: 5px;
}

.header__btn-kontakt {
	text-align: center;
	height: 45px;
	width: 45px;
	margin: 0 auto;
	margin-top: 5px;
	margin-right: 5px;
}

#roundbutton a {
	height: 60px;
	width: 60px;
	font-size: 1.4em;
	padding-top: 24px;
	padding-left: 7px;
	font-weight: 400;
	float: left;
	margin: 0 auto;
	color: #fdf3d6;
	text-decoration: none;
	border-radius: 50%;
	box-shadow: 4px 4px 30px #003366;
	background: rgb(250,222,143);
	background: linear-gradient(153deg, rgba(250,222,143,1) 0%, rgba(114,190,179,1) 74%, rgba(5,102,113,1) 100%);

	
	-webkit-transition: all 0.6s ease-out; 
	-moz-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	-o-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}

.roundbutton:hover {
	background: linear-gradient(#f24437, #c62d1f);
  }

#roundbutton-home a {
	height: 95px;
	width: 95px;
	padding-top: 25px;
	font-size: 1.2em;
	font-weight: 400;
	letter-spacing: normal;
	background: linear-gradient(#f24437, #c62d1f);
	float: left;
	margin: 0 auto;
	color: white;
	text-decoration: none;
	border-radius: 50%;
	
	-webkit-transition: all 1.6s ease-out; 
	-moz-transition: all 1.6s ease-out;
	-ms-transition: all 1.6s ease-out;
	-o-transition: all 1.6s ease-out;
	transition: all 1.6s ease-out;
}

#roundbutton-wir a {
	height: 65px;
	width: 65px;
	padding-top: 25px;
	font-size: 1.2em;
	border: 2px solid #8dc9e8;
	float: left;
	margin: 0 auto;
	color: white;
	text-decoration: none;
	border-radius: 50%;
	box-shadow: 0px 3px 5px #444;
	
	transform-origin: center center;
	
	-webkit-transition: transform .6s ease-out; 
	-moz-transition: transform .6s ease-out;
	-ms-transition: transform .6s ease-out;
	-o-transition: transform .6s ease-out;
	transition: transform .6s ease-out;
}

#roundbutton-wir:hover {
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2); 	
	transform: scale(1.2);
}


.header__btn-home:hover .header__btn-rotate-home {
	-webkit-transform: rotate(360deg) scale(1.2);
	-moz-transform: rotate(360deg) scale(1.2);
	-ms-transform: rotate(360deg) scale(1.2);
	-o-transform: rotate(360deg) scale(1.2);
	-ms-transform: rotate(360deg) scale(1.2); 	
	transform: rotate(360deg) scale(1.2);
}

.header__btn-kontakt:hover .header__btn-rotate {
	-webkit-transform: rotate(360deg) scale(1.2); 
	-moz-transform: rotate(360deg) scale(1.2);
	-ms-transform: rotate(360deg) scale(1.2);
	-o-transform: rotate(360deg) scale(1.2);
	transform: rotate(360deg) scale(1.2);
}

.div00__startframespace {
	width: 100%;
	height: 100%;
}

.scrollpoint {
	width: 1px;
	height: 1px;
	position: relative;
	top: -100px;
}

.header__btn-lernfoerderung {
	text-align: center;
	min-width: 200px;
	padding: 10px;
	margin: 0 auto;
	margin-top: 5px;
	margin-right: 5px;
	border: 1px solid white;
}

.header__btn-lernfoerderung a:link {
	color: #fff;
	text-decoration: none;
}

.header__btn-lernfoerderung a:hover {
	text-decoration: underline;
}


/* #endregion */
/* #region MAIN*/

.contentstart {
	margin-top: 0;
	padding-top: 80px;
}

.contentstart-ogs {
	margin-top: 0;
	padding-top: 20px;
}


.beachten-link a {
	color: darkslateblue;
	text-decoration: none;
	line-height: 150%;
	font-size: 1rem;
	
	-webkit-transition: all .5s ;
	-moz-transition: all .5s ;
	-ms-transition: all .5s ;
	-o-transition: all .5s ;
	transition: all .5s;
}

.beachten-link a:hover {
	color: darkmagenta;
	text-decoration: underline;
}

/* #endregion */
/* #region BUTTON NACH OBEN*/

#button {
	display: inline-block;
	background-color: rgba(255, 255, 255, 0.6);
	color: #004780;
	width: 20px;
	height: 20px;
	margin: auto;
	text-align: center;
	position: fixed;
	bottom: 10px;
	right: 20px;
	border-radius: 3px;
	transition: background-color .6s;
	z-index: 100;
	padding-top: 2px;
	text-decoration: none;
	font-size: 3em;
	font-weight: 600;
	line-height: 100%;
  }

.buttoncover {
	position: absolute;
	bottom: 10px;
	right: 15px;
	height: 40px;
	width: 40px;
	background-color: #999;
	box-shadow: 0 4px 2px -2px gray;
	border-top: 1px solid #333;
	border-left: 1px solid #333;
	border-right: 1px solid #333;
	border-radius: 4px;
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	z-index: 300;
}

#button:hover {
	cursor: pointer;
	color: white;
	background-color: rgba(47, 36, 36, 1);
  }

#button:active {
	background-color: #555;
  }

/* #endregion */
/* #region FARBEN*/

.fgs-beige-2025 {
	background-color: #ffd6b1;
}

.fgs-beige-violett-2025 {
	background-color: #f6d3bf;
}

.fgs-violett-beige-2025 {
	background-color: #eacfd2;
}

.fgs-violett-2025 {
	background-color: #dacaeb;
}

.fgs-violett-blau-2025 {
	background-color: #cdcbf7;
}

.fgs-blau-violett-2025 {
	background-color: #bdd2f9;
}

.fgs-blau-2025 {
	background-color: #addbfd;
}

.fgs-blau-gruen-2025 {
	background-color: #a7e1fe;
}

.fgs-gruen-blau-2025 {
	background-color: #afe9f2;
}

.fgs-gruen-2025 {
	background-color: #bef0e2;
}

.fgs-gruen-gruen-2025 {
	background-color: #c8f4d8;
}

.fgs-transparent-2025 {
	background-color: none;
}


.fgs-kornblumenblau-2024 {
	background-color: #ffffff;
}
.fgs-violett-2024 {
	background-color: #bfa9ff;
}
.fgs-rose-2024 {
	background-color: #ff6f61;
}
.fgs-rose-2024-hell {
	background-color: #fcddeb;
}
.fgs-mousse-2024 {
	background-color: #a47764;
}
.fgs-steingrau-2024 {
	background-color: #a79a8f;
}
.fgs-olive-2024 {
	background-color: #96c291;
}
.fgs-olive-2024-hell {
	background-color: #c9f5d6;
}
.fgs-weiss-2024 {
	background-color: #f1f1f1;
}
.fgs-red-2024 {
	background-color: #bb2649;
}


.fgs-green-2025 {
	background-color: #e4efc3;
}
.fgs-brown-2025 {
	background-color: #502117;
}
.fgs-orange-2025 {
	background-color: #fb9940;
}
.fgs-green-2025 {
	background-color: #3e4f4b;
}
.fgs-red-2025 {
	background-color: #e17360;
}


.fontcolor-dark-2024 {
	color: #2b2b2b;
}

.div07__flexbox a {
	color: #2b2b2b;
	font-size: 2em;
	font-weight: 500;
	text-shadow: none;
}




.fgs-purple-2022 {
	background-color: #6868ae;
}

.fgs-beige-2022 {
	background-color: #fade8f;
}

.fgs-rosa-2022 {
	background-color: #eb758e;
}

.fgs-lightpurple-2022 {
	background-color: #cab1ce;
}

.fgs-pfirsich-2022 {
	background-color: #fbbe4f;
}

.fgs-red-2022 {
	background-color: #cd3525;
}

.fgs-green-2022 {
	background-color: #056671;
}

.fgs-lightgreen-2022 {
	background-color: #72beb3;
}

.fgs-lightblue-2022 {
	background-color: #b7deec;
}

.fgs-brown-2022 {
	background-color: #866b58;
}

.fgs-olive-2022 {
	background-color: #b9bb29;
}

.fgs-blue-2022 {
	background-color: #172a45;
}



.fg-newblue {
	background-color: #003366;
}
.fg-newblue-btn {
	background-color: #003366;
	background: rgba(0, 51, 102, 0.9);
}
.fg-newred {
	background-image: linear-gradient(to bottom, #8c0099, #6f2398, #522f92, #373488, #1d357b, #0d3e7f, #004780, #004f81, #006594, #007ba6, #1991b5, #32a8c4);
}

.fg-purple2022 {
	background-color: #644882;
}

.fg-red2022 {
	background-color: #FF003C;
}

.fg-orange2022 {
	background-color: #ef7d00;
}

.fg-lightgreen2022 {
	background-color: #1EE747;
}

.fg-yellow2022 {
	background-color: #fbb900;
}

.fgs-brown-2024 {
	background-color: #f36f61;
}

.fg-darkred2022 {
	background-color: #bf1a49;
}

.fg-magenta2022 {
	background-color: #F71C83;
}

.fg-green2022 {
	background-color: #00C176;
}

.fg-lightblue2022 {
	background-color: #32A8C4;
}

.fg-deepblue202 {
	background-color: #34548b;
}

.fg-newred-btn {
	background: rgba(215, 36, 109, 0.9);
}

.fg-newbluegreen {
	background-color: #00927f;
}

.fg-newbluegreen-btn {
	background-color: #00927f;
	background: rgba(0, 146, 127, 0.9);
}

.fg-newwhite {
	background-color: #fcfcfa;
}
.fg-newgreen {
	background-color: #add84d;
}
.fg-newgreen-btn {
	background-color: #add84d;
	background: rgba(173, 216, 77, 0.9);
}



.fg-red {
	background-color: #e25346;
}
.fg-lightred {
	background-color: #d24841;
}
.fg-lightred-btn {
	background-color: #d24841;
	background: rgba(210, 72, 65, 0.9);
}
.fg-deepred {
	background-color: #b9352f;
}
.fg-modernred {
	background-color: #CC3333;
}


.fg-orange {
	background-color: #FF8A00;
}
.fg-lightorange {
	background-color: #f5a031;
}
.fg-deeporange {
	background-color: #f17933;
}

.fg-purple {
	background-color: #9e74c0;
}
.fg-lightpurple {
	background-color: #9466b9;
}
.fg-lightpurple-btn {
	background-color: #9466b9;
}
.fg-deeppurple {
	background-color: #563982;
}


.fg-blue {
	background-color: #638bb7;
}
.fg-lightblue { 
	background-color: #61b4d6;
}

.fg-lightblue-btn { 
	background-color: #61b4d6;
	background: rgba(97, 180, 214, 0.9);
}

.fg-deepblue {
	background-color: #2b82ca;
}


.fg-greyblue {
	background-color: #586484;
}

.fg-green {
	background-color: #023f2c;
}
.fg-lightgreen {
	background-color: #61be6e;
}
.fg-lightlightgreen {
	background-color: #ecf7ed;
}
.fg-deepgreen {
	background-color: #4ea960;
}



.fg-yellow {
	background-color: #f4a738;
}
.fg-lightyellow {
	background-color: #f7da64;
}
.fg-deepyellow {
	background-color: #f9c632;
}
.fg-newyellow {
	background-color: #f9c632;
}
.fg-newyellow-btn {
	background-color: #f9c632;
	background: rgba(249, 198, 50, 0.9);
}


.fg-white {
	background-color: #fff;
}



.fg-grey {
	background-color: #d2d6d9;
}



.div01__btn--gradient-purple {
	background: linear-gradient(to bottom, #9466b9, #553981);
}

.fg-white {
	background: linear-gradient(to bottom, #f9c632, #f5a031);
}

.div01__btn--gradient-red {
	background: linear-gradient(to bottom, #e14938, #b9352f);
}

.div01__btn--gradient-blue {
	background: linear-gradient(to bottom, #3287ab, #266e8c);
}

.div01__btn---gradient-deepblue {
	background: linear-gradient(to bottom, #475577, #28324e);
}

.div01__btn--gradient-lightblue { 
	background: linear-gradient(to bottom, #54add3, #3d8fb9);
}

.div01__btn--gradient-green {
	background: linear-gradient(to bottom, #72be60, #51a34b);
}

.div01__btn--gradient-white {
	background: linear-gradient(to bottom, #ffffff, #f0f0f0);
}

.div01__btn--gradient-lightpurple {
	background: linear-gradient(to bottom, #dcb2e8, #8d6cd1);
}

.div01__btn--gradient-whiteblue {
	background: linear-gradient(to bottom, #fff, #54acd3);
}

.div01__btn--gradient-yellow {
	background: linear-gradient(to bottom, #f7da64, #f8c632);
}

.div05__bg-green {
	background: linear-gradient(to bottom, #B3CC57, #A8BF52);
}

.div05__bg-orange {
	background: linear-gradient(to bottom, #FFBE40, #F7A541);
}

.div05__bg-orangered {
	background: linear-gradient(to bottom, #F7803C, #F07241);
}

.div05__bg-rainbow {
	background: linear-gradient(to bottom, #CC0000, #ff5e33, #CC0000);
}

.div05__bg-purple {
	background: linear-gradient(to bottom, #cc0099, #b60189);
}

.div05__bg-blue {
	background: linear-gradient(to bottom, #3299BB, #3299BB);
}

.div05__bg-teal {
	background: linear-gradient(to bottom, #33cc99, #33cc99);
}

.div05__bg-lightpurple {
	background: linear-gradient(to bottom, #FF6666, #FF3333);
}

.div05__bg-darkteal {
	background: linear-gradient(to bottom, #558c7f, #426C62);
}

.div__blue-green-yellow {
	background: #2A7B9B;
	background: linear-gradient(90deg,rgba(42, 123, 155, 1) 0%, rgba(87, 199, 133, 1) 50%, rgba(237, 221, 83, 1) 100%);
}



/* #endregion */
/* #region DIV01*/

nav {
	height: 36px;
	position: fixed;
	top: 90px;
	width: 100%;
	max-width: 1600px;
	margin: auto;
	text-align: center;
	box-shadow:0 0 10px rgba(0, 51, 102, 0.9);
	transition: transform .9s .01s ease-in-out;
	z-index: 500;
 }
 
 .down nav {
	transform: translate3d(0, -90px, 0);
 }

 .shownavtop {
	position: fixed;
	top: 0;
 }

.div01_nav {
	margin: auto;
	padding-top: 1px;
	width: 100%;

	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-justify-content: space-around;
	-moz-justify-content: space-around;
	-ms-justify-content: space-around;
	-o-justify-content: space-around;
	justify-content: space-around;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
	-o-align-items: center;
	align-items: center;
}

.div01_nav .current-page {
	background-color: white;
	border-bottom: 3px inset #555;
}

.div01__btn { 
	height: 100%;
	width: auto;
	padding: 10px;
	text-decoration: none;
	color: #312016;
	font-size: 2.2em;
	font-weight: 400;
	letter-spacing: 0.05em;
	font-family: 'Poiret One', normal;
	
	-webkit-transition: all .5s ;
	-moz-transition: all .5s ;
	-ms-transition: all .5s ;
	-o-transition: all .5s ;
	transition: all .5s;
}

.div01__btn a:hover { 
	text-decoration: underline;
}


.div01__hint {
	width: 28px;
	height: 30px;
	border: 2px solid #999;
	border-bottom: 0;
	margin: 0 auto;
	margin-top: 10px;
	font-size: 2em;
	color: #999;
	text-align: center;
}

.div01__hintbox {
	height: 40px;
	margin-top: 10px;
}

.div01__scrollbox {
	position: relative;
	top: -15px;
	height: 25px;
	width: 20px;
	margin: 0 auto;
	
	-webkit-transition: all 1s;
	-moz-transition:  all 1s;
	-ms-transition:  all 1s;
	-o-transition:  all 1s;
	transition: all 1s;
}

.div01__hint a:after {
	content: " ";
	display: block;
}

.div01__hint a {
	color: #999;
	text-decoration: none;
}

.div01__hint a:hover .div01--translateY {
	-webkit-transform: translatey(20px);
	-moz-transform: translatey(20px);
	-ms-transform: translatey(20px);
	-o-transform: translatey(20px);
	transform: translatey(20px);
}

/* #endregion */
/* #region CORONA*/

.corona-flexcontainer {
	width: 100%;
	height: auto;
	margin: 0 auto;
	background-color: #fcfcfa;
	padding: 30px 10px 30px 10px;
	color: #333;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
	
	-webkit-align-items: flex-start;
	-moz--align-items: flex-start;
	-ms-align-items: flex-start;
	-o-align-items: flex-start;
	align-items: flex-start;
}

.corona-flexcontainer-one {
	width: 300px;
	height: auto;
	background-color: white;
	margin: 12px;
	text-align: center;
	padding: 10px;
	border: 1px solid #d7246d;
	
	-webkit-transition: all 2s ease-out;
	-moz-transition: all 2s ease-out;
	-ms-transition: all 2s ease-out;
	-o-transition: all 2s ease-out;
	transition: all 2s ease-out;
}

.corona-flexcontainer-one a {
	color: white;
	text-decoration: none;
}

.corona-flexcontainer-one a:hover {
	color: yellow;
	text-decoration: underline;
}

.corona-flexcontainer-one img {
	width: 150px;
	height: auto;
	padding: 3px;
	background-color: white;
	margin: 10px auto;
}

.corona-flexcontainer-one-title {
	font-size: 16px; 
	letter-spacing: normal;
	text-align: left;
}

.corona-flexcontainer-one-grow2 {
	-webkit-flex-grow: 2;
	-moz-flex-grow: 2;
	-ms-flex-grow: 2;
	-o-flex-grow: 2;
	flex-grow: 2;
	
	max-width: 600px;
}

/* #endregion */
/* #region BAUSTELLE*/

.baustelle-flexcontainer {
	width: 100%;
	height: auto;
	margin: 0 auto;
	margin-bottom: 90px;
	background-color: #fff;
	padding: 30px 10px 30px 10px;
	color: #333;
	background-image: url('../img/projekte/baustellentagebuch_2020/bild_112');
	background-position: center;
	background-size: cover;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
	
	-webkit-align-items: flex-start;
	-moz--align-items: flex-start;
	-ms-align-items: flex-start;
	-o-align-items: flex-start;
	align-items: flex-start;
}

.baustelle-flexcontainer-one {

	width: 48%;
	min-width: 300px;
	height: auto;
	margin: 12px;
	margin-bottom: 0;
	text-align: justify;
	padding: 10px;
	background-color: #fff;
	-webkit-transition: all 2s ease-out;
	-moz-transition: all 2s ease-out;
	-ms-transition: all 2s ease-out;
	-o-transition: all 2s ease-out;
	transition: all 2s ease-out;
}

.baustelle-flexcontainer-one a {
	color: #cc6600;
	text-decoration: none;
}

.baustelle-flexcontainer-one img {
	width: 100%;
	height: auto;
	padding: 3px;
	padding: 6px;
	margin: 10px auto;
}

.baustelle-flexcontainer-one-title {
	font-size: 1.2em; 
	line-height: 160%;
	letter-spacing: normal;
	color: #555;
}

.baustelle-flexcontainer-one-text {
	 margin: 10px 0 10px 0; 
	 color: #555;
}


.baustelle-flexcontainer-one-grow2 {
	-webkit-flex-grow: 2;
	-moz-flex-grow: 2;
	-ms-flex-grow: 2;
	-o-flex-grow: 2;
	flex-grow: 2;
	
	max-width: 600px;
}

.baustelle-flexcontainer-btn {
	width: 220px;
	height: 40px;
	padding: 10px;
	box-shadow: 8px 8px 15px #3c241a;
	margin: auto;
	text-align: center;
	-webkit-transition: all 2s ease-out;
	-moz-transition: all 2s ease-out;
	-ms-transition: all 2s ease-out;
	-o-transition: all 2s ease-out;
	transition: all 2s ease-out;
}

.baustelle-flexcontainer-btn a{
	color: #fff;
	padding: 20px;
	font-size: 1em;
}

.baustelle-flexcontainer-btn a:hover {
	box-shadow: 0px 3px 5px #fff;
}


/* #endregion */
/* #region DIV02*/

.div02 {
  width: 100%;
  margin: 0 auto;
  padding: 50px;
}

.div02__h3 {
	font-size: 2.8em;
	font-style: italic;
	margin: 20px 0 30px 0;
	text-align: center;
	line-height: 160%;
}

.div02__container {
	max-width: 1800px;
	margin: auto;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}

.div02__figure {
	max-width: 300px;
}

.div02__img {
	width: 100%;
	height: auto;
}

.div02__article {
	width: 60%;
	font-size: 1.4em;
	line-height: 160%;
	text-align: justify;
	margin: 0 20px 0 20px;
}

.div02__p {
	margin-bottom: 2em;
}

.div02__nav {
	text-align: center;
	height: 85px;
	width: 85px;
	margin: 0 auto;
	margin-top: 50px;
}

#squarebutton a {
	height: 80px;
	width: 80px;
	padding-top: 30px;
	font-size: 150%;
	background: linear-gradient(to bottom, #f7da64, #f8c632);
	box-shadow: 0px 1px 2px #444;
	float: left;
	margin: 0 auto;
	color: #fff;
	text-decoration: none;
	
	-webkit-transition: all 2s ease-out;
	-moz-transition: all 2s ease-out;
	-ms-transition: all 2s ease-out;
	-o-transition: all 2s ease-out;
	transition: all 2s ease-out;
}

div.div02__nav:hover .div_02__btn-rotate {
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
}

/* #endregion */
/* #region DIV03*/

.div03 {
	min-height: 400px;
	width: inherit;
	background: #f0f0f0 url(../img/start/bewegtes_klassenzimmer_01.jpg) no-repeat;
	background-size: 100% auto;
}

.div03__container1 {
	position: relative;
	top: 300px;
	left: 40px;
	height: 60px;
	width: 520px;
	color: #fff;
	padding: 20px;
	background: rgba(248, 198, 50, 0.8);
	font-size: 3em;
	letter-spacing: normal;
}


/* #endregion */
/* #region DIV04*/

.div04 {
	width: 100%;
	min-height: 400px;
	background-color: #fff;
}

.div04__h3 {
	font-size: 2.8em;
	font-style: italic;
	margin: 0 auto;
	text-align: center;
	line-height: 120%;
	color: #fff;
	padding: 20px;
	text-align: center;
}

.div04__h5 {
	padding-bottom: 40px; 
	font-size: 1.6em; 
	color: #fff; 
	margin-bottom: 0;
	padding: 10px;
	text-align: center;
}

.div04__container {
		max-width: 1800px;
		min-height: 300px;
}

.div04__grid-group {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;   
		
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}

.div04__contentbox {
	width: 100%;
	box-shadow: 3px 3px 7px #444;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	-ms-align-items: flex-start;
	-o-align-items: flex-start;
	align-items: flex-start;
	
}

.div04__content {
	width: 300px;
	min-height: 300px;
	margin: 10px;
	margin-top: 30px;
	margin-right: 30px;
	padding: 10px;
	border: 2px solid #fff;
	background-color: #ceb9df;
	box-shadow: 0px 3px 5px #000;
}

.viewbox-box {
	width: 500px;
	height: 500px;
	background-color: blue;
}

.div04__content-font {
	font-size: 1.4em;
	line-height: 140%;
	font-weight: 300;
}

.div04_p {
	text-align: justify;
	margin: 10px 0 10px 0;
}


.div04__navi {
	min-width: 550px;
	min-height: 550px;
}

.div04__navi-square {
	width: 154px;
	height: 154px;
	margin: 5px;
	padding: 45px 5px 20px 5px;
	text-align: center;
}

.div04--a {
	font-size: 1.6em;
	text-decoration: none;
	margin: 3px;
	color: #fff;
	font-weight: 400;
	letter-spacing: normal;
	line-height: 180%;
}

#foerderSvg {
	background-color: #9466b9;
	width: 700px;
	height: 505px;
}

.div04__svg--form rect {
	stroke: #fff;
	stroke-width: 2px;
	stroke-linecap: butt;
	
	-webkit-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}

.div04__svg--text {
	text-anchor: middle; 
	font-size: 1.8em;
	font-variant: small-caps;	
	font-weight: 400;
	letter-spacing: normal;
	
	-webkit-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}

#foerderschienen { 
  fill: #eee;
  font-weight: 300;
  letter-spacing: normal;
}

#foerderschienen:hover { 
  fill: #fff;
  font-weight: 600;
  letter-spacing: normal;
}

.div04__svg--form polyline {
	stroke: #fff;
	stroke-width: 2px;
	stroke-linecap: butt;
}

.fg-red {
	background-color: #e25346;
}
.fg-lightred {
	background-color: #d24841;
}
.fg-deepred {
	background-color: #b9352f;
}

.fg-orange {
	background-color: #f1843c;
}
.fg-lightorange {
	background-color: #f5a031;
}
.fg-deeporange {
	background-color: #f17933;
}

.fg-purple {
	background-color: #9e74c0;
}
.fg-lightpurple {
	background-color: #9466b9;
}
.fg-deeppurple {
	background-color: #563982;
}

.fg-blue {
	background-color: #638bb7;
}
.fg-lightblue { 
	background-color: #61b4d6;
}
.fg-deepblue {
	background-color: #2b82ca;
}

.fg-greyblue {
	background-color: #586484;
}

.fg-green {
	background-color: #6ac37c;
}
.fg-lightgreen {
	background-color: #61be6e;
}
.fg-deepgreen {
	background-color: #4ea960;
}

.fg-yellow {
	background-color: #f4a738;
}
.fg-lightyellow {
	background-color: #f7da64;
}
.fg-deepyellow {
	background-color: #f9c632;
}

.fg-white {
	background-color: #fff;
}

.fg-grey {
	background-color: #d2d6d9;
}



.div04--a-blue {
	background: rgba(83, 127, 176, 0.9);
	transition: background-color 0.4s;
}

.div04--a-red {
	background: rgba(225, 73, 56, 0.9);
	transition: background-color 0.4s;
}

.div04--a-green {
	background: rgba(97, 190, 110, 0.9);
	transition: background-color 0.4s;
}

.div04--a-orange {
	background: rgba(241, 121, 51, 0.9);
	transition: background-color 0.3s;
}

.div04--a-purple {
	background: rgba(148, 102, 185, 0.9);
	transition: background-color 0.4s;
}

.div04--a-deepblue {
	background: rgba(71, 85, 120, 0.9);
	transition: background-color 0.4s;
}

.div04--a-lightred {
	background: rgba(245, 160, 49, 0.9);
	transition: background-color 0.4s;
}

.div04--a-darkgreen {
	background: rgba(78, 169, 96, 0.9);
	transition: background-color 0.4s;
}

.div04--a-lightblue {
	background: rgba(84, 173, 211, 0.9);
	transition: background-color 0.4s;
}

.div04--a-lightblue {
	background: rgba(84, 173, 211, 1);
	color: #fff;
}


.div04--a:hover {
	margin: 0;
	border: 3px solid #fff;
	background: rgba(255, 255, 255, 0.9);
	color: #336699;
}

.div04__white {
background: rgba(255, 255, 255, 0.9);
color: #336699;
}

.div04__silver {
	color: #c7001d;
}

/* #endregion */
/* #region DIV05*/

.div05 {
	min-height: 400px;
	width: 100%;
	margin: auto;
	padding: 30px;
	text-align: center;	
	box-shadow: 0px 6px 10px #333;
}

.div05__h4 {
	font-size: 1.6em;
	font-weight: 500;
	letter-spacing: 0.05;
	margin: 10px 0 10px 0;
	text-align: center;
	color: black;
}

.div05__gallery {
	max-width: 1800px;
	margin: auto;
}

.div05__flex-container {
	margin-bottom: 40px;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.div05__flex-item {
		min-height: 200px;
		width: 90%;	
		max-width: 400px;
		min-width: 280px;
		margin: 0 auto;
		margin-bottom: 30px;
		background-color: white;
		overflow: hidden;
		border: 0;
		box-shadow: 0px 3px 6px #424140;
		
		-webkit-transition: box-shadow .3s;
		-moz-transition: box-shadow .3s;
		-ms-transition: box-shadow .3s;
		-o-transition: box-shadow .3s;
		transition: box-shadow .3s;
}

.hide {
	display: none;
}

.div05__flex-item:hover {
		box-shadow: 0px 0px 0px #999;
}

.div05__img {
		width: 100%;
		padding: 0;
		height: auto;
		overflow: hidden;
}

.div05__img--width {
		width: 100%;
		height: auto;
}

.div05__caption {
	width: 200px;
	height: auto;
	margin: auto;
	font-size: 1.2em;
	line-height: 160%;
}

/* #endregion */
/* #region DIV06*/

.div06 {
  width: 100%;
  height: 70px;
  overflow: hidden;
}

.div06__action-event {
	height: 60px; 
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	text-align: left;
	padding-top: 20px;
}

.div06__btn {
	font-size: 3em;
	color: #2a6ab1;
	text-decoration: none;
	position: relative;
}

.div06--top {
	top: 0px;
	left: 320px;
	visibility: visible;
}

.div06--bottom {
	top: 80px;
	left: -80px;
	visibility: hidden;
}

.div06__btn:hover .div06--top {
	top: 80px;
	visibility: hidden;
}

.div06__btn:hover .div06--bottom {
	top: 0;
	visibility: visible;
}

.div06--content {
	position: relative;
	
	-webkit-transition: top 1.3s ease-out 0.3s;
	-moz-transition: top 1.3s ease-out 0.3s;
	-ms-transition: top 1.3s ease-out 0.3s;
	-o-transition: top 1.3s ease-out 0.3s;
	transition: top 1.3s ease-out 0.3s;
}

/* #endregion */
/* #region DIV07*/

#test {
	-webkit-transition: all 2s;
	-moz-transition: all 2s;
	-ms-transition: all 2s;
	-o-transition: all 2s;
	transition: all 2s;
}

.div07 {
	width: 100%;
	min-height: 600px; 
	text-align: center;
	margin-top: 0;
	background: #72beb3 url('../img/start/wirwiese_4.webp') no-repeat top center;
	background-size: cover;
}

.div07__h2 {
	font-family: 'Indie Flower', cursive;
	height: 50px;
	padding-top: 20px;
	font-size: 5em;
	font-weight: 600;
	line-height: 100%;
	margin: 0 auto;
	text-align: center;
	color: #fff;
}

.topscrollerbox {
	position: absolute;
	top: 10px;
	right: 20px;
	width: 30px;
	height: 30px;
	border: 2px solid silver;
	border-bottom: 0;
}

.topscroller {
	position: relative;
	top: -18px;
	width: 20px;
	margin: auto;
	height: 20px;
	color: white;
	text-decoration: none;
	font-weight: 400;
}

@-webkit-keyframes topscroll {
	0% {-webkit-transform: translateY(-1px);}
	100% {-webkit-transform: translateY(-8px);}
}

@keyframes topscroll {
	0% {transform: translateY(-1px);}
	100% {transform: translateY(-8px);}
}

.topscroller:hover {
	-webkit-animation: topscroll 1s ease-in-out 0.3s forwards;
	-moz-animation: topscroll 1s ease-in-out 0.3s forwards;
	-ms-animation: topscroll 1s ease-in-out 0.3s forwards;
	-o-animation: topscroll 1s ease-in-out 0.3s forwards;
	animation: topscroll 1s ease-in-out 0.3s forwards;
}

.toparrow-white {
	padding: 2px;
	text-decoration: none;
	color: silver;
}

.div07__btn--square {
	font-size: 1.8em;
	letter-spacing: 1px;
	padding: 15px;
	font-weight: 400;
	text-decoration: none;
	color: #fff;
	text-shadow: 1px 1px 4px #333;
}

.div07_containerbox {
 max-width: 600px;
	min-height: 600px;
	margin: auto;
	padding-top: 20px;
	font-family: 'Indie Flower', cursive;
	font-weight: 600;
	font-size: 1em;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-align-items: center;
	align-items: center;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
} 

.div07__flexbox {
	text-align: center;
	margin: 15px 5px 15px 5px;
}

.div07__container-h {
	width: 140px;
	height: 90px;
	padding-top: 35px;
	color: white;
	border-radius: 6px;
	box-shadow: 1px 2px 6px #003366;
	}

	.div07__container-h:hover {
		box-shadow: 1px 1px 1px #003366;
		}

.div07__container-w {
	width: 160px;
	height: 70px;
	padding-top: 25px;
	color: white;
	border-radius: 6px;
	box-shadow: 1px 2px 6px #003366;
	}

	.div07__container-w:hover {
		box-shadow: 1px 1px 1px #003366;
		}

.div07__container-m {
		width: 150px;
		height: 80px;
		padding-top: 30px;
		color: white;
		border-radius: 6px;
		box-shadow: 1px 2px 6px #003366;
		}

		.div07__container-m:hover {
			box-shadow: 1px 1px 1px #003366;
			}


@-webkit-keyframes slide-down {
from {
	-webkit-transform: translateY(2px);
	transform: translateY(2px);
	}
to {
	-webkit-transform: translateY(8px);
	transform: translateY(8px);
	}	
}

@keyframes slide-down {
from {
	-webkit-transform: translateY(2px);
	transform: translateY(2px); 
	}
to {
	-webkit-transform: translateY(8px);
	transform: translateY(8px); 
	}	
}


@-webkit-keyframes slide-right {
	from {
		-webkit-transform: translateX(2px);
		transform: translateX(2px);
		}
	to {
		-webkit-transform: translateX(8px);
		transform: translateX(8px);
		}	
	}
	
	@keyframes slide-right {
	from {
		-webkit-transform: translateX(2px);
		transform: translateX(2px); 
		}
	to {
		-webkit-transform: translateX(8px);
		transform: translateX(8px); 
		}	
	}

.div07__container--transition {
	position: relative;
	top: 10px;
}

.active0 {
	-webkit-animation: /*fade-in 1s ease-in-out 0.25s forwards, */ slide-down 1.2s ease-in-out 1s infinite alternate;
	-moz-animation: slide-down 1.2s ease-in-out 1s infinite alternate;
	-ms-animation: slide-down 1.2s ease-in-out 1s infinite alternate;
	-o-animation: slide-down 1.2s ease-in-out 1s infinite alternate;
	animation: /*fade-in 1s ease-in-out 0.25s forwards, */ slide-down 1.2s ease-in-out 1s infinite alternate;
}

.active1 {
	-webkit-animation: slide-right 2.5s ease-in-out 1.2s infinite alternate;
	-moz-animation: slide-right 2.5s ease-in-out 1.2s infinite alternate;
	-ms-animation: slide-right 2.5s ease-in-out 1.2s infinite alternate;
	-o-animation: slide-right 2.5s ease-in-out 1.2s infinite alternate;
	animation: slide-right 2.5s ease-in-out 1.2s infinite alternate;
}

.active2 {
	-webkit-animation: slide-down 3.2s ease-in-out 1.4s infinite alternate;
	-moz-animation: slide-down 3.2s ease-in-out 1.4s infinite alternate;
	-ms-animation: slide-down 3.2s ease-in-out 1.4s infinite alternate;
	-o-animation: slide-down 3.2s ease-in-out 1.4s infinite alternate;
	animation: slide-down 3.2s ease-in-out 1.4s infinite alternate;
}
.active3 {
	-webkit-animation: slide-right 1.8s ease-in-out 1.6s infinite alternate;
	-moz-animation: slide-right 1.8s ease-in-out 1.6s infinite alternate;
	-ms-animation: slide-right 1.8s ease-in-out 1.6s infinite alternate;
	-o-animation: slide-right 1.8s ease-in-out 1.6s infinite alternate;
	animation: slide-right 1.8s ease-in-out 1.6s infinite alternate;
}
.active4 {
	-webkit-animation: slide-down 1s ease-in-out 1.8s infinite alternate;
	-moz-animation: slide-down 1s ease-in-out 1.8s infinite alternate;
	-ms-animation: slide-down 1s ease-in-out 1.8s infinite alternate;
	-o-animation: slide-down 1s ease-in-out 1.8s infinite alternate;
	animation: slide-down 1s ease-in-out 1.8s infinite alternate;
}
.active5 {
	-webkit-animation: slide-down 3.5s ease-in-out 2s infinite alternate;
	-moz-animation: slide-down 3.5s ease-in-out 2s infinite alternate;
	-ms-animation: slide-down 3.5s ease-in-out 2s infinite alternate;
	-o-animation: slide-down 3.5s ease-in-out 2s infinite alternate;
	animation: slide-down 3.5s ease-in-out 2s infinite alternate;
}
.active6 {
	-webkit-animation: slide-down 2.2s ease-in-out 2.2s infinite alternate;
	-moz-animation: slide-down 2.2s ease-in-out 2.2s infinite alternate;
	-ms-animation: slide-down 2.2s ease-in-out 2.2s infinite alternate;
	-o-animation: slide-down 2.2s ease-in-out 2.2s infinite alternate;
	animation: slide-down 2.2s ease-in-out 2.2s infinite alternate;
}
.active7 {
	-webkit-animation: slide-down 1.3s ease-in-out 2.4s infinite alternate;
	-moz-animation: slide-down 1.3s ease-in-out 2.4s infinite alternate;
	-ms-animation: slide-down 1.3s ease-in-out 2.4s infinite alternate;
	-o-animation: slide-down 1.3s ease-in-out 2.4s infinite alternate;
	animation: slide-down 1.3s ease-in-out 2.4s infinite alternate;
}
.active8 {
	-webkit-animation: slide-down 2s ease-in-out 2.6s infinite alternate;
	-moz-animation: slide-down 2s ease-in-out 2.6s infinite alternate;
	-ms-animation: slide-down 2s ease-in-out 2.6s infinite alternate;
	-o-animation: slide-down 2s ease-in-out 2.6s infinite alternate;
	animation: slide-down 2s ease-in-out 2.6s infinite alternate;
}

/* #endregion */
/* #region DIV12*/

.div12 {
	position: relative;
	min-height: 400px;
	width: 100%;
	text-align: center;	
}

.div12__h2 {
	height: auto;
	padding-bottom:10px;
	padding-top: 30px;
	font-weight: 600;
	font-size: 3vw;
	line-height: 100%;
	margin: 0 auto;
	text-align: center;
	color: #312016;
	font-size: 3vw;
	letter-spacing: 0.05em;
	font-family: 'Poiret One', normal;
}

.div12__h2-download {
	height: auto;
	padding-bottom:10px;
	padding-top: 30px;
	font-weight: 600;
	font-size: 2vw;
	line-height: 100%;
	margin: 0 auto;
	text-align: center;
	color: #312016;
	font-size: 3vw;
	letter-spacing: 0.05em;
	font-family: 'Poiret One', normal;
}

.div12__gallery {
	margin: auto;
	padding: 30px 10px 30px 10px;
}

.div12__flex-container {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;

	-webkit-align-items: stretch;
	-moz-align-items: stretch;
	-ms-align-items: stretch;
	-o-align-items: stretch;
	align-items: stretch;


}

.div12__flex-item {
		min-height: 200px;
		width: 300px;
		overflow: hidden;
		border: 0;
		
		
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;   

		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
}

.div12__flex-item-2025 {
		min-height: 200px;
		width: 100%;
		overflow: hidden;
		border: 0;
		
		
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;   

		-webkit-flex-direction: row;
		-moz-flex-direction: row;
		-ms-flex-direction: row;
		-o-flex-direction: row;
		flex-direction: row;
		
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
}

.div12-newsboxen {
	max-width: 50%; 
	padding: 50px;
}


.div12__flex-item-beachten {
		min-height: 130px;
		padding-top:50px;
		width: 240px;
		overflow: hidden;
		border: 0;
		
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;   

		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
}



.div12__flex-item-info {
		padding-top:20px;
		width: 90%;
		margin: auto;
		overflow: hidden;
		border: 0;
		display: flex;   
		flex-direction: column;
		flex-wrap: wrap;
}

.div12__flex-item-info ul {
		padding: 10px; 
		list-style: disc; 
		text-align: left
}

.div12__flex-item-info li {
		margin-bottom: 2px; 
		line-height: 140%; 
		color: white; 
		padding: 3px 4px 3px 4px;
		font-size: 1rem; 
		font-weight: 600;
}


.div12__flex-item-badge {
		min-height: 160px;
		border-radius: 50%;
		width: 260px;	
		overflow: hidden;
		border: 0;
		padding-top: 40px;
		font-size: 1.8em;
		line-height: 160%;
		text-align: center;
		text-decoration: none;
		color: white;
		
		display: flex;   

		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	
	-webkit-transition: all 0.6s;
	transition: all 0.6s;
}


.div12__h4 {
	width: 100%;
	font-size: 2.2em; font-family: 'Roboto'; 
	letter-spacing: 0.1em;
	font-weight: 600;
	min-height: 30px;
	margin-bottom: 0;
	margin-top: 5px;
	line-height: 130%;
	padding: 12px;
	text-align: left;
	color: #281d18;
}

.div12__h5 {
	height: auto;
	font-family: 'Open Sans'; 
	font-variant: small-caps;
	font-size: 1.8em;
	letter-spacing: 0.05em;
	line-height: 100%;
	color: #999;
	margin-top: 10px;
	text-align: left;
	padding-left: 12px;
}

.div12__img {
	height: 200px;
	width: auto;
	overflow: hidden;
	
	/*-webkit-flex-shrink: 1;
	-moz-flex-shrink: 1;
	-ms-flex-shrink: 1;
	-o-flex-shrink: 1;
	flex-shrink: 1;*/
}

.heart {
	width: 100%;
	height: 220px;
	background-color: red;
	text-align: center;
	padding-top: 80pt;
	color: blue;
	font-size: 120pt;
}

.div12__link-beachten {
	position: relative; 
	width: 98%; 
	max-width: 600px;  
	background-color: rgba(43, 39, 64, 0.6);
	border-radius: 10%; 
	box-shadow: 3px 3px 10px rgba(55, 15, 99, 0.5);
}

.div12__link-beachten a:link {
	font-size: 1rem; 
	letter-spacing: 0.1rem;
	font-weight: 600; 
	text-decoration: none;
	transition: all ease-out 0.5s;
	color: white;
	line-height: 160%;
}

.div12__link-beachten a:hover {
	text-decoration: underline;
	color: lightblue;
}

.div12__link-beachten a:visited {
	color: #efefef;
} 

.div12__link {
	text-decoration: none;
	margin: 20px;
	backdrop-filter: blur(5px);
	background-color: rgba(255, 255, 255, 1);
	/* border-radius: 26px; */
	/* box-shadow: 3px 3px 5px 0px rgb(2, 85, 123), inset -2px -2px 6px 0px rgba(26, 174, 248, 0.623), inset 0px 9px 8px 0px rgb(255, 255, 255); */
	
	/* -webkit-transition: all 0.6s;
	transition: all 0.6s; */
}


.div12__link-info {
	width: 98%; 
	max-width: 600px;  
	background-color: rgba(43, 39, 64, 0.6);
	border-radius: 10%; 
	box-shadow: 3px 3px 10px rgba(55, 15, 99, 0.5);
}

.div12__link-info a:link {
	font-size: 1rem; 
	letter-spacing: 0.1rem;
	font-weight: 600; 
	text-decoration: none;
	transition: all ease-out 0.5s;
	color: white;
	line-height: 160%;
	background-color: rgba(0, 0, 0, 0.2);
}

.div12__link-info a:hover {
	text-decoration: underline;
	color: lightblue;
	background-color: rgba(0, 0, 0, 0.6);
}

.div12__link-info a:visited {
	color: #efefef;
} 

.bold700 {
	font-weight: 400;
	background-color: rgba(0, 0, 0, 0.2);
}



.div12__badge {
	text-decoration: underline;
	margin: 20px;
	margin-bottom: 30px;
	padding: 10px;
}


.div12_link_inline {
	color: blue;
	line-height: 160%;
	text-decoration: none;
}

.div12_link_inline:hover {
	color: navy;
	text-decoration: underline;
}

.div12__caption {
	width: 100%;
	height: auto;
	font-size: 1.6em;
	line-height: 160%;
	letter-spacing: 0.05em;
	text-align: left;
	padding: 12px;
	padding-bottom: 0;
	color: #333;	
	margin-bottom: 10px;
	font-weight: 500;
}

.div12__caption a{
	font-style: italic;
	font-family: 'Open Sans';
	font-size: 1em;
	font-weight: 600;
	text-decoration: none;
}

.div12__caption a:hover{
	text-decoration: underline;
	color: blue;
}
		
.fs-news--figure {
	height: auto;
	width: 100%;
	
	display: -webkit-flex; 
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
	-o-align-items: center;
	align-items: center;	

	justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
}

.fs-news--figure-onbox {
	height: 180px;
	width: 240px;
	overflow: hidden;
	margin: 8px;
	text-align: center;
}

.fs-news--figure-onbox:hover {
	box-shadow: 1px 1px 1px #999;
	border: 1px solid #999;
}

.fs-news--figure-onbox-middle {
	height: 120px;
	width: 160px;
	overflow: hidden;
	margin: 8px;
	text-align: center;
}

.fs-news--figure-onbox-large {
	height: 90px;
	width: 120px;
	overflow: hidden;
	margin: 8px;
	text-align: center;
}

.fs-news--figure-onbox-large:hover {
	box-shadow: 1px 1px 1px #999;
	border: 1px solid #999;
}

.fs-news--figure-onbox-alone {
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 8px;
	text-align: center;
}

.fs-news--figure-onbox-alone:hover {
	box-shadow: 1px 1px 1px #999;
	border: 1px solid #999;
}

.fs-news--figure img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: 50%;
	margin: 0;
	text-align: center;
}

		
	/*-webkit-flex-shrink: 1;
	-moz-flex-shrink: 1;
	-ms-flex-shrink: 1;
	-o-flex-shrink: 1;
	flex-shrink: 1;*/


/* #endregion */
/* #region DIV13*/

.div13 {
	min-height: 400px;
	width: 100%;
	margin: 0 auto;
	padding: 30px;
	text-align: left;	
	background-color: #fff;
}

#div13 {
	-webkit-transition: all 2s;
	-moz-transition: all 2s;
	-ms-transition: all 2s;
	-o-transition: all 2s;
	transition: all 2s;
}

.div13__hr {
	width: 40%;
	height: 1px;
	border: 1px solid #fff;
	margin: auto;
	margin-top: 10px;
	margin-bottom: 10px;
}

.div13__h4 {
	font-size: 2.4em;
	line-height: 140%;
	margin: 10px 0 10px 0;
	text-align: center;
	color: #fff;
	font-weight: 700;
}

.div13__gallery {
	max-width: 1400px;
	margin: auto;
}

.div13__containergroup {
	margin: 20px auto;
	margin-bottom: 40px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.div13__flex-item {
	height: auto;
	min-height: 300px;
	width: 24%;
	min-width: 300px;	
	margin: 16px auto;
	overflow: hidden;
	border-radius: 20px;
	background-color: rgba(0, 0, 0, 0.2);
}

@-webkit-keyframes wag {
	0% {-webkit-transform: rotate(-5deg);}
	100% {-webkit-transform: rotate(5deg);}
}

@keyframes wag {
	0% {transform: rotate(-5deg);}
	100% {transform: rotate(5deg);}
}

@-webkit-keyframes wag2 {
	0% {-webkit-transform: scale(1.1);}
	100% {-webkit-transform: scale(1.13);}
}

@keyframes wag2 {
	0% {transform: scale(1.1);}
	100% {transform: scale(1.13);}
}


.div13__badge {
		height: 130px;
		width: 130px;	
		margin: 0 auto;
		padding: 2px;
		margin-bottom: 20px;
		overflow: hidden;
		border-radius: 50%;
}


.div13__badge-new {
		height: 220px;
		width: 120px;	
		margin: -px 10px 10px -30px;
		padding: 10px;
		margin-bottom: 20px;
		overflow: hidden;
		border-bottom-right-radius: 90%;
		float: left;
}

.div13__badge_large {
		height: 260px;
		width: 260px;	
		margin: 0 auto;
		padding: 5px;
		margin-bottom: 20px;
		background-color: white;
		overflow: hidden;
		border-radius: 50%;
}

.div13__badge-fast {
	-webkit-transform-origin: top center;
	-webkit-animation: wag 0.8s 0s infinite ease-in-out alternate;
	-moz-transform-origin: top center;
	-moz-animation: wag 0.8s 0s infinite ease-in-out alternate;
	-ms-transform-origin: top center;
	-ms-animation: wag 0.8s 0s infinite ease-in-out alternate;
	-o-transform-origin: top center;
	-o-animation: wag 0.8s 0s infinite ease-in-out alternate;
	transform-origin: top center;									 
	animation: wag 0.8s 0s infinite ease-in-out alternate;
}

.div13__badge-middlefast {
	-webkit-transform-origin: top center;
	-webkit-animation: wag 0.9s 0s infinite ease-in-out alternate;
	-moz-transform-origin: top center;
	-moz-animation: wag 0.9s 0s infinite ease-in-out alternate;
	-ms-transform-origin: top center;
	-ms-animation: wag 0.9s 0s infinite ease-in-out alternate;
	-o-transform-origin: top center;
	-o-animation: wag 0.9s 0s infinite ease-in-out alternate;
	transform-origin: top center;									 
	animation: wag 0.9s 0s infinite ease-in-out alternate;
}

.div13__badge-slow {
	-webkit-transform-origin: top center;
	-webkit-animation: wag 0.96s 0s infinite ease-in-out alternate;
	-moz-transform-origin: top center;
	-moz-animation: wag 0.96s 0s infinite ease-in-out alternate;
	-ms-transform-origin: top center;
	-ms-animation: wag 0.96s 0s infinite ease-in-out alternate;
	-o-transform-origin: top center;
	-o-animation: wag 0.96s 0s infinite ease-in-out alternate;
	transform-origin: top center;									 
	animation: wag 0.96s 0s infinite ease-in-out alternate;
}

.div13__badge-veryfast {
	-webkit-transform-origin: middle center;
	-webkit-animation: wag2 0.3s 0s infinite ease-in-out alternate;
	-moz-transform-origin: middle center;
	-moz-animation: wag2 0.3s 0s infinite ease-in-out alternate;
	-ms-transform-origin: middle center;
	-ms-animation: wag2 0.3s 0s infinite ease-in-out alternate;
	-o-transform-origin: middle center;
	-o-animation: wag2 0.3s 0s infinite ease-in-out alternate;
	transform-origin: middle center;									 
	animation: wag2 0.3s 0s infinite ease-in-out alternate;
}


.div13__badge-contakt {
	-webkit-transform-origin: bottom center;
	-webkit-animation: wag 0.76s 0s infinite ease-in-out alternate;
	-moz-transform-origin: bottom center;
	-moz-animation: wag 0.76s 0s infinite ease-in-out alternate;
	-ms-transform-origin: bottom center;
	-ms-animation: wag 0.76s 0s infinite ease-in-out alternate;
	-o-transform-origin: bottom center;
	-o-animation: wag 0.76s 0s infinite ease-in-out alternate;
	transform-origin: bottom center;									 
	animation: wag 0.76s 0s infinite ease-in-out alternate;
}


.div13__img {
		width: 290px;
		height: auto;
		overflow: hidden;
}

.div13__img--width {
		width: 300px;
		height: auto;
}

.div13__caption {
	width: 300px;
	height: auto;
	margin: auto;
	margin-bottom: 20px;
	font-size: 1.6em;
	line-height: 160%;
	color: #fff;
	text-align: left;
	padding: 6px;
}

.div13__bg-teestube {
	background: #dbc9bf url('../img/icons/teestube.png') no-repeat center center;
}

.div13__bg-dinoclub {
	background: #de5088 url('../img/icons/dinoclub.png') no-repeat center center;
}

.div13__bg-schwimmkurs {
	background: #3fb6e2 url('../img/icons/schwimmkurs.png') no-repeat center center;
}

.div13__bg-naehen {
	background: #3c8fb9 url('../img/icons/naehen.png') no-repeat center center;
}

.div13__bg-elterncafe {
	background: #553982 url('../img/icons/elterncafe.png') no-repeat center center;
}

.div13__bg-gesundesfruehstueck{
	background: #14583f url('../img/icons/gesundesfruehstuck.png') no-repeat center center;
}

.div13__bg-halloween {
	background: #4ca986 url('../img/icons/halloween.png') no-repeat center center;
}

.div13__bg-waffeltage {
	background: #4ca986 url('../img/icons/waffeltag.png') no-repeat center center;
}

.div13__bg-winterhase {
	background: #000012 url('../img/icons/winterhase.png') no-repeat top center;
}

.div13__bg-yoga {
	background: #000012 url('../img/icons/yoga.png') no-repeat top center;
}

.div13__bg-arabischdeutsch {
	background: #000012 url('../img/icons/arabischesprechstunde.png') no-repeat top center;
}

.div13__bg-stadtwerke {
	border: 6px solid #febf00;
	box-shadow: 3px 3px 6px #000;
}
.div13__bg-center {
	-webkit-align-items: center;
	-moz--align-items: center;
	-ms-align-items: center;
	-o-align-items: center;
	align-items: center;
}

/* #endregion */
/* #region DIV14*/

.div14 {
	min-height: 400px;
	width: 100%;
	margin: 0 auto;
	padding: 30px;
	text-align: center;	
}

.div14__h4 {
	font-size: 1.6em;
	margin: 10px 0 10px 0;
	text-align: center;
	color: black;
}

.div14__h2 {
	font-family: 'Indie Flower', cursive;
	height: 60px;
	padding-top: 15px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 0 30px 0;
	text-align: center;
	color: #2b2b2b;
	font-variant: small-caps;
}


.div14__h2-large {
	font-family: 'Indie Flower', cursive;
	height: 60px;
	padding-top: 15px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 0 30px 0;
	text-align: center;
	color: #2b2b2b;
}

.div14__gallery {
	max-width: 1800px;
	margin: auto;
}

.div14__flex-container {
	margin-bottom: 40px;
	justify-content: space-around;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.div14__flex-item {
		min-height: 200px;
		width: 300px;	
		margin: 0 auto;
		padding: 5px;
		margin-bottom: 20px;
		background-color: white;
		overflow: hidden;
		border: 0;
		border-radius: 6px;
		box-shadow: 0px 1px 2px #000;
		
		-webkit-transition: box-shadow .3s;
		-moz-transition: box-shadow .3s;
		-ms-transition: box-shadow .3s;
		-o-transition: box-shadow .3s;
		transition: box-shadow .3s;
}

.div__flex-item-schulleitung {
		background-image: url('../img/wir2017/2023_schulleitung.png');
		background-position: top;
		background-size: cover;
}

.div14__img {
		height: 180px;
		width: auto;
		overflow: hidden;
		text-align: center;
}

.div14__img--width {
		height: 180px;
		width: auto;
		margin: auto;
		text-align: center;
	}

.div14__flex-item-2 {
		min-height: 200px;
		width: 400px;	
		margin: 0 auto;
		padding: 5px;
		margin-bottom: 20px;
		background-color: white;
		overflow: hidden;
		border: 0;
		border-radius: 6px;
		box-shadow: 0px 1px 2px #000;
		
		-webkit-transition: box-shadow .3s;
		-moz-transition: box-shadow .3s;
		-ms-transition: box-shadow .3s;
		-o-transition: box-shadow .3s;
		transition: box-shadow .3s;
}


.div14__img-2 {
		height: 180px;
		width: auto;
		overflow: hidden;
}

.div14__img--width-2 {
		width: 100%;
		height: auto;
	}



.div14__caption {
	width: 90%;
	height: auto;
	margin: auto;
	font-size: 1.2em;
	line-height: 160%;
}

.div14__caption p {
	margin: 15px;
}

/* #endregion */
/* #region DIV15*/

.div15 {
	min-height: 400px;
	width: 100%;
	margin: 0 auto;
	padding: 30px;
}

.div15__h4 {
	font-size: 1.4em;
	letter-spacing: 0.03em;
	font-weight: 600;
	margin: auto;
	text-align: center;
	line-height: 160%;
	color: #2b2b2b;
}

.div15__h2 {
	font-family: 'Indie Flower', cursive;
	height: 40px;
	padding-top: 15px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 0 30px 0;
	text-align: center;
	color: #fff;
	font-variant: small-caps;
}

.div15__gallery {
	max-width: 1800px;
	margin: auto;
}

.div15__flex-container {
	margin-bottom: 40px;
	justify-content: space-around;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.div15__flex-item {
	width: 100%;
	max-width: 350px;
	margin: 20px;
	background-color: white;
	box-shadow: 2px 2px 3px #333;
	padding: 6px;
	border: 0;
}

.div15__img {
	width: 100%;
	height: auto;
	margin: auto;
	margin-bottom: 20px;
	padding-bottom: 0;
	background-color:#fff;
	
	-webkit-transition: box-shadow .3s;
	-moz-transition: box-shadow .3s;
	-ms-transition: box-shadow .3s;
	-o-transition: box-shadow .3s;
	transition: box-shadow .3s;
}

.div15__img--width {
	width: 100%;
	height: auto;
}


.div15__caption {
	width: 98%;
	height: auto;
	margin: auto;
	font-size: 1.4em;
	letter-spacing: 0.05em;
	color: #2b2b2b;
	font-weight: 500;
	line-height: 160%;
	margin-bottom: 20px;
	margin-top: 0;
}

/* #endregion */
/* #region DIV16*/

.div16 {
	min-height: 400px;
	width: 100%;
	margin: 0 auto;
	padding: 30px;
	text-align: center;	
}

.div16__h4 {
	font-size: 1.6em;
	margin: 10px 0 10px 0;
	text-align: center;
	color: black;
}

.div16__h2 {
	font-family: 'Indie Flower', cursive;
	height: 60px;
	padding-top: 15px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 0 30px 0;
	text-align: center;
	color: white;
	font-variant: small-caps;
}

.div16__gallery {
	max-width: 1800px;
	margin: auto;
}

.div16__flex-container {
	margin-bottom: 40px;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.div16__flex-item {
		min-height: 200px;
		width: 300px;	
		margin: 0 auto;
		padding: 5px;
		margin-bottom: 20px;
		background-color: white;
		overflow: hidden;
		border: 0;
		border-radius: 6px;
		box-shadow: 0px 1px 2px #000;
		
		-webkit-transition: box-shadow .3s;
		-moz-transition: box-shadow .3s;
		-ms-transition: box-shadow .3s;
		-o-transition: box-shadow .3s;
		transition: box-shadow .3s;
}


.div16__flex-item-square {
	min-height: 450px;
	width: 400px;	
	margin: 0 auto;
	padding: 5px;
	margin-bottom: 20px;
	background-color: white;
	border: 0;
	border-radius: 6px;
	box-shadow: 0px 1px 2px #000;
	
	-webkit-transition: box-shadow .3s;
	-moz-transition: box-shadow .3s;
	-ms-transition: box-shadow .3s;
	-o-transition: box-shadow .3s;
	transition: box-shadow .3s;
}

.div16__ul {
	text-align: left;
	margin: 5px;
	margin-top: 20px;
}

.div16__li {
	margin-bottom: 10px;
	margin-left: 20px;
}

.div16__img {
		height: 180px;
		width: auto;
		overflow: hidden;
}

.div16__img--width {
		height: 180px;
		width: auto;}

.div16__caption {
	width: 90%;
	height: auto;
	margin: auto;
	font-size: 1.4em;
	font-weight: 400;
	letter-spacing: 0.03em;
	line-height: 160%;
}

.div16__caption p {
	margin: 15px;
}

/* #endregion */
/* #region DIV17*/

.div17 {
	min-height: 350px;
	width: 100%;
	margin: 0 auto;
	padding: 30px;
	text-align: center;	
}

.div17__h4 {
	font-size: 1.6em;
	margin: 10px 0 10px 0;
	text-align: center;
	color: black;
}

.div17__h2 {
	font-family: 'Indie Flower', cursive;
	height: 60px;
	padding-top: 15px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 0 30px 0;
	text-align: center;
	color: white;
	font-variant: small-caps;
}

.div17__gallery {
	max-width: 1800px;
	margin: auto;
}

.div17__flex-container {
	margin-bottom: 40px;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.div17__flex-item {
		min-height: 200px;
		width: 300px;	
		margin: 0 auto;
		padding: 5px;
		margin-bottom: 20px;
		background-color: white;
		overflow: hidden;
		border: 0;
		border-radius: 6px;
		box-shadow: 0px 1px 2px #000;
		
		-webkit-transition: box-shadow .3s;
		-moz-transition: box-shadow .3s;
		-ms-transition: box-shadow .3s;
		-o-transition: box-shadow .3s;
		transition: box-shadow .3s;
}

.div17__flex-item-doublesquare {
		min-height: 350px;
		width: 800px;	
		margin: 0 auto;
		padding: 5px;
		margin-bottom: 20px;
		background-color: white;
		overflow: hidden;
		border: 0;
		box-shadow: 0px 4px 8px #000;
		
		-webkit-transition: box-shadow .3s;
		-moz-transition: box-shadow .3s;
		-ms-transition: box-shadow .3s;
		-o-transition: box-shadow .3s;
		transition: box-shadow .3s;
}

.div17__img {
		height: 180px;
		width: auto;
		overflow: hidden;
}

.div17__img--width {
		height: 180px;
		width: auto;
}

.div17__ul {
	text-align: left;
	margin: 5px;
	margin-top: 20px;
}

.div17__li {
	margin-bottom: 10px;
	margin-left: 20px;
}

.div17__caption {
	width: 90%;
	height: auto;
	margin: auto;
	font-size: 1.2em;
	line-height: 160%;
}

.div17__caption p {
	margin: 15px;
}

.div17--saeulen {
	width: 100%;
	height: auto;
	background-color: #003399;
	text-align: center;
}

.div17--schaubild {
	width: 80%;
	max-width: 1200px;
	height: auto;
	margin: 10px auto;
}


/* #endregion */
/* #region DIV18*/

.div18 {
	min-height: 400px;
	width: 100%;
	margin: 0 auto;
	padding: 30px;
	text-align: center;	
	background-color: white;
}

.div18__h4 {
	font-size: 1.4em;
	margin: 10px 0 10px 0;
	text-align: center;
	color: black;
}

.div18__h5 {
	font-size: 1.4em;
	margin: 5px 0 5px 0;
	text-align: center;
	color: black;
}

.div18__h2 {
	font-family: 'Indie Flower', cursive;
	height: 60px;
	padding-top: 15px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 0 30px 0;
	text-align: center;
	color: white;
	font-variant: small-caps;
}

.div18__gallery {
	max-width: 1800px;
	margin: auto;
}

.div18__flex-container {
	margin-bottom: 40px;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.div18__flex-item-square {
	min-height: 400px;
	width: 500px;	
	margin: 0 auto;
	padding: 5px;
	margin-bottom: 20px;
	background-color: white;
	border: 0;
	border-radius: 6px;
	box-shadow: 0px 1px 2px #000;
	
	-webkit-transition: box-shadow .3s;
	-moz-transition: box-shadow .3s;
	-ms-transition: box-shadow .3s;
	-o-transition: box-shadow .3s;
	transition: box-shadow .3s;
}

.div18__img {
		height: 180px;
		width: auto;
		overflow: hidden;
}

.div18__img--width {
		height: 180px;
		width: auto;}

.div18__ul {
	text-align: left;
	margin: 5px;
	display: inline;
	list-style: none;
}

.div18__li {
	margin-bottom: 10px;
}

.div18__caption {
	width: 90%;
	height: auto;
	margin: auto;
	font-size: 1.2em;
	line-height: 160%;
}

.div18__caption p {
	text-align: left;
	margin-bottom: 15px;
}


/* #endregion */
/* #region DIV19*/


.div19 {
	position: relative;
	width: 100%;
	min-height: 400px;
	color: #2b2b2b;
	padding-bottom: 30px;
	overflow: hidden;
}

.div19_termmincontainer {
	max-width: 98%; 
	margin: auto; 
	padding: 30px;

	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   

	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}



.div19-hs {
	background-color: #d1caf5;
}

.div19-ts {
	background-color: #afdafc;
}

#div19__scrollcontainer-termine {
	width: 100%;
	margin: auto;
	display: none;
}

#div19__scrollcontainer-datenschutz {
	width: 100%;
	margin: auto;
	display: none;
}

.div19__expand {
	width: 80%;
	margin: 0 auto;
	height: 60px;
	padding-top: 5px;
	text-align: center;
}
 
.div19__fold {
	width: 80%;
	margin: 0 auto;
	height: 40px;
	padding-top: 5px;
	text-align: center;
}
  
.div19__btn-arrow {
	color: navy;
	font-size: 1.4em;
	font-weight: 300;
	text-decoration: none;
	padding: 5px 15px 5px 15px;
}

.div19__btn-arrow:hover {
	color: #b9352f;
}

.div19__h2 {
	font-family: 'Indie Flower', cursive;
	height: 50px;
	padding-top: 10px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 auto;
	text-align: center;
	color: #fff;
}

.div19__flexcontainer {
	width: 45%;
	min-width: 300px;
	height: auto;
	margin: 20px auto;
	padding: 20px; 
	backdrop-filter: blur(5px);
	background-color: rgba(255, 255, 255, 1);
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	-o-justify-content: space-between;
	justify-content: space-between;
	
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	-ms-align-items: flex-start;
	-o-align-items: flex-start;
	align-items: flex-start;
}

.div19__flexcontainer-termine {
	width: 80%;
	min-height: 600px;
	margin: 0 auto;
	padding: 20px; 
	backdrop-filter: blur(5px);
	background-color: rgba(255, 255, 255, 1);
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
	
	-webkit-align-items: flex-start;
	-moz--align-items: flex-start;
	-ms-align-items: flex-start;
	-o-align-items: flex-start;
	align-items: flex-start;
}



.div19__flexcontentbox {
	width: 82%;
	margin: 0 auto;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: nowrap;
	-moz-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	-o-flex-wrap: nowrap;
	flex-wrap: nowrap;
	
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
	
	-webkit-align-items: center;
	-moz--align-items: center;
	-ms-align-items: center;
	-o-align-items: center;
	align-items: center;
}

.div19__flex-item-column {
	position: relative;
	width: 96%;
	height: auto;
	margin: 0 auto;
	border-top: 1px dotted #558c7f;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: nowrap;
	-moz-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	-o-flex-wrap: nowrap;
	flex-wrap: nowrap;
	
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	-ms-justify-content: flex-start;
	-o-justify-content: flex-start;
	justify-content: flex-start;
}

.div19__flex-item-column-schedule {
	position: relative;
	width: 96%;
	height: auto;
	margin: 0 auto;
	border-top: 1px dotted #558c7f;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: nowrap;
	-moz-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	-o-flex-wrap: nowrap;
	flex-wrap: nowrap;
	
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	-ms-justify-content: flex-start;
	-o-justify-content: flex-start;
	justify-content: flex-start;
}

.div19__flex-item-column-schedule {
	position: relative;
	width: 98%;
	height: auto;
	margin: 0 auto;
	border-top: 1px dotted #558c7f;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
	
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	-ms-justify-content: flex-start;
	-o-justify-content: flex-start;
	justify-content: flex-start;
}

.div19__flex-item-column-fgz {
	float: right;
	margin-left: 10px;
	margin-right: 10px;
	right: 0;
	top: 0;
	height: 60px;
	width: 100px;
}


.div19__flex-item-column-border {
	border-bottom: 1px dotted #999;
}

.div19__flex-item-column-legende {
		width: 600px;
		margin: 5px auto;
		text-align: left;
		padding: 5px 0 15px 0;
		min-height: 90px;
		
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		
		-webkit-flex-wrap: wrap; 
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		
		-webkit-flex-direction: row;
		-moz-flex-direction: row;
		-ms-flex-direction: row;
		-o-flex-direction: row;
		flex-direction: row;
		
		-webkit-align-items: center;
		-moz-align-items: center;
		-ms-align-items: center;
		-o-align-items: center;
		align-items: center;
		
		-webkit-justify-content: center;
		-moz-justify-content: center;
		-ms-justify-content: center;
		-o-justify-content: center;
		justify-content: center;
	}

.div19__flex-item-column-legende ul {
	list-style-type: square;
	list-style-position: outside;
	padding-left: 8px;
}

.div19__flex-item-row {
	width: auto;
	height: auto;
	margin: 6px;
}

.div19__flex-item-row-ogs-hs {
	color: #5d3529;
}

.div19__flex-item-row-ogs-ts {
	color: #3d4d4c;
}

.div19__flex-item-row-fgz-hs {
	background-color: #f9d473;
}

.div19__flex-item-row-fgz-ts {
	background-color: #b4dae8;
}


.div19__blank {
	position: relative;
	height: 15px;
}

.div19__h3 {
	font-family: 'Roboto Serif';
	height: 22px;
	font-size: 1.8em;
	letter-spacing: normal;
	margin: 10px auto;
	font-weight: 300;
	color: #333;	
	text-align: center;
	line-height: 140%;
 }
 
 .div19__flex-item-column-explication {
	font-family: 'Open Sans'; 
	font-style: italic;
 	font-size: 1.2em; 
 	color: #555; 
 	text-align: center; 
 	margin-bottom: 10px; 
 	line-height: 160%; 
 	margin: auto;
 }
 
.div19__borderline {
		height: 30px;
		font-size: 2.4em;
		margin: 0;
		border-top: 2px solid #fff;
}

.div19__flex-item-row-point {
	width: 30px;
	height: 20px;
	border: 1px solid #fff;
}

.div19__flex-item-row-point-non {
	background-color: #648cb8;
	width: 30px;
	height: 20px;
}

.div19__flex-item-row-point-hs  {
	background-color: #fff;
}

.div19__flex-item-row-point-ts  {
	background-color: #f9c632;
}

.div19__flex-item-row-legende {
	width: 30%;
	min-height: 40px;
	margin: 0 auto;
	text-align: left;
	line-height: 160%;
	font-size: 1.2em;
	font-weight: 400; 
	color: #333; 
	padding: 6px; 
}


.div19__flex-item-row-hsts {
	width: 20%;
	height: auto;
	margin: 5px;
	padding: 2px;
	padding-left: 20px;
	text-align: left;
	font-size: 1em;
	font-weight: 400;
}

.div19__flex-item-row-date-small {
	width: 80%;
	height: auto;
	margin: 5px;
	padding-top: 5px;
	text-align: left;
}


.div19__flex-item-row-date {
	width: 60%;
	height: auto;
	text-align: center;
	line-height: 160%;
	color: #333;font-weight: 400;
	font-size: 1.6em;
	font-variant: small-caps;
}

.div19__flex-item-row-date-termine {
	width: 20%;
	height: auto;
	text-align: right;
	padding-right: 20px;
	line-height: 160%;
	color: #333;
	font-family: 'Roboto', sans-serif;
	font-weight: 600;
	font-size: 1.6em;
	letter-spacing: 0.05em;
}



.div19__flex-item-row-info {
	width: 75%;
	height: auto;
	text-align: left;
	line-height: 160%;
	color: #333;
	font-weight: 400;
	font-size: 1.6em;
}


.div19__flex-item-row-info-time {
	width: 75%;
	height: auto;
	text-align: left;
	line-height: 160%;
	color: #333;
	font-weight: 400;
	font-size: 1.6em;
}


.div19__flex-item-row-elternbriefe {
	width: 70%;
	color: #333;
	height: auto;
	margin: 5px;
	padding-top: 2px;
	padding-left: 10px;
	text-align: left;
}

.div19__letter {
	color: #333;
	text-decoration: none;
	font-size: 1.4em;
}

.div19__letter:hover {
	text-decoration: underline;
}

.div19__flex-item-row-downloads {
	width: 98%;
	min-height: 30px;
	padding: 5px;
	margin: 0 auto;
	text-align: left;
	line-height: 160%;
	border-bottom: 1px dotted #fff;
}

.div19__flex-item-row-downloads-link {
	color: #333;
	text-decoration: none;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.4em;
	padding: 10px 0 10px 0;
}

.div19__flex-item-row-downloads-link:hover {
	color: blue;
	text-decoration: underline;
}

.div19_schulfest {
	width: 96%; 
	min-height: 200px; 
	box-shadow: 0px 3px 5px #444; 
	padding: 10px; 
	color: white; 
	border: 3px solid #fff; 
	line-height: 140%;
}

/* #endregion */
/* #region DIV20*/

.div20__pfeil {
	position: absolute;
	bottom: 56px;
	left: 47%;
	height: 45px;
	width: 50px;
	padding-top: 10px;
	margin: auto;
	text-align: center;
	color: #fff;
	z-index: 100;
	border: 2px solid #fff;
}

.div20__titleanker {
	color: #fff;
	text-decoration: none;
	font-weight: 600;
	font-size: 20pt;
}

.div20__titleanker:hover {
	color: red;
}

/* @end */

/* @group div20 */

.div20_meldung {
	width: 100%;
	min-height: 120px;
	text-align: center;
	color: #efefef;
	font-size: 11pt;
	margin: auto;
	line-height: 140%;
	padding: 16px;
}

.div20__titleanker:hover {
	color: red;
}

/* #endregion */
/* #region MODAL*/

.modalhs {
    display: none; 
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; 
    overflow: scroll;
    padding-bottom: 200px;
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0,0.4);
}

.modalts {
    display: none; 
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: scroll; 
    padding-bottom: 200px;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}

.modal-content {
    background: linear-gradient(to bottom, #f5a031, #f17933);
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 700px;
}

.closehs {
	position:fixed;
	z-index: 102;
	top: 130px;
	right: 10%;
    color: #fb0404;
    font-size: 28px;
    font-weight: bold;
	background-color: #fff;
	width: 30px;
	height: 30px;
	padding: 7px;
	box-shadow: 0px 3px 5px #444;
}

.closehs:hover,
.closehs:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.closets {
	position:fixed;
	z-index: 102;
	top: 130px;
	right: 10%;
    color: #fb0404;
    font-size: 28px;
    font-weight: bold;
	background-color: #fff;
	width: 30px;
	height: 30px;
	padding: 7px;
	box-shadow: 0px 3px 5px #444;
}

.closets:hover,
.closets:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

/* #endregion */
/* #region DIV21*/

.div21 {
	position: relative;
	width: 100%;
	margin: 10px auto;
}


.div21__h2 {
	font-family: 'Indie Flower', cursive;
	height: 50px;
	padding-top: 10px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 auto;
	text-align: center;
	color: #fff;
}

.div21__h4 {
	font-family: 'Indie Flower', cursive;
	font-size: 3em;
	font-weight: 400;
	line-height: 160%; 
	text-align: center;
	color: #fff;
	letter-spacing: normal;
	padding-top: 4px;
	background: rgba(121, 49, 65, 0.8);
}

.div21__gallery {
	max-width: 1800px;
	margin: auto;
	padding-top: 50px;
}

.div21__flex-container {
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}

.div21__flex-item {
		height: 450px;
		width: 450px;	
		padding-top: 400px;
		margin: 0 auto;
		margin-bottom: 40px;
		overflow: hidden;
		border: 2px solid #fff;
		box-shadow: 4px 8px 8px #333;
		
		-webkit-transition: box-shadow .3s;
		-moz-transition: box-shadow .3s;
		-ms-transition: box-shadow .3s;
		-o-transition: box-shadow .3s;
		transition: box-shadow .3s;
}

.div21__flex-item:hover {
		box-shadow: 0px 1px 1px #999;
}

.div21__flex-item-hs {
	background: #4c5f97 url('../img/ogs/2025_ogs-hs.webp') no-repeat left top;
	background-size: cover;
}

.div21__flex-item-ts {
	background: #846694 url('../img/start/start_ts_2022.png') no-repeat left top;
	background-size: cover;
}

.div21__caption {
	width: 200px;
	height: auto;
	margin: auto;
	font-size: 1.4em;
	line-height: 160%;
}

/* #endregion */
/* #region DIV22*/

.div22__h2 {
	font-family: 'Indie Flower', cursive;
	height: 50px;
	padding-top: 10px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 auto;
	text-align: center;
	color: #fff;
}

.div22 {
	min-height: 520px;
	width: inherit;
	background: #fff url(../img/start/feldsieper_grundschule_bochum_sponsorenlauf_2020_hs.png) no-repeat top center;
	background-size: cover;
}

.div22__titelcontainer {
	position: relative;
	top: 400px;
	left: 2%;
	width: 400px;
	text-align: center;
	color: #00fff0;
	padding: 10px;
	background: rgba(185, 53, 47, 0.4);
	font-size: 2.8em;
}

.div22_contentbox {
  width: 100%;
  margin: 0 auto;
  padding: 50px;
}

.div22__marquee {
	height: 30px; 
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	text-align: left;
}

.div22__btn {
	font-size: 2.4em;
	font-weight: 400;
	color: #2a6ab1;
	text-decoration: none;
	position: relative;
}

.div22__btn--top {
	left: 320px;
	visibility: visible;
}

.div22__btn--bottom {
	left: 1000px;
	visibility: hidden;
}

.div22__btn:hover .div22__btn--bottom {
	left: 320px;
	visibility: visible;
}

.div22--marqueetext {
	position: relative;
	
	-webkit-transition: left 1s ease-out 0.3;
	-moz-transition: left 1s ease-out 0.3;
	-ms-transition: left 1s ease-out 0.3;
	-o-transition: left 1s ease-out 0.3;
	transition: left 1s ease-out 0.3s;
}

.div22__textcontainer {
	max-width: 1800px;
	margin: auto;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
}

.div22__figure {
	max-width: 300px;
}

.div22__img {
	width: 100%;
	height: auto;
}

.div22__article {
	width: 60%;
	font-size: 1.4em;
	
	line-height: 160%;
	text-align: justify;
	margin: 0 20px 0 20px;
}

.div22__p {
	margin-bottom: 2em;
}

.div22__nav {
	text-align: center;
	font-weight: 600;
	height: 85px;
	width: 85px;
	margin: 0 auto;
	margin-top: 50px;
}

#squarebutton a {
	height: 80px;
	width: 80px;
	padding-top: 30px;
	font-size: 150%;
	background: linear-gradient(to bottom, #f7da64, #f8c632);
	box-shadow: 0px 1px 2px #444;
	float: left;
	margin: 0 auto;
	color: #fff;
	text-decoration: none;
	
	-webkit-transition: all 2s ease-out 0.3s;
	-moz-transition: all 2s ease-out 0.3s;
	-ms-transition: all 2s ease-out 0.3s;
	-o-transition: all 2s ease-out 0.3s;
	transition: all 2s ease-out 0.3s;
}

div.div22__nav:hover .div_22__btn-rotate {
	-webkit-transform: rotate(360deg); 
	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
}

.div22__content {
	width: 100%;
	min-height: 600px;
	padding-bottom: 50px;
	padding-top: 30px;
	
	display: -webkit-flex; 
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-justify-content: space-around;
	-moz-justify-content: space-around;
	-ms-justify-content: space-around;
	-o-justify-content: space-around;
	justify-content: space-around;
	
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	-ms-align-items: flex-start;
	-o-align-items: flex-start;
	align-items: flex-start;
}

.div22__infobox {
	width: 30%;
	min-width: 310px;
	background-color: #fff;
	margin: 15px 5px 15px 5px;
	box-shadow: 1px 3px 3px #555;
	height: auto;
	color: #333;
	font-size: 1.4em;
	font-weight: 300;
	line-height: 160%;
	margin-bottom: 30px;
}

.div22__img-size {
	width: 100%;
	height: auto;
	margin-bottom: 10px;
}

.div22__text {
	padding: 15px;
}

/* #endregion */
/* #region DIV23*/

.div23 {
	position: absolute;
	top: 20px;
	right: 10%;
	z-index: 10000;
	width: 90%;
	max-width: 1200px;
	margin: 30px auto;
	background: rgba(255, 255, 255, 0.4);
	opacity: 0;
	visibility: hidden;
}

.div23-show {
	opacity: 1;
	visibility: visible;
	z-index: 1000;
}

.div23__h2 {
	font-family: 'Indie Flower', cursive;
	position: relative;
	height: 60px;
	padding-top: 15px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 0 10px 0;
	text-align: center;
	color: #fff;
	background-color: #475577;
}

.div23__closeX {
	position: absolute;
	top: 2px;
	right: 20px;
	margin-right: 10px;
	margin-top: 10px;
	font-weight: 600;
	color: #fff;
}

.div23__flex-container {
	width: 96%;
	margin: auto;
	min-height: 600px;
	margin-bottom: 40px;
	padding: 20px;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
	-o-align-items: center;
	align-items: center;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
	justify-content: center;
	
}

.div23__flex-item {
			height: 200px;
			width: 200px;	
			margin: 5px;
			padding: 5px;
			border: 0;
			font-size: 1.4em;
			font-weight: 400;
			color: white;
			text-align: center;
			box-shadow: 0px 4px 6px #72392c;
	}
	
	.div23__flex-item:hover {
			box-shadow: 0px 1px 1px #9c3c25;
	}
	
.div23__flex-item-large {
			height: 300px;
			width: 470px;	
	}

.div23__p {
	margin: 10px;
}

.div23__h4 {
	font-weight: 600;
	font-size: 1.2rem;
	margin-bottom: 10px;
	margin-top: 10px;
	line-height: 160%;
	text-align: left;
	color: #050505;
}

.div23__h5 {
	font-weight: 400;
	font-size: 1rem;
	margin-bottom: 10px;
	margin-top: 10px;
	line-height: 160%;
	text-align: left;
	color: #050505;
}

.div23__ul {
	display: inline;
	text-align: left;
	list-style-type: none;
}

.div23__ul li {
	padding-bottom: 10px;
	text-align: left;
	color: #000;
}

/* #endregion */
/* #region DIV24*/

.div24 {
	min-height: 400px;
	width: 100%;
	margin: 0 auto;
	padding: 30px;
	text-align: center;	
}

.div24__h4 {
	font-size: 1.6em;
	margin: 10px 0 10px 0;
	text-align: center;
	color: black;
}

.div24__h2 {
	font-family: 'Indie Flower', cursive;
	height: 60px;
	padding-top: 15px;
	font-weight: 600;
	font-size: 3.2em;
	line-height: 100%;
	margin: 0 0 30px 0;
	font-weight: 400;
	text-align: center;
	color: white;
	font-variant: small-caps;
}

.div24__gallery {
	width: 640px;
	padding: 5px;
	margin: auto;
}

.div24__flex-container {
	width: 95%;
	margin: auto;
	margin-bottom: 40px;
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row; 
	
	-webkit-align-items: stretch;
	-moz-align-items: stretch;
	-ms-align-items: stretch;
	-o-align-items: stretch;
	align-items: stretch;

	justify-content: space-around;
	
}

.div24__flex-item {
		min-height: 100px;
		width: 96%;	
		max-width: 700px;
		margin: 10px auto;
		padding: 5px;
		margin: 16px;
		overflow: hidden;
		border: 0;
		box-shadow: 0px 4px 8px #000;
		background-color: #fff;
}

.div24__flex-item table {
		width: 100%;
		max-width: 360px;
		height: auto;
		border: 3px solid darkorchid;
		padding: 6px;

}

.div24__flex-item tr {
	vertical-align: top;
	text-align: left;
}

.div24__img {
		width: 45%;
		min-width: 300px;
		margin: 5%;
		height: auto;
		float: right;
		overflow: hidden;
}

.div24__caption {
	width: 90%;
	height: auto;
	margin: auto;
	font-size: 1.4em;
	line-height: 160%;
}

.div24__caption p {
	margin: 15px;
	text-align: left;
}

.div24__img-leiterin {
	height: 180px;
	float: left;
	width: auto;
	margin-right: 10px;
	margin-left: 10px;
} 
.div24__img-leiterin-figcaption {
	float: right;
}

.div24__img-team {
		width: 100%;
		margin: 0 auto;
		margin-left: 0;
		height: auto;
		overflow: hidden;
}


/* #endregion */
/* #region DIV26*/

.div26 {
	width: 100%;
	height: auto;
	padding-bottom: 50px;
}

.div26__img {
	width: 100%;
	height: auto;
}

/* #endregion */
/* #region DIV27*/

.div27 {
	width: 100%;
	height: auto;
}

.div27__img-background {
	width: 100%;
	height: auto;
	margin: 0 auto;
	background: url('../img/start/feldsieper_musik_fp.jpg');
	background-repeat: no-repeat;
	background-size: contain;
}

.div27__img {
	width: 100%;
	height: auto;
	
	-webkit-transition: opacity 1s ease-in-out 0s;
	transition: opacity 1s ease-in-out 0s;
}

.div27__img:hover {
	visibility: none;
	opacity: 0;
}

.topscrollerbox {
	display: none;
}

.div22__marquee {
	display: none;
}

.div27__h2 {
	font-family: 'Indie Flower', cursive;
	position: relative;
		min-height: 60px;
		padding-top: 15px;
		font-weight: 600;
		font-size: 3.2em;
		line-height: 100%;
		margin: 0 auto;
		font-weight: 400;
		text-align: center;
		color: #fff;	
		border-top: 10px solid #fff;
}

.div27__h3 {
		height: 60px;
	height: 50px;
	padding-top: 10px;
	font-weight: 300;
	font-size: 2.8em;
	line-height: 100%;
	margin: 0 auto;
	text-align: center;
	color: #fff;
}

.div27__content {
	width: 100%;
	min-height: 600px;
	padding-bottom: 50px;
	padding-top: 30px;
	
	display: -webkit-flex; 
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-justify-content: space-around;
	-moz-justify-content: space-around;
	-ms-justify-content: space-around;
	-o-justify-content: space-around;
	justify-content: space-around;
}

.div27__infobox {
	width: 30%;
	min-width: 300px;
	height: auto;
	border: 1px solid #eee;
	color: #333;
	font-weight: 300;
	font-size: 1.4em;
	line-height: 160%;
	margin: 15px;
	background-color: #fff;
	box-shadow: 1px 3px 3px #555;
}


.div27__img-size {
	width: 100%;
	height: auto;
	margin-bottom: 10px;
}

.div27__text {
	padding: 15px;
}

/* #endregion */
/* #region DIV28*/

.div28_contentbox {
  width: 100%;
  margin: 0 auto;
  padding: 10px;
}

.div28__h3 {
	font-size: 2.4em;
	font-style: italic;
	width: 100%;
	min-height: 50px;
	padding-top: 20px;
	text-align: center;
	color: #fff;
}

.div28__content {
	width: 100%;
	min-height: 200px;
	padding-bottom: 50px;
	padding-top: 30px;
	
	display: -webkit-flex; 
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;   
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-justify-content: space-around;
	-moz-justify-content: space-around;
	-ms-justify-content: space-around;
	-o-justify-content: space-around;
	justify-content: space-around;
	
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	-ms-align-items: flex-start;
	-o-align-items: flex-start;
	align-items: flex-start;
}

.div28__infobox {
	width: 80%;
	height: auto;
	border: 1px solid #eee;
	color: #2b2b2b;
	font-weight: 300;
	font-size: 1.4em;
	line-height: 140%;
	margin: auto;
	margin-bottom: 20px;
	padding: 10px;
	text-align: left;
}

.div28__infobox-large {
	width: 98%;
	height: auto; 
  column-count: 3;
  column-rule-color: #fff;
  column-rule-width: 1px;
  column-rule-style: dotted;
	border: 1px solid #fff;
	color: #2b2b2b;
	font-weight: 300;
	font-size: 1.4em;
	line-height: 140%;
	padding: 10px;
	margin-bottom: 30px;
}

.div28__text {
	padding: 5px;
}

.div28__p {
	margin-bottom: 2em;
	font-size: 1em;
}

.div28__text-600 {
	font-weight: 600;
	margin-bottom: 20px;
}

.div28__h2 {
	font-weight: 600;
	margin: 6px 0 6px 0;
}

/* #endregion */
/* #region FOOTER*/

.footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	max-width: 1600px;
	min-height: 50px;
	color: white;
	padding-top: 6px;
	font-size: 1.4em;
	font-weight: 400;
	text-align: center;
	/* box-shadow: 0 -3px 15px rgba(55, 15, 99, 0.6); */
}

.reinigung {
	width: 600px;
	height: auto;
}

.reinigung-img {
	width: 100%;
	height: auto;
}
	
/* #endregion */
/* #region MEDIA 1400*/


		@media (max-width: 1400px) {
	
/* 		.startframe {
		   	background: #ffffff url('../img/start/') no-repeat top center fixed;
		   	
   	-webkit-background-size: auto 768px ;
-moz-background-size:  auto 768px ;
-o-background-size:  auto 768px ;
background-size:  auto 768px ;
		} */


	.div22 {
		min-height: 520px;
		width: inherit;
		background: #fff url("../img/start/feldsieper_grundschule_bochum_sponsorenlauf_2020_hs.jpg") no-repeat top center;
		background-size: cover;
		-webkit-background-size: auto 520px ;
		-moz-background-size:  auto 520px ;
		-o-background-size:  auto 520px ;
		background-size:  auto 520px ;
	}

	.div24__flex-item {
		min-height: 100px;
		width: 45%;	
		max-width: 700px;
		margin: 0 auto;
		padding: 5px;
		margin: 16px;
		overflow: hidden;
		border: 0;
		box-shadow: 0px 4px 8px #000;
		background-color: #fff;
		}

		.div24__img {
				width: 100%;
				min-width: 300px;
				margin: 10px auto;
				height: auto;
				float: none;
				overflow: hidden;
		}

}

/* #endregion */
/* #region MEDIA 1100*/
	
@media (max-width: 1100px) {

	.startframe {
		width: 100%;
		max-width: 1100px;
		background: #003366 url('../img/start/feldsieper_grundschule_bochum_VFL2026_1100.webp') no-repeat top center;
		background-size: cover;
	}
	
	.header__logo {
		max-width: 120px;
	}

	.header__h1 {
		flex-grow: 3;
		margin: 50px auto;
		font-size: 4.5vw;
		letter-spacing: 2pt;
	font-family: 'Poiret One', normal;
		text-shadow: 2px 2px 10px rgba(0,0,0,0.8);
	}

	.header__nav {
		top: 50px;
		right: 30px;
		width: 90px;
	}

	#roundbutton a {
		height: 30px;
		width: 40px;
		font-size: 1.3em;
		padding-top: 14px;
		padding-left: 1px;
	}
	
	.dropdown {
		display: none;
	}
		
	.div01__btn { 
		font-size: 1.8em;
		letter-spacing: normal;
	}

	.div17--saeulen {
		width: 100%;
		height: auto;
		background-color: #003399;
		text-align: center;
	}
	
	.div17--schaubild {
		width: 1000px;
		height: auto;
		margin: 10px auto;
	}

	.header__btn-lernfoerderung {
		text-align: center;
		height: 35px;
		width: 200px;
		margin: 0 auto;
		margin-top: 5px;
		margin-right: 5px;
		}

	

.div12-newsboxen {
	max-width: 100%; 
	padding: 30px;
}


.beachten-link a {
	color: darkslateblue;
	text-decoration: none;
	line-height: 150%;
	font-size: 1rem;
	
	-webkit-transition: all .5s ;
	-moz-transition: all .5s ;
	-ms-transition: all .5s ;
	-o-transition: all .5s ;
	transition: all .5s;
}

.beachten-link a:hover {
	color: darkmagenta;
	text-decoration: underline;
}
	
}

/* #endregion */
/* #region MEDIA 830*/
@media (max-width: 830px) {

	header {
		position: fixed;
		top: 0;
		margin: 0 auto;
		padding-top: 10px;
		padding-bottom: 10px;
		width: 100vw;
		text-align: center;
		height: 120px;
		box-shadow: 3px 3px 10px #333;
	}

	.header__logo {
		background-image: url('../img/start/feldsieper-grundschule-bochum-logo.png');
		background-size: contain;
		width: 80px;
		max-width: 90px;
		height: 60px;
		margin-top: 4px;
	}
	
	.header__h1 {
		position: relative;
		margin: 30px auto;
		font-size: 4.5vw;
	font-family: 'Poiret One', normal;
	}

	.backtostart {
		position: absolute; 
		top: 10px; 
		left: 10px; 
		width: 90%; 
		height: 160px; 
		text-decoration: none;
		z-index: 999;
	}
	
	.startframe {
	   	background: #ffffff url('../img/start/feldsieper_grundschule_bochum_VFL2026_830.webp') no-repeat top center fixed;	
		background-size:  cover;
	}
	
	.header__nav {
		display: none;
	}

	.scrollpoint {
	width: 1px;
	height: 1px;
	position: relative;
	top: -60px;
	}
	
	nav {
	  display: none;
	}

	.contentstart {
		margin-top: 0;
		padding-top: 160px;
	}

	.contentstart-ogs {
		margin-top: 0;
		padding-top: 70px;
	}
	
	.div04__contentbox {
		width: 100%;
		box-shadow: 3px 3px 7px #444;
		background-image: url('../img/start/foerder_600.png') no-repeat;
		color: #fff;
	}
	
	.div04__h3 {
	font-size: 5vw;
	font-style: italic;
	margin: 0 auto;
	padding: 10px;
	text-align: center;
	line-height: 120%;
	color: #fff;
	}

	.div04__h5 {
		padding-bottom: 40px; 
		font-size: 1em; 
		color: #fff; 
		margin-bottom: 0;
		padding: 10px;
		font-weight: 200;
		text-align: center;
	}

	.div04__subtext {
		display: none;
	}
	
	.div04__navi {
	display: none;
	}


	.div12__h2 {
		font-size: 6vw;
	}

.div12__img {
	width: 100%;
	height: auto;
	width: auto;
	overflow: hidden;
	
	/*-webkit-flex-shrink: 1;
	-moz-flex-shrink: 1;
	-ms-flex-shrink: 1;
	-o-flex-shrink: 1;
	flex-shrink: 1;*/
}

.div12-newsboxen {
	max-width: 100%; 
	padding: 10px;
}

.div05 {
	padding: 10px;
	text-align: center;	
	box-shadow: 0px 6px 10px #333;
}
	
	.div17--saeulen {
		width: 100%;
		height: auto;
		background-color: #003399;
		text-align: center;
	}
	
	.div17--schaubild {
		width: 700px;
		height: auto;
		margin: 10px auto;
	}

	.div24__flex-item {
		width: 98%;	
		max-width: 700px;
		}

	

.div19__flex-item-column-fgz {
	float: right;
	margin-left: 10px;
	margin-right: 10px;
	right: 0;
	top: 0;
	height: 40px;
	width: 80px;
}


	/* #endregion */
/* landscape orientation for the dropdown content */
@media only screen and (orientation: landscape) {

	 
	.dropdown-content {
		right: 0;
		text-align: center;
		margin: auto;

	}

	.dropdown-content a {
		font-family: 'Poiret One', normal;
		color: #fff;
		text-decoration: none;
		display: block;
		border-bottom: 1px solid #efefef;
		letter-spacing: normal;
		text-align: center;
		
		-webkit-transition: all 0.6s ease-out; 
		-moz-transition: all 0.6s ease-out;
		-ms-transition: all 0.6s ease-out;
		-o-transition: all 0.6s ease-out;
		transition: all 0.6s ease-out;
	}

	.dropdown-content a:hover {
		text-decoration: none;
		color: #fff;
		border-bottom: 0px solid #fff;
		background-color: rgba(115, 145, 200, 0.8);
		font-weight: 400;
		box-shadow: none;
	}



.beachten-link a {
	color: darkslateblue;
	text-decoration: none;
	line-height: 150%;
	font-size: 1rem;
	
	-webkit-transition: all .5s ;
	-moz-transition: all .5s ;
	-ms-transition: all .5s ;
	-o-transition: all .5s ;
	transition: all .5s;
}

.beachten-link a:hover {
	color: darkmagenta;
	text-decoration: underline;
}


  }
	/* #region DROPDOWN*/
	.dropdown {
		display: flex;
		position: fixed;
		top: 30px;
		right: 30px;
		z-index: 2000;
	}
	
	.menuebtn {
			border: none;
			cursor: pointer;
			height: 40px;
			width: 40px;
			border-radius: 10%;
			box-shadow: 0 3px 6px #011d32;
			z-index: 1000;
			color: #333;
			background-color: rgba(241, 233, 225, 1);
			font-weight: 700;
		}


		.menuopen {
			background: url('../img/start/menu.png');
			background-repeat: no-repeat;
			background-size: cover;
			background-position: center;
		}

		.menuclose {
			background: url('../img/start/menu-close.png');
			background-repeat: no-repeat;
			background-size: cover;
			background-position: center;
		}
			
	.dropbtn:hover, .dropbtn:focus {
		background-color: red;
			}
			
			
/* 	.dropdown-content {
				    position: absolute;
					top: -20px;
					right: -100vw;
					height: 100vh;
					width: 100vw;
					color: #fff;
				    box-shadow: 0px 3px 5px #444;
					z-index: 1;
				}
				
	.dropdown-content a {
				    color: #fff;
				    padding: 20px;
				    text-decoration: none;
				    display: block;
					border-bottom: 1px solid #efefef;
					font-size:  2em;
					letter-spacing: normal;
					font-weight: 500;
					
					-webkit-transition: all 0.6s ease-out; 
					-moz-transition: all 1.6s ease-out;
					-ms-transition: all 1.6s ease-out;
					-o-transition: all 1.6s ease-out;
					transition: all 0.6s ease-out;
				}
				
	.dropdown-content a:hover {
				    color: #333;
				    text-decoration: none;
					border-bottom: 1px solid #fff;
					background-color: #fff;
					font-weight: 400;
					font-size: 15px;
					box-shadow: 6px 6px 10px hsla(300,15%,25%,0.3) inset;
				} */


.dropdown-content {
    position: fixed;
    top: 85px;
    left: 0;
    right: 0;
    width: 100%;
    height: calc(100vh - 55px);
    height: calc(100dvh - 55px);
    z-index: 100;

    display: flex;
    flex-direction: column;
    gap: 0.75rem;

    padding: 1rem 0.9rem 1.2rem;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;

    background: rgba(255, 255, 255, 0.34);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);

    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;

    transition:
        transform 0.35s ease,
        opacity 0.25s ease,
        visibility 0s linear 0s;
}

.dropdown-content.closed {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-14px);
    pointer-events: none;

    transition:
        transform 0.35s ease,
        opacity 0.25s ease,
        visibility 0s linear 0.35s;
}

.dropdown-content a {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 3.9rem;
    padding: 1rem 1.2rem;
    border-radius: 1rem;

    text-decoration: none;
    text-align: center;
	font-family: 'Poiret One', normal;
    color: #1f2937;
    font-size: clamp(1rem, 4vw, 1.25rem);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.02em;

    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow:
        0 6px 18px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.45);

    transition:
        transform 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease,
        color 0.2s ease;
}

.dropdown-content a:hover,
.dropdown-content a:focus-visible {
    color: #111827;
    background: rgba(255, 255, 255, 0.82);
    transform: translateY(-2px);
    box-shadow:
        0 10px 24px rgba(0, 0, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.55);
    outline: none;
}

.dropdown-content a:active {
    transform: translateY(0);
}

.dropdown-content a:last-child {
    margin-bottom: 0.3rem;
}

.dropdown-content a.fgs-olive-2024 {
    background: rgba(226, 232, 207, 0.72);
    color: #2f3a1f;
}

.dropdown-content a.current-page {
    position: relative;

    color: #111827;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(31, 41, 55, 0.18);
    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.10),
        inset 0 0 0 1px rgba(255, 255, 255, 0.45);
    font-weight: 700;

    padding-left: 1.6rem;
    padding-right: 1.6rem;
}

.dropdown-content a.current-page::before {
    content: "";
    position: absolute;
    left: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0.35rem;
    height: 65%;
    border-radius: 999px;
    background: #4b5d7a;
}

.dropdown-content a.current-page:hover,
.dropdown-content a.current-page:focus-visible {
    color: #111827;
    background: rgba(255, 255, 255, 0.92);
    transform: none;
}

			
	.show {display: block;}
			
	.slider {
				overflow-y: hidden;
				max-height: 500px; /* approximate max height */
			
				transition-property: all;
				transition-duration: 0.75s;
				transition-timing-function: cubic-bezier(1, 1, 1, 1);
			}
				
	.slider.closed {
				max-height: 0;
			}	
	
	.scroller {
				position: relative; 
				top: 2; 
			}

	.div12__flex-item {
		min-height: 200px;
		width: 100%;
		overflow: hidden;
		border: 0;
	}

	.div12__flex-item-beachten {
		min-height: 120px;
		width: 90%;
		max-width: 240px;
		overflow: hidden;
		border: 0;
	}

	.div12__flex-item-info {
		min-height: 120px;
		width: 90%;
		overflow: hidden;
		border: 0;
	}

.div12__img {
	width: 100%;
	height: auto;
	overflow: hidden;
	
}

	.div19__flexcontentbox {
		width: 96%;
	}	
		
	.div19__flexcontainer {
		width: 100%;
		height: auto;
		margin: 20px auto;
		padding: 12px; 
		backdrop-filter: blur(5px);
		background-color: rgba(255, 255, 255, 1);
	}

	.div19__flexcontainer-termine {
		width: 96%;
		margin: 0 auto;
	}

}

/* #endregion */
/* #region MEDIA 600*/


@media (max-width: 600px) {
 
	.header__h1 {
		font-size: 4.5vw;
		letter-spacing: normal;
		line-height: 100%;
	}

}

/* #endregion */
/* #region MEDIA 530*/

@media (max-width: 530px) {

	main {
		margin: 0 auto;
		margin-top: 100vh;
	}

.header__nav {
	display: none;
}
	
header {
	/* position: relative;
	top: 0;
	margin: 0 auto;
	width: 100vw;
	height: 140px;
	z-index: 200; */	
	position: fixed;
	top: 0;
	margin: 0 auto;
	padding-top: 10px;
	padding-bottom: 10px;
	width: 100vw;
	text-align: center;
	height: 120px;
	box-shadow: 3px 3px 10px #333;

	/* background: -webkit-linear-gradient(top,  rgb(115, 145, 200,),  rgba(41, 105, 176, 0));
    background: -moz-linear-gradient(top,  rgba(115, 145, 200,, 1),  rgba(41, 105, 176, 0));
    background: linear-gradient(top,  rgba(115, 145, 200,, 1),  rgba(41, 105, 176, 0));
    background: -moz-linear-gradient(top,  rgb(144, 196, 252, 1),  rgba(87, 158, 228, 0));
    background: linear-gradient(top,  rgba(144, 196, 252, 1),  rgba(87, 158, 228, 0));  */
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;

	flex-direction: column;
	
	-webkit-justify-content: top;
	-moz-justify-content: top;
	-ms-justify-content: top;
	-o-justify-content: top;
	justify-content: top;
	
	-webkit-flex-wrap: nowrap;
	-moz-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	-o-flex-wrap: nowrap;
	flex-wrap: nowrap;
	
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
	-o-align-items: center;
	align-items: center;
}
		
	.startframe {
		height: 100vh;
		background: #003366 url('../img/start/feldsieper_grundschule_bochum_VFL2026_830.webp') no-repeat top center;
		background-size: cover;
	}
		
	.header__logo {
		flex-grow: 1;
		max-width: 120px;
		width: 120px;
	}

	.header__figcaption{
		margin-left: 1px;
	}
	
	.header__h1 {
		position: relative;
		width: 100%;
		margin: 0 auto;
		font-size: 6.5vw;
		letter-spacing: 1px;
	}
	
	.scrollpoint {
	width: 1px;
	height: 1px;
	position: relative;
	top: 0;
}

.titelcontainer {
	display: none;
}

.div12__h2 {
	font-size: 8vw;
}

.div12__flex-item {
	min-height: 200px;
	width: 100%;
	overflow: hidden;
	border: 0;
}



.div12__flex-item-beachten {
		width: 90%;
		max-width: 400px;
		overflow: hidden;
		border: 0;
	}

.div12__flex-item-info {
		width: 90%;
		max-width: 400px;
		overflow: hidden;
		border: 0;
	}


.div00__startframespace {
	width: 100%;
	height: 70%;
}

.div19_termmincontainer {
	padding: 8px;
}



.div19__flex-item-column {
	width: 96%;
	height: auto;
	margin: 0 auto;
	border-top: 1px dotted #558c7f;
	/*background: url('../img/start/feldsieper-schule-bochum-line.png');
	background-position: top left;
	background-repeat: repeat-y;*/
	
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	-ms-justify-content: flex-start;
	-o-justify-content: flex-start;
	justify-content: flex-start;
}

.div19__flex-item-column-legende {
		width: 100%;
		margin: auto;
		text-align: left;
		padding: 5px;
		min-height: 90px;
		
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
	}
	
.div19__flex-item-row-legende {
	width: 300px;
	min-height: 40px;
	margin: 0 auto;
	text-align: center;
	line-height: 160%;
	font-size: 1.4em;
	font-weight: 400; 
	color: #fff; 
	padding: 6px; 
}

.div07__btn--square {
		padding: 10px;
	}


.div19__flex-item-row-date-termine {
	width: 20%;
	height: auto;
	text-align: right;
	padding-right: 2px;
	font-size: 1.4em;
	color:#000;
}


.div19__flex-item-row-info {
	width: 75%;
	height: auto;
	text-align: left;
	font-size: 1.4em;
}

.div19__flex-item-row-info-time {
	width: 75%;
	height: auto;
	text-align: left;
	font-size: 1.4em;
}



.div19__flex-item-row-date-termine {
	width: 80%;
	height: auto;
	text-align: left;
	padding-right: auto;
	padding-top: 10px;
	line-height: 100%;
	color: #333;
	font-family: 'Roboto', sans-serif;
	font-weight: 600;
	font-size: 1.6em;
}


.div19__flex-item-row-info {
	width: 98%;
	height: auto;
	text-align: left;
	line-height: 160%;
	color: #333;font-weight: 400;
	font-size: 1.6em;
}



.div19__flex-item-row-info-time {
	width: 40%;
	height: auto;
	text-align: left;
	line-height: 160%;
	color: #333;font-weight: 400;
	font-size: 1.6em;
}

	.div07__flexbox {
		text-align: center;
		margin: 20px 0;
	}
	
	.div07_containerbox {
	 max-width: 420px;
		margin: 0 auto;
		font-size: 1.4em;
		
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column;
		
		-webkit-align-items: center;
		align-items: center;
		
		-webkit-justify-content: center;
		-moz-justify-content: center;
		-ms-justify-content: center;
		-o-justify-content: center;
		justify-content: center;
	} 
	
	.div07__container-h {
		width: 280px;
		height: 50px;
		padding-top: 20px;
		color: white;
		margin-top: 40px;
		}
	
	.div07__container-w {
		width: 280px;
		height: 50px;
		padding-top: 20px;
		color: white;
		margin-top: 40px;
		}
		
		.div21__flex-item {
			height: 300px;
			width: 300px;	
			padding-top: 100px;
			margin: 0 auto;
			margin-bottom: 40px;
			overflow: hidden;
			border: 2px solid #fff;
			box-shadow: 4px 8px 8px #333;
	}
	
	.div21__flex-item-hs {
		background: #4c5f97 url('../img/ogs/2023_ogs-hs.png') no-repeat left top;
		background-size: contain;
	}
	
	.div21__flex-item-ts {
		background: #846694 url('../img/start/start_ts_2022.png') no-repeat left top;
		background-size: contain;
	}

	.div21__h4 {
		width: 100%;
		position: absolute;
		font-size: 2em;
		bottom: 0;
	}
	
	.div22__infobox {
	width: 90%;
	min-width: 300px;
	background-color: #fff;
	margin: 8px auto;
}


.modal-content {
	    margin: 20px auto;
	    padding: 0;
	    border: 1px solid #888;
	    width: 98%;
	}
	.div24__flex-container {
		width: 96%;
		margin: auto;
		margin-bottom: 20px;
		
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;   
		
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		-o-flex-direction: column;
		flex-direction: column; 
		
		-webkit-align-items: center;
		-moz-align-items: center;
		-ms-align-items: center;
		-o-align-items: center;
		align-items: center;
		
	}
	
	.div24__flex-item {
			min-height: 100px;
			width: 96%;	
			margin: auto;
			padding: 5px;
			margin-bottom: 10px;
			overflow: hidden;
			border: 0;
			box-shadow: 0 2px 4px #000;
			background-color: #fff;
	}
	
	.div24__img {
			width: 96%;
			margin: 0 auto;
			height: auto;
			overflow: hidden;
	}
	
	.div24__caption {
		width: 96%;
		height: auto;
		margin: 30px auto;
		font-size: 1.2em;
		line-height: 140%;
	}
	
	.div19__flex-item-row-date {
		width: 35%;
		height: auto;
		margin: 3px;
		padding: 2px;
		text-align: right;
		font-size: 1.4em;
		font-weight: 400;
	}
	
	.closehs {
	position: fixed;
	z-index: 102;
	top: 20px;
	right: 50px;
    color: #fb0404;
    font-size: 28px;
    font-weight: bold;
	background-color: #fff;
	width: 30px;
	height: 30px;
	padding: 7px;
	box-shadow: 0px 3px 5px #444;
}

.closehs:hover,
.closehs:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.closets {
	position: fixed;
	top: 20px;
	right: 50px;
    color: #fb0404;
    font-size: 28px;
    font-weight: bold;
	background-color: #fff;
	width: 30px;
	height: 30px;
	padding: 7px;
	box-shadow: 0px 3px 5px #444;
}

.div22__h2 {
	font-family: 'Indie Flower', cursive;
	font-size: 7vw;
}
	
	.div17--saeulen {
		display: none;
	}
	


	.div14__h2-large {
		font-family: 'Indie Flower', cursive;
		height: 60px;
		padding-top: 15px;
		font-weight: 400;
		font-size: 9vw;
		line-height: 100%;
		letter-spacing: 2px;
		margin: 0 0 30px 0;
	}
	
	
}

/* #endregion */