/****************************************/
/* KAYAK White Label Premium Modules
/* Version: 1.1 rev.2018.01.22
/* Copyright: 2018 KAYAK Online Marketing
/* https://www.kayakonlinemarketing.com/
/* 1.1
/* - Added notes for future maintenance
/* 1.0
/* - Initial release
/****************************************/

/*****************************************/
/* Premium Modules                       */
/*****************************************/

/* Parallax Module
   Use: create module group with class
        "parallax-content" that contains
        all parallax content (text, etc.),
        then add the custom parallax module
        after the .parallax-content module
        group.
        Place all of this within another
        module group with class
        "parallax-wrapper".
        Using a parallax module is very
        similar to using a standard
        "billboard" module, only with
        parallax-specific classes and
        the custom parallax module.
        .parallax-tint controls a colour
        overlay that is set by the user
        in the custom parallax module.
*/

/* This is in the "premium" scripts file because
/* it isn't something you'll likely use on most
/* client projects. Every so often, though, it
/* does come in handy.
*/

.parallax-wrapper,
.parallax-content{
    position: relative;
    z-index: 10;
}

.parallax-wrapper{
    padding: 40px 0;
}

.parallax-container{
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
}

.parallax-background{
    width: 100%;
    height: 100%;
    background: 50% 0/cover no-repeat fixed;
}

.parallax-tint{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}