blog/_src/_assets/styl/_kremalicious/footer.styl

//
// kremalicious3
// --------------
// Footer
//

.site__footer
    @extend .textcenter
    padding-top: ($spacer*2)

    .avatar
        margin-bottom: ($spacer / 2)

    &,
    .footer-description
        color: $text-color-light
        line-height: $spacer

    a
        @extend .link--nounderline

.footer-description
    @extend .h5
    margin-top: 0
    margin-bottom: ($spacer / 4)

    a
        display: block

.footer-copyright
    @extend .divider-top
    padding-top: $spacer
    padding-bottom: $spacer

    p
        margin-bottom: 0
        font-size: $font-size-mini

    .icon
        width: 15px
        height: 15px
        margin-right: .2em
        margin-bottom: -2px

// Subscribe component
.subscribe
    margin: $spacer auto
    p
        @extend .textcenter
        margin: 0

.link
    @extend .textcenter, .link--nounderline
    width: 1.5rem
    padding: $padding-small-vertical
    margin: 0
    display: inline-block
    color: $text-color-light

    &:first-child
        margin-left: 0

    &:last-child
        margin-right: 0

    .icon
        transition: color .3s ease-in-out
        display: block
        margin: 0 auto

.rss:hover .icon
    fill: #e15a00
.json:hover .icon
    fill: #8BE028
.twitter:hover .icon
    fill: #019ad2
.google:hover .icon
    fill: #c63b1e
.facebook:hover .icon
    fill: #3b5998

.subscribe-title
    @extend .h5, .text-dimmed
    margin-bottom: ($spacer/2)

.footer__btc
    margin-left: ($spacer / 2)
    .icon
        width: 10px
        margin-right: 0
    code
        font-size: .55rem
        background: none
        color: $link-color
        padding: 0