nav {
display:block;
margin: 0 auto;
}

#menu1 {
    display:table;
    POSITION:fixed;
    POSITION:fixed;
    z-index:0;
    top:-200%;left:0%;
    height:100%;
    width:100%;
    margin:0;
    padding: 0;
    transition:all 2s;
}

    #menu1 ul {
        display: table-cell;
        background: #E9E9ED; /*weis*/
        vertical-align: middle;
        margin: 0 auto;
        padding: 0rem 1rem 0rem 1rem;
    }

#menu1 li {list-style-type: none;
display:block;
text-align:center;
padding:0px 5px 1px 10px;
margin:0rem;
}

#menu1 li a {
    display:inline-block;
    width:100%;
    background:#F7F7F7; /*weis*/
    color:#1f1f1f;  /*grau-schwarz*/
    text-align:left;
    text-decoration : none;
    font-size:1.6rem;
    letter-spacing:2px;
    padding: .5rem .5rem .5rem 1.5rem;
    margin: 0;
    font-weight:normal;
    text-transform:uppercase;
}



#menu1 li a:hover {background:#fff;
color:#1f1f1f;
text-decoration:none;
}


#menu1  li#aktuell a {background:#fff;
color:#1f1f1f;
font-weight:normal;
text-decoration:none;
}

#menu1  li#aktuell a:hover {background:#fff; }


nav label.button-open {
    display: inline-block;
    text-align: center;
    POSITION: fixed;
    top: 0rem;
    right: 1rem;
    z-index: 2;
    padding: 0rem;
    background: #f3f5f3; /*weis*/
    color: #1f1f1f; /*grau-schwarz*/
    height: 3rem;
    width: 3rem;
    line-height: 3rem;
    font-size: 1.8rem;
    border-radius: .5rem;
    cursor: pointer;
}



nav label.button-close  {
    display:inline-block;
    text-align:center;
    POSITION:fixed;
    top:0rem; 
    right:1rem;
    z-index:3;
    padding:0rem;
    background:transparent;
    color:#1f1f1f;
    height:3rem;
    width:3rem;
    line-height:3rem;
    font-size:1.8rem;
    border-radius:.5rem;
    cursor:pointer;
    opacity:0;
}


input[type=checkbox]{
display: none;
}

input#open-menue:checked ~ #menu1  {
top:0;
z-index:2;
transition:all 1s ;
}

input#open-menue:checked ~  label.button-close  {
opacity:1;
transition:all 2s ease-out;
}



/* --------- CSS Bildschirmabfragen ----------------------- */


/*----------------- Schrift icons --------------------------*/

.fa,
.fas,
.far,
.fal,
.fad,
.fab {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

.fa-comment:before {
    content: "\f075";
}

.fa-heart:before {
    content: "\f004";
}

.fa-heart-broken:before {
    content: "\f7a9";
}

.fa-search:before {
    content: "\f002";
}

.fa-search-dollar:before {
    content: "\f688";
}

.fa-search-location:before {
    content: "\f689";
}

.fa-search-minus:before {
    content: "\f010";
}

.fa-search-plus:before {
    content: "\f00e";
}

.fa-bars:before {
    content: "\f0c9";
}
@font-face {
    font-family: "Font Awesome 5 Brands";
    font-style: normal;
    font-weight: normal;
    src: url(../fonts/fa/fa-brands-400.eot);
    src: url(../fonts/fa/fa-brands-400.eot?#iefix) format("embedded-opentype"),url(../fonts/fa/fa-brands-400.woff2) format("woff2"),url(../fonts/fa/fa-brands-400.woff) format("woff"),url(../fonts/fa/fa-brands-400.ttf) format("truetype"),url(../fonts/fa/fa-brands-400.svg#fontawesome) format("svg")
}

.fab {
    font-family: "Font Awesome 5 Brands"
}

@font-face {
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/fa/fa-regular-400.eot);
    src: url(../fonts/fa/fa-regular-400.eot?#iefix) format("embedded-opentype"),url(../fonts/fa/fa-regular-400.woff2) format("woff2"),url(../fonts/fa/fa-regular-400.woff) format("woff"),url(../fonts/fa/fa-regular-400.ttf) format("truetype"),url(../fonts/fa/fa-regular-400.svg#fontawesome) format("svg")
}

.far {
    font-weight: 400
}

@font-face {
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 900;
    src: url(../fonts/fa/fa-solid-900.eot);
    src: url(../fonts/fa/fa-solid-900.eot?#iefix) format("embedded-opentype"),url(../fonts/fa/fa-solid-900.woff2) format("woff2"),url(../fonts/fa/fa-solid-900.woff) format("woff"),url(../fonts/fa/fa-solid-900.ttf) format("truetype"),url(../fonts/fa/fa-solid-900.svg#fontawesome) format("svg")
}

.fa, .far, .fas {
    font-family: "Font Awesome 5 Free"
}

.fa, .fas {
    font-weight: 900
}

/* ==================================== ab 480 pixel ================================== */
@media (min-width: 480px) {

#menu1 li a {width:33rem; }

}


/* ===================================== ab 760 pixel ================================= */
@media (min-width: 760px) {

nav label.button-open,nav label.button-close {display:none; }

nav {padding:0rem 0rem;  }

#menu1 {width:100%;height:0rem;margin:0;padding:0rem 0rem;box-shadow:none; POSITION:relative;top:0;left:0;
opacity:1;transform: scale(1) ;
background:#26374A;
z-index:2;
}

#menu1 ul {background:transparent;text-align:center; }

#menu1 li {display:inline-block;padding:0;margin:0 -.25rem;}
#menu1 li a {width:auto;background:transparent;font-size:1.4rem; padding:.5rem .6rem; color:#efefef;font-weight:normal; }
#menu1 li a:hover {color:#fff;background:#4F7299;text-decoration:none; }

#menu1 li#aktuell a {color:#fff;background:#4F7299;  }
#menu1 li#aktuell a:hover {color:#fff;background:#4F7299; }

}