footer{

    background-color: var(--footer-background);
    padding-top: 4rem;
    padding-bottom: 5rem;
    text-align: center;

    ul {
        padding: 0;
        li{
            list-style-type: none; 
        } 
    }
    div.link{
        display: flex;
        flex-direction: column;
        gap: 40px;
        align-items: center;
        ul{
            width: 100%;
            display: flex;
            justify-content: space-evenly;
            @media(min-width:425px){
                justify-content: center;
                gap: 57px;
            }
            padding: 0;
            margin: 0;
            li{
                list-style-type: none;
                a{
                    line-height: 25px;
                    letter-spacing: -0.13px;
                    font-size: 18px;
                    font-family: var(--font-text);
                    text-decoration: none;
                    color: var(--footer-textColor);
                    transition: color 0.1s linear;
                    &:hover{
                        cursor: pointer;
                        color: var(--footer-hover);
                    }
                }
            }
        }
    }

    div.media{
        margin-top: 88px;
        ul{
            display: flex;
            justify-content: center;
            gap: 28px;

            li{
                svg path{
                    transition: fill 0.1s linear;
                }
                &:hover{
                    cursor: pointer;
                }
                &:hover svg path{
                    fill: var(--footer-hover);
                }
            }
        }
    } 
    

    
}