
/* VIDEOS */

    video {
        width: 100%;
        height: auto;
        padding: 0;
        margin: 0;
        border: 1px solid transparent;
        box-shadow: 0 0 4px 1px #ccc;
    }

    video:hover {
        border-color: rgba(152, 50, 34, 1);
        box-shadow: 0 0 4px 1px rgba(255, 204, 0, 1);
        opacity: .6;
        cursor: pointer;
    }

    video:active {
        opacity: 1;
    }


/* THESE ARE STYLES FOR THE VIDEO MODALS */

    .modal {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 1; /* Sit on top */
        padding-top: 100px; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    } /* The Modal (background) */

    .videoModalContent {
        background-color: #fefefe;
        margin: auto;
        padding: 20px;
        border: 1px solid #888;
        width: 80%;
        -moz-box-shadow: 1px 1px 3px #000;
        -webkit-box-shadow: 1px 1px 3px #000;
        box-shadow: 1px 1px 3px #000;
    } /* Modal Content */

    .videoBtn {
        border: none;
        background-color: #fff;	
        padding: 0 0 12px 0;
        box-shadow: none;
    } /* The open button */

    .videoBtn:hover {
        cursor: pointer;
        opacity: .6;
        border: none;
        box-shadow: none;
        background-color: #fff;
    }

    .videoBtn img {
        width: 100%;
        border: 1px solid rgba(85, 86, 90, .2);
    }

    .close {
        background: #666;
        color: #FFFFFF;
        line-height: 100%;
        font-size: 180%;
        position: absolute;
        right: 9%;
        text-align: center;
        padding: 4px 12px;
        top: 90px;
        width: 40px;
        height: 40px;
        text-decoration: none;
        font-weight: bold;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        border-radius: 100%;
        -moz-box-shadow: 1px 1px 3px #000;
        -webkit-box-shadow: 1px 1px 3px #000;
        box-shadow: 1px 1px 3px #000;
    } /* The Close Button */

    .close:hover,
    .close:focus {
        color: #000;
        text-decoration: none;
        cursor: pointer;
    }

    #modalVideo {
        opacity: 1;
        border: none;
        box-shadow: none;
    } /* This removes the default outline that is on video links */


