@charset "UTF-8";

.hero-main {
    background: url(../images/hero.jpg) no-repeat 80% 0;
    -webkit-background-size: cover;
    background-size: cover;
}

@media screen and (min-width: 768px) {
    .hero-main {
        background: url(../images/hero.jpg) no-repeat 50% 50%;
        -webkit-background-size: cover;
        background-size: cover;
    }
}

@media screen and (max-width: 768px) and (orientation: landscape) {
    .hero-main {
        background: url(../images/hero.jpg) no-repeat 20% 42%;
    }
}

@media screen and (min-width: 768px) and (orientation: portrait) {
    .hero-main {
        background: url(../images/hero.jpg) no-repeat 35% 50%;
        -webkit-background-size: cover;
        background-size: cover;
    }
}