@require 'variables'

.page-wrapper {
    padding-left: $sidebar-width
    box-sizing: border-box

    min-height: 100%

    // Animation: slide away
    transition: padding-left 0.5s, margin-right 0.5s

    @media only screen and (max-width: $max-page-width-with-hidden-sidebar) {
        padding-left: 0
    }
}

.sidebar-hidden .page-wrapper {
    padding-left: 0
}

.sidebar-visible .page-wrapper {
    padding-left: $sidebar-width
    margin-right: - $sidebar-width
}

.page {
    outline: 0
    padding: 0 $page-padding
}

.content {
    margin-left: auto
    margin-right:auto
    max-width: $content-max-width
    padding-bottom: 50px

    a {
        text-decoration: none;
        &:hover { text-decoration: underline; }
    }

    img { max-width: 100%; }
}