gaf-mobile/app/styles/layout/hire.less

GAF mobile Web site

@import (reference) '../themes/variables';

/* Hire page(s) */

// 1. High resolution image sources

/* Hire hero section */
.hire {

    .hero {
        color: @septenary-color-xxxlight;
        background-color: @septenary-color-xdark;
        background-repeat: no-repeat;
        background-position: center center;
        background-attachment: absolute;
        -webkit-background-size: cover;
        background-size: cover;
    }

    .hero-inner {
        .default-vertical-padding;
    }

    .hero-title {
        font-size: @type-size-xxxlge;
    }

    .hero-sub-title {
        margin-bottom: 35px;
        font-size: @type-size-xlge;
        line-height: 1.1em;
    }

    &-hero {
        background-image: url(/images/hire/mob-hire-hero-bg.jpg);

        &-button {
            margin-bottom: 30px;
        }
    }

    &-hero-category {
        background-image: url(/images/hire/mob-hire-category-hero-bg.png);

        &-button {
            margin-top: 30px;
        }

        .hero-footer-link {
            margin-top: 30px;
            color: @septenary-color-xxxlight;
        }
    }


    &-hero-list {
        padding-left: 0;
        list-style: none;
    }

    &-hero-list-item {
        margin-bottom: 1em;
    }

    @media only screen and (orientation:landscape) {
        .hero-title {
            font-size: @type-size-huge;
        }
    }
}

// 1.
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 2.5), (min-device-pixel-ratio: 1.5) and (max-device-pixel-ratio: 2.5) {
    .hire-hero {
        background-image: url(/images/hire/mob-hire-hero-bg@2x.jpg);
    }
    .hire-hero-category {
        background-image: url(/images/hire/mob-hire-category-hero-bg@2x.png);
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2.5), (min-device-pixel-ratio: 2.5) {
    .hire-hero {
        background-image: url(/images/hire/mob-hire-hero-bg@3x.jpg);
    }
    .hire-hero-category {
        background-image: url(/images/hire/mob-hire-category-hero-bg@3x.png);
    }
}


/* Hire content section */
.hire-content {
    .default-vertical-padding;
    line-height: 1.5em;

    &-list {
        padding-left: 20px;
    }

    &-list-item {
        margin-bottom: 0.5em;
    }


    &-posting-guide {
        padding: 30px 0;
    }

    &-text {
        line-height: 1.5em;
    }

}