﻿@CHARSET "UTF-8";

:root {
    --primary: #363636;
    --background: #ffffff;

    --button: #8adebb;
    --link: #363636;
    --link-active: #8adebb; 


    --green: #8adebb;
    --darkgrey: #363636;
    --grey: #91a7b5;
    --lightgreen: #ecfaf4;
}


* {
    margin: 0; xpadding: 0;
    box-sizing: border-box;
}



.f3-widget-paginator { display: inline-flex; list-style-type: none !important; margin: 20px 0; }
.f3-widget-paginator li::before { content: "" !important; }
.news-list-view .footer { background-color: white; }
.news-list-view h3 { padding-bottom: 0.5em; }
.news-image-wrap img { border-radius: 0 !important; }

.Xnews { height: 300px; width: 100%; }
.Xnews-special { background-color: #fdfdfd; padding: 10px; display: block; z-index: 10000; position: absolute; left: 35%; top: -350px; width: 60%; height: 300px !important; }
.Xitem-special .header { color: black; }
.Xitem-special .teaser-text { color: black; }
.Xitem-special img { width: 200px; }

.tx_newsslider { background-color: rgb(255,255,255,0.8); padding: 10px; display: block; z-index: 10000; position: absolute; left: 35%; top: -350px; width: 60%; height: 300px !important; }
.tx_newsslider img { width: 30% !important; }
.slide-block { display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; Xalign-items: stretch; }
.flex-caption { background-color: rgb(255,255,255,0); position: relative; width: 70%; }
.flex-caption .caption-title { color: black; font-weight: bold; }
.flex-caption .caption-text { color: black; }
.flex-direction-nav a { background-color: rgba(255, 255, 255, 0.1) !important; margin-top: 0 !important; z-index: 10001; }
.flex-control-nav { background-color: red !important; margin-top: 0 !important; z-index: 10001; bottom: 5px !important; width: 98%; margin: 0;}
.flex-control-nav a { color: white !important; z-index: 10002; }


.ce-textpic { overflow: visible !important; }
.ce-bodytext { overflow: visible !important; }
.ce-bodytext p { padding-top: 0.5em; }




h1,h2 { font-family: 'Poppins'; font-weight: 600; }
h3,h4,h5,h6,h7 { font-family: 'Poppins'; font-weight: 500; }

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}




/* ************************************************************************************************* */
/* Smartphones */
/* ************************************************************************************************* */
@media screen and (min-width: 1px) and (max-width: 767px) {

body {
    font-family: 'Poppins','calibri', sans-serif;
	font-weight: 300;
    font-size: 1em;
    line-height: 1.2;
    background: var(--background);
    color: var(--primary);
    Xwidth: 100%;
    Xmax-width: 1920px;
    height: auto;
    margin: 0 auto;
}

.ce-inner { display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; align-items: stretch; } 
.ce-row { margin-bottom: 0; width: 100%; }
.ce-column { margin-bottom: 30px; }
.ce-column img { width: 100%; height: auto; }

.ce-textpic .ce-row { width: 100%; }

.top { position: relative; top: 0; width: 100%; height: 120px; z-index: 2000; }
.topbar { position: absolute; top: 0; width: 100%; height: 120px; opacity: 0.5; background-color: white; z-index: 2000; }
.topnavi { position: absolute; padding-left: 10vw; padding-right: 10vw; opacity: 1; top: 70px; z-index: 2001; }
.topnavi a { font-weight: bold; text-decoration: none; }

.logodiv { position: absolute; text-align: center; overflow: hidden; top: 20px; width: 100%; margin: 0 auto; padding-right: 10vw; z-index: 2003; }
.logo { height: 80px; }
.topnavi { visibility: hidden; }

.menu-button { position: absolute; width: 40px; height: 40px; top: 40px; right: 5vw; cursor: pointer; z-index: 2005; }
.menu-close-button { position: absolute; width: 40px; height: 40px; right: 50px; top: 50px; }

.menu { display: none; position: absolute; top: 0; left: 0; width: 100%; z-index: 9001; background: rgba(0,0,0,0.6); backdrop-filter: blur(10px);}

.mainmenu { padding: 70px; }
.mainmenu ul { Xdisplay: block; Xpadding: 70px; list-style-type: none; padding-inline-start: 0; }
.mainmenu ul li { text-color: #FFFFFF; font-face: 'SophiaPro-SemiBold'; line-height: 2em; }
.mainmenu ul li a { color: #FFFFFF; text-decoration: none; }

.mainmenu ul li ul { padding: 0px; padding-bottom: 20px; }
.mainmenu ul li ul li { padding-left: 20px; }

.Xmainmenu ul li a:hover { border-bottom: solid 2px #0061A3; }
.Xmainmenu ul li.activelink a { border-bottom: solid 2px #0061A3; }



.rand { position: relative; top: 0; width: 100%; z-index: 1000; color: white; overflow: hidden; }

.rand .frame-layout-0 { position: relative; top: 0; z-index: 3000; }
.rand .frame-layout-0 h2 { position: relative; top: 20px !important; left: 5% !important; color: white; font-size: 1.5rem !important; }
.rand .frame-layout-0 a { margin-top: 10px; width: auto !important; background-color: #8ADEBB; color: white; line-height: 2em !important; Xpadding-left: 20px; Xpadding-right: 20px; border-radius: 20px; text-align: center; text-decoration: none; }
.rand .slider-container { max-height: 500px; }
.Xrand .Xfs-stretcher { height: 130px !important; }
.rand .slide-part-1 { position: relative; margin-left: 5%; top: 50px !important; font-size: 5rem !important; }
.rand .slide p { margin: 0; padding: 0; width: auto; z-index: 3000; }
.rand img {  Xobject-fit: none; }
.rand .image-embed-item { opacity: 0.85; }

.content { position: relative; top: 0; padding-left: 5%; padding-right: 5%; display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; align-items: stretch; 
  z-index: 2000;
  margin-left: auto; margin-right: auto;
  Xpadding-top: 50px; Xpadding-bottom: 50px;
  Xmax-width: 1920px; overflow: visible;
}


.slick-container { width: 100%; }
.slick-img { width: 200px; border-radius: 30px !important; padding: 20px; }
*[id^='loader-slick-id'] { display: none; }
.slick-slider figure figcaption { position: relative; padding: 0; background: none; color: #363636;  }


.content a { color: #8ADEBB; text-decoration: none; }
.content ul { list-style: none; }
.content ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #8ADEBB; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

/* Icon im Header Rechts */
.frame-layout-1 { position: relative; top: -300px; margin-left: 5vw; margin-right: 5; z-index: 9998; display: none; }

/* Weiße Überschrift auf Key Visual Unterseiten */
.Xframe-layout-1 { position: relative; width: 100%; height: 500px; color: white; z-index: 1000; }
.Xframe-layout-1 h2 { position: relative; top: 100px !important; left: 5% !important; color: white; }
.Xframe-layout-1 a { margin-top: 20px; width: auto !important; background-color: #8ADEBB; color: white; line-height: 2em !important; padding-left: 20px; padding-right: 20px; border-radius: 20px; text-align: center; }
.Xframe-layout-1 .ce-textpic { position: absolute !important; top: 200px !important; margin-left: 0.2vw !important; width: 500px !important; border: solid 1px red;}
.Xslide .ce-bodytext { position: relative; top 270px; }

.fs_obj * { display: block !important; }

/* Willkommen im Kreis */
.frame-layout-2 { display: flex; position: relative; opacity: 0.95; background-color: #E5F3E9; margin-top: -20px; width: 50vw; height: 50vw; border-radius: 50%; padding: 10vw; color: #333333; text-align: center; z-index: 1001; }
.frame-layout-2 h1 { align-self: center; flex: 1; font-size: 5vw; }
.frame-layout-2 h1 a { color: #363636; }

/* Info im Kreis */
.frame-layout-3 { display: flex; position: relative; Xmargin-left: 70px; opacity: 0.95; background-color: #91A7B5; X:#74868D; margin-top: -10vw; width: 90vw; height: 90vw; border-radius: 50%; padding: 15vw; color: white; font-size: 18pt; text-align: center; vertical-align: middle; z-index: 1000; }
.frame-layout-3 p { align-self: center; flex: 1; font-size: 3.5vw; }

/* Team Eintrag, Mitarbeiter, diese Kästen dürfen max. 4 spaltig ausgegeben werden */
.frame-layout-4 { width: 80%; margin-bottom: 50px; }
.frame-layout-4 img { margin-left: auto; margin-right: auto; border-radius: 30px; width: 50%; height: 50%; }
.frame-layout-4 .ce-bodytext { text-align: center; }

/* Zentrierter Textblock */
.frame-layout-5 { width: 100%; text-align: center; }
.frame-layout-5 img { margin-left: auto; margin-right: auto; border-radius: 30px; }
.Xframe-layout-5 p { font-size: 1em !important; }

/* Linksbündiger Textblock */
.frame-layout-6 { width: 100%; text-align: left; }
.frame-layout-6 img { margin-left: auto; margin-right: auto; border-radius: 30px; }

/* 5Bs mit Logo-Hintergrund 3-spaltig  */
.frame-layout-7 { display: block; position: relative; margin-left: auto; margin-right: auto; top: 50%; text-align: center; width: 50vw; height: 50vw; background: url("/fileadmin/images/logo-back.png") no-repeat; background-size: 80%; background-position: center;}
.frame-layout-7 .ce-textpic { display: table-cell; vertical-align: middle;}
.frame-layout-7 a { color: #363636; }

.frame-layout-7 .centered { position: relative; width: 100%; height: 100%; padding-top: 40%;  Xleft: 50%; Xtransform: translate(0%, 50%);}
.frame-layout-8 .centered { position: relative; width: 100%; height: 100%; padding-top: 40%;  Xleft: 50%; Xtransform: translate(0%, 50%);}

.bilden { display: flex; position: relative; width: 100%; height: 100%; font-size: 5vw; }
.text1-bilden { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-bilden { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

.betreuen { display: flex; position: relative; width: 100%; height: 100%; font-size: 5vw; }
.text1-betreuen { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-betreuen { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

.begleiten { display: flex; position: relative; width: 100%; height: 100%; font-size: 5vw; }
.text1-begleiten { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-begleiten { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

.beraten { display: flex; position: relative; width: 100%; height: 100%; font-size: 5vw; }
.text1-beraten { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-beraten { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

.befaehigen { display: flex; position: relative; width: 100%; height: 100%; font-size: 5vw; }
.text1-befaehigen { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-befaehigen { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

/* 5Bs mit Logo-Hintergrund 2spaltig  */
.frame-layout-8 { display: table; position: relative; text-align: center; width: 50vw; height: 50vw; background: url("/fileadmin/images/logo-back.png") no-repeat; background-size: 80%; background-position: center;}
.frame-layout-8 .ce-textpic { display: table-cell; vertical-align: middle;}
.frame-layout-8 a { color: #363636; }

/* Schule-/News-/Kontakt-Block */
.frame-layout-9,
.frame-layout-10,
.frame-layout-11 { color: white; position: relative; text-align: center; width: 80vw; height: 80vw !important; Xpadding: 3vw; margin-left: 0; margin-right: 2%; border-radius: 30px; margin-bottom: 50px; }
.frame-layout-9 { background: center no-repeat url("/fileadmin/images/tiles/tile-schule.jpg"); background-size: cover; }
.frame-layout-10 { background: center no-repeat url("/fileadmin/images/tiles/tile-news.jpg"); background-size: cover; }
.frame-layout-11 { background: center no-repeat url("/fileadmin/images/tiles/tile-kontakt.jpg"); background-size: cover; }
.frame-layout-9 a { color: white; }
.frame-layout-9 .ce-gallery { position: absolute; top: 45vw; left: 30vw; }
.frame-layout-9 .ce-row { overflow: visible; }
.frame-layout-9 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-9 img:hover { width: 115px; height: 115px; transform: scale(1.15); }
.frame-layout-10 a { display: block; width: 100%; height: 100% color: white; }
.frame-layout-10 .ce-gallery { position: absolute; top: 45vw; left: 30vw; }
.frame-layout-10 .ce-row { overflow: visible; }
.frame-layout-10 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-10 img:hover { width: 115px; height: 115px; transform: scale(1.15); }
.frame-layout-11 a { color: white; }
.frame-layout-11 .ce-gallery { position: absolute; top: 45vw; left: 30vw; }
.frame-layout-11 .ce-row { overflow: visible; }
.frame-layout-11 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-11 img:hover { width: 115px; height: 115px; transform: scale(1.15); }

.frame-layout-12 { width: 100%; Xpadding: 0 50px; }
.frame-layout-12 img { border-radius: 30px; }

.frame-layout-13 { margin-left: -10px; margin-right: -10px; padding-top: 5.5vw; padding-left: 1vw; padding-right: 1vw; text-align: center; width: 25vw; height: 25vw; border-radius: 50%; opacity: 0.95; color: white; background-color: #91A7B5; transition: all .2s ease-in-out; z-index:1000;}
.frame-layout-13:hover,.frame-layout-13:active { transform: scale(1.15); background-color: #8adebb; x:#ECFAF4; Xz-index: 5000; }
.frame-layout-13 h3 { font-size: 2.2vw; }
.frame-layout-13 p { font-size: 2vw; }

.frame-layout-14,
.frame-layout-15,
.frame-layout-16,
.frame-layout-17 { color: white; position: relative; text-align: center; width: 100vw; height: 80vw !important; padding: 2vw; margin-left: 0; margin-right: 2%; border-radius: 30px; margin-bottom: 2vw; z-index: 2000; }
.frame-layout-14 { background: center no-repeat url("/fileadmin/images/header/IMG_8821.JPG"); background-size: cover; }
.frame-layout-14 a { color: white; }
.frame-layout-15 { background: center no-repeat url("/fileadmin/images/header/kontakt.jpg"); background-size: cover; }
.frame-layout-15 a { color: white; }
.frame-layout-16 { background: center no-repeat url("/fileadmin/images/header/img_8817.jpg"); background-size: cover; }
.frame-layout-16 a { color: white; }
.frame-layout-17 { background: center no-repeat url("/fileadmin/images/header/maedchen.jpg"); background-size: cover; }
.frame-layout-17 a { color: white; }

.frame-layout-18 {
	position:relative;
    top:0;
    width:100%;
	height: 50px;
    z-index:9999;
    text-align:center;
    font-weight:normal;
    font-size:20px;
    font-weight:bold;
    color:black;
    background-color:#ecfaf4;
	Xborder: solid 1px red;
    padding:15px;
	white-space:nowrap;
}

.frame-layout-18 p { white-space:nowrap;}


.frame-space-before-small { margin-top: 25px; }
.frame-space-before-medium { margin-top: 50px; }
.frame-space-before-large { margin-top: 50px; }
.frame-space-before-extra-large { margin-top: 75px; }

.grow { transition: all .2s ease-in-out; }
.grow:hover { transform: scale(1.15); }

.image-embed-item img { border-radius: 30px; }

.footer {
    position: relative;
    Xtop: 150px;
    height: auto;
    margin-top: 50px;
    padding-top: 20px;
    padding-bottom: 50px;
    background-color: #91A7B5;
    Xfont-size: 2rem;
    color: white;
	z-index: 9999;
}

.footer-content { padding-left: 5vw; padding-right: 5vw; margin-left: auto; margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
  align-items: flex-start;
}

.footer-column { display: inline-block; width: 100%; padding-top: 30px; vertical-align: top; color: white; xfont-weight: bold;  }

.Xfooter-column div .menu {height: auto;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #91A7B5;
    background-image:linear-gradient(rgb(42, 120, 192), rgb(0, 86, 168));
    Xfont-size: 12pt;
    color: white;}

.footer ul { padding: 0; margin: 0; top: 0; list-style-type: none; }
.footer ul li { display: block; padding: 0; text-align: left; line-height: 1.5em; }
.footer a { text-decoration: none; xfont-weight: bold; color: white; }
.footer a:hover { text-decoration: underline; xfont-weight: bold; color: white; }


.form-group .control-label { visibility: hidden; }
.input input { width: 100%; background-color: #ECFAF4; line-height: 3.0em; border-radius: 1em; }
.input textarea { width: 100%; background-color: #ECFAF4; line-height: 2.0em; border-radius: 1em; height: 15em;}

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

}

@media(any-pointer: any-hover) {
  .frame-layout-13:hover, .frame-layout-13:active { transform: scale(1.15); background-color: #8adebb; x:#ECFAF4; z-index: 5000; }
}

/************************************************************************************************** */
/* Tablet */
/************************************************************************************************** */
@media screen and (min-width: 768px) and (max-width: 1024px) {
body {
    font-family: 'Nunito','calibri', sans-serif;
	font-weight: 300;
    font-size: 1.25em;
    line-height: 1.2;
    background: var(--background);
    color: var(--primary);
    Xwidth: 100%;
    Xmax-width: 1920px;
    height: auto;
    margin: 0 auto;
}

.ce-inner { display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; align-items: stretch; } 
.ce-row { margin-bottom: 0; width: 100%; }
.ce-column { margin-bottom: 30px; }
.Xce-column img { width: 100%; height: auto; }

.ce-textpic .ce-row { width: 100%; }

.top { position: relative; top: 0; width: 100%; height: 100px; z-index: 2000; }
.topbar { position: absolute; top: 0; width: 100%; height: 100px; opacity: 0.5; background-color: white; z-index: 2000; }
.topnavi { position: absolute; padding-left: 10vw; padding-right: 10vw; opacity: 1; top: 45px; z-index: 2001; }
.topnavi a { font-weight: bold; text-decoration: none; }

.logodiv { position: absolute; text-align: center; overflow: hidden; top: 20px; width: 100%; margin: 0 auto; z-index: 2003; }
.logo { height: 70px; }
.Xtopnavi { visibility: hidden; }

.menu-button { position: absolute; width: 100%; top: 30px; text-align: right; padding-right: 5%; cursor: pointer; z-index: 2005; }
.menu-close-button { position: absolute; width: 40px; height: 40px; right: 50px; top: 50px; }

.menu { display: none; position: absolute; top: 0; left: 0; width: 100%; z-index: 9001; background: rgba(0,0,0,0.6); backdrop-filter: blur(10px);}

.mainmenu { padding: 70px; }
.mainmenu ul { Xdisplay: block; Xpadding: 70px; list-style-type: none; padding-inline-start: 0; }
.mainmenu ul li { text-color: #FFFFFF; font-face: 'SophiaPro-SemiBold'; line-height: 2em; }
.mainmenu ul li a { color: #FFFFFF; text-decoration: none; }

.mainmenu ul li ul { padding: 0px; padding-bottom: 20px; }
.mainmenu ul li ul li { padding-left: 20px; }

.Xmainmenu ul li a:hover { border-bottom: solid 2px #0061A3; }
.Xmainmenu ul li.activelink a { border-bottom: solid 2px #0061A3; }



.rand { position: relative; top: 0; width: 100%; z-index: 1000; color: white; overflow: hidden; }

.rand .frame-layout-0 { position: relative; top: 0; height: auto;}
.rand .frame-layout-0 h2 { position: relative; top: 30px !important; left: 10vw !important; color: white; font-size: 2rem !important; }
.rand .frame-layout-0 a { margin-top: 20px; width: auto !important; background-color: #8ADEBB; color: white; line-height: 2em !important; border-radius: 20px; text-align: center; text-decoration: none; }
.rand .slide-part-1 { position: relative; margin-left: 10vw; top: 80px !important; font-size: 2.5rem; }
.rand .slide p { margin: 0; padding: 0; width: auto; }

.Xrand { position: absolute; top: 120px; width: 100%; height: 500px; z-index: 1000; color: white; overflow: hidden; }
.Xrand .frame-layout-0 { position: relative; top: 0; height: auto;}
.Xand .frame-layout-0 h2 { position: relative; top: 80px !important; left: 10vw !important; color: white; }
.Xrand .frame-layout-0 a { margin-top: 20px; width: auto !important; background-color: #8ADEBB; color: white; line-height: 2em !important; Xpadding-left: 20px; Xpadding-right: 20px; border-radius: 20px; text-align: center; text-decoration: none; }
.Xrand .slider-container { Xheight: 500px; }
.Xrand .slide-part-1 { position: relative; margin-left: 10vw; top: 120px !important; font-size: 1.6rem; }
.Xrand .slide p { margin: 0; padding: 0; width: auto; }
.Xrand .image-embed-item { opacity: 0.5; }

.content { position: relative; top: 0; padding-left: 5%; padding-right: 5%; display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; align-items: stretch; 
  margin-left: auto; margin-right: auto;
  Xpadding-top: 50px; Xpadding-bottom: 50px;
  Xmax-width: 1920px; overflow: visible;
}


.slick-container { width: 100%; }
.slick-img { width: 200px; border-radius: 30px !important; padding: 20px; }
*[id^='loader-slick-id'] { display: none; }
.slick-slider figure figcaption { position: relative; padding: 0; background: none; color: #363636;  }


.content a { color: #8ADEBB; text-decoration: none; }
.content ul { list-style: none; }
.content ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #8ADEBB; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

/* Icon im Header Rechts */
.frame-layout-1 { position: relative; top: -300px; margin-left: 5vw; margin-right: 5; z-index: 9998; display: none; }

/* Weiße Überschrift auf Key Visual Unterseiten */
.Xframe-layout-1 { position: relative; width: 100%; height: 500px; color: white; z-index: 1000; }
.Xframe-layout-1 h2 { position: relative; top: 100px !important; left: 5% !important; color: white; }
.Xframe-layout-1 a { margin-top: 20px; width: auto !important; background-color: #8ADEBB; color: white; line-height: 2em !important; padding-left: 20px; padding-right: 20px; border-radius: 20px; text-align: center; }
.Xframe-layout-1 .ce-textpic { position: absolute !important; top: 200px !important; margin-left: 0.2vw !important; width: 500px !important; border: solid 1px red;}
.Xslide .ce-bodytext { position: relative; top 270px; }

.fs_obj * { display: block !important; }

/* Willkommen im Kreis */
.Xframe-layout-2 { position: relative; Xbackground-color: #E5F3E9; margin-top: -100px; left: 200px; width: 500px; height: 500px; border-radius: 50%; padding: 120px; color: #333333; text-align: left; vertical-align: middle; z-index: 1001; }
.Xframe-layout-2 { position: relative; opacity: 0.95; background-color: #E5F3E9; margin-top: 27vw; Xleft: 10%; width: 500px; height: 500px; border-radius: 50%; padding: 120px; color: #333333; text-align: left; vertical-align: middle; z-index: 1001; }
.Xframe-layout-2 p { font-size: 1em; }

/* Info im Kreis */
.Xframe-layout-3 { position: relative; margin-left: 70px; opacity: 0.95; background-color: #74868D; width: 700px; height: 700px; border-radius: 50%; margin-top: -50px; padding: 150px; color: white; font-size: 18pt; text-align: left; vertical-align: middle; z-index: 1000; }
.Xframe-layout-3 p { font-size: 1em; }

/* Willkommen im Kreis */
.frame-layout-2 { display: flex; position: relative; opacity: 0.95; background-color: #E5F3E9; margin-top: -20px; left: 5vw; width: 30vw; height: 30vw; border-radius: 50%; padding: 4.5vw; color: #333333;  text-align: center; z-index: 1001;}
.frame-layout-2 h1 { align-self: center; flex: 1; font-size: 4vw; }
.frame-layout-2 h1 a { color: #363636; }

/* Info im Kreis */
.frame-layout-3 { display: flex; position: relative; Xmargin-left: 70px; opacity: 0.95; background-color: #91A7B5; X:#74868D; width: 40vw; height: 40vw; border-radius: 50%; margin-top: -30px; padding: 7vw; color: white; text-align: left;  z-index: 1000; }
.frame-layout-3 p { align-self: center; flex: 1; font-size: 1.7vw; text-align: center; }


/* Team Eintrag, Mitarbeiter, diese Kästen dürfen max. 4 spaltig ausgegeben werden */
.frame-layout-4 { width: 80%; margin-bottom: 50px; }
.frame-layout-4 img { margin-left: auto; margin-right: auto; border-radius: 30px; width: 50%; height: 50%; }
.frame-layout-4 .ce-bodytext { text-align: center; }

/* Zentrierter Textblock */
.frame-layout-5 { width: 100%; text-align: center; }
.frame-layout-5 img { margin-left: auto; margin-right: auto; border-radius: 30px; }
.frame-layout-5 p { font-size: 1.2em !important; }

/* Linksbündiger Textblock */
.frame-layout-6 { width: 100%; text-align: left; }
.frame-layout-6 img { margin-left: auto; margin-right: auto; border-radius: 30px; }

/* 5Bs mit Logo-Hintergrund 3-spaltig  */
.frame-layout-7 { display: block; position: relative; margin-left: auto; margin-right: auto; top: 50%; text-align: center; width: 50vw; height: 50vw; background: url("/fileadmin/images/logo-back.png") no-repeat; background-size: 80%; background-position: center;}
.frame-layout-7 .ce-textpic { display: table-cell; vertical-align: middle;}
.frame-layout-7 a { color: #363636; }

.frame-layout-7 .centered { position: relative; width: 100%; height: 100%; padding-top: 40%;  Xleft: 50%; Xtransform: translate(0%, 50%);}
.frame-layout-8 .centered { position: relative; width: 100%; height: 100%; padding-top: 40%;  Xleft: 50%; Xtransform: translate(0%, 50%);}

.bilden { display: flex; position: relative; width: 100%; height: 100%; }
.text1-bilden { align-self: center; flex: 1; display: inline-block; z-index: 5002; font-size: 3vw; }
.text2-bilden { align-self: center; flex: 1; display: inline-block; z-index: 5001; font-size: 3vw; }

.betreuen { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-betreuen { align-self: center; flex: 1; display: inline-block; z-index: 5002; font-size: 3vw;}
.text2-betreuen { align-self: center; flex: 1; display: inline-block; z-index: 5001; font-size: 3vw;}

.begleiten { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-begleiten { align-self: center; flex: 1; display: inline-block; z-index: 5002; font-size: 3vw;}
.text2-begleiten { align-self: center; flex: 1; display: inline-block; z-index: 5001; font-size: 3vw;}

.beraten { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-beraten { align-self: center; flex: 1; display: inline-block; z-index: 5002; font-size: 3vw;}
.text2-beraten { align-self: center; flex: 1; display: inline-block; z-index: 5001; font-size: 3vw;}

.befaehigen { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-befaehigen { align-self: center; flex: 1; display: inline-block; z-index: 5002; font-size: 3vw;}
.text2-befaehigen { align-self: center; flex: 1; display: inline-block; z-index: 5001; font-size: 3vw;}

/* 5Bs mit Logo-Hintergrund 2spaltig  */
.frame-layout-8 { display: table; position: relative; text-align: center; width: 50vw; height: 50vw; background: url("/fileadmin/images/logo-back.png") no-repeat; background-size: 80%; background-position: center;}
.frame-layout-8 .ce-textpic { display: table-cell; vertical-align: middle;}
.frame-layout-8 a { color: #363636; }


/* Schule-/News-/Kontakt-Block */
/*.frame-layout-9 { color: white; Xdisplay: table; position: relative; text-align: center; width: 30vw; height: auto !important; background: center no-repeat url("/fileadmin/images/tiles/tile-schule.jpg"); background-size: contain; Xborder-radius: 30px; margin-bottom: 50px; }
/*
.frame-layout-9 h2 { padding-top: 3vw !important; }
.frame-layout-9 a { color: white; }
.frame-layout-9 .ce-gallery { padding-bottom: 50px; }
.frame-layout-10 { color: white; Xdisplay: table; position: relative; text-align: center; width: 30vw; height: auto; background: center no-repeat url("/fileadmin/images/tiles/tile-news.jpg"); background-size: contain; border-radius: 30px; margin-bottom: 50px; }
.frame-layout-10 a { color: white; }
.frame-layout-11 { color: white; Xdisplay: table; position: relative; text-align: center; width: 30vw; height: auto; background: center no-repeat url("/fileadmin/images/tiles/tile-kontakt.jpg"); background-size: contain; border-radius: 30px; overflow: hidden; margin-bottom: 50px; }
.frame-layout-11 a { color: white; }

.frame-layout-12 { width: 45%; padding: 0 50px; }
.frame-layout-12 img { border-radius: 30px; }

.frame-layout-13 { margin-left: -10px; margin-right: -10px; padding-top: 3.5vw; padding-left: 1vw; padding-right: 1vw; text-align: center; width: 14vw; height: 14vw; border-radius: 50%; opacity: 0.95; color: white; background-color: #91A7B5; transition: all .2s ease-in-out; }
.frame-layout-13:hover { transform: scale(1.15); background-color: #8adebb; x:#ECFAF4; z-index: 5000; }
.frame-layout-13 h3 { font-size: 1.2vw; }
.frame-layout-13 p { font-size: 1vw; }

.Xframe-layout-14 { padding-top: 5vw; padding-left: 2vw; padding-right: 2vw; text-align: center; width: 14vw; height: 14vw; border-radius: 50%; background-color: #8adebb; x:#ECFAF4; }
*/
/* Schule-/News-/Kontakt-Block */
.frame-layout-9,
.frame-layout-10,
.frame-layout-11 { color: white; position: relative; text-align: center; width: 24vw; height: 35vw !important; Xpadding: 3vw; margin-left: 0; margin-right: 2%; border-radius: 30px; margin-bottom: 50px; }
.frame-layout-9 { background: center no-repeat url("/fileadmin/images/tiles/tile-schule.jpg"); background-size: cover; }
.frame-layout-10 { background: center no-repeat url("/fileadmin/images/tiles/tile-news.jpg"); background-size: cover; }
.frame-layout-11 { background: center no-repeat url("/fileadmin/images/tiles/tile-kontakt.jpg"); background-size: cover; }
.frame-layout-9 p a { display: block; line-height: 1.2em; color: white; }
.frame-layout-9 h2 a { display: block; line-height: 2em; color: white; }
.frame-layout-9 .ce-gallery { position: absolute; top: 20vw; left: 6vw; }
.frame-layout-9 .ce-row { overflow: visible; }
.frame-layout-9 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-9 img:hover { width: 115px; height: 115px; transform: scale(1.15); }
.frame-layout-9 img:hover { width: 115px; height: 115px; transform: scale(1.15); }
.frame-layout-10 p a { display: block; line-height: 1.2em; color: white; }
.frame-layout-10 h2 a { display: block; line-height: 2em; color: white; }
.frame-layout-10 .ce-gallery { position: absolute; top: 20vw; left: 6vw; }
.frame-layout-10 .ce-row { overflow: visible; }
.frame-layout-10 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-10 img:hover { width: 115px; height: 115px; transform: scale(1.15); }
.frame-layout-11 p a { display: block; line-height: 1.2em; color: white; }
.frame-layout-11 h2 a { display: block; line-height: 2em; color: white; }
.frame-layout-11 .ce-gallery { position: absolute; top: 20vw; left: 6vw; }
.frame-layout-11 .ce-row { overflow: visible; }
.frame-layout-11 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-11 img:hover { width: 115px; height: 115px; transform: scale(1.15); }

.frame-layout-12 { width: 45%; padding: 0 50px; }
.frame-layout-12 img { border-radius: 30px; }

.frame-layout-13 { margin-left: -10px; margin-right: -10px; padding-top: 3.5vw; padding-left: 1vw; padding-right: 1vw; text-align: center; width: 14vw; height: 14vw; border-radius: 50%; opacity: 0.95; color: white; background-color: #91A7B5; transition: all .2s ease-in-out; }
.frame-layout-13:hover { transform: scale(1.15); background-color: #8adebb; x:#ECFAF4; z-index: 5000; }
.frame-layout-13 h3 { font-size: 1.2vw; }
.frame-layout-13 p { font-size: 1vw; }

.frame-layout-14,
.frame-layout-15,
.frame-layout-16,
.frame-layout-17 { color: white; position: relative; text-align: center; width: 35vw; height: 24vw !important; padding: 2vw; margin-left: 0; margin-right: 2%; border-radius: 30px; margin-bottom: 50px; }
.frame-layout-14 { background: center no-repeat url("/fileadmin/images/header/IMG_8821.JPG"); background-size: cover; }
.frame-layout-14 a { color: white; }
.frame-layout-15 { background: center no-repeat url("/fileadmin/images/header/kontakt.jpg"); background-size: cover; }
.frame-layout-15 a { color: white; }
.frame-layout-16 { background: center no-repeat url("/fileadmin/images/header/img_8817.jpg"); background-size: cover; }
.frame-layout-16 a { color: white; }
.frame-layout-17 { background: center no-repeat url("/fileadmin/images/header/maedchen.jpg"); background-size: cover; }
.frame-layout-17 a { color: white; }

.frame-layout-18 {
	position:relative;
    top:0;
    width:100%;
	height: 50px;
    z-index:9999;
    text-align:center;
    font-weight:normal;
    font-size:20px;
    font-weight:bold;
    color:black;
    background-color:#ecfaf4;
	Xborder: solid 1px red;
    padding:15px;
	white-space:nowrap;
}

.frame-layout-18 p { white-space:nowrap;}

.image-embed-item img { width: 70vw; border-radius: 30px; }


.grow { transition: all .2s ease-in-out; }
.grow:hover { transform: scale(1.15); }

.footer {
    position: relative;
    top: 500px;
    height: auto;
    padding-top: 20px;
    padding-bottom: 50px;
    background-color: #91A7B5;
    font-size: 1em;
    color: white;
}

.footer-content { padding-left: 5vw; padding-right: 5vw; margin-left: auto; margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
  align-items: flex-start;
}

.footer-column { display: inline-block; width: 100%; padding-top: 30px; vertical-align: top; color: white; xfont-weight: bold;  }

.Xfooter-column div .menu {height: auto;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #91A7B5;
    background-image:linear-gradient(rgb(42, 120, 192), rgb(0, 86, 168));
    Xfont-size: 12pt;
    color: white;}

.footer ul { padding: 0; margin: 0; top: 0; list-style-type: none; }
.footer ul li { display: block; padding: 0; text-align: left; line-height: 1.5em; }
.footer a { text-decoration: none; xfont-weight: bold; color: white; }
.footer a:hover { text-decoration: underline; xfont-weight: bold; color: white; }


.form-group .control-label { visibility: hidden; }
.input input { width: 100%; background-color: #ECFAF4; line-height: 3.0em; border-radius: 1em; }
.input textarea { width: 100%; background-color: #ECFAF4; line-height: 2.0em; border-radius: 1em; height: 15em;}



.ce-row { margin-bottom: 0; width: 100%; }

}


/************************************************************************************************** */
/* Desktop */
/************************************************************************************************** */
@media screen and (min-width: 1025px) {


body {
    font-family: 'Nunito','calibri', sans-serif;
    font-size: 1em;
	font-weight: 300;
    line-height: 1.2;
    background: var(--background);
    color: var(--primary);
    width: 100%;
    Xmax-width: 1920px;
    height: auto;
    margin: 0 auto;
}

h2 { font-size: 50px; }

.ce-inner { display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; align-items: stretch; } 
.Xce-row { margin-bottom: 0; width: 100%; }
.ce-row { margin-bottom: 0; width: 100%; }
.ce-column { margin-bottom: 30px; }
.Xce-column img { width: 150px; height: auto; }

.text-center { text-align: center; }

.ce-textpic .ce-row { width: 100%; }

.top { position: absolute; top: 0; width: 100%; z-index: 2000; }
.topbar { position: absolute; top: 0; width: 100%; height: 100px; opacity: 0.5; background-color: white; z-index: 2000; }
.topnavi { position: absolute; padding-left: 10vw; padding-right: 10vw; opacity: 1; top: 40px; z-index: 2001; }
.topnavi a { font-weight: bold; text-decoration: none; }

.Xlogodiv { position: absolute; overflow: hidden; top: 20px; text-align: center; Xmargin-left: -170px; z-index: 2003; }
.logodiv { position: absolute; text-align: center; overflow: hidden; top: 20px; width: 100%; margin: 0 auto; z-index: 2003; }
.logo { height: 60px; }
.topnavi { visibility: visible; }

.menu-button { position: absolute; width: auto; right:0; top: 30px; text-align: right; padding-right: 5vw; cursor: pointer; z-index: 2005; }
.menu-close-button { position: absolute; width: 40px; height: 40px; right: 50px; top: 50px; }

.menu { display: none; position: absolute; top: 0; left: 0; width: 100%; z-index: 9001; background: rgba(0,0,0,0.6); backdrop-filter: blur(10px);}

.mainmenu { padding: 70px; }
.mainmenu ul { Xdisplay: block; Xpadding: 70px; list-style-type: none; padding-inline-start: 0; }
.mainmenu ul li { text-color: #FFFFFF; font-face: 'SophiaPro-SemiBold'; line-height: 2em; }
.mainmenu ul li a { color: #FFFFFF; text-decoration: none; }

.mainmenu ul li ul { padding: 0px; padding-bottom: 20px; }
.mainmenu ul li ul li { padding-left: 20px; }


.rand { position: relative; top: 100px; width: 100vw; z-index: 1000; color: white; overflow: hidden; }
.rand .frame-layout-0 { position: relative; top: 0; Xheight: 500px; }
.rand .frame-layout-0 h2 { position: relative; top: 150px !important; left: 10vw !important; color: white; font-size: 3vw !important; }
.rand .frame-layout-0 a { margin-top: 20px; width: auto !important; background-color: #8ADEBB; color: white; line-height: 2.5em !important; border-radius: 25px; text-align: center; text-decoration: none; }
.rand .slider-container { height: 500px; }
.rand .slide-part-1 { position: relative; margin-left: 10vw; top: 230px !important; Xfont-size: 1em; }
.rand .slide p { margin: 0; padding: 0; width: auto; font-size: 1.5vw; }
.rand .ce-column img { width: 150px; height: auto; }

.rand .frame-layout-1 .ce-row { margin-bottom: 0; width: 100%; }

.Xcontent { position: relative; top: 150px; padding-left: 5%; padding-right: 5%; display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; align-items: stretch; 
  margin-left: auto; margin-right: auto;
  Xpadding-top: 50px; Xpadding-bottom: 50px;
  Xmax-width: 1920px; overflow: visible;
}
.content { position: relative; top: 100px; padding-left: 10vw; padding-right: 10vw; display: flex; flex-wrap: wrap; justify-content: center; align-content: flex-start; align-items: stretch; Xmargin-left: auto; Xmargin-right: auto; }
.content h1 { font-size: 3vw; }

.slick-container { width: 100%; }
.slick-img { width: 200px; border-radius: 30px !important; padding: 20px; }
*[id^='loader-slick-id'] { display: none; }
.slick-slider figure figcaption { position: relative; padding: 0; background: none; color: #363636;  }


.content a { color: #8ADEBB; text-decoration: none; }
.content ul { list-style: none; }
.content ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #8ADEBB; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

/* Icon im Header Rechts */
.Xframe-layout-1 { position: relative; top: -300px; margin-left: 5vw; margin-right: 5; z-index: 9998; display: none; }
.frame-layout-1 { position: absolute; top: 30% !important; right: 10vw; z-index: 9998; }




/* Weiße Überschrift auf Key Visual Unterseiten */
.Xframe-layout-1 { position: relative; width: 100%; height: 500px; color: white; z-index: 1000; }
.Xframe-layout-1 h2 { position: relative; top: 100px !important; left: 5% !important; color: white; }
.Xframe-layout-1 a { margin-top: 20px; width: auto !important; background-color: #8ADEBB; color: white; line-height: 2em !important; padding-left: 20px; padding-right: 20px; border-radius: 20px; text-align: center; }
.Xframe-layout-1 .ce-textpic { position: absolute !important; top: 200px !important; margin-left: 0.2vw !important; width: 500px !important; border: solid 1px red;}
.Xslide .ce-bodytext { position: relative; top 270px; }

.fs_obj * { display: block !important; }


/* Willkommen im Kreis */
.frame-layout-2 { display: flex; position: relative; opacity: 0.95; background-color: #E5F3E9; margin-top: -30px; left: 5vw; width: 25vw; height: 25vw; border-radius: 50%; padding: 2vw; color: #333333; vertical-align: middle; z-index: 1001;}
.frame-layout-2 h1 { align-self: center; flex: 1; font-size: 2.5vw; }
.frame-layout-2 h1 a { color: #363636; }

/* Info im Kreis */
.frame-layout-3 { display: flex; position: relative; Xmargin-left: 70px; opacity: 0.95; background-color: #91A7B5; X:#74868D; width: 35vw; height: 35vw; border-radius: 50%; margin-top: -50px; padding: 7vw; color: white; text-align: left; vertical-align: middle; z-index: 1000; }
.frame-layout-3 p { align-self: center; flex: 1; font-size: 1.3vw; text-align: center; }

/* Team Eintrag, Mitarbeiter, diese Kästen dürfen max. 4 spaltig ausgegeben werden */
.frame-layout-4 { width: 25%; margin-bottom: 50px; }
.frame-layout-4 img { margin-left: auto; margin-right: auto; border-radius: 30px; width: 50%; height: 50%; }
.frame-layout-4 .ce-bodytext { text-align: center; }

/* Zentrierter Textblock */
.frame-layout-5 { width: 100%; text-align: center; }
.frame-layout-5 img { margin-left: auto; margin-right: auto; border-radius: 30px; }
.frame-layout-5 p { font-size: 1.2em !important; }

/* Linksbündiger Textblock */
.frame-layout-6 { width: 100%; text-align: left; }
.frame-layout-6 img { margin-left: auto; margin-right: auto; border-radius: 30px; }

/* 5Bs mit Logo-Hintergrund 3-spaltig  */
.frame-layout-7 { display: block; position: relative; top: 50%; text-align: center; width: 25vw; height: 25vw; background: url("/fileadmin/images/logo-back.png") no-repeat; background-size: 80%; background-position: center;}
.frame-layout-7 .ce-textpic { display: table-cell; vertical-align: middle;}
.frame-layout-7 a { color: #363636; }
.frame-layout-7 .centered { position: relative; width: 100%; height: 100%; padding-top: 40%;  Xleft: 50%; Xtransform: translate(0%, 50%);}

/* 5Bs mit Logo-Hintergrund 2-spaltig */
.frame-layout-8 { display: block; position: relative; top: 50%; text-align: center; width: 25vw; height: 25vw; margin-bottom: 50px; background: url("/fileadmin/images/logo-back.png") no-repeat; background-size: 80%; background-position: center; }
.frame-layout-8 .ce-textpic { display: table-cell; vertical-align: middle;}
.frame-layout-8 a { color: #363636; }
.frame-layout-8 .centered { position: relative; width: 100%; height: 100%; padding-top: 40%;  Xleft: 50%; Xtransform: translate(0%, 50%);}


.bilden { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-bilden { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-bilden { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

.betreuen { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-betreuen { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-betreuen { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

.begleiten { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-begleiten { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-begleiten { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

.beraten { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-beraten { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-beraten { align-self: center; flex: 1; display: inline-block; z-index: 5001; }

.befaehigen { display: flex; position: relative; width: 100%; height: 100%; font-size: 1.4vw; }
.text1-befaehigen { align-self: center; flex: 1; display: inline-block; z-index: 5002; }
.text2-befaehigen { align-self: center; flex: 1; display: inline-block; z-index: 5001; }


/* Schule-/News-/Kontakt-Block */
.frame-layout-9,
.frame-layout-10,
.frame-layout-11 { display: flex; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; align-items: stretch; color: white; position: relative; text-align: center; width: 24vw; height: 24vw !important; Xpadding: 3vw; margin-left: 0; margin-right: 2%; border-radius: 30px; margin-bottom: 50px; }
.frame-layout-9 { background: center no-repeat url("/fileadmin/images/tiles/tile-schule.jpg"); background-size: cover; }
.frame-layout-10 { background: center no-repeat url("/fileadmin/images/tiles/tile-news.jpg"); background-size: cover; }
.frame-layout-11 { background: center no-repeat url("/fileadmin/images/tiles/tile-kontakt.jpg"); background-size: cover; }
.frame-layout-9 h2 a { padding-top: 3vw; }
.frame-layout-9 a { display: block; height: 100%; width: 100%; color: white; text-align: center; }
.frame-layout-9 .ce-bodytext { width: 100%; height: 100%; }
.frame-layout-9 .ce-bodytext p { width: 100%; height: 100%; margin-top: 0; padding-top: 0; }
.frame-layout-9 .ce-textpic { width: 100%; height: 50%; }
.frame-layout-9 .ce-outer { width: 100%; }
.frame-layout-9 .ce-column { width: 100%; height: 100%; }
.frame-layout-9 .image { width: 100%; }
.frame-layout-9 .ce-gallery img { display: inline; }
.frame-layout-9 .ce-gallery { margin-top: 0; height: auto:50%; }
.frame-layout-9 .ce-gallery a { display: block; height: 100%; width: 100%; padding-top: 4vw; padding-bottom: 3vw; text-align: center; }
.frame-layout-9 .ce-row { overflow: visible; }
.frame-layout-9 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-9 img:hover { width: 115px; height: 115px; transform: scale(1.15); }

.frame-layout-10 h2 a { padding-top: 3vw; }
.frame-layout-10 a { display: block; height: 100%; width: 100%; color: white; text-align: center; }
.frame-layout-10 .ce-bodytext { width: 100%; height: 100%; }
.frame-layout-10 .ce-bodytext p { width: 100%; height: 100%; margin-top: 0; padding-top: 0; }
.frame-layout-10 .ce-textpic { width: 100%; height: 50%; }
.frame-layout-10 .ce-outer { width: 100%; }
.frame-layout-10 .ce-column { width: 100%; height: 100%; }
.frame-layout-10 .image { width: 100%; }
.frame-layout-10  .ce-gallery img { display: inline; }
.frame-layout-10 .ce-gallery { margin-top: 0; height: auto:50%; }
.frame-layout-10  .ce-gallery a { display: block; height: 100%; width: 100%; padding-top: 4vw; padding-bottom: 3vw; text-align: center; }
.frame-layout-10 .ce-row { overflow: visible; }
.frame-layout-10 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-10 img:hover { width: 115px; height: 115px; transform: scale(1.15); }

.frame-layout-11 h2 a { padding-top: 3vw; }
.frame-layout-11 a { display: block; height: 100%; width: 100%; color: white; text-align: center; }
.frame-layout-11 .ce-bodytext { width: 100%; height: 100%; }
.frame-layout-11 .ce-bodytext p { width: 100%; height: 100%; margin-top: 0; padding-top: 0; }
.frame-layout-11 .ce-textpic { width: 100%; height: 50%; }
.frame-layout-11 .ce-outer { width: 100%; }
.frame-layout-11 .ce-column { width: 100%; height: 100%; }
.frame-layout-11 .image { width: 100%; }
.frame-layout-11 .ce-gallery img { display: inline; }
.frame-layout-11 .ce-gallery { margin-top: 0; height: auto:50%; }
.frame-layout-11 .ce-gallery a { display: block; height: 100%; width: 100%; padding-top: 4vw; padding-bottom: 3vw; text-align: center; }
.frame-layout-11 .ce-row { overflow: visible; }
.frame-layout-11 .image-embed-item { transition: all .2s ease-in-out; }
.frame-layout-11 img:hover { width: 115px; height: 115px; transform: scale(1.15); }

.frame-layout-12 { width: 45%; padding: 0 50px; }
.frame-layout-12 img { border-radius: 30px; }

.frame-layout-13 { margin-left: -10px; margin-right: -10px; padding-top: 3.5vw; padding-left: 1vw; padding-right: 1vw; text-align: center; width: 14vw; height: 14vw; border-radius: 50%; opacity: 0.95; color: white; background-color: #91A7B5; transition: all .2s ease-in-out; }
.frame-layout-13:hover { transform: scale(1.15); background-color: #8adebb; x:#ECFAF4; z-index: 5000; }
.frame-layout-13 h3 { font-size: 1.2vw; }
.frame-layout-13 p { font-size: 1vw; }

.frame-layout-14,
.frame-layout-15,
.frame-layout-16,
.frame-layout-17 { color: white; position: relative; text-align: center; width: 35vw; height: 24vw !important; padding: 2vw; margin-left: 0; margin-right: 2%; border-radius: 30px; margin-bottom: 50px; }
.frame-layout-14 { background: center no-repeat url("/fileadmin/images/header/IMG_8821.JPG"); background-size: cover; }
.frame-layout-14 a { color: white; }
.frame-layout-15 { background: center no-repeat url("/fileadmin/images/header/kontakt.jpg"); background-size: cover; }
.frame-layout-15 a { color: white; }
.frame-layout-16 { background: center no-repeat url("/fileadmin/images/header/img_8817.jpg"); background-size: cover; }
.frame-layout-16 a { color: white; }
.frame-layout-17 { background: center no-repeat url("/fileadmin/images/header/maedchen.jpg"); background-size: cover; }
.frame-layout-17 a { color: white; }

.frame-layout-18 {
    position:relative;
    top:0;
    width:100%;
    height: 50px;
    z-index: 9999;
    text-align:center;
    font-weight:normal;
    font-size:1em;
    font-weight:bold;
    color:black;
    background-color:#ecfaf4;
    padding:15px;
    white-space:nowrap;
}
.frame-layout-18 p { white-space:nowrap;}

.frame-space-before-small { margin-top: 50px; }
.frame-space-before-medium { margin-top: 75px; }
.frame-space-before-large { margin-top: 100px; }





.grow { transition: all .2s ease-in-out; }
.grow:hover { transform: scale(1.15); }

.footer {
    position: relative;
    top: 500px;
    height: auto;
    padding-top: 20px;
    padding-bottom: 50px;
    background-color: #91A7B5;
    font-size: 1em;
    color: white;
}

.footer-content { padding-left: 10vw; padding-right: 10vw; margin-left: auto; margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
  align-items: flex-start;
}

.footer-column { display: inline-block; width: auto; padding-top: 30px; vertical-align: top; color: white; xfont-weight: bold;  }

.Xfooter-column div .menu {height: auto;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #91A7B5;
    background-image:linear-gradient(rgb(42, 120, 192), rgb(0, 86, 168));
    Xfont-size: 12pt;
    color: white;}

.footer ul { padding: 0; margin: 0; top: 0; list-style-type: none; }
.footer ul li { display: block; padding: 0; text-align: left; line-height: 1.5em; }
.footer a { text-decoration: none; xfont-weight: bold; color: white; }
.footer a:hover { text-decoration: underline; xfont-weight: bold; color: white; }


.form-group .control-label { visibility: hidden; }
.input input { width: 100%; background-color: #ECFAF4; line-height: 3.0em; border-radius: 1em; }
.input textarea { width: 100%; background-color: #ECFAF4; line-height: 2.0em; border-radius: 1em; height: 15em;}



/* ********************************* */

.menu { display: none; position: absolute; left: auto !important; right: 0px; z-index: 9998; top: 0px; min-height: 400px; width: 400px; background: rgba(0,0,0,0.6); backdrop-filter: blur(10px);}

.mainmenu ul { Xdisplay: block; Xpadding: 70px; list-style-type: none; padding-inline-start: 0; }
.mainmenu ul li { text-color: #FFFFFF; font-face: 'SophiaPro-SemiBold'; line-height: 2em; }
.mainmenu ul li a { color: #FFFFFF; text-decoration: none; }

.mainmenu ul li ul { padding: 0px; padding-bottom: 20px; }
.mainmenu ul li ul li { padding-left: 20px; }

.news-article { width: 100%; height: auto; padding-bottom: 50px; }
.news-img-wrap { margin-right: 50px; text-align: center; min-height: 150px; width: 300px; float: left; }

}

