.footer {
    margin: 5.2vh;
    padding: 5.2vh;
    box-sizing: border-box;
    background-color: #ffbfb3;
    display: table;
    width: calc(100% - 10.4vh);
}

.footer > .kol {width: 33.33%; float: left; box-sizing: border-box; padding-right: 5%;}

/* footer menu */
.footer-menu {
    column-count: 2;
}

/* social media */
.social-media {display: table;}
.social-media > a {width: 50px; heighT: 50px; margin-right: 25px; background-image: url(../img/logo_MDA_white.png);  background-color: white; background-size: auto 100%; float: left; display: block; }
.social-media > a.facebook {background-position: 0 0px;}
.social-media > a.instagram {background-position: -50px 0px;}
.social-media > a.google {background-position: -102px 0px;}


/* typo */
.footer > .kol h4 {color: white; text-transform: uppercase; font-size: 16px; font-family: 'mob'; font-weight: normal; margin: 0 0 25px; letter-spacing: 2px;}
.footer-menu a {display: block; text-decoration: none; color: black; font-family: 'FuturaPT-BookObl'; margin: 15px 0; transition: all 250ms ease-in-out;}
.footer-menu a:first-child {margin-top: 0;}
.footer-menu a:last-child {margin-bottom: 0;}
.footer-menu a:hover {color: white;}
.footer > .kol a {text-decoration: none; color: black; transition: all 250ms ease-in-out;}
.footer > .kol a:hover {color: white;}

/* mobile */
@media screen and (max-width: 980px) {
    .footer {margin: 10% 8%; width: 84%; padding: 10%;}
    .footer > .kol {width: 100%; padding-right: 0; margin-top: 35px;}
    .footer > .kol:first-child {margin-top: 0;}
}
@media screen and (max-width: 500px) {
    .footer-menu {column-count: 1;}
}
@media screen and (max-width: 380px) {
    .social-media > a {width: 18vw; height: 18vw; margin-right: 2vw;}
    .social-media > a.google {background-position: right top;}
    .social-media > a.instagram {background-position: center top;}
    .social-media > a.facebook {background-position: left top;}
}