#close-button {
    position: relative;
    right: 0;
    top: 0;
    z-index: 1000;
    text-align: right;
    border: none;
    padding: 0;
    background-color: white;
    display: none;
}

.playing #close-button {
    display: block;
}

.fluid-width-video-wrapper {
    width: 100%;
    position: relative;
    padding: 0;
}

    .fluid-width-video-wrapper iframe,
    .fluid-width-video-wrapper object,
    .fluid-width-video-wrapper embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }


.videoGrad2 {
    background: black; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.3) 20%, rgba(0,0,0,0.7) 60%, rgba(0,0,0,0.9)); /*Safari 5.1-6*/
    background: -o-linear-gradient(right, rgba(0,0,0,0), rgba(0,0,0,0.3) 20%, rgba(0,0,0,0.7) 60%, rgba(0,0,0,0.9)); /*Opera 11.1-12*/
    background: -moz-linear-gradient(right, rgba(0,0,0,0), rgba(0,0,0,0.3) 20%, rgba(0,0,0,0.7) 60%, rgba(0,0,0,0.9)); /*Fx 3.6-15*/
    background: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,0.3) 20%, rgba(0,0,0,0.7) 60%, rgba(0,0,0,0.9)); /*Standard*/
}

.rickBG {
    background-image: url("../RHF-2016-A4A/images/RHF_Spring_Awareness_Campaign_Dots.jpg");
    background-repeat: repeat-x repeat-y;
    background-color: #0d64a5;
    -moz-background-origin: border-box;
    -webkit-background-origin: border-box;
    background-origin: border-box;
}

@media (min-width: 768px) {
    .rickBG {
        /*background: url(images/bg.jpg) no-repeat center center fixed;*/
        /*background-image: url('/portals/_default/Skins/Canada150/images/CAN-589-Access4All-Signiture-Initiative-Website_LandingPage_Banner_Desktoptest.jpg'); 
        background-repeat: no-repeat;
        background-attachment: local;
        background-position: 40% 60%;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;*/
        background-image: url("../RHF-2016-A4A/images/RHF_Spring_Awareness_Campaign_Dots.jpg");
        background-repeat: repeat-x repeat-y;
        background-color: #0d64a5;
        -moz-background-origin: border-box;
        -webkit-background-origin: border-box;
        background-origin: border-box;
    }
}

.videoGrad {
    background-image: url(https://rhfcdn.blob.core.windows.net/a4a/CAN-589 Access4All Signiture Initiative – C150_RaspberryBackground.svg);
    background-repeat: no-repeat;
    background-color: none;
    background-position: left bottom;
    background-size: cover;
}

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

@media (max-width: 767px) {

    .rickBG {
        /*background-position-x: 15%;
        background-position-y: 0%;*/
        /*background-size:300%;*/
    }

    .videoGrad {
        background: white; /* For browsers that do not support gradients */
    }
}

/* Small devices (tablets, 768px and up) sm */
@media (min-width: 768px) {
    .rickBG {
        /*background-position-x: 30%;
        background-position-y: center;*/
    }
}

/* Medium devices (desktops, 992px and up) md*/
@media (min-width: 992px) {

    .rickBG {
        /*background-position-x: 20%;
        background-position-y: center;*/
    }
}

/* Large devices (large desktops, 1200px and up) lg*/
@media (min-width: 1200px) {

    .rickBG {
        /*background-position-x: center;
        background-position-y: center;*/
    }
}

.jumbotron.rickBG {
    margin-bottom: 0px;
    padding: 0px;
    margin-left: -15px;
    margin-right: -15px;
}

    .jumbotron.rickBG h1 {
        font-size: 43px;
    }

@media (max-width: 375px) {
    .jumbotron.rickBG h1 {
        font-size: 33px;
    }
}

@media (min-width: 768px) {
    .videoGrad > .row > .col-xs-12 {
        max-width: 436px;
        float: right;
    }
}

iframe#c150Video {
    width: 560px;
    height: 315px;
    display: block;
    margin: 0 auto;
    box-shadow: none;
}

@media (min-width: 768px) {
    iframe#c150Video {
        width: 436px;
        height: 245px;
        box-shadow: 0px 0px 28px -1px rgba(0,0,0,0.5);
    }
}

.videoText {
    padding-top: 0;
}

@media (min-width:768px) {
    .videoText {
        padding-top: 40px;
    }
}

.videoText > img {
    display: none;
}

@media (min-width:768px) and (max-width:992px) {
    .videoText > img {
        max-width: 272px;
        max-height: 49px;
        display: block;
        margin: 0 auto;
    }
}

@media (min-width:992px) {
    .videoText > img {
        /*max-width: 374px;
        max-height: 49px;*/
        display: block;
        margin: 0 auto;
    }
}