.footer {
    background-color: var(--dark-01);
    background: var(--dark-01);
    background: linear-gradient(135deg, var(--dark-01) 0%, var(--dark-focus) 100%);
    color: var(--base-01);
    font-size: var(--text-sm);
    font-weight: 500;
    padding-top: 2rem;
}

    .footer .footer-section {
        margin-bottom: 2rem;
    }

    .footer .logo-container img {
        content: var(--reverselogo);
        height: 2rem;
        width: auto;
        margin-bottom: 2rem;
    }

    .footer .collapsible .collapsible-content {
        max-height: 0;
        overflow: hidden;
        padding: 0;
        margin: 0;
        list-style: none;
        min-width: 150px;
        transition: var(--five);
    }

    .footer .collapsible.active .collapsible-content {
        max-height: 20rem;
        transition: var(--five);
    }

    .footer .engagement-container {
        padding-top: .75rem;
        padding-bottom: .75rem;
        display: flex;
        gap: 1rem;
        flex-wrap: wrap;
    }

        .footer .engagement-container > div {
            display: flex;
            align-items: center;
        }

    .footer .partner-container a {
        text-decoration: none;
        color: var(--primary);
    }

        .footer .partner-container a:hover {
            color: var(--primary-focus);
        }

    .footer .partner-container .fa-circle {
        color: var(--primary);
    }

        .footer .partner-container .fa-circle:hover {
            color: var(--primary-focus);
        }

    .footer .partner-container .fa-handshake-angle {
        color: var(--dark-01);
    }

    .footer .social-media-container .fa-stack-2x {
        color: var(--base-mute);
        transition: var(--three);
    }

    .footer .social-media-container .fa-stack-1x {
        color: var(--base-01);
        top: -1px;
        transition: var(--three);
    }

    .footer .social-media-container .fa-stack-2x:hover {
        color: var(--base-content);
        transition: var(--three);
    }

    .footer .org-details-container {
        font-size: var(--text-xs);
        margin-bottom: 1rem;
    }

        .footer .org-details-container a {
            color: var(--base-04);
            text-decoration: none;
            font-weight: 600;
        }

            .footer .org-details-container a:hover {
                color: var(--dark-content);
            }

    .footer .nav-title {
        color: var(--dark-content);
        text-decoration: none;
        margin: .5rem 0;
        display: block;
        font-size: var(--text-sm);
    }

        .footer .active .nav-title, .footer .nav-title:hover {
            color: var(--base-04);
        }

            .footer .active .nav-title i {
                transform: rotate(180deg);
                transition: var(--three);
                padding-right: .25rem;
                color: var(--base-04);
            }

        .footer .nav-title i {
            color: var(--base-02);
            position: relative;
            top: 1px;
            padding-left: .25rem;
            transform: rotate(0);
            transition: var(--three);
        }

    .footer .nav-sub-link a {
        color: var(--tertiary);
        text-decoration: none;
        margin: .5rem 0;
        display: block;
        font-size: var(--text-xs);
        font-weight: lighter;
    }

        .footer .nav-sub-link a:hover {
            color: var(--tertiary-focus);
        }

    .footer hr {
        border: none;
        border-top: .5px solid var(--base-04);
        opacity: .2;
        margin-left: -.75rem;
        width: 100vw;
    }

    .footer .sub-footer {
        padding: .75rem 0;
        display: flex;
        flex-direction: column;
        gap: .5rem;
    }

        .footer .sub-footer a {
            text-decoration: none;
            color: var(--base-04)
        }

            .footer .sub-footer a:hover {
                color: var(--dark-content);
            }

    .footer .org-links {
        display: flex;
        gap: .5rem;
    }

    .footer .powered-by-cadmore {
        display: flex;
        gap: .325rem;
        align-items: center;
        color: var(--base-04);
    }

    .footer .cadmore-c {
        content: var(--i-cadmore-c);
        height: 1.25rem;
        filter: brightness(0) invert(1);
        transition: var(--three);
    }

    .footer .powered-by-cadmore:hover .cadmore-c {
        filter: none;
        transition: var(--three);
    }

@media only screen and (min-width: 360px) {
    /* CSS rules */
}

@media only screen and (min-width: 500px) {
    /* CSS rules */
}

@media only screen and (min-width: 640px) {
    .footer .org-details-container {
        font-size: var(--text-base);
    }

    .footer hr {
        margin: 0 -1.25rem;
    }
}

@media only screen and (min-width: 768px) {
    .footer .wrapper:nth-of-type(1) {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .footer .footer-section {
        width: 100%;
    }

    .footer .collapsible {
        width: calc((100% - 3rem) / 4);
    }

    .footer .nav-title i {
        display: none;
    }

    .footer .collapsible .collapsible-content {
        max-height: 20rem;
    }

    .footer .nav-title {
        font-size: var(--text-base);
    }

    .footer .nav-sub-link a {
        font-size: var(--text-sm);
    }
}

@media only screen and (min-width: 1024px) {
    .footer {
        padding-bottom: 0;
    }

        .footer .logo-container {
            width: 100%;
        }

        .footer .footer-section {
            width: 40%;
        }

        .footer .collapsible {
            width: min-content;
        }

        .footer .nav-title {
            margin-top: 0;
        }

        .footer hr {
            margin-left: -2rem;
        }

        .footer .sub-footer {
            flex-direction: row;
            gap: 1rem;
        }

        .footer .org-links {
            margin-right: auto;
        }

        .footer hr {
            margin: 0 -2.5rem;
        }
}

@media only screen and (min-width: 1280px) {
    /* CSS rules */
}

@media only screen and (min-width: 1536px) {
    .footer hr {
        margin-left: calc((90rem - 100vw) / 2);
        margin-right: calc((90rem - 100vw) / 2);
    }
}








