/* Hero layout shared by the pages with a header scene (services, process,
   about-us). These rules used to be copied into each page's fixes/*.fix.css and
   had drifted apart; the services copy is the reference. */
.inner-hero .container {
    padding-top: 170px;
}

@media screen and (min-width: 1200px) {
    .inner-hero {
        padding-top: 80px;
    }
}

.hero-area .hero-screen-img img {
    margin-bottom: 20px;
}

@media screen and (max-width: 991px) {
    .hero-area .hero-screen-img img {
        margin-top: 50px;
    }
}

@media screen and (min-width: 991px) and (max-width: 1080px) {
    .hero-area .hero-screen-img img {
        max-width: 400px !important;
        position: relative;
        top: 250px;
    }
}

@media screen and (min-width: 1080px) and (max-width: 1250px) {
    .hero-area .hero-screen-img img {
        position: relative;
        top: 250px;
    }
}

@media screen and (min-width: 1200px) and (max-width: 1700px) {
    .hero-area .hero-screen-img img {
        max-width: 500px !important;
    }
}

@media screen and (min-width: 1250px) and (max-width: 1450px) {
    .hero-area .hero-screen-img img {
        position: relative;
        top: 350px;
    }
}