.detail-subtitle,
.detail-title {
    font-weight: 400;
    letter-spacing: .040em;
    font-family: 'Source Sans 3', sans-serif;
    color: #fff
}

#quick-links,
#social-links {
    display: grid;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    row-gap: 20px
}

.ref-link,
.ref-link:hover {
    transition: color .2s ease-out
}

footer {
    display: grid;
    grid-template-rows: min-content 2fr 1fr;
    width: inherit;
    height: 540px;
    background-color: var(--dark-grey)
}

#footer-title {
    padding-top: 40px;
    margin-left: 100px;
    color: #fff;
    font-family: Cinzel, serif;
    font-size: 40px;
    font-weight: 400;
    letter-spacing: .080em
}

#footer-links {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    height: 300px;
    padding-inline-start: 100px;
    padding-inline-end: 100px;
    margin-block-start: 50px
}

#contact {
    display: grid;
    row-gap: 10px
}

#call-us,
#email-us,
#location {
    display: flex
}

#email-us,
#location {
    cursor: pointer
}

.contact-details {
    margin-inline-start: 20px;
    margin-inline-end: 20px
}

.contact-icon {
    height: 30px;
    width: 30px
}

.detail-title {
    font-size: 24px
}

.detail-subtitle {
    font-size: 12px;
    margin-block-start: 5px
}

#quick-links-title,
#social-links-title {
    font-family: 'Source Sans 3', sans-serif;
    color: #fff;
    font-size: 32px;
    font-weight: 500;
    text-decoration-line: underline;
    letter-spacing: .040em
}

#copyright-claims,
.quick-link-name,
.social-link-name {
    font-family: 'Source Sans 3', sans-serif;
    font-size: 24px;
    font-weight: 400;
    letter-spacing: .040em;
    color: #fff
}

#facebook,
#instagram,
#whatsapp {
    display: flex;
    align-items: flex-start;
    column-gap: 15px
}

.quick-link-name,
.social-link-name {
    margin-bottom: auto;
    width: max-content;
    height: max-content;
    text-decoration: none;
    cursor: pointer
}

@media only screen and (max-width:1360px) {
    #footer-title {
        font-size: 32px
    }

    .contact-icon {
        height: 25px;
        width: 25px
    }

    .detail-title {
        font-size: 22px
    }

    #quick-links-title,
    #social-links-title {
        font-size: 24px
    }

    .social-icon {
        width: 20px;
        height: 20px
    }

    .quick-link-name,
    .social-link-name {
        font-size: 18px
    }
}

#quick-links {
    grid-template-columns: 1fr 1fr;
    column-gap: 20px
}

#quick-links-title {
    grid-column: 1/3
}

#copyright-claims {
    align-self: end;
    display: flex;
    align-items: center;
    padding-inline-start: 100px;
    padding-block: 20px;
    line-height: 150%;
    border-top: 1px solid var(--light-grey)
}

@media only screen and (max-width:1260px) {
    #copyright-claims {
        font-size: 16px
    }
}

@media only screen and (max-width:900px) {
    footer {
        height: 1000px;
        justify-content: center
    }

    #footer-title {
        margin-left: 70px;
        font-size: 24px
    }

    #footer-links {
        grid-template-columns: 1fr;
        row-gap: 60px
    }

    #copyright-claims {
        padding-inline-start: 20px;
        padding-inline-end: 20px;
        text-align: center;
        line-height: 150%
    }
}

@media only screen and (max-width:560px) {
    #copyright-claims {
        font-size: 14px
    }
}

@media only screen and (max-width:460px) {
    #copyright-claims {
        padding-inline-start: 60px;
        padding-inline-end: 60px
    }
}

.ref-link {
    display: contents;
    color: inherit;
    text-decoration: none
}

.ref-link:hover {
    color: #ffdd60
}