html, body
    color: $text-color
    font-family: $font-family
    font-size: $font-size
    //font-weight: 400
    margin: 0
    min-height: 100%
    text-align: justify

body
    padding-bottom: 40px

h1, h2, h3, h4, h5, h6
    font-family: $headers-font-family
    font-weight: normal
    text-shadow: 1px 1px 3px rgb(221, 221, 221)

h1
    font-size: 200%

h2
    font-size: 175%

h3
    font-size: 150%

h4
    font-size: 125%

strong
    color: $strong-text-color

a
    color: $anchor-text-color
    text-decoration: none

    &.dark
        color: $text-color
        //text-shadow: $text-color $text-shadow-properties

    &.bright
        color: $text-shadow-color

    &:hover
        border-bottom: 1px dotted

figure
    margin: 0
    text-align: center

    img
        margin: 14px

        &.pull-left
            margin-left: 0

        &.pull-right
            margin-right: 0

        &.padding
            padding: 6px

        &.shadow
            box-shadow: $text-color $box-shadow-properties

hr
    background: none
    border: 0
    border-bottom: #aaa 1px dotted
    width: 90%

    &.big
        border-bottom-width: 3px
        margin: 30px auto


.sidebar
    background-color: $sidebar-bg
    color: $sidebar-text-color
    min-height: 100%
    position: fixed
    top: 0
    width: $sidebar-width

    &> button.menu
        display: none

    &> header
        height: 220px

        .logo
            color: #fff
            font-family: Verdana
            font-size: 200%
            font-weight: 800
            padding: 20px

    footer
        bottom: 0
        position: absolute
        left: 0
        padding: $footer-padding
        width: $sidebar-width - ($footer-padding*2)

        .zombiepress
            font-family: $headers-font-family
            font-size: 80%
            text-shadow: #333 1px 1px 3px
            a
                color: #fff

    .zone-menu

    .buttons
        @extend .text-center

        header
            font-size: 170%
            margin-bottom: 10px

        &.social
            margin-bottom: 20px
            button
                width: 31%
                font-size: 75%
                font-family: helvetica, sans-serif

        a.button
            @include button(inherit, rgb(192, 192, 192))
            border: none
            cursor: pointer
            display: inline-block
            font-family: helvetica, sans-serif
            font-size: 90%
            margin-top: 5px
            padding: 8px 0 8px 0
            font-weight: bold
            text-shadow: 0 0 1px #000
            width: 90%
            text-align: left

            transition: 0.3s all

            i.fa
                margin: 0 8px 0 10px
                width: 20px

            &.half
                width: 38%

            &.gap
                &.pull-right
                    margin-right: 5%

                &.pull-left
                    margin-left: 5%

            &:hover
                //margin-left: 10px

            &.rss
                @include button($rss-text-color, $rss-color)

            &.blog
                @include button($blog-text-color, $blog-color)

            &.homepage
                @include button($homepage-text-color, $homepage-color)

            &.projects
                @include button($projects-text-color, $projects-color)

section.content
    margin-left: $sidebar-width + $content-sidebar-gap
    width: 60%

.pagination
    padding-bottom: 30px