#splash
    margin: auto 0
    height: 100vh
    width: 45%
    overflow: hidden
    @media screen and (max-width: 736px)
        width: 90%

.big-link
    font-family: $font
    font-size: 3rem
    font-weight: 300
    margin-bottom: 2rem
    line-height: 1.5em

#title
    margin-top: 3rem
    font-family: $font
    font-size: 2rem
    line-height: 3rem
    margin-bottom: 2rem

#content
    margin: 2rem 0
    line-height: 2em
    letter-spacing: 2px
    div
        width: 100%
        height: 100%
        margin-bottom: 1em
    & h1,h2,h3
        margin: 1em 0em
        text-align: left
    & p
        margin-bottom: 1em
        line-height: 1.8
        letter-spacing: 1.5px
        opacity: 0.8
    & .highlight
        width: 100%
    & pre
        line-height: 2rem
        border-radius: 3px
        padding: 1rem
        overflow-x: auto
        background-color: $code-block
        width: 100%
        margin-bottom: 1em
    & pre > code
        border: none
    & code
        font-size: 0.9rem
        font-family: 'Source Code Pro', monospace
        padding: 0.1rem
        border-radius: 3px
        border: 1px solid $links
    & img
        width: 100%
        max-width: 100%
        display: block
        margin: 2rem auto
        opacity: 1
    & blockquote
        background-color: $links
        color: $dark-grey
        padding: 2rem
        margin: 2rem 1rem 2rem 1rem
        border-radius: 3px
        a
            color: $black
        & ul
            margin-top: 1rem
        & li
            list-style: disc
    & table
        width: 100%
        border-collapse: collapse
        margin: 1rem 0
        overflow-x: auto
        th
            font-size: 0.9rem
        td, th
            padding: 2px 5px
            text-align: center
            border: 1px solid $links
    & li
        line-height: 2
        padding-left: 0.4rem
        &:last-child
            margin-bottom: 1rem
    & ul
        list-style: disc outside
        padding-left: 2rem
    & ol
        list-style: decimal outside
        padding-left: 2rem
    & .gist
        width: 100%
        td, th
            text-align: left
            border: 0
        & .gist-meta
            background-color: transparent
            color: $body-text
            & a
                color: $body-text

.tag
    padding: 0.25em 0em
    margin-right: 0.5em
    opacity: 0.6

.grid
    display: grid
    grid-gap: 20px
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr))
    grid-auto-rows: 400px
    @media screen and (max-width: 736px)
        grid-template-columns: repeat(auto-fit, minmax(100%, 1fr))

.grid > div
    background-color: transparent
    overflow: hidden

.grid > div > img
    height: 100%
    width: 100%
    object-fit: cover
    opacity: 1

.grid > div > a > img
    height: 100%
    width: 100%
    object-fit: cover
    opacity: 1