/* @override 
	http://neu.preuskerbuecherei.de/files/2017/css/navigation.css */
/*a{
    color: #7bb3b8;
}*/
#mainmenu-desktop.mod_navigation.block {
    overflow: visible;
}

#mainmenu-desktop {
    font-family: 'EngschriftDIND';
    font-weight: normal;
    font-style: normal;
    /*  margin-top: 20px;*/
    background-color: #FFFAEE;
    font-variant: small-caps;
    height: 80px;
}

#mainmenu-desktop ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

#mainmenu-desktop ul.level_1 {
    padding-top: 20px;
    display: flex;
}

#mainmenu-desktop li a,
#mainmenu-desktop li span,
.active {
    text-decoration: none;
    letter-spacing: 1px;
}

#mainmenu-desktop li .active,
#mainmenu-desktop li.trail a.trail,
#mainmenu-desktop li a:hover,
li.active.first {
    color: #EA960F;
    font-weight: normal;
}

/* definition für li der ersten ebene */
#mainmenu-desktop ul.level_1 > li:nth-child(n) a:before,
#mainmenu-desktop ul.level_1 > li:nth-child(n) .active:before {
    display: block;
    padding-bottom: 10px;
    height: 32px;
}

#mainmenu-desktop ul.level_1 > li:nth-child(1) > a:before {
    content: url('../inhaltsgrafiken/Icons/aktuelles.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(1) > .active:before,
#mainmenu-desktop ul.level_1 > li:nth-child(1) > .trail:before,
#mainmenu-desktop ul.level_1 > li:nth-child(1) > a:hover:before {
    content: url('../inhaltsgrafiken/Icons/aktuelles-1.png');
    /*position: relative;*/
    /*top: 0px;*/
}

/*#mainmenu-desktop ul.level_1 > li:nth-child(1) > .active {
content: url('../inhaltsgrafiken/Icons/aktuelles-1.png');
position: relative;
top: -3.5px;
}*/
#mainmenu-desktop ul.level_1 > li:nth-child(2) > a:before {
    content: url('../inhaltsgrafiken/Icons/preusker.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(2) > .active:before,
#mainmenu-desktop ul.level_1 > li:nth-child(2) > a:hover:before,
#mainmenu-desktop ul.level_1 > li:nth-child(2) > .trail:before {
    content: url('../inhaltsgrafiken/Icons/preusker-1.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(3) > a:before {
    content: url('../inhaltsgrafiken/Icons/service.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(3) > .active:before,
#mainmenu-desktop ul.level_1 > li:nth-child(3) > a:hover:before,
#mainmenu-desktop ul.level_1 > li:nth-child(3) > .trail:before {
    content: url('../inhaltsgrafiken/Icons/service-1.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(4) > a:before {
    content: url('../inhaltsgrafiken/Icons/online-1.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(4) > .active:before,
#mainmenu-desktop ul.level_1 > li:nth-child(4) > a:hover:before,
#mainmenu-desktop ul.level_1 > li:nth-child(4) > .trail:before {
    content: url('../inhaltsgrafiken/Icons/online.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(5) > a:before {
    content: url('../inhaltsgrafiken/Icons/veranstaltungen.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(5) > .active:before,
#mainmenu-desktop ul.level_1 > li:nth-child(5) > a:hover:before,
#mainmenu-desktop ul.level_1 > li:nth-child(5) > .trail:before {
    content: url('../inhaltsgrafiken/Icons/veranstaltungen-1.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(6) > a:before {
    content: url('../inhaltsgrafiken/Icons/kinder.png');
}

#mainmenu-desktop ul.level_1 > li:nth-child(6) > .active:before,
#mainmenu-desktop ul.level_1 > li:nth-child(6) > a:hover:before,
#mainmenu-desktop ul.level_1 > li:nth-child(6) > .trail:before {
    content: url('../inhaltsgrafiken/Icons/kinder-1.png');
}

#mainmenu-desktop > ul.level_1 > li {
    font-size: 19px;
    text-align: center;
    /*    display: inline-block;*/
    text-transform: uppercase;
    padding: 0px 17px;
    height: 80px;
    position: relative;
    background-color: #FFFAED;
}

#mainmenu-desktop ul.level_1 > li > a,
#mainmenu-desktop ul.level_1 > li > span {
    display: block;
    color: #4E878C;
    /*line-height: 20px;*/
    text-align: center;
    margin-bottom: -5px;
}

#mainmenu-desktop ul.level_1 > li a:hover {
    color: #EA960F;
}

/* definition fuer ul der ebene 2 */
#mainmenu-desktop ul.level_2 {
    min-width: 200px;
    position: absolute;
    top: 62px;
    /*oder 60*/
    margin: 17px 0 0 0;
    behavior:   url('assets/css3pie/1.0.0/PIE.htc');
    opacity: 0;
    z-index: -1;
    background-color: #FFFAED;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    height: auto;
    -webkit-transition: opacity 1s ease;
    -moz-transition: opacity 1s ease;
    -o-transition: opacity 1s ease;
    transition: opacity 1s ease, transform 0.7s ease;
    transform: translateY(-100%);
    /* box-shadow: 0px 4px 5px -2px #cbcaca inset;*/
    box-shadow: 0 0 8px #CBCACA;
}

#mainmenu-desktop li.last ul.level_2 {
    right: 20px;
    min-width: 200px;
}

#mainmenu-desktop li:hover > ul.level_2,
#mainmenu-desktop li:focus > ul.level_2,
#mainmenu-desktop li:active > ul.level_2 {
    opacity: 0.95;
    transition: opacity 0.9s ease;
    /* z-index:1000;*/
    height: auto;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
    transition: opacity 1s ease, transform 0.7s ease;
    transform: translateY(0%);
}

#mainmenu-desktop ul.level_2 li {
    font-size: 19px;
    width: 100%;
    padding: 0px;
    margin: 0px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    font-variant: normal;
    height: 100%;
}

#mainmenu-desktop ul.level_2 li a,
#mainmenu-desktop ul.level_2 li span,
#mainmenu-desktop ul.level_2 > li > a.trail,
#mainmenu-desktop ul.level_2 > li > .active {
    display: block;
    margin-right: 0;
    margin-left: 0;
    padding: 8px 10px;
    text-align: left;
    color: #79B3B9;
    text-transform: none;
}

#mainmenu-desktop ul.level_2 li a:hover,
#mainmenu-desktop ul.level_2 li a:hover span {
    background: #79B3B9;
    color: #FFF;
}

#mainmenu-desktop ul.level_2 > li > .active {
    color: #EA960F;
    padding: 15px 20px;
}

.dk_mobilmenu {
    margin: 20px -70px 20px 20px;
    width: 33px;
    height: 33px;
    border: 2px solid #7BB3B8;
    border-radius: 100px;
    padding: 10px;
}

.dk_mobilmenu a {
    font-size: 22px;
    fill: #7bb3b8;
}

/* bis 667px mobiles Menü eingeblendet */
@media only screen and (max-width: 667px) {
    #mainmenu-desktop {
        display: none;
    }
    
    .dk_mobilmenu {
        display: inline-block;
    }
    
    #main .inside {
        margin: 0px 10px 0px 10px;
    }
    
    .startseite #main .inside {
        margin: 0px;
    }
}

/* ab 668px mobiles Menü ausgeblendet */
@media only screen and (min-width: 668px) {
    .dk_mobilmenu {
        display: none;
    }
    
    #mainmenu-desktop li.last ul.level_2 {
        background-image: url('../inhaltsgrafiken/Icons/preusker-eule.png');
        background-position: 89px 24px;
        background-size: 50%;
        background-repeat: no-repeat;
    }
}