footer {
    margin-top: 15rem;

    background-color: var(--Lighthing-gray);

    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 3rem 4rem;
}

footer > img {
    width: 6rem;
    height: 6rem;
}

footer > nav > .nav-list {
    display: grid;
    grid-template-columns: repeat(3, auto);
    gap: 2.5rem;
}

footer > nav > .nav-list > li > a {
    color: var(--Light-gray);

    font-size: 1.8rem;
    font-weight: 500;
    
    transition: all .3s ease-in-out;
}

footer > nav > .nav-list > li > a:hover {
    color: var(--Green);
}

footer > .social-media {
    display: flex;
    gap: 3rem;
}

footer > .social-media > a > img {
    height: 3.5rem;

    transition: all 0.3s ease-in-out;
}

footer > .social-media > a:hover > img {
  filter: invert(39%) sepia(74%) saturate(300%) hue-rotate(131deg) brightness(100%) contrast(89%);
  transform: scale(1.7);
}

@media (max-width: 480px) {
    footer {
        flex-direction: column;
        gap: 2rem;
    }

    footer > img {
        width: 7rem;
        height: 7rem;

        margin: 5rem 0;
    }

    footer > nav > .nav-list {
        grid-template-columns: repeat(1, auto);
        gap: 3rem;

        text-align: center;
    }

    footer > .social-media {
        margin-top: 5rem;

        gap: 4rem;
    }

    footer > .social-media > a > img {
        width: 4rem;
        height: 4rem;
    }

    footer > .social-media > a:hover > img {
        filter: invert(47%) sepia(78%) saturate(565%) hue-rotate(93deg) brightness(95%) contrast(91%);
        transform: scale(1.5);
    }
}