/* ----- Animated Burger menu ----- */
.navbar-toggler .animated-burger,
.navbar-toggler .animated-burger::before,
.navbar-toggler .animated-burger::after {
    background: #333333;
    content: '';
    display: block;
    height: 2px;
    position: absolute;
    transition: background ease .3s, top ease .3s .3s, transform ease .3s;
    width: 30px;
}

/*.navbar-toggler:hover .animated-burger,*/
/*.navbar-toggler:hover .animated-burger::before,*/
/*.navbar-toggler:hover .animated-burger::after {*/
/*    background: #47B74B;*/
/*}*/

.navbar-toggler .animated-burger {
    left: 0px;
    top: 15px;
}

.navbar-toggler .animated-burger::before {
    top: -10px;
}

.navbar-toggler .animated-burger::after {
    top: 10px;
}

.navbar-toggler.opened .animated-burger {
    background: transparent;
}

.navbar-toggler.opened .animated-burger::before {
    transform: rotate(45deg);
}

.navbar-toggler.opened .animated-burger::after {
    transform: rotate(-45deg);
}

.navbar-toggler.opened .animated-burger::before,
.navbar-toggler.opened .animated-burger::after {
    top: 0;
    transition: top ease .3s, transform ease .3s .3s;
}







/* ----- Open Close Arrow for responsive menu ----- */
.open-close-btn-wrapper
{
    /* Beispiel: Die Position immer am Zielelement stylen */
    position: absolute;
    /*top: 50%;*/
    /*left: 50%;*/
    /*transform: translate(-50%, -50%)*/

    height: 0.5em;
    width: 0em;
}

.open-close-btn
{
    font-size: 15px;
    -webkit-appearance: none;
    border: none;
    width: 1em;
    height: 1em;
    text-indent: -9999px;
    background-color: transparent;
    outline: none;
}
.open-close-btn.first-submenu-level
{
    color: #890E3A;
}
.open-close-btn.second-submenu-level
{
    color: #ffffff;
}

.open-close-btn-wrapper button:hover,
.open-close-btn:hover
{
    background-color: transparent !important;
}

.open-close-btn:before,
.open-close-btn:after
{
    content: '';
    display: block;
    position: absolute;
    width: 1.5em;
    height: 0.2em;
    border-radius: 2em;
    top: 45%;
    transform: rotate(45deg);
    transition: all .3s ease;
}

.open-close-btn.first-submenu-level:before,
.open-close-btn.first-submenu-level:after
{
    background-color: #890E3A;
}
.open-close-btn.second-submenu-level:before,
.open-close-btn.second-submenu-level:after
{
    background-color: #ffffff;
}


.open-close-btn:before
{
    left: -1.55em;
}

.open-close-btn:after
{
    transform: rotate(-45deg);
    right: -0.9em;
}

.open-close-btn.active:before
{
    left: -0.5em;
}

.open-close-btn.active:after
{
    right: 0;
}