herereadthis/redwall

@footer_bg_padding_bottom: 3rem;

[role="contentinfo"] {
    margin-top: 4rem;
    background-repeat: no-repeat;

    @media @da_baseline {
        background-size: 50% 0.5rem;

        &, & .bellmaker_container {
            .triple_hr;
            background-position: 0% 0%;
        }
        .bellmaker_container {
            padding-top: 0.5rem;
            background-size: 100% 0.5rem;
        }
        .content_container {
            padding-top: 0;

            > h4:first-child {
                padding-top: 2rem;
            }
        }
    }
    @media @da_small {
        .content_container {
            // should be 39.6rem
            // height: round(0.61803 * 10 * ((10 / 12) * @pw_small)) / 10;
            height: 64rem + @footer_bg_padding_bottom;
        }
    }
    @media @da_medium {
        .content_container {
            // should be 39.6rem
            // height: round(0.61803 * 10 * ((8 / 12) * @pw_medium)) / 10;
            height: 64rem + @footer_bg_padding_bottom;
        }
        .content_container {
            > h4:first-child {
                padding-top: 2.2rem;
            }
        }
    }
    @media @da_large {
        background-size: 50% 0.7rem;

        &, & .bellmaker_container {
            .triple_hr2;
        }
        .bellmaker_container {
            padding-top: 0.7rem;
            background-size: 100% 0.7rem;
        }
        .content_container {
            // should be 47.5rem
            // height: round(0.61803 * 10 * ((8 / 12) * @pw_large)) / 10;
            height: 48rem + @footer_bg_padding_bottom;
        }
        .content_container {
            > h4:first-child {
                padding-top: 2.6rem;
            }
        }
    }
    @media @da_x_large {
        .content_container {
            // should be 55.4rem
            // height: round(0.61803 * 10 * ((8 / 12) * @pw_x_large)) / 10;
            height: 41rem + @footer_bg_padding_bottom;
        }
    }
}
#footer_background {
    background-repeat: no-repeat;
}

.creative_commons_license {
    overflow: auto;
    padding-top: 2rem;
    overflow: hidden;

    > span {
        display: block;
    }
}
.creative_commons_image {
    display: block;
    float: left;
    width: 8.8rem;
    height: 3.1rem;
    //text-indent: -9999px;
    //background: transparent url("../../assets/images/css/icon_logo_sprites.png") scroll no-repeat 0 -10rem;
    background-size: 10rem 20rem;

    @media @da_baseline {
        margin: 0.5rem 0.5rem 0.4rem 0;
    }
    @media @da_medium {
        margin: 0.6rem 0.5rem 0.5rem 0;
    }
    @media @da_large {
        margin: 1.1rem 0.5rem 0.9rem 0;
    }
}

#social_linking {
    li {
        > a {
            border-radius: 50%;
            border-style: solid;
            background-color: #FFF;

            &:link, &:visited {
                margin: 0.1rem;
                border-width: 0.2rem;
                border-color: @code_grey_dark;

                svg {
                    fill: @code_grey_dark;
                }
            }
            &:hover {
                margin: 0;
                border-width: 0.3rem;
                border-color: @code_a_hover;

                svg {
                    fill: @code_a_hover;
                }
            }
            &:active, &:focus {
                margin: 0;
                border-width: 0.2rem;
                border-color: @code_a_visited;
                padding: 0.1rem;

                svg {
                    fill: @code_a_visited;
                }
            }
        }
    }
    @media @da_baseline {
        margin: 0 -2rem 0 -1rem;

        li {
            height: 5rem;
            margin-left: 0.6rem;

            &:first-child {
                margin-left: 0.7rem;
            }
            > a {
                width: 4rem;
                height: 4rem;
            }
        }
        .facebook, .twitter {
            width: 3.2rem;
            height: 3.2rem;
            padding: 0.4rem;
        }
        .googleplus, .github, .pinterest, .vimeo {
            width: 3rem;
            height: 3rem;
            padding: 0.5rem;
        }
    }
    @media @ds_ratio_9_16 @orientation_portrait {
        margin: 0 -2rem 0 -1rem;

        li {
            height: 5rem;
            margin-left: 0.8rem;

            &:first-child {
                margin-left: 1.6rem;
            }
            > a {
                width: 4.2rem;
                height: 4.2rem;
            }
        }
        .facebook, .twitter {
            padding: 0.5rem;
        }
        .googleplus, .github, .pinterest, .vimeo {
            padding: 0.6rem;
        }

    }
    @media @da_small {
        margin: 0 0 0 -0.1rem;

        li {
            height: 4rem;
            margin-left: 0.4rem;

            &:first-child {
                margin-left: 0rem;
            }
            > a {
                width: 2.8rem;
                height: 2.8rem;
            }
        }
        .facebook, .twitter {
            width: 2.2rem;
            height: 2.2rem;
            padding: 0.3rem;
        }
        .twitter {
            padding: 0.3rem 0.2rem 0.3rem 0.4rem;
        }
        .googleplus, .github, .pinterest, .vimeo {
            width: 2rem;
            height: 2rem;
            padding: 0.4rem;
        }
        .googleplus {
            padding: 0.4rem 0.3rem 0.4rem 0.5rem;
        }
    }
    @media @da_medium {

        li {
            height: 4.4rem;
            margin-left: 0.5rem;

            &:first-child {
                margin-left: 0rem;
            }
            > a {
                width: 3.2rem;
                height: 3.2rem;
            }
        }
        .facebook, .twitter {
            width: 2.4rem;
            height: 2.4rem;
            padding: 0.4rem;
        }
        .twitter {
            padding: 0.4rem 0.3rem 0.4rem 0.5rem;
        }
        .googleplus, .github, .pinterest, .vimeo {
            width: 2.2rem;
            height: 2.2rem;
            padding: 0.5rem;
        }
        .googleplus {
            padding: 0.5rem 0.4rem 0.5rem 0.6rem;
        }
    }
    @media @da_large {

        li {
            height: 5.2rem;
            margin-left: 0.6rem;

            &:first-child {
                margin-left: 0rem;
            }
            > a {
                width: 3.8rem;
                height: 3.8rem;
            }
        }
        .facebook, .twitter {
            width: 2.8rem;
            height: 2.8rem;
            padding: 0.5rem;
        }
        .twitter {
            padding: 0.5rem 0.4rem 0.5rem 0.6rem;
        }
        .googleplus, .github, .pinterest, .vimeo {
            width: 2.6rem;
            height: 2.6rem;
            padding: 0.6rem;
        }
        .googleplus {
            padding: 0.6rem 0.5rem 0.6rem 0.7rem;
        }
    }
}
#post_social_footer {

}