@charset "utf-8";
/* CSS Document */

body, html {width: 100%; height: 100%;}
body {margin: 0px; padding: 0px; font-family: 'Lato', sans-serif; font-size: 18px;}
body {
background:
    url(../../../images/elemente/hg/lkw.png) 10% 1000px no-repeat,
    url(../../../images/elemente/hg/lkw.png) 90% 3000px no-repeat,
	url(../../../images/elemente/hg/schiff.png) 90% 1020px no-repeat,
    url(../../../images/elemente/hg/schiff.png) 5% 1400px no-repeat,
	url(../../../images/elemente/hg/ballon.png) 94% 4000px no-repeat,
    url(../../../images/elemente/hg/ballon.png) 50% 200px no-repeat,
	url(../../../images/elemente/hg/flugzeug.png) 56% 430px no-repeat,
    url(../../../images/elemente/hg/flugzeug.png) 95% 2300px no-repeat,
	url(../../../images/elemente/hg/lok.png) 16% 260px no-repeat,
    url(../../../images/elemente/hg/lok.png) 81% 2400px no-repeat,
	url(../../../images/elemente/hg/rakete.png) 40% 2000px no-repeat,
    url(../../../images/elemente/hg/rakete.png) 60% 500px no-repeat,
	url(../../../images/elemente/hg/zeppelin.png) 27% 2600px no-repeat,
    url(../../../images/elemente/hg/zeppelin.png) 73% 600px no-repeat,
	url(../../../images/elemente/hg/auto.png) 38% 3900px no-repeat,
    url(../../../images/elemente/hg/auto.png) 93% 800px no-repeat,
	url(../../../images/elemente/hg/boot.png) 7% 4700px no-repeat,
    url(../../../images/elemente/hg/boot.png) 82% 2700px no-repeat
}

img {width: 100%; height: auto; border: 0; display: block;}
h1, h2, h3, h4 {font-family: 'Sniglet', cursive; font-weight: 400; margin: 0 0 40px 0;}
h1, h2 {color: #508c28;}
h3, h4 {color: #3768ab;}
h1 {font-size: 32px;}
h2 {font-size: 28px;}
h3 {font-size: 28px;}
h4 {font-size: 24px;}
p {margin: 0 0 40px 0; line-height: 28px;}

.btn {padding: 12px 20px; border-radius: 6px; color: #ffffff!important; text-decoration: none;}
.btn-rot {background-color: #e54724; transition: all .5s;}
.btn-rot:hover {background-color: #508c28; transition: all .5s; text-decoration: none!important;}

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

.pink-heart {color: #f19834; margin: -20px 0 20px 0; display: block;}
.pink-heart-hr::after, .pink-heart-hr::before {content: ""; height: 3px; width: 40px; background-color: #f19834; display: block; float: left; margin-top: 6px;}
.pink-heart-hr::after {margin-left: 10px;}
.pink-heart-hr::before {margin-right: 10px;}
.pink-heart .fa {float: left;}



.header {width: 100%; background-color: #fff; transition: all .3s; position: fixed; top: 0; left: 0; border-bottom: 1px #f2f2f2 solid; z-index: 1000;}
.header-inner {width: 94%; max-width: 1200px; margin: 0 auto; padding: 15px 0 0 0; position: relative; box-sizing: border-box; transition: all .3s;}
.brand {width: 70%; max-width: 200px; min-height: 130px; transition: all .3s;}
.logolink {display: block;}
.cloud-brand {width: 50%; max-width: 272px; position: absolute; bottom: -63px; left: -36px; transition: all .3s;}
@media screen and (max-width: 577px){
.cloud-brand {width: 100%;}
}
@media screen and (max-width: 420px){
.cloud-brand {bottom: -43%;}
}

/*Menu*/
.navi::after {content: ""; display: table; clear: both;}
.navi {display: table; position: absolute; bottom: 40px; right: 0px; transition: all .3s;}
.navi ul {list-style-type: none; padding: 0; margin: 0;}
.navi ul li {float: left; padding: 8px 20px 10px 20px; background-color: #f19834; position: relative; margin-left: 5px; color: #ffffff; font-size: 16px; border-radius: 6px;}
.navi ul li:first-child {margin-left: 0;}
.navi ul li:hover {background-color: #508c28;}
.navi ul li a {color: #ffffff; text-decoration: none; font-size: 16px;}
.navi ul li ul li {float: none; margin-left: 0; position: relative; font-size: 16px; border-top: 4px transparent solid; margin-top: 4px;}
.navi ul li ul li a {font-size: 16px;}
.navi ul li ul, .navi ul li ul li ul {display: none;}
.navi ul li:hover ul {display: block; position: absolute; top: 36px; left: 0px; border-top: 4px transparent solid; width: 230px;}
.navi ul li:hover ul li ul {display: none;}
.navi ul li ul li:hover ul {display: block; position: absolute; top: 0; left: 100%; border-left: 4px transparent solid; border-top: 0;}
.navi ul li ul li:hover ul li ul {display: none;}
.navi ul li ul li ul li:hover ul {display: block;}

.separator::after, ul li ul li.deeper > a::after, ul li ul li ul li.deeper > a::after {font-family: 'FontAwesome'; content: "\f107"; color: #ffffff; margin-left: 5px;}
.navi ul li ul li:hover {background-color: #508c28;}
.navi ul li.active {background-color: #508c28;}

.navi-pos {top: -3px;}

.mome {width: 20%; max-width: 40px; position: absolute; right: 0px; bottom: 25px; z-index: 999991; display: none; cursor: pointer;}

@media screen and (max-width: 916px){
.navi {display: none;}
.mome {display: block;}
}

.mob-nav {width: 100%; height: 100%; background-color: #508c28; position: fixed; top: 0; left: 0; display: none; z-index: 999991; overflow: hidden;}
.mob-nav-on {display: block;}
.mn-mover {width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow-x: hidden; min-height: 100%; overflow-y: auto;}
.closer-master {background-color: #ffffff; width: 100%; padding: 20px 0; margin-bottom: 30px;}
.closer {cursor: pointer; color: #ffffff; margin: 0px auto; display: table; width: 20%; max-width: 45px;}
.mob-nav ul {list-style-type: none; padding: 15px 25px; margin: 0 auto 30px auto; display: table; color: #ffffff; background-color: #f19834; border-radius: 10px;}
.mob-nav ul li ul, .mob-nav ul li ul li ul {padding: 0;}
.mob-nav ul li a {color: #ffffff; text-decoration: none; font-size: 20px;}
.mob-nav ul li ul {margin-left: 20px;}
.mob-nav ul li ul li a {color: #ffffff; font-size: 20px;}
.mob-nav ul li ul, .mob-nav ul li ul li ul {margin: 0 0 0 20px;}
.mob-nav .separator {color: #ffffff; font-size: 20px;}
.mob-nav .separator::after {color: #ffffff;}
.mob-nav ul li {margin: 15px 0;}

/*Fullscreen*/
.fullscreen {position: absolute; top:0; left: 0; background-color: #c7d7e5; width: 100%; height: 100%; z-index: 100; min-height: 850px;}
.full-inner {width: 94%; max-width: 1200px; position: relative; margin-left: auto; margin-right: auto; min-height: 705px;}
.kids-full {width: 60%; max-width: 678px; position: absolute; bottom: 45px; right: 0;}
.cloud-bottom {width: 100%; position: absolute; left: 0; bottom: 0;}
.fs-content {width: 94%; max-width: 500px; position: absolute; top: 15%; left: 0;}
.fs-content h1 {color: #9d5296; font-size: 40px;}
.fs-content p {color: #666666; font-size: 18px; line-height: 28px;}
.paper-airplane {width: 55%; max-width: 600px; position: absolute; top: 10%; right: 0;}
@media screen and (max-width: 1200px){
.kids-full {width: 50%; bottom: 0px;}
.fullscreen {min-height: 780px;}
}
@media screen and (max-width: 990px){
.kids-full {left: 0; margin: auto;}
.fs-content {max-width: none; top: 8%;}
.paper-airplane {top: auto; bottom: 10%;}
}
@media screen and (max-width: 640px){
.kids-full {width: 70%;}
.fs-content h1 {font-size: 30px; margin: 0 0 30px 0; text-align: center;}
.fs-content p {line-height: 24px; margin: 0 0 30px 0; text-align: center;}
}

/* Clouds */
.clouds {position: absolute; left: 0; top: 146px; z-index: 50; width: 100%;}
@media screen and (max-width: 890px){
.wolken {overflow: hidden;}
.wolken img {width: 200%;}
}
@media screen and (max-width: 550px){
.wolken img {width: 300%;}
}
@media screen and (max-width: 400px){
.wolken img {width: 400%;}
}

/* Content */
.row-fluid {width: 100%; position: absolute; left: 0;}
.content {width: 94%; max-width: 1200px; margin-left: auto; margin-right: auto; padding: 140px 0; color: #666666;}
.abstand1 {top: 100%;}
.abstand2 {top: 160px;}

.content ul {margin: 20px 0 40px 0;}
.content li {line-height: 28px; font-size: 18px; list-style-type: none;}
.content li::before {font-family: 'FontAwesome'; content: "\f005"; color: #f19834; margin-right: 25px; margin-left: -40px;}
.content hr {height: 2px; border: 0; color: #3768ab; background-color: #3768ab; margin: 40px 0;}
.content a {color: #e54724; text-decoration: none;}
.content a:hover {text-decoration: underline;}

.left50, .right50 {float: left; box-sizing: border-box; width: 50%; max-width: 600px; position: relative;}
.left-padding {padding-left: 40px;}
.right-padding {padding-right: 40px;}
.pinkborder {border: 1px #9d5296 solid; border-radius: 10px; padding: 40px 20px 0px 20px; background-color: #fcfafc; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); position: relative;}
.junge1 {position: absolute; bottom: 0; left: 30%; width: 30%; max-width: 200px;}
.maedchen1 {position: absolute; top: -169px; left: 5%; width: 30%; max-width: 160px; z-index: 200;}
.pinkborder2 {border: 5px #9d5296 solid; border-radius: 10px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); position: relative; box-sizing: border-box;}

.startseite-bild1, .startseite-bild2, .startseite-bild3 {padding: 10px; border-radius: 50%; position: absolute;}
.startseite-bild1 {width: 80%; max-width: 360px; border: 5px #508c28 dotted; background-color: #ffffff; top: 30px; left: 0;}
.startseite-bild2 {width: 70%; max-width: 290px; border: 5px #f19834 dotted; background-color: #ffffff; top: 270px; right: 70px;}
.startseite-bild3 {width: 70%; max-width: 240px; border: 5px #3768ab dotted; background-color: #ffffff; top: 390px; left: 20px;}
@media screen and (max-width: 1100px){
.startseite-bild2 {top: 370px;}
.startseite-bild3 {top: 590px;}
.junge1 {display: none;}
}
@media screen and (max-width: 820px){
.startseite-bild1 {width: 70%; margin: 0 auto; position: relative; top: 0;}
.startseite-bild2 {display: none;}
.startseite-bild3 {display: none;}
.left50, .right50 {float: none; width: 100%; max-width: 820px; padding: 30px 0;}
}
@media screen and (max-width: 570px){
.maedchen1 {display: none;}
}

.care-master {padding-top: 140px;}
.care-box, .category-module li {width: 30.83333321%; max-width: 370px; float: left; border-radius: 10px; margin-left: 3.33333332%; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); overflow: hidden; background-color: #f9bd48;}
.care-box:first-child {margin-left: 0;}
.care-inner {box-sizing: border-box; padding: 20px 15px 0 15px;}
.care-image {position: relative;}
.care-image::after {content: url("../../../images/elemente/boxwave.png"); position: absolute; bottom: -5px; left: 0;}
@media screen and (max-width: 720px){
.care-box {width: 100%; float: none; max-width: 500px; margin-left: auto; margin-right: auto; margin-top: 30px;}
.care-box:first-child {margin-left: auto; margin-top: 0;}
}

.green, .green-top, .green-bottom {width: 100%;}
.green {background-color: #3768ab; padding: 100px 0;}
.green-inner {width: 94%; max-width: 1200px; margin: 0 auto;}
.green-inner h2 {color: #f19834; text-align: center; margin: 0 0 70px 0; font-size: 34px;}
.green-box {width: 22.49999991%; max-width: 270px; float: left; position: relative; background-color: #ffffff; border-radius: 8px; box-sizing: border-box; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); margin-left: 3.33333332%; text-align: center; padding: 60px 15px 0 15px;}
.green-box:first-child {margin-left: 0;}
.green-box::after {font-family: 'FontAwesome'; color: #ffffff; width: 70px; height: 70px; border-radius: 50%; position: absolute; top: -35px; left: 50%; margin-left: -30px; text-align: center; vertical-align: middle; font-size: 30px; background-color: #f5b73e; box-sizing: border-box; padding: 16px 0 0 0;}
.green-box::before {border: 4px #3768ab dotted; width: 74px; height: 74px; border-radius: 50%; position: absolute; top: -41.5px; left: 50%; margin-left: -36px; display: block; content: ""; background-color: #fff;}
.green-box:nth-child(1)::after {content: "\f005";}
.green-box:nth-child(2)::after {content: "\f073";}
.green-box:nth-child(3)::after {content: "\f0f5";}
.green-box:nth-child(4)::after {content: "\f030";}
@media screen and (max-width: 1015px){
.green-box {width: 100%; max-width: 320px; float: none; margin-left: auto; margin-right: auto; margin-top: 70px; padding: 60px 15px 1px 15px;}
.green-box:first-child {margin-left: auto; margin-top: 0;}
}

.news {padding: 100px 0 350px 0; width: 100%; background-image: url("../../../images/elemente/spielende-kinder-hg.png"); background-position: center bottom; background-size: 100% auto; background-repeat: no-repeat;}
.news-inner {width: 94%; max-width: 1200px; margin: 0 auto;}
ul.category-module {list-style-type: none; margin: 40px 0 0-40px;}
.category-module li:nth-child(1) {margin-left: 0; background-color: #e690bf;}
.category-module li:nth-child(2) {background-color: #c7d7e5;}
.category-module li:nth-child(3) {background-color: #f5b73e;}
.news-box {padding: 20px 15px; color: #666666;}
.news-box h3 {font-size: 24px;}
.news-box h3 a {text-decoration: none; color: #3768ab;}
.news-box .news-bottom {font-size: 12px;}
.news-box .mod-articles-category-readmore {float: right;}
.news-box a.mod-articles-category-title {padding: 4px 8px; border-radius: 6px; color: #ffffff; text-decoration: none; background-color: #e54724; transition: all .5s;}
.news-box a.mod-articles-category-title:hover {background-color: #508c28; transition: all .5s;}
@media screen and (max-width: 1115px){
.category-module li {width: 100%; max-width: 500px; float: none; margin-left: auto; margin-right: auto; margin-top: 30px;}
.category-module li:nth-child(1) {margin-left: auto; margin-top: 0;}
}
@media screen and (max-width: 450px){
.news {padding: 100px 0 150px 0;}
}


.footer {width: 100%; padding: 80px 0; background-color: #508c28;}
.footer-inner {width: 94%; max-width: 1200px; margin: 0 auto; border-left: 4px #f5b73e dotted; border-right: 4px #f5b73e dotted; box-sizing: border-box;}
.footer-box {width: 33.3333333%; max-width: 400px; float: left; box-sizing: border-box; color: #e2e2e2; padding: 0 20px;}
.footer-box:nth-child(2) {border-left: 4px #f5b73e dotted; border-right: 4px #f5b73e dotted;}
.footer-box h3 {color: #f5b73e;}
.footer-box .fa {width: 20px; color: #f5b73e; margin-right: 15px;}
.footer-box a.fl::before {font-family: 'FontAwesome'; width: 20px; color: #f5b73e; margin-right: 15px; content: "\f061";}
.footer-box a.fl {color: #e2e2e2; text-decoration: none;}
.footer-box a:hover.fl::before {color: #e54724;}
.footer-box .btn-rot:hover {background-color: #3768ab; transition: all .5s;}

.last-line {width: 100%; padding: 15px 0; text-align: center; color: #f5b73e; background-color: #3c7318; font-size: 14px;}
.last-line a {color: #f5b73e; text-decoration: none;}
.last-line a:hover {color: #e54724;}
@media screen and (max-width: 815px){
.footer-box {width: 100%; max-width: none; float: none;}
.footer-box:nth-child(2) {border-left: 0; border-right: 0; margin: 30px 0; border-top: 4px #f5b73e dotted; border-bottom: 4px #f5b73e dotted; padding-top: 30px;}
.footer-inner {border-left: 0; border-right: 0;}
}

/* Team */
.team-master {width: 100%; display: flex; flex-wrap: wrap; justify-content: center;}
.team-box {width: 260px; margin: 20px; position: relative; transition: all .5s; z-index: 10;}
.team-bild {width:260px; height: 345px; background-image: url("../../../images/elemente/cookie.png"); background-position: center center; background-size: cover; padding: 30px 35px 35px 35px; box-sizing: border-box; margin-bottom: -35px;}
.team-bild img {border-radius: 16px;}
.team-description {display: table; padding: 10px; box-sizing: border-box; background-color: #e54724; color: #ffffff; margin: 0 auto; text-align: center; transform: rotate(-12deg); border-radius: 8px; position: relative; z-index: 12;}
.team-box:hover .team-description {background-color: #508c28; transition: all .5s;}

.cookie {width: 70px; height: 70px; position: absolute; left: 20%; bottom: 10%; z-index: 11; background-position: center center; background-size: cover;}
.c1 {background-image: url("../../../images/elemente/cookie-1.png");}
.c2 {background-image: url("../../../images/elemente/cookie-2.png");}
.c3 {background-image: url("../../../images/elemente/cookie-3.png");}
.c4 {background-image: url("../../../images/elemente/cookie-4.png");}
.c5 {background-image: url("../../../images/elemente/cookie-5.png");}
.c6 {background-image: url("../../../images/elemente/cookie-6.png");}

/* TiKA in Bildern */
.image-map {}
.imagemap {position: relative; max-width: 842px; margin: 0 auto;}
.imagemap img {display: block;}
.imagemap .area {display: block; position: absolute; transition: box-shadow 0.15s ease-in-out;}
.imagemap .area:hover {box-shadow: 0px 0px 1vw rgba(0,0,0,0.5);}

.bereich0, .bereich1, .bereich2, .bereich3, .bereich4, .bereich5, .bereich6, .bereich7, .bereich8, .bereich9, .bereich7a, .bereich7b {position: absolute; cursor: pointer;}
.bereich0:hover, .bereich1:hover, .bereich2:hover, .bereich3:hover, .bereich4:hover, .bereich5:hover, .bereich6:hover, .bereich8:hover, .bereich9:hover, .bereich7:hover .bereich7a, .bereich7:hover .bereich7b {background-color: rgba(255,0,4,0.50); transition: background-color 0.35s ease-in-out;}
.bereich0 {left: 0; bottom: 0; width: 100%; height: 18.2%;}
.bereich1 {left: 21.7%; bottom: 21%; width: 14.3%; height: 27.4%;}
.bereich2 {left: 4.6%; bottom: 21%; width: 16.5%; height: 27.4%;}
.bereich3 {left: 4.6%; bottom: 49.3%; width: 34.2%; height: 30.9%;}
.bereich4 {left: 39.4%; bottom: 57.9%; width: 13.9%; height: 22.3%;}
.bereich5 {left: 53.9%; bottom: 57.9%; width: 13.3%; height: 22.3%;}
.bereich6 {left: 45%; bottom: 21%; width: 22.2%; height: 27.4%;}
.bereich7 {left: 68.5%; bottom: 47.3%; width: 26.3%; height: 32.9%;}
.bereich7a {left: 0%; bottom: 0%; width: 49.7%; height: 100%;}
.bereich7b {left: 49.7%; bottom: 30.7%; width: 50%; height: 69.3%;}
.bereich8 {left: 68.4%; bottom: 21%; width: 17.5%; height: 25.2%;}
.bereich9 {left: 0; bottom: 83.3%; width: 100%; height: 18.2%;}

/* Felder Termine u. Speiseplan */
.colorbox {box-sizing: border-box; padding: 40px 20px 20px 20px; margin: 0 0 40px 0; border-radius: 8px;}
.colorbox p {color: #ffffff;}
.colorbox:nth-child(1) {background-color: #c7d7e5;}
.colorbox:nth-child(2) {background-color: #e690bf;}
.colorbox:nth-child(3) {background-color: #f5b73e;}
.colorbox:nth-child(4) {background-color: #9accff;}
.colorbox:nth-child(5) {background-color: #c7d7e5;}
.colorbox:nth-child(6) {background-color: #e690bf;}
.colorbox:nth-child(7) {background-color: #f5b73e;}
.colorbox:nth-child(8) {background-color: #9accff;}
.colorbox:nth-child(9) {background-color: #e690bf;}
.colorbox:nth-child(10) {background-color: #c7d7e5;}
.colorbox:nth-child(11) {background-color: #f5b73e;}
.colorbox:nth-child(12) {background-color: #9accff;}


/* Galerie */
.galerie, .anmelden {background-color: #3768ab; padding: 20px; box-sizing: border-box; border-radius: 10px;}


/* Formmailer */
.anmelden .bfLegend-m {color: #f19834; padding: 4px 10px; border-radius: 16px; background-color: #c7d7e5;}
.anmelden .bfQuickMode fieldset {border: 0; background-color: #c7d7e5; margin: 15px 0 15px 0!important; border-radius: 6px;}
.anmelden .bfElemWrap .ff_elem {width: 100%!important; max-width:100%!important; min-width: 100%!important; height: 40px; line-height: 40px; border: 0; box-sizing: border-box; padding: 0 2%; font-family: 'Lato', sans-serif; font-size: 18px; color: #000000;}
.anmelden .bfCaptcha a img {max-width: 20px; margin-top: -30px;}
.anmelden button.bfSubmitButton {display: table; background-color: #e54723; color: #ffffff!important; cursor: pointer; width: auto!important; min-width: auto!important; max-width: 190px!important; text-align: center; border-radius: 6px; padding: 12px 16px; border: 0; font-size: 18px; float: none!important;}
.anmelden button.bfSubmitButton:hover {background-color: #3768ab;}
.anmelden section#bfElemWrap45::before {content: "Hinweise: Obwohl die Anmeldung keinen Anspruch begründet und ein Betreuungsvertrag erst durch unsere ausdrückliche Annahme und Bestätigung zustande kommt, bemühen wir uns nach besten Kräften, all Euren Wünschen nachzukommen, können dies allerdings nicht garantieren. Macht hier bitte Anmerkungen zur Teilnahme am Essen, Nahrungsmittelunverträglichkeiten, Krankheiten und alles, was Ihr uns sonst noch im Rahmen der Anmeldung vorab mitteilen möchtet. Weitere Details werden wir mit Euch im persönlichen Aufnahmegespräch klären."; font-size: 12px; line-height: 15px; margin-bottom: 10px; display: block;}


/* Aktuelle News */
.aktuelles {margin: 40px 0 0 0;}
.aktuelles table.category {width: 100%;}
.aktuelles #categorylist_header_title {width: 80%; box-sizing: border-box; padding: 10px; background-color: #508c28; text-align: left; border-top-left-radius: 8px;}
.aktuelles #categorylist_header_date {width: 20%; box-sizing: border-box; padding: 10px; background-color: #508c28; text-align: left; border-top-right-radius: 8px;}
.aktuelles #categorylist_header_title a, .aktuelles #categorylist_header_date a {color: #f5b63e;}
.aktuelles .list-title, .aktuelles .list-date {background-color: #d3e0ec; padding: 10px; box-sizing: border-box; line-height: 34px;}
.aktuelles .list-date {text-align: right;}
.category-list::after {content: ""; width: 100%; height: 30px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: #508c28; display: block; margin-bottom: 40px;}
@media screen and (max-width: 400px){
.aktuelles #categorylist_header_title a, .aktuelles #categorylist_header_date a {font-size: 14px;} 
}
@media screen and (max-width: 360px){
.aktuelles #categorylist_header_title a, .aktuelles #categorylist_header_date a {font-size: 13px;} 
}



/* Angebote in Bildern */
.angebotbild {width: 100%; max-width: 600px; margin: 40px auto;}
.bildbeschreibung {padding: 10px 0; text-align: center;}