:root {
    --teilbar-green-standard: #8ABC17;
    --teilbar-green-text: #5A7000;
    --teilbar-button-text: white;
    --teilbar-button-back: #5A7000;
}

ul.messenger {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.messenger li {
    display: inline-block;
    clear: both;
    padding: 10px;
    border-radius: 20px;
    margin-bottom: 2px;
    width: 70%;
    font-family: Helvetica, Arial, sans-serif;
}

ul.messenger li .info {
    font-size: x-small;
}

ul.messenger .other {
    float: left;
    background: #eee;
}

ul.messenger .me {
    float: right;
    background: #0084ff;
    color: #fff;
}

ul.messenger .otherNotLast {
    border-bottom-left-radius: 5px;
}

ul.messenger .meNotLast {
    border-bottom-right-radius: 5px;
}

ul.messenger .me+.me {
    border-top-right-radius: 5px;
}

ul.messenger .other+.other {
    border-top-left-radius: 5px;
}

ul.messenger .me:last-of-type {
    border-bottom-right-radius: 20px;
}

ul.messenger .other:last-of-type {
    border-bottom-left-radius: 20px;
}

.messengerheader {
    text-align: center;
    font-weight: bold;
    border-bottom: 1px solid #eee;
}

.messengerbox {
    display: flex;
}

/* The sidebar menu */
div.messengercontacts {
    height: 100%;
    border-right: 1px solid gainsboro;
    /* Full-height: remove this if you want "auto" height */
    width: 10em;
    min-width: 10em;
    /* Set the width of the sidebar */
    top: 0;
    /* Stay at the top */
    left: 0;
    overflow-x: hidden;
    /* Disable horizontal scroll */
}

/* The navigation menu links */
div.messengercontacts a {
    padding: 6px;
    text-decoration: underline;
    color: #818181;
    display: block;
    border-bottom: 1px solid #eee;
}

div.messengercontacts a.messengerShownUser {
    background: #eee;
    color: black;
}

/* When you mouse over the navigation links, change their color */
div.messengercontacts a:hover {
    color: #0084ff;
}

/* Style page content */
.messengercomposer {
    /* Same as the width of the sidebar */
    padding: 0px 10px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .messengercontacts {
        padding-top: 15px;
    }

    .messengercontacts a {
        font-size: 18px;
    }
}

div.loginblock {
    background-color: Khaki;
    border: 1px solid GoldenRod;
    padding: 1em;
}

div.loginblock p {
    margin-bottom: 0px !important;
}

.teilbar-icon {
    height: 100px;
    width: 100px;
    background-position: center;
    /* Center the image */
    background-repeat: no-repeat;
    /* Do not repeat the image */
    background-size: cover;
    /* Resize the background image to cover the entire container */
    display: inline-block;
}

.teilbar-icon-mitfahrbank {
    background-image: url("/teilbar/icon-mitfahrbank.svg");
}

.teilbar-icon-gemeinschaftsmobile {
    background-image: url("/teilbar/icon-gemeinschaftsmobile.svg");
}

.teilbar-icon-mitfahrgelegenheit {
    background-image: url("/teilbar/icon-mitfahrgelegenheit.svg");
}

.teilbar-icon-mitbringgelegenheit {
    background-image: url("/teilbar/icon-mitbringgelegenheit.svg");
}

.teilbar-icon-buchungsplattform {
    background-image: url("/teilbar/icon-buchungsplattform.svg");
}

.teilbar-icon-nachbarschaftsautos {
    background-image: url("/teilbar/icon-nachbarschaftsautos.svg");
}


.site-title,
.site-title a,
.site-title a:visited,
.site-description {
    color: var(--teilbar-green-text) !important;
}

.button.is-link {
    background-color: var(--teilbar-button-back) !important;
    color: var(--teilbar-button-text) !important;
}

.button.is-info {
    background-color: var(--teilbar-button-back) !important;
    color: var(--teilbar-button-text) !important;
}

a,
a:visited {
    text-decoration-line: underline !important;
    text-decoration-style: dashed !important;
    color: var(--teilbar-green-text) !important;
}

.navbar-link:not(.is-arrowless)::after {
    border-color: DimGray !important;
}

.footer {
    background-color: rgba(255, 165, 0, 0.0) !important;
}

/* #BDD000 */

dl {
    width: 100%;
    overflow: hidden;

    padding: 0;
    margin: 0
}

dt {
    float: left;
    width: 30%;
    /* adjust the width; make sure the total of both is 100% */

    padding: 0;
    margin: 0 !important;
}

dd {
    float: left;
    width: 70%;
    /* adjust the width; make sure the total of both is 100% */

    padding: 0;
    margin: 0 !important;
}