/************************************************************************
// Table of Background CSS

1. Blog Header
2. Custom Front Page
3. Blog Single
4. Features Section
5. Counter Section
6. Card Section

*************************************************************************/

/* 1. Blog Header */
.blog-header {
    background: rgb(0,106,182);
    max-width: 100%;
    height: 550px;
    position: relative;
}

    .blog-header:before {
        background-color: rgb(0,77,132);
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        opacity: .7;
    }

/* 2. Custom Front Page */
.front-header {
    background: url('../img/header.jpg') repeat-y center bottom;
    max-width: 100%;
    min-height: 570px;
    position: relative;
    overflow-y: hidden;
}

    .front-header:before {
        background-color: rgba(0,106,182, .7);
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        opacity: .7;
    }

/* 3. Blog Single */
.blog-single-header {
    background: url('../img/background-1.png') repeat-y center center;
    max-width: 100%;
    height: 768px;
    position: relative;
}

    .blog-single-header:before {
        background-color: #101931;
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        opacity: .7;
    }

/* 4. Features Section */
.section-features {
    background: url('../img/uitgelicht.jpg') repeat-y center center;
}

/* 5. Counter Section */
.section-counter {
    background: url('../img/counter.jpg') repeat-y center top;
    max-width: 100%;
    height: auto;
    position: relative;
}

    .section-counter:before {
        background-color: rgba(0,106,182, 8);
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        opacity: .7;
    }

/* 6. Card Section */
.section-card {
    background: url('../img/background-2.png') repeat-y center center;
}