@media (min-width: 900px)

.home-template
        .site-nav
                position: relative
                top: -65px

.site-header

position: relative
padding-top: 12px
padding-bottom: 12px
color: rgb(255, 255, 255)
background: 50% center / cover no-repeat rgb(9, 10, 11)
@media (max-width: 700px)
        .site-header
                padding-right: 0
                padding-left: 0
.site-header-content
        display: flex
        flex-direction: column
        justify-content: center
        align-items: center
        padding: 7.8vw 4vw
        min-height: 200px
        max-height: 450px
        text-align: center
        .site-title
                margin: 0
                padding: 0
                font-size: 2.8rem
                line-height: 1.3
                img
                        max-height: 50px
        .site-description
                margin: 0
                padding: 5px 0
                font-size: 1.3rem
                font-weight: 300
                letter-spacing: .5px
                opacity: .8
@media (max-width: 500px)
        .site-header-content
                padding: 10vw 4vw 5.8vw
.site-nav, .site-nav-left
        display: flex
        overflow-y: hidden
.site-nav
        position: relative
        z-index: 300
        justify-content: space-between
        height: 39px
        font-size: 1.2rem
        align-items: flex-start
        .site-nav-logo
                flex-shrink: 0
                display: block
                margin-right: 24px
                color: $white
                font-weight: 700
                margin-bottom: 0
                img
                        display: block
                        width: auto
                        height: 30px
                h1
                        font-size: .9rem
                        margin-bottom: 0
        @media (max-width: 700px)
                .site-nav-left
                        margin-right: 0
        .site-nav-left
                align-items: center
                overflow-x: auto
                margin-right: 10px
                letter-spacing: .4px
                white-space: nowrap
                .nav
                        display: flex
                        margin: 0 0 0 -12px
                        padding: 0
                        list-style: none
                        li
                                padding: 0
                                text-transform: uppercase
                                a
                                        padding: 10px 12px
                                        color: $white
                                        opacity: .8
                                        font-size: .8rem
                                        &:hover
                                                opacity: 1
                .nav li, .nav li a
                        display: block
                        margin: 0
.site-nav-right
        height: 40px
@media (max-width: 700px)
        .site-nav-right
                display: none !important
.site-nav-right, .social-links
        flex-shrink: 0
        display: flex
        align-items: center
        .social-links
                flex-shrink: 0
                display: flex
                align-items: center
                .social-link
                        display: flex
                        justify-content: center
                        align-items: center
                        margin: 0
                        padding: 10px
                        color: $white
                        svg
                                opacity: .8
                                fill: $white
                                height: .99rem
                                &:hover
                                        opacity: 1
                .social-link-tw
                        padding-right: 20px
        .subscribe-button
                display: block
                padding: 4px 10px
                border: 1px solid $white
                color: $white
                font-size: .75rem
                line-height: 1em
                border-radius: 100px
                opacity: .8
                transition: opacity .2s ease-in
                &:hover
                        opacity: 1
        .rss-button
                display: flex
                justify-content: center
                align-items: center
                svg
                        opacity: 0.8
                        fill: $white
                        height: 1.2rem
                        &:hover
                                opacity: 1