.dual-channel {
    background: #000;
    text-align: center;
    overflow: auto;
    padding-bottom: 5%;
}
.dual-channel .heading h1 {
    color: white;
    margin: 10% auto 0%;
    width: 80%;
    font-weight: bolder;
    font-size: 3em;
}
.dual-channel .panel p {
    color: white;
    padding: 0 10%;
    font-size: larger;
}
.dual-channel h2 {
    margin-top: 0;
    padding-top: 5%;
    font-size: 2em;
}
.dual-channel img {
    width: 50%;
}
#bg-image-red-half {
    background:
        /* top, transparent black, faked with gradient */
        linear-gradient(
            rgba(0, 0, 0, 0.3),
            rgba(0, 0, 0, 0.3)
        ),
        /* bottom, image */
        url(../img/passwear/dual-channel/red-half-stream-of-light_x4.png);
    background-position: bottom;
    background-size: cover;
    /*min-height: 50vh;*/
}
#bg-image-blue-half {
    background:
        /* top, transparent black, faked with gradient */
        linear-gradient(
            rgba(0, 0, 0, 0.3),
            rgba(0, 0, 0, 0.3)
        ),
        /* bottom, image */
        url(../img/passwear/dual-channel/blue-half-stream-of-light_x4.png);
    background-position: top;
    background-size: cover;
    /*min-height: 50vh;*/
}


/********************************************
 *
 * SMALLER TABLET TABLET VIEW 640 pixels plus
 */
@media only screen and (min-width: 640px) {
    .dual-channel img {
        width: 25%;
    }
}
/********************************************
 *
 * TABLET TABLET TABLET TABLET VIEW 800 pixels plus
 */
@media only screen and (min-width: 800px) {
    .dual-channel h2 {
        font-size: 3em;
    }
    #bg-image-red-half {
        overflow: hidden;
    }
    #bg-image-blue-half {
        overflow: hidden;
    }
    .dual-channel img {
        width: 15%;
        width: auto;
    }
    #bg-image-red-half .text {
        float: left;
        width: 50%;
    }
    #bg-image-red-half img {
        float: right;
        padding: 3%;
    }
    #bg-image-blue-half .text {
        float: right;
        width: 50%;
    }
    #bg-image-blue-half img {
        float: left;
        padding: 3%;
    }
}

@media only screen and (min-width: 1000px) {
    #bg-image-red-half img {
        margin-right: 7%;
    }
    #bg-image-blue-half img {
        margin-left: 7%;
    }
}

/********************************************
 *
 * LARGER SCREENS
 */
@media only screen and (min-width: 1200px) {
    .dual-channel .panel p {
        padding: 0 25%;
    }
    #bg-image-red-half img {
        margin-right: 16%;
    }
    #bg-image-blue-half img {
        margin-left: 16%;
    }
}

@media only screen and (min-width: 1600px) {
    .dual-channel .panel p {
        padding: 0 33%;
    }
}