body > footer
{
    @include inverted;

    .contents
    {
        @include column-container;

        padding-top: steps(2.5);
        padding-bottom: steps(2);

        > .content
        {
            @include one-quarter-column;

            padding-top: steps(1);
            padding-bottom: steps(1);
        }

        @include for-at-least-normal-tablets
        {
            padding-top: steps(3);

            > .content
            {
                padding-top: steps(1);
                padding-bottom: steps(1);
            }
        }
    }

    p
    {
        @include baseline-box(16px, steps(3), 0.5px);

        margin-bottom: 0;
    }

    .svg.icon
    {
        margin-right: steps(1.5);
    }

    a.phone:not(.button)
    {
        color: $color-text-inverted-lighter;
    }

    address.primary
    {
        color: $color-text-inverted-lighter;

        .label
        {
            @include font-dimensions(16px, steps(2), 0.5px);

            display: inline-block;
            max-width: 36%;
            margin-right: steps(3);
            vertical-align: middle;
        }

        a.phone
        {
            @include font-dimensions(41px, steps(4.5), 2.2px);

            vertical-align: middle;

            .svg.icon,
            .svg.icon svg
            {
                width: steps(3.5);
                height: steps(3.5);
            }

            .svg.icon
            {
                margin-top: -7px;
                margin-right: 0;
            }
        }

        @include for-at-least-normal-tablets
        {
            .label
            {
                @include font-dimensions(18px, steps(2), 0.8px);

                display: block;
                max-width: none;
                padding: 4px 0 6px;
                margin: 0 0 steps(1);

                font-weight: bold;
            }

            a.phone
            {
                display: inline-block;
                padding: 4px 0 6px;
                margin-left: steps(-1);
            }
        }
    }

    address.additional
    {
        a
        {
            display: inline-block;
            padding-left: steps(3.5);
        }

        .svg.icon
        {
            margin-left: steps(-3.5);
        }
    }
}
