/*!
 * Naturwinkel Hickengrund
*/

.page {
    background: #e7f1ec;
}

.frame-section.background-image h1, .frame-section.background-image h2, .frame-section.background-image h3 {
    background-color: #008549;
}

.divider {
    background-color: #008549;
}

.col-12 .divider {
    margin-right: 0;
    margin-left: 0;
}

figure .img-round {
    width: 100%;
    height: auto;
}

section.logos {
    position: relative;
    margin: 0 -15px;
    background-image: url(../media/winkel-footer.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #fff;
    padding: 220px 25px 100px 25px;
}

.kachel .img-wrap {
    background-color: #008549;
}

/* Indicator als Kreise statt als Striche darstellen */
.carousel .carousel-indicators button {
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: #aedbc4;
}

.carousel .carousel-indicators button.active {
    background-color: #02864d;
}

/*--------------------------------------------------------------
# Carousel
--------------------------------------------------------------*/
.carousel {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
}

/* Indicator als Kreise statt als Striche darstellen */
.carousel .carousel-indicators button {
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: #aedbc4;
}

.carousel .carousel-indicators button.active {
    background-color: #02864d;
}

.wrap-carousel {
    position: relative;
}


.carousel-caption h2 {
    color: #ffffff;
    background-color: #008549;
    display: inline-block;
    padding: 5px;
}

.overlay {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    height: auto;
    width:100%;
}

.overlay .img-fluid {
    width:100%;
}

.content-main .carousel-caption h2 {
    display: inline-block;
    text-transform: uppercase;
    background-color: #008549;
    color: #fff;
    padding: 0.5rem 1rem;
}

.content-main .carousel-caption .caption-content {
    background-color: #ffff;
    color: #666;
    text-align: left;
    padding: 1rem;
    margin: 0;
}

/*--------------------------------------------------------------
# Teaser News und Veranstaltungen
--------------------------------------------------------------*/
.teaser {
    background-color: #008549;
}

/*--------------------------------------------------------------
# Veranstaltungen mit sf_event_mgt
--------------------------------------------------------------*/

.event-list-item {
    border-bottom: 1px solid #69b091;
    padding: 5px 0;
    margin: 0 5px;
}

.event-list-item.row-0 {
    border-top: 1px solid #69b091;
}

.event-list-item.event-header {
    border-bottom: unset;
}

.tx-sf-event-mgt .categories {
    text-align: center;
}

.tx-sf-event-mgt .list-image {
    padding-left: 0;
}

.tx-sf-event-mgt .simple-list {
    border-bottom: 1px solid #008549;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}



.image-wrapper {
    position: relative;
}

.overlay-seminar {
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 30%;
    height: 30%;
    z-index: 2;
    background-size: contain;
}

.garden, .icon-3 {
    background-image: url("../media/icon-3.png");
    background-image: url("../media/garden.png");
}

.meadow, .icon-2 {
    background-image: url("../media/icon-2.png");
    background-image: url("../media/meadow.png");
}

.orchard, .icon-5 {
    background-image: url("../media/icon-5.png");
    background-image: url("../media/orchard.png");
}

.water, .icon-4 {
    background-image: url("../media/icon-4.png");
    background-image: url("../media/water.png");
}

.booked-out .btn-primary.alert {
    background-color: #79ac2c;
    border-color: #79ac2c;
    padding: 0.5rem;
    color: #fff;
}


/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

.footer {
    color: #fff;
    background-color: #008549;
}