Header image does not scale on older mobile devices

[tomasholderness]

Header image does not scale on older mobile devices

[tomasholderness]

This is due to site-header using "vh" units;

.site-header {
    width: 100%;
    height: 80vh;
    min-height: 400px;
    background-image: url(/assets/img/protest.jpg);
    background-size: cover;
    background-position: center;
}```

Support in Safari was buggy until version 8: http://caniuse.com/#feat=viewport-units

[tomasholderness]

Here's a potential fix in SCSS (as provided by caniuse.com (see previous comment) but I don't have enough Jekyll/SCSS experience to verify if it would work.

https://gist.github.com/BenMorel/e9e34c08360ebbbd0634

[jvivs]

@talltom Applied that fix in #21 but don't have a device w/ an old enough version to test. Checked out in a few browsers and simulator w/ iPhone5s and iOS10 and it didn't break anything.

[RichardLitt]

@talltom Should be merged. Can you check on older devices?

[tomasholderness]

Looks great @jvivs @RichardLitt , working on both Safari and Chrome on iOS 7.1