/*Variables*/
:root {
    --accentColor: #96C000;
    --secondaryColor: rgb(220,220,220);
    --secondTitleColor: #a4917e;
    --saturday: #d1cfcf;
    --sunday: #BDBCBC;
}

body {
    font-family: "KievitOT","Noto Sans",Helvetica,sans-serif !important;
    src: local('KievitOT'), url('../KievitOT-Regular.otf') format('woff');
}

th {
    background-color: var(--accentColor) !important;
    color: white !important;
}

h2 {
    color: var(--accentColor) !important;
}

h4 {
    color: var(--secondTitleColor) !important;
}

a {
    color: var(--accentColor) !important;
}

ol, ul {
    margin-top: 0;
    margin-bottom: 0;
}

#headerImg {
    width: 300px;
    height: auto;
    max-width: none;
    margin-top: 1em;
}

#eMailBtn, #pdfBtn, #icalBtn {
    color: var(--accentColor) !important;
    background-color: var(--secondaryColor) !important;
    font-weight: bold;
    outline: none !important;
    border: none !important;
    transition-duration: 0.5s;
    margin-top: 5px;
    width: 100%;
}

    #eMailBtn:hover, #pdfBtn:hover, #icalBtn:hover {
        color: var(--secondaryColor) !important;
        background-color: var(--accentColor) !important;
        outline: none !important;
        border: none !important;
        transition-duration: 0.5s;
    }

#confirmEmail {
    color: white !important;
    background-color: var(--accentColor) !important;
    outline: none !important;
    border: none !important;
    transition-duration: 0.5s;
}

    #confirmEmail:hover {
        color: var(--accentColor) !important;
        background-color: var(--secondaryColor) !important;
        outline: none !important;
        border: none !important;
        transition-duration: 0.5s;
    }

#backBtn, #disableEmail {
    color: white !important;
    background-color: var(--accentColor) !important;
    outline: none !important;
    border: none !important;
    margin-left: 5px;
    transition-duration: 0.5s;
}

    #backBtn:hover, #disableEmail:hover {
        color: var(--accentColor) !important;
        background-color: var(--secondaryColor) !important;
        outline: none !important;
        border: none !important;
        transition-duration: 0.5s;
    }

label {
    font-weight: normal !important;
}

#submitEmail {
    color: white !important;
    background-color: var(--accentColor) !important;
    outline: none !important;
    border: none !important;
    margin-left: 5px;
    transition-duration: 0.5s;
}

    #submitEmail:hover {
        color: var(--accentColor) !important;
        background-color: var(--secondaryColor) !important;
        outline: none !important;
        border: none !important;
        transition-duration: 0.5s;
    }

.Saturday {
    background-color: var(--saturday);
}

.Sunday {
    background-color: var(--sunday);
}

.fixLegend {
    position: fixed;
    padding: 10px;
    top: 0;
    left: 0;
    width: 100%;
    background-color: white;
    border-bottom: 1px solid silver;
}

.mailWasteType {
    padding: 3px;
}

.legendContainer {
    margin-top: 5px;
}

/*.col-md-4{
    padding: 5px;
}*/

#menuButton {
    color: white;
    background-color: var(--accentColor);
    outline: none;
    border: none;
    transition-duration: 0.5s;
    width: 100%;
}

    #menuButton:hover {
        color: var(--accentColor);
        background-color: var(--secondaryColor);
        outline: none;
        border: none;
        transition-duration: 0.5s;
    }

tr {
    height: 45px;
}

.bg-danger {
    height: 37px !important;
}


.tableDay {
    margin-top: 5px;
    width: 50px;
    float: left;
}

.rowHead {
    margin-right: 0 !important;
    margin-left: 0 !important;
}



.weihnachtsbaum {
    background-image: url('../img/baum.jpg');
    background-repeat: no-repeat;
    background-position: 0% 50%;
    display: inline-block;
    width: 20px;
    height: 20px;
}

.laubsammlung_1 {
    background-image: url('../img/laubsammlung_1.png');
}

.laubsammlung_2 {
    background-image: url('../img/laubsammlung_2.png');
}

.laubsammlung_3 {
    background-image: url('../img/laubsammlung_3.png');
}

.laubsammlung_4 {
    background-image: url('../img/laubsammlung_4.png');
}

.laubsammlung_5 {
    background-image: url('../img/laubsammlung_5.png');
}

.tagDerOffenenTuer {
    background-image: url('../img/tagDerOffenenTuer.png');
}

.marathon {
    background-image: url('../img/marathon.png');
}

.sauberhafterSchulweg {
    background-image: url('../img/sauberhafterSchulweg.png');
}

.fruehlingsputz {
    background-image: url('../img/fruehlingsputz.png');
}

.LaubsammlungTermin {
    margin-top: 3px;
    display: inline-block;
    font-size: 11px;
}

.legendTable {
    width: 100%;
}

.footer {
    bottom: 0;
    width: 100%;
    position: absolute;
}


@media (min-width: 768px) {
    .footer {
        position: sticky;
    }
}

@media (min-width: 992px){
    .footer {
        position: sticky;
    }
    
}

@media (min-width: 1200px) {
    .footer {
        position: absolute;
    }
}

.primary-links {
    font-family: Kievit Pro,Noto Sans,Helvetica,Arial,sans-serif;
    font-size: 1.11111rem;
    margin: 0 0 1rem 0;
    list-style: none;
}

.primary-links__link {
    position: relative;
    padding-left: 1.66667rem;
    text-transform: uppercase;
    padding-left: 0
}

.primary-links__bland {
    color: #333;
}

.primary-links__item.department--wirtschaft .primary-links__link {
    color: #ffcd00 !important;
}

.primary-links__item.department--stadt .primary-links__link {
    color: #c80059 !important;
}

.primary-links__item.department--buerger .primary-links__link {
    color: #96c000 !important;
}

.primary-links__item.department--bildung .primary-links__link {
    color: #ee6a00 !important;
}

.primary-links__item.department--kultur .primary-links__link {
    color: #0064a6 !important;
}

.primary-links__item.department--tourismus .primary-links__link {
    color: #27b0e4 !important;
}

.primary-links__item.department--karriere .primary-links__link {
    color: #554596 !important;
}

.no-bullet {
    margin-left: 0;
    list-style: none;
}

    .no-bullet a {
        color: #333 !important;
    }

.page-footer__image {
    margin-bottom: 1rem;
    margin-right: 1rem;
}

a img, a .blur-up {
    border: 0;
}

img, .blur-up {
    max-width: 100%;
    height: auto;
    -ms-interpolation-mode: bicubic;
    display: inline-block;
    vertical-align: middle;
}

img, .blur-up {
    border: 0;
}


user agent stylesheet
img {
    overflow-clip-margin: content-box;
    overflow: clip;
}

.page-footer__end {
    padding-top: 0.55556rem;
    padding-bottom: 0.55556rem;
    color: #fff;
    background-color: #333;
}

    .page-footer__end a {
        color: white !important;
    }

.page-footer ul {
    margin-bottom: 0;
}

@media screen and (min-width: 40em) .page-footer__legal {
    float: right;
}

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

.footer ul {
    padding: 0 !important;
}

.topSpace{
    margin-top:0.5em;
}

.headerEmpty {
    background-color: #96c000;
    padding-bottom: 22.5%
}

#firstHeaderDiv {
    padding-bottom: 10px
}

@media (max-width: 767px) {
    .hidden-xs {
        display: none !important;
    }
}

@media screen and (max-width: 1190px) {
    .hide-on-small-display {
        padding-bottom: 22%
    }
}

@media screen and (max-width: 990px) {
    .hide-on-small-display {
        display: none;
    }
}

@media screen and (max-width: 990px) {
    .change-on-small-display {
        display: inline-flex;
    }
}


@media screen and (max-width: 500px) {
    .hide-on-mobile {
        display: none;
    }
}