#banner {
    background-image: url(../images/banner2.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    color: #d8d8d8;
    padding: 14em 0;
    text-align: center
}

#banner h2,
#banner h3,
#banner h4,
#banner h5,
#banner h6 {
    color: #fff
}

.wrapper {
    padding: 4em 0 1em 0
}

.wrapper.style1 {
    background: #fff;
    color: #555f66
}

.wrapper.style2 {
    background: #192024;
    color: #c5c7c8
}

.wrapper.style2 h2,
.wrapper.style2 h3,
.wrapper.style2 h4,
.wrapper.style2 h5,
.wrapper.style2 h6 {
    color: #fff
}

.wrapper.style2 header p {
    color: #a3a5a7
}

header.major {
    text-align: center;
    margin: 0 0 4em 0
}

header.major h2 {
    font-size: 2em
}

header.major h2+p {
    font-size: 1.5em;
    margin: -1em 0 2em 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #666f77;
    font-weight: 300;
    line-height: 1em;
    margin: 0 0 1em 0;
    text-transform: uppercase;
    letter-spacing: .125em
}

.div_index {
    text-align: center;
    padding: 2%;
    background-color: #d3d3d3;
    margin: 2%;
    color: #000
}

.h2_index {
    color: #000
}

@media only screen and (max-width:600px) {
    #banner .inner .h2_index {
        font-size: 2.6em
    }

    #banner p {
        font-size: 1.2em;
        margin-bottom: 2em
    }
}

@media only screen and (min-width:600px) {
    #banner .inner .h2_index {
        font-size: 3em
    }

    #banner p {
        font-size: 1.3em;
        margin-bottom: 2em
    }
}

@media only screen and (min-width:992px) {
    #banner .inner .h2_index {
        font-size: 3.5em
    }

    #banner p {
        font-size: 1.4em;
        margin-bottom: 2em
    }
}

@media only screen and (min-width:1200px) {
    #banner .inner .h2_index {
        font-size: 4em
    }

    #banner p {
        font-size: 1.6em;
        margin-bottom: 2em
    }
}