footer{
    background-color: var(--braun-light);
    padding: 1.5rem 0;
}
#footer *{
    color: var(--secondary);
}

footer nav.footer{
    align-items: normal;
}

footer nav a.btn{
    padding:0.5rem 1rem;
    font-size: 1rem;
    transition: all 0.3s ease-in-out;
}
footer nav a.btn:after {
    content: '';
    position: absolute;
    left: 1rem;
    bottom: 0.3rem;
    height: 2px;
    width: 0;
    background: var(--secondary);
    opacity: 0;
    transition: all 0.3s ease-in-out;
}
footer nav a.btn:hover:after, .activ nav  a.btn:after {
    opacity: 0.6;
    background: #ffffff;
    width: calc(100% - 2rem);
}

.footer-l, .footer-m, .footer-r  {
    display: flex;
    flex-direction: column;
}

@media screen and (max-width: 940px){
    footer nav a.btn:hover{
        background-color: transparent;
    }
    nav a.btn{
        padding: 0.8rem 1rem;
    }
}

@media screen and (max-width: 480px){
    footer nav.footer  {
        flex-direction: column;
        align-items: center;
    }
    footer nav a.btn {
        padding: 0.5rem 1rem;
        font-size: 1.5rem;
    }
    .footer-l{
        order: 2;
        text-align: center;
    }
    .footer-m{
        order: 3;
        text-align: center;
    }
    .footer-r{
        order: 1;
        text-align: center;
    }
}