﻿:root {
    --footer-expanded-supergraphic: url("/images/footer-expanded-supergraphic-logo.svg")
}

.ontario-footer {
    color: #fff;
    margin-top: 5rem;
    padding: 4rem 0
}

    .ontario-footer .ontario-columns *:last-child {
        margin-bottom: 0
    }

@media screen and (max-width: 40em) {
    .ontario-footer:not(.ontario-footer--default) .ontario-columns:first-child {
        margin-bottom: 3rem
    }

    .ontario-footer .ontario-footer__expanded-bottom-section .ontario-columns:first-child {
        margin-bottom: 0
    }
}

.ontario-footer__links-container {
    list-style: none;
    margin: 0 0 1rem 0
}

@media screen and (min-width: 73em) {
    .ontario-footer__links-container {
        margin-bottom: .5rem
    }
}

.ontario-footer__links-container--inline {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap
}

@media screen and (min-width: 40em) {
    .ontario-footer__links-container--inline {
        flex-direction: row
    }
}

.ontario-footer__links-container li {
    padding: .25rem 0
}

.ontario-footer__link {
    color: #fff;
    display: inline-block;
    padding: .5rem 0;
    margin: 0;
    text-decoration: underline
}

    .ontario-footer__link:hover, .ontario-footer__link:focus {
        text-decoration: none
    }

    .ontario-footer__link:visited, .ontario-footer__link:active, .ontario-footer__link:hover {
        color: #fff
    }

@media screen and (min-width: 40em) {
    .ontario-footer__link {
        padding: 0;
        margin: 0 3rem 1rem 0
    }
}

.ontario-footer p {
    max-width: 48rem;
    width: 100%
}

    .ontario-footer p a {
        color: #fff;
        font-weight: 600
    }

        .ontario-footer p a:visited {
            color: #fff
        }

        .ontario-footer p a:active {
            color: #e6e6e6
        }

        .ontario-footer p a:focus, .ontario-footer p a:hover {
            text-decoration: none
        }

.ontario-footer__links-container--two-column-list {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    display: block;
    margin: 0
}

@media screen and (min-width: 40em) {
    .ontario-footer__links-container--two-column-list {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2
    }

        .ontario-footer__links-container--two-column-list .ontario-footer__link {
            padding: 0;
            margin: 0 1rem 1rem 0
        }
}

.ontario-footer__links-container--social {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

    .ontario-footer__links-container--social .ontario-footer__link {
        background: transparent;
        border-radius: 45%;
        margin: 0 1rem .75rem 0;
        padding: 0;
        outline: none;
        height: 3.5rem;
        width: 3.5rem;
        display: flex;
        justify-content: center;
        align-items: center
    }

        .ontario-footer__links-container--social .ontario-footer__link:hover, .ontario-footer__links-container--social .ontario-footer__link:focus {
            background-color: #000
        }

            .ontario-footer__links-container--social .ontario-footer__link:hover .ontario-icon, .ontario-footer__links-container--social .ontario-footer__link:focus .ontario-icon {
                fill: #fff
            }

@media screen and (min-width: 40em) {
    .ontario-footer__links-container--social .ontario-footer__link {
        height: 3rem;
        width: 3rem
    }
}

.ontario-footer__links-container--social .ontario-footer__link .ontario-icon {
    fill: #fff;
    width: 2.25rem;
    height: 2.25rem
}

@media screen and (min-width: 40em) {
    .ontario-footer__links-container--social .ontario-footer__link .ontario-icon {
        width: 2rem;
        height: 2rem
    }
}

.ontario-button.ontario-footer__button {
    background-color: #1a1a1a;
    border: .125rem solid #fff;
    border-color: #fff;
    color: #fff;
    margin-bottom: 2rem
}

    .ontario-button.ontario-footer__button:hover, .ontario-button.ontario-footer__button:focus {
        background-color: #4d4d4d
    }

    .ontario-button.ontario-footer__button:active {
        background-color: #666
    }

.ontario-footer__button + .ontario-footer__links-container {
    margin-top: 1.5rem
}

.ontario-footer__expanded-top-section:before {
    background-image: var(--footer-expanded-supergraphic)
}

.ontario-footer.ontario-footer--expanded {
    padding-top: 0;
    background-color: #1a1a1a;
    border-bottom: .25rem solid #4d4d4d
}

.ontario-footer__expanded-top-section {
    background-color: #262626;
    padding: 4rem 0;
    position: relative
}

    .ontario-footer__expanded-top-section:before {
        background-color: #333;
        background-repeat: no-repeat;
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: 165rem;
        background-position: calc(50vw - 125rem) -64rem
    }

@media screen and (min-width: 40em) {
    .ontario-footer__expanded-top-section:before {
        background-size: 250rem;
        background-position: calc(50vw - 195rem) -106rem
    }
}

@media screen and (min-width: 73em) {
    .ontario-footer__expanded-top-section:before {
        background-size: 580rem;
        background-position: calc(50vw - 495rem) -160rem
    }
}

.ontario-footer__expanded-top-section .ontario-footer__link {
    text-decoration: underline
}

    .ontario-footer__expanded-top-section .ontario-footer__link:hover, .ontario-footer__expanded-top-section .ontario-footer__link:focus {
        text-decoration: none
    }

    .ontario-footer__expanded-top-section .ontario-footer__link:active {
        color: #e6e6e6
    }

.ontario-footer__expanded-top-section ul {
    margin-bottom: 0
}

.ontario-expanded-footer__one-third-block {
    margin-bottom: 0
}

    .ontario-expanded-footer__one-third-block:first-of-type, .ontario-expanded-footer__one-third-block:nth-child(2) {
        margin-bottom: 3rem
    }

@media screen and (min-width: 40em) {
    .ontario-expanded-footer__one-third-block {
        margin-bottom: 0
    }

        .ontario-expanded-footer__one-third-block:first-of-type {
            margin-bottom: 3rem
        }

        .ontario-expanded-footer__one-third-block:nth-child(2) {
            margin-bottom: 0
        }
}

@media screen and (min-width: 73em) {
    .ontario-expanded-footer__one-third-block {
        margin-bottom: 0
    }

        .ontario-expanded-footer__one-third-block:first-of-type {
            margin-bottom: 0
        }
}

.ontario-footer__expanded-bottom-section {
    background-color: #1a1a1a;
    padding-top: 4rem
}


:root {
    --footer-default-supergraphic: url("/images/footer-default-supergraphic-logo.svg")
}

.ontario-footer {
    color: #fff;
    margin-top: 5rem;
    padding: 4rem 0
}

    .ontario-footer .ontario-columns *:last-child {
        margin-bottom: 0
    }

@media screen and (max-width: 40em) {
    .ontario-footer:not(.ontario-footer--default) .ontario-columns:first-child {
        margin-bottom: 3rem
    }

    .ontario-footer .ontario-footer__expanded-bottom-section .ontario-columns:first-child {
        margin-bottom: 0
    }
}

.ontario-footer__links-container {
    list-style: none;
    margin: 0 0 1rem 0
}

@media screen and (min-width: 73em) {
    .ontario-footer__links-container {
        margin-bottom: .5rem
    }
}

.ontario-footer__links-container--inline {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap
}

@media screen and (min-width: 40em) {
    .ontario-footer__links-container--inline {
        flex-direction: row
    }
}

.ontario-footer__links-container li {
    padding: .25rem 0
}

.ontario-footer__link {
    color: #fff;
    display: inline-block;
    padding: .5rem 0;
    margin: 0;
    text-decoration: underline
}

    .ontario-footer__link:hover, .ontario-footer__link:focus {
        text-decoration: none
    }

    .ontario-footer__link:visited, .ontario-footer__link:active, .ontario-footer__link:hover {
        color: #fff
    }

@media screen and (min-width: 40em) {
    .ontario-footer__link {
        padding: 0;
        margin: 0 3rem 1rem 0
    }
}

.ontario-footer--default {
    position: relative;
    background-color: #1a1a1a;
    border-bottom: .25rem solid #4d4d4d
}

    .ontario-footer--default:before {
        background-image: var(--footer-default-supergraphic);
        background-size: 170rem;
        background-position: calc(50vw - 136rem) -64rem;
        background-color: #333;
        background-repeat: no-repeat;
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }


@media screen and (min-width: 40em) {
    .ontario-footer--default:before {
        background-size: 690rem;
        background-position: calc(50vw - 600rem) -160rem
    }
}