body {
    margin: 0;
    overflow: hidden;
    font-family: 'Open Sans', sans-serif;
    font-size: 22px; /*22px oder 15px*/
    line-height: normal !important;
}

h1, h2, h3, h4, h5, p {
    margin: 0;
}

h1 {
    font-size: 130%;
    font-weight: bold;
}

h2 {
    font-size: 120%;
    text-decoration: underline;
    margin-bottom: 10px;
}

.ml-10 {
    margin-left: 10px;
}

.block {
    padding: 20px;
    width: 100%;
}

.outer {
    float: left;
    width: 100%;
    height: 100%;
}

.outer-separator-left {
    min-width: 285px; /* aufgrund der Begrüßung und Ampel */
    width: 25%;
    max-width: 500px; /* aufgrund der Logo-Breite */
}

.outer-separator-right {
    rpadding-right: 20px;
}

.color-left {
    background-color: transparent;
    background-image: linear-gradient(to right, #95b832 0%, rgba(149, 184, 50, 0.25) 85%, transparent 100%);
}

.color-bottom {
    background-color: transparent;
    background-image: linear-gradient(to top, #95b832 0%, rgba(149, 184, 50, 0.25) 80%, transparent 100%);
}

#kigalogo > img {
    width: 80%;
    max-width: 400px;
    filter: drop-shadow(0 0 40px #95b832);
    -webkit-filter: drop-shadow(0 0 40px #95b832);
}

#dvlogo {
    margin-left: -10%;
}

#dvlogo > img {
    width: 40%;
    filter: drop-shadow(0 0 3px #fff);
    -webkit-filter: drop-shadow(0 0 3px #fff);
}

.welcome {
    text-align: center;
}

.schedule {
    width: auto;
}

.schedule-phase {
    font-style: italic;
    margin-bottom: 8px;
}

.schedule-time {
    font-style: normal;
    margin: 0;
    margin-left: 10px;
}

.ampel {
    padding: 0;
    margin: 20px 40px;
    width: 70px;
    height: 200px;
    background-color: #333;
    border-radius: 8px;
}

.ampel-licht {
    margin: 5px;
    width: 60px;
    height: 60px;
    background-color: #606060;
    border: 1px #000000 solid;
    border-radius: 60px;
}

.ampel-red {
    background-color: red;
}

.ampel-yellow {
    background-color: yellow;
}

.ampel-green {
    background-color: lawngreen;
}

#closure-1, #closure-2, #closure-3 {
    margin-bottom: 15px;
}

.closure .closure-day {
    font-weight: bold;
}

.closure-miscellaneous {
    font-style: italic;
    font-size: 80%;
    margin-top: 10px;
}

.closure-miscellaneous > .topic {
    font-weight: bold;
}

.closure-miscellaneous > .contents {

}

.further {
    margin-top: 5px;
    padding-bottom: 0;
    text-align: right;
}

.further > #clock {
    color: #95b832;
    font-weight: bold;
}

.further > #miscellaneous {
    font-style: italic;
}

.further > #miscellaneous #stand-and-autor {
    font-size: 50%;
}

#slider {
    height: 600px; /* 1400 x 600 fest an Bildschirm gebunden!! */
    padding-top: 0;
    padding-bottom: 0;
}

.meal-and-events {
    padding: 0 25px;
}

.meal,
.events {
    border: 1px black solid;
    border-radius: 15px;
    background-color: rgba(149, 184, 50, 0.25);
}

.meal {
    width: 40%;
}

.events {
    width: 50%;
}

.icon {
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 15px;
    color: #95b832;
    text-shadow: 1px 1px 1px dimgrey, 1px -1px 1px dimgrey, -1px 1px 1px dimgrey, -1px -1px 1px dimgrey;
}

.content {
    margin-top: auto;
    margin-bottom: auto;
    width: 100%;
    text-align: center;
}

.content > h2 {
    margin-bottom: 20px;
}

#meal .vorspeise,
#meal .nachspeise {
    font-size: 75%;
    font-style: italic;
}

#meal .vorspeise {
    margin-bottom: 10px;
}

#meal .nachspeise {
    margin-top: 10px;
}

#meal .hauptspeise {
    font-weight: bold;
}

#events {
    text-align: left;
}

#events .event {
    margin-bottom: 15px;
}

#events .event:last-child {
    margin-bottom: 0px;
}

#events .titel {
    font-weight: bold;
    margin-right: 10px;
}

#events .titel::after {
    content: ':';
}

#events .datum {
    font-style: italic;
    font-size: 80%;
}

#events .infos {
    font-size: 80%;
}

#events .infos .beschreibung {
    text-align: justify;
}

#events .infos .ort {
    margin-top: 5px;
}

#events .infos .ort > u {
    margin-right: 10px;
}

.marquee-outer {
    position: absolute;
    z-index: -1;
    margin-left: -200px;
    padding: 30px 0 20px;
    border: none;
    font-size: 130%;
}

.marquee-inner {
    width: 100%;
    overflow: hidden;
}

.marquee-message {
    margin: 0 30px;
}

.hide {
    display: none !IMPORTANT;
}

/********************
      Override
********************/
.carousel-indicators {
    /*position: relative;
    bottom: 0;
    margin: 0px 20px; /* 20px laut .block */
}

.carousel-indicators li,
.carousel-indicators .progress {
    height: 15px;
}

.carousel-indicators li {
    width: 100px;
    margin-left: 5px;
    margin-right: 5px;
}

.carousel-indicators li,
.carousel-indicators li.active {
    background-color: transparent;
}

.carousel-indicators .progress {
    background-color: #E6F0C8;
    border-radius: 10px;
}

.carousel-indicators .progress-bar,
.carousel-indicators .active .progress {
    background-color: #95b832;
}