html, body {
	height: 100%;
	width: 100%;
	font-family: system-ui, sans-serif;
	font : 100%/1.4 'Helvetica Neue', arial, helvetica, helve, sans-serif;
	font-size: 10px;
	margin: 0;
	padding: 0;
	background:#fff;
}

*:focus { outline: none; }
* { box-sizing:border-box; }
*:before, *:after { box-sizing:inherit; }
p{line-height:2.2rem;}

p, ul, li{
	color:#4f4f4f;
	font-size: 1.4rem;
	text-align:justify;
	padding: 0 1rem 1rem 1rem;
}

.box-outer{
	margin-bottom:2rem;
}

.box-headline-grey, .box-headline-blue{
	display:block;
	background:#d9d9d9;
	font-size:1.3rem;
	font-weight:bold;
	padding:1rem 2rem;
	color:#000;
}
.box-headline-blue{background:#002a40;color:#fff;}

.box-intro-grey, .box-intro-blue, .box-intro-greyblue{
	display:block;
	background:#efefef;
	color:#002a40;
	font-size: 1.2rem;
	padding:1rem 2rem;
	text-align:justify;
	min-height:6rem;
}
.box-intro-blue{background:#b3bdc6;}
.box-intro-greyblue{background:#b3bdc6;}

.box-content-grey, .box-content-blue{
	display:block;
	background:#efefef;
	font-size:1.3rem;
	padding:1rem 2rem;
	color:#000;
	min-height:15rem;
}
.box-content-blue{background:#b3bdc6;}

a:hover{
	cursor:pointer;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------- Infobox-Flex */
fs-infobox-flex{
	display:flex;
	flex-wrap:no-wrap;
	justify-content:space-around;
}
fs-infobox-flex ul{
	margin-left:1rem;
}
fs-infobox-content i{
	margin-right:1rem;
}
fs-infobox-content ulhead, fs-infobox-content i, content-ulhead, content-ulhead i{
	font-size:1.4rem;
	font-weight:bolder;
	text-transform:uppercase;
}
content-ulhead, content-ulhead i{
	font-size:1.4rem;
	font-weight:bolder;
	text-transform:uppercase;
}
content-ulhead i{
	margin:0 1.5rem 0 0.5rem;
}
./* -------------------------------------------------------------------------------------------------------------------------------------------- Main Grid */
fs-header{grid-area:header;}
fs-content{grid-area:content;padding-bottom:5rem;}
fs-footer{grid-area:footer;}

body-grid-outer{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 9rem 1fr auto;
	grid-template-areas:
	"header"
	"content"
	"footer";
	gap:0;
	height: 100%;
}


.grid-headline{
	color:#000;
	padding:1rem 0.5rem 1rem 2rem;
	font-size:1.3rem;
	font-weight:bolder;
	line-height:3rem;
}
.grid-headline i{
	margin-right:1rem;
}

headline{
	display:block;
	padding:1rem;
	background:#efefef;
	font-size:1.3rem;
	font-weight:600;
	color:#002a40;
}

.logolink{
	display:block;
	height: 9rem;
	min-width:25rem;
	text-decoration:none;
	background-image: url(images/Logo_2024-black-head.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

header{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: nowrap;
	width:100vw;
	margin:0;
	z-index:99;
	box-shadow: 0px 0px 15px #4f4f4f;
	background: rgba(255,255,255,1);
}

footer{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: nowrap;
	width:100vw;
	margin:0;
	z-index:99;
	background: #ed1b24;
}

/* Content Styles ------------------------------------------------------------------------------------------------ */

.baselink{
	display:block;
	height: 9rem;
	min-width:25rem;
	text-decoration:none;
	background-image: url(images/Logo_2024-black.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 70%;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------- Charity / Interest Box */

.button-box-interest{
	display:block;
	text-align:right;
	position:relative;
	right:3rem;
	padding-top:8rem;
}

a.button-box-interest-link:link, a.button-box-interest-link:visited{
	margin:auto;
	display:inline-block;
	text-align:center;
	font-size:1.6rem;
	padding:1rem 3rem;
	background:rgba(246,195,19,0.8);
	border:1px solid #fff;
	border-radius:1rem;
	color:#000;
	text-decoration:none;
}
a.button-box-interest-link:hover{
	background:rgba(246,195,19,0.95);
	color:black;
}

a.button-box-interest-link:hover i{
	color:#fff;
}

.button-box-charity{
	display:block;
}

a.button-box-charity-link:link, a.button-box-charity-link:visited{
	margin:auto;
	display:inline-block;
	margin-top:5rem;
	text-align:center;
	font-size:1.6rem;
	padding:1rem 3rem 1rem 5rem;
	background:rgba(14,73,15,0.5);
	border:1px solid #fff;
	border-radius:1rem;
	color:#fff;
	text-decoration:none;
	background-image:url("images/Charity_Button_Flower.png");
	background-repeat:no-repeat;
	background-size:contain;
	background-position:1rem center;
}
a.button-box-charity-link:hover{
	background-color:rgba(14,73,15,0.6);
}

a.button-box-challenge-link:link, a.button-box-challenge-link:visited{
	margin:auto;
	display:inline-block;
	text-align:center;
	font-size:1.6rem;
	padding:1rem 1.6rem;
	background:rgba(255,255,255,0.8);
	border:1px solid #fff;
	border-radius:1rem;
	color:#000;
	text-decoration:none;
}
a.button-box-challenge-link:hover{
	background:rgba(255,255,255,0.9);
}

/* -------------------------------------------------------------------------------------------------------------------------------------------- Header */
.flexbox#header{
	margin:0 5% 0 5%;
}

.flexbox#header{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: nowrap;
	height: 9rem;
	width:100vw;
	position:fixed;
	margin:0 0;
	z-index:99;
	box-shadow: 0px 0px 15px #4f4f4f;
	background: rgba(255,255,255,1);
}

.flexelement#headerleft{
	order: 1;
	flex-grow: 1;
	flex-shrink: 0;
}

#headerleftlogo{
	padding: 1rem;
}

.flexelement#headerright{
	order: 2;
	flex-grow: 3;
	flex-shrink: 1;
	flex-basis: 75%;
	position: relative;
	
}

/* -------------------------------------------------------------------------------------------------------------------------------------------- Content Image Box */
.content-left-footer p{
	font-size: 1.2rem;
	padding:0 2rem 0.5rem 1rem;
	text-align:justify;
}

.content-left-image{
	display:block;
	width:100%;
	padding:0;
	margin:0;
	background:#b3bdc6;
}
.content-left-image img{
	object-fit: cover; 
	width:100%; 
	max-height:20rem;
	margin:0;
	padding:0;
}

.content-left-image#ischein{
	display:block;
	width:100%;
	padding:0;
	margin:0;
	background-image:url("images/ischein.jpg");
	background-size:cover;
	background-position:center center;
}
/* -------------------------------------------------------------------------------------------------------------------------------------------- Footer */
.footer-outer{
	height: 16rem;
	width: 100%;
	color: white;
	background:#727477;
}

.flexbox-footer-content{
	height:13rem;
	width:100%;
	background:#727477;
	display:flex;
	justify-content: flex-end;
}

.flexbox-footer-content-footer-left, .flexbox-footer-content-footer-center, .flexbox-footer-content-footer-right{
	width:30%;
	height:12rem;
}

.footer-headline{
	font-size:1.2rem;
	font-weight:bold;
	padding:0.5rem 0 0.8rem 0;
}
.footer-text{
	font-size:1.0rem;
}

.footer-text a{
	text-decoration:none;
	color:white;
}

.footer-end{
	height:3rem;
	width:100%;
	background:#002a40;
	text-align:right;
	line-height:3rem;
	padding-right:2rem;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------- Navigation */

nav {
  padding: 2rem 1rem 3rem 1rem;
}
nav ul {
  float: right;
  padding-right:2rem;
}
nav ul li {
  display: inline-block;
  float: left;
}

nav ul li #charity-link-top {
  display: inline-block;
  float: left;
  padding-left:1.5rem;
  background-image:url("images/charity-link-top.png");
  background-repeat:no-repeat;
  background-position:left center;
}


nav ul li:not(:first-child) {
  margin-left: 1rem;
}
nav ul li a {
  display: inline-block;
  outline: none;
  color: #000000;
  font-size: 1.4rem;
  text-decoration: none;
  letter-spacing: 0.04em;
}
nav ul li a i{
	margin-right:0.5rem;
	color:#C8C8C8;
}
nav ul li a:hover {
  color: #353535;
  text-decoration: none;
  border-bottom:1px solid #ed1c24;
}
nav ul li a:hover i{
	color:#000;
}

@media screen and (max-width: 70rem) {
  .nav-container {
    position: absolute;
    top: 0;
    right: 0;
    height:100vh;
	min-height:75vh;
    width: 30rem;
    z-index: -1;
    background: rgba(255,255,255,1);
	background-image:url("images/img-mental_genial.png");
	background-size:contain;
	background-position: bottom center;
	background-repeat:no-repeat;
    opacity: 0;
	box-shadow: 0px 0px 15px #4f4f4f;
  }
  
  .nav-mobile-items i{
  	margin-right:2rem;
	color:#ff0000;
  }
  
  .nav-container ul {
    position: absolute;
    top: 20%;
    transform: translateY(-20%);
  }
  .nav-container ul li {
    display: inline-block;
    width: 100%;
	text-align: left;
    margin-bottom: 0.5rem;
  }
 
  .nav-container ul li #charity-link-top{
    display: inline-block;
    width: 100%;
	text-align: left;
    margin-bottom: 0.5rem;
	padding-left:4.5rem;
	background-image:url("images/charity-link-top.png");
	background-repeat:no-repeat;
	background-position:1rem center;
  }
 
  .nav-container ul li:not(:first-child) {
    margin-left: 0;
  }

  .nav-container ul li a {
	display:inline-block;
	width:100%;
	padding:0.5rem 1rem;
	text-align:left;
	color:#002a40;
	font-size:1.4rem;
	background:#efefef;
	border:1px solid #dfdfdf;
	text-decoration:none;
  }
  .nav-container ul li a:hover {
  	transition: 0.5s;
  	background:#d9d9d9;
  }
  .nav-container ul li a i{
  	margin-right:2rem;
  }

  .nav-container ul li a:hover i{
  	transition: 0.5s;
	color:#000;
  }

  .nav-open {
    position: absolute;
    right: 2rem;
    top: 2rem;
    display: block;
    width: 48px;
    height: 48px;
    cursor: pointer;
    z-index: 9999;
	background:#efefef;
	border:1px solid #d9d9d9;
  }

  .nav-open i {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 2px;
    margin-left: 14px;
  }
  .nav-open i:nth-child(1) {
  	background: #0c66b0;
    margin-top: 16px;
  }
  .nav-open i:nth-child(2) {
	background: #727477;
    margin-top: 4px;
    opacity: 1;
  }
  .nav-open i:nth-child(3) {
	background: #e52428;
	margin-top: 4px;
  }

  #nav:not(:checked) ~ .nav-container {
	z-index:-9999;
	display:none;
	}

	@media only screen and (max-height: 575.98px) and (orientation: landscape) {
		.nav-open {
			right: 2rem;
			top: 2rem;
		}
		.nav-container ul {
			margin: 0.5rem 3rem 2rem 2rem;
		}
		.nav-container {
			background-image:none;
		}
	}
}

#nav:checked + .nav-open {
  transform: rotate(45deg);
  border:0;
  background:transparent;
}
#nav:checked + .nav-open i {
  background: #000;
  transition: transform 0.8s ease;
}
#nav:checked + .nav-open i:nth-child(1) {
  transform: translateY(6px) rotate(180deg);
}
#nav:checked + .nav-open i:nth-child(2) {
  opacity: 0;
}
#nav:checked + .nav-open i:nth-child(3) {
  transform: translateY(-6px) rotate(90deg);
}
#nav:checked ~ .nav-container {
  z-index: 150;
  opacity: 1;
}

#nav:checked ~ .nav-container ul li a {
  opacity: 1;
  transform: translateY(0);
}

.hidden {
  	display: none;
}

.nav-mobile-items{
	margin-top:9rem;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------- Cookie Banner */
.fixed {position: fixed;will-change: transform;}
.fixed--bottom {bottom: 0;left: 0;right: 0;}
.media-body a {color: inherit;}
.cookie-disclaimer button {background-color: transparent;border: 0;color: inherit;cursor: pointer;font: inherit;margin: 0;padding: 0;}
.cookie-disclaimer .button {border-style: solid;border-width: 0.0625em;padding: 0.5em 1em;position: relative;}
.cookie-disclaimer .button::after {background-color: inherit;bottom: 0;content: '';left: 0;opacity: 0;position: absolute;right: 0;top: 0;-webkit-transition: opacity 0.3s;transition: opacity 0.3s;will-change: opacity;z-index: -1;}
.cookie-disclaimer .button:focus::after,.cookie-disclaimer .button:hover::after {opacity: 1;}
.cookie-disclaimer {background-color: rgba(120,120,120,0.95);color: #fff;font-size: inherit;font-size: 1.3rem;opacity: 0;padding: 2rem 1rem 1rem 1rem;-webkit-transform: translateY(100%);transform: translateY(100%);-webkit-transition: opacity 0.3s, -webkit-transform 0.5s;transition: opacity 0.3s, -webkit-transform 0.5s;transition: opacity 0.3s, transform 0.5s;transition: opacity 0.3s, transform 0.5s, -webkit-transform 0.5s;z-index:9999;}
.cookie-disclaimer.is-active {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0);}
.cookie-disclaimer :first-child {margin-top: 0;}
.cookie-disclaimer :last-child {margin-bottom: 0;}
.media {display: -webkit-box;display: -ms-flexbox;display: flex;}
.media-center {-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
.media-object--left {margin-right: 1em;}
.media-object--right {margin-left: 1em;-webkit-box-ordinal-group: 2;-ms-flex-order: 1;order: 1;}
.media-body {-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;}



content-headline, content-headline i{
	font-size:1.4rem;
	font-weight:bolder;
	text-transform:uppercase;
}
content-headline i{
	margin:0 1rem 0 1rem;
}

a.fs-contentlink:link, a.fs-contentlink:visited{
	text-decoration:none;
	color:#1a4a86;
}
a.fs-contentlink:hover{
	color:#000;
}
a.fs-contentlink i{
	margin:0 0.5rem 0 0.25rem;
}

/* ---------------------------------------------------------------------------------------------------------------------------------------------- Footer */
.footer-grid-text{grid-area: footer-text;}
.footer-grid-links{grid-area: footer-links;}
.footer-grid-smicons{grid-area: footer-smicons;}
.footer-grid-mentalgenial{grid-area: footer-mentalgenial;}

.grid-box-footer{
	display:grid;
	grid-template-areas:
	'footer-text footer-links footer-mentalgenial'
	'footer-text footer-smicons footer-mentalgenial';
	align-content: top;
	align-items: top;
	grid-template-columns: 1fr 1fr 1fr;
	color:#000;
	font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
	font-size: 1.3rem;
	padding:1rem;
	background:#fff;
	border-top:1px solid #d9d9d9;
	box-shadow: 5px 5px 10px #4f4f4f;
}

.footer-grid-mentalgenial{
	background:transparent;
	background-image:url("images/img-mental_genial.png");
	background-position: center right;
	background-repeat:no-repeat;
	background-size:25rem;
}

.footer-grid-text{
	font-size:1.2rem;
	color:#292929;
	text-align:left;
}

.footer-grid-smicons span{
	font-size:1.4rem;
	color:#292929;
}

.footer-grid-links, .footer-grid-smicons{
	text-align:center;
}

a.footer-links:link, a.footer-links:visited{
	display:inline-block;
	line-height:2rem;
	text-align:center;
	background:transparent;
	color:#292929;
	font-size: 1.3rem;
	text-decoration:none;
}
a.footer-links:hover{
	text-decoration:underline;
}

#footer-smbox{
	justify-content:center;
}

footer{
	border-top:1px solid #d9d9d9;
}

@media screen and (max-width: 800px) {
	.footer-grid-mentalgenial{
		display:none;
	}
	.grid-box-footer{
		grid-template-columns: 2fr 1fr;
		grid-template-areas:
		'footer-text footer-links'
		'footer-text footer-smicons';
	}
	.footer-grid-links, .footer-grid-smicons{
		text-align:right;
	}
	a.footer-links:link, a.footer-links:visited{
		text-align:right;
	}
	#footer-smbox{
		justify-content:flex-end;
	}
}

a.tlink:link, a.tlink:visited, a.tlink-top:link, a.tlink-top:visited, a.tlink-footer:link, a.tlink-footer:visited{
	padding:0;
	margin:0;
	text-decoration:none;
	color:#fff;
	flex-basis:2rem;
	flex-grow:0;
	flex-shrink:0;
	font-size:2rem;
}
a.tlink:hover, a.tlink-top:hover, a.tlink-footer:hover{
	cursor:pointer;
}

a.tlink-top:link, a.tlink-top:visited, a.tlink-footer:link, a.tlink-footer:visited{
	color:#666666;
}

a.tlink-footer:link, a.tlink-footer:visited{
	font-size:1.4rem;
}

a.fs-formbutton:link, a.fs-formbutton:visited, a.fs-formbutton-portal:link, a.fs-formbutton-portal:visited{
	display:block;
	margin:0 2rem;
	border:1px solid #fff;
	padding:1rem 3rem;
	color:#fff;
	border-radius:0.5rem;
	text-decoration:none;
	font-size:1.3rem;
}
a.fs-formbutton:link, a.fs-formbutton:visited{background:rgba(160,13,13,1);}
a.fs-formbutton-portal:link, a.fs-formbutton-portal:visited{background:rgba(14,73,15,1);}

a.fs-formbutton:hover, a.fs-formbutton:hover{background:rgba(160,13,13,0.9);cursor:pointer;}
a.fs-formbutton-portal:hover, a.fs-formbutton-portal:hover{background:rgba(14,73,15,0.9);cursor:pointer;}

.fs-form-submit, .fs-form-submit-red, .fs-form-submit-blue, .fs-form-submit-grey{
	display:block;
	margin:auto;
	background:rgba(26,74,134,1);
	border:1px solid #fff;
	padding:1rem 3rem;
	color:#fff;
	border-radius:1rem;
}
.fs-form-submit:hover, .fs-form-submit-red:hover, .fs-form-submit-blue:hover{
	background:rgba(26,74,134,0.9);
	cursor:pointer;
}

.fs-form-submit-red{	
	display:block;
	min-width:13rem;
	text-align:center;
	padding:1rem 0;
	background:rgba(160,13,13,1);
}
.fs-form-submit-red:hover{
	background:rgba(160,13,13,0.9);
}

.fs-form-submit-blue{
	display:block;
	min-width:13rem;
	text-align:center;
	padding:1rem 0;
}
.fs-form-submit-grey{
	display:block;
	min-width:13rem;
	text-align:center;
	padding:1rem 0;
	background:rgba(186,186,186,1.00);
	color:#000;
}

#eltern .login-portal-button{
	background:rgba(26,74,134,1);
	border:1px solid #fff;
	padding:1rem 3rem;
	color:#fff;
	border-radius:1rem;
}
#eltern .login-portal-button:hover{
	background:rgba(26,74,134,0.9);
	cursor:pointer;
}

#eltern .logout-portal-button{
	background:rgba(160,13,13,1);
	border:1px solid #fff;
	padding:1rem 3rem;
	color:#fff;
	border-radius:1rem;
}
#eltern .logout-portal-button:hover{
	background:rgba(160,13,13,0.9);
	cursor:pointer;
}