/*TODO: Move page header css to the main styles sheet as we are duplicating code as of right now*/

.blog-header {

}

.header {
    height: 40vh;
}

.blog-header-text {
    margin-top: 40vh;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.blog-header-text h1 {
    padding-top: 30px;
    padding-bottom: 30px;
    font-family: 'Open Sans', sans-serif;
    /*font-family: 'Josefin Sans', sans-serif;*/
    font-size: 3rem;
    color: white;
}

#blog-header {
    position: absolute;
    height: 40vh;
    width: 100%;
    background: url(../img/blog.jpg) repeat center center scroll;
    background-size: 102%;
    background-position-x: -77px;
    z-index: -1;
}

@media screen and (min-width: 426px) {
    #blog-header {
        background-position-x: 19px;
        background-position-y: -356px;
    }
}