footer{
    padding: 2em 0 1em;
    background: #00212e12;
}

.footer-header{
    margin-bottom: 1.5em;
}

.footer-header h1{
    font-weight: 500;
    color: white;
    background: var(--primary4);
    padding: .2em .5em;
    width: 3em;
    border-radius: .3em;
}

.footer-header h1 span{
    color: var(--primary1);
}

.footer-header p{
    font-weight: 300;
    font-size: .8rem;
}

.footer-contents{
    display: flex;
    flex-direction: column;
    gap: 2em;
}

.address{
    display: flex;
    flex-direction: column;
    gap: .5em;
}

.address p{
    display: flex;
    align-items: center;
    gap: .3em;
}

.address p i{
    font-size: 1.5rem;
    color: var(--primary1);
}

.address p{
    font-size: .9rem;
    font-weight: 300;
}

.address p span{
    font-weight: bold;
}

.footer-services h2{
    font-weight: 400;
    margin-bottom: .5em;
}

.ser-link{
    display: flex;
    flex-direction: column;
    gap: .5em;
}

.ser-link a{
    text-decoration: none;
    color: black;
    font-size: .9rem;
    font-weight: 300;
}

.quicklinks h2{
    font-weight: 400;
    margin-bottom: .5em;
}

.links{
    display: flex;
    flex-direction: column;
    gap: .5em;
}

.links a{
    text-decoration: none;
    color: black;
    font-size: .9rem;
    font-weight: 300;
}

.footer-contents{
    margin-bottom: 4em;
}

.copyright{
    text-align: center;
    font-weight: 300;
    position: relative;
    font-size: .9rem;
}

.copyright::after{
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    background: rgba(0, 0, 0, 0.219);
    top: -60%;
    left: 0;
}

@media screen and (min-width: 768px){

    .footer-header h1{
        margin: 0 auto ;
    }

    .footer-header{
        text-align: center;
    }

    .footer-contents{
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
    }
}

@media screen and (min-width: 1024px){

    .footer-container{
        padding: 2em 0 0;
    }

    .footer-header h1{
        margin: 0;
    }

    .footer-header{
        text-align: left;
        display: none;
    }

    .quicklinks h2{
        margin-bottom: 1em;
    }

    .footer-services h2{
        font-weight: 400;
        margin-bottom: 1em;
    }
}