/*==========----------==========*/
/*             HERO             */
/*==========----------==========*/

.heroWrp{
    height:100vh;
    min-height:600px;
    position:relative;
}
    .topWrp{
        width:100%;
        height:80px;
        position:relative;
        z-index:2;
        background: rgba(19,21,22,1);
        background: -moz-linear-gradient(top, rgba(19,21,22,1) 0%, rgba(19,21,22,0) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(19,21,22,1)), color-stop(100%, rgba(19,21,22,0)));
        background: -webkit-linear-gradient(top, rgba(19,21,22,1) 0%, rgba(19,21,22,0) 100%);
        background: -o-linear-gradient(top, rgba(19,21,22,1) 0%, rgba(19,21,22,0) 100%);
        background: -ms-linear-gradient(top, rgba(19,21,22,1) 0%, rgba(19,21,22,0) 100%);
        background: linear-gradient(to bottom, rgba(19,21,22,1) 0%, rgba(19,21,22,0) 100%);
    }
    .heroContentWrp{
        opacity:1;
        width:100%;
        max-width:600px;
        padding:.5em;
        border:1px solid rgba(255,255,255,.2);
        position:absolute;
        top:50%;
        left:50%;
        z-index:2;
        -webkit-transform:translate(-50%,-50%);
           -moz-transform:translate(-50%,-50%);
            -ms-transform:translate(-50%,-50%);
             -o-transform:translate(-50%,-50%);
                transform:translate(-50%,-50%);
        -webkit-transition:all .75s ease;
           -moz-transition:all .75s ease;
             -o-transition:all .75s ease;
                transition:all .75s ease;
    }
    .preload .heroContentWrp{
        opacity:0;
        top:52%;
    }
    .icon.question{
        width:80px;
        height:80px;
        margin:0 auto 1em auto;
        border-radius:50%;
        background:#f2f3f4;
        position:absolute;
        top:0;
        left:50%;
        -webkit-transform:translate(-50%,-50%);
           -moz-transform:translate(-50%,-50%);
            -ms-transform:translate(-50%,-50%);
             -o-transform:translate(-50%,-50%);
                transform:translate(-50%,-50%);
    }
        .icon.question:before{
            font-size:40px;
            color:#131516;
            position:absolute;
            top:50%;
            left:50%;
            -webkit-transform:translate(-50%,-50%);
               -moz-transform:translate(-50%,-50%);
                -ms-transform:translate(-50%,-50%);
                 -o-transform:translate(-50%,-50%);
                    transform:translate(-50%,-50%);
        }
        .icon.question:after{
            display:block;
            box-shadow:0 6px 12px rgba(0,0,0,.25);
            content:'';
            border:1px solid #f2f3f4;
            border-radius:50%;
            position:absolute;
            top:-12px;
            right:-12px;
            bottom:-12px;
            left:-12px;
        }

        .heroContent{
            width:100%;
            padding:60px 4em 4em 4em;
            background:rgba(255,255,255,.3);
        }

    .heroImgWrp{
        width:100%;
        background:url('../images/background.jpg') no-repeat center center;
        background-size:cover;
        position:absolute;
        top:0;
        right:0;
        bottom:0;
        left:0;
        z-index:1;
    }

/*==========----------==========*/
/*            FOOTER            */
/*==========----------==========*/

.footer{
    font-size:.8em;
    text-align:center;
    background: rgba(19,21,22,0);
    background: -moz-linear-gradient(top, rgba(19,21,22,0) 0%, rgba(19,21,22,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(19,21,22,0)), color-stop(100%, rgba(19,21,22,1)));
    background: -webkit-linear-gradient(top, rgba(19,21,22,0) 0%, rgba(19,21,22,1) 100%);
    background: -o-linear-gradient(top, rgba(19,21,22,0) 0%, rgba(19,21,22,1) 100%);
    background: -ms-linear-gradient(top, rgba(19,21,22,0) 0%, rgba(19,21,22,1) 100%);
    background: linear-gradient(to bottom, rgba(19,21,22,0) 0%, rgba(19,21,22,1) 100%);
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    z-index:2;
    width:100%;
}