

.page-banner,
.beans-slider,
.beans-stepslider,
.beans-fadeslider,
.port-parallex,
.parallax-section,
.contact-form {
    width: 100%;
    overflow: hidden;
    position: relative;
}


    .btn-history:before,
    .page-heading .heading:after,
    .page-heading .heading2:before,
    .page-heading .heading2:after,
    .page-heading .heading3:after,
    .page-heading .heading3:before,
    .page-heading .heading5:after,
    .page-heading .heading5:before,
    .page-heading .heading6:after,
    .page-heading .heading7:before,
    .page-heading .heading7:after,
    .page-heading .heading8:after,
    .page-heading .heading8:before,
    .page-heading .heading9:after,
    .page-heading .heading10:after,
    .page-banner .heading:before {
        content: "";
        position: absolute;
    }



    .parallax-holder,
    .parallax-holder .parallax-frame,
    .stretch,
    .beans-fadeslider .slide,
    .beans-fadeslider .slick-list,
    .beans-fadeslider .slick-track,
    .beans-fadeslider .slick-slider,
    .beans-fadeslider .slick-dots,
    .parallax-section .over,
    .error-section:after {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }



.stretch {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}



/*------------------------------------------------------------------
1.4. page banner styles / .page-banner
-------------------------------------------------------------------*/

.page-banner {
    z-index: 1;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 2px;
}

    .page-banner .heading {
        color: #fff;
        margin: 0 0 20px;
        padding: 0 0 14px;
        font: 600 36px/50px "Quicksand", "Helvetica Neue", Helvetica, Arial, sans-serif;
        position: relative;
        z-index: 1;
    }

        .page-banner .heading:before {
            top: 100%;
            z-index: -1;
            bottom: auto;
            left: 0;
            right: auto;
            background: transparent;
        }

        .page-banner .heading:before {
            margin: 0;
            width: 50px;
            height: 4px;
        }

    .page-banner .parallax-holder,
    .page-banner .video-area,
    .page-banner .stretch {
        z-index: 1;
        position: relative;
        position: absolute;
    }

        .page-banner .parallax-holder:before,
        .page-banner .video-area:before,
        .page-banner .stretch:before {
            position: absolute;
            content: "";
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
        }

        .page-banner .parallax-holder:before,
        .page-banner .video-area:before,
        .page-banner .stretch:before {
            z-index: 1;
            background: rgba(0, 0, 0, .5);
        }



    .page-banner .container-max,
    .page-banner .container {
        padding-top: 187px;
        padding-bottom: 99px;
        position: relative;
        z-index: 999;
    }


    .page-banner .holder {
        float: left;
        max-width: 850px;
        text-transform: uppercase;
    }



.stretch {
    overflow: hidden;
}

    .stretch img {
        top: 0;
        left: 0;
        position: absolute;
    }

/*------------------------------------------------------------------
1.7. gotoTop styles / #gotoTop
-------------------------------------------------------------------*/

#gotoTop {
    right: 20px;
    bottom: 20px;
    opacity: .8;
    color: #fff;
    z-index: 9999;
    position: fixed;
    font-size: 20px;
    cursor: pointer;
    background: #666;
    padding: 12px 0 0;
    text-align: center;
    border-radius: 50px;
    width: 50px;
    height: 50px;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}



.padding-top-30 {
    padding-top: 30px !important;
}



.margin-bottom-10 {
    margin-bottom: 10px !important;
}


.padding-bottom-90 {
    padding-bottom: 90px !important;
}



.bg-shark {
    background: #2a2a2a;
}


.dark {
    background: #222;
}




@media only screen and (max-width: 991px) {
    .page-banner .heading {
        font-size: 30px;
        line-height: 35px;
    }


    .padding-bottom-90 {
        padding-bottom: 60px !important;
    }
}

@media only screen and (max-width: 767px) {


    .page-banner .holder {
        float: none;
        max-width: 100%;
    }
}
