.carousel-indicators li {
        background-color: #000 !important;
        width: 10px !important;
    }

    .carousel-indicators {
        bottom: -15px !important;

    }
    .videobutton {
        /* Text */
        font-size: 45px;

        /* Dimensions */
        width: 100px;
        height: 100px;

        /* Positioning */
        /* position: fixed; */
        /* top: 50%; */
        /* left: 50%; */
        z-index: 2;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);

        /* The code above makes sure the video is
both vertically and horizontally centered
to the screen */

        /* Styling */
        background-color: rgba(0, 0, 0, 0.95);
        border: 0;
        /* remove annoying grey border */
        border-radius: 50%;
        /* make it a circle */
        outline: none;
        /* Ditch the annoyning blue outline on click */
        cursor: pointer;
        box-shadow: 0px 0px 0px 2px rgba(0, 0, 0, 0.25);

        /* ----- Transformations ----- */
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);

        /* ----- Transitions ----- */
        -webkit-transition: transform .5s ease;
        -moz-transition: transform .5s ease;
        -ms-transition: transform .5s ease;
        -o-transition: transform .5s ease;
        transition: transform .5s ease;
    }

    .videobutton:hover {
        /* ----- Transformations ----- */
        -webkit-transform: scale(1.2, 1.2);
        -moz-transform: scale(1.2, 1.2);
        -ms-transform: scale(1.2, 1.2);
        -o-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);

        /* ----- Transitions ----- */
        -webkit-transition: transform .5s ease;
        -moz-transition: transform .5s ease;
        -ms-transition: transform .5s ease;
        -o-transition: transform .5s ease;
        transition: transform .5s ease;
    }

    .videobutton>i {
        /* Text */
        color: grey;
        text-shadow: 1px 1px rgba(255, 255, 255, 0.2);

        /* Make play sign 3d-ish */

        /* Positioning */
        position: relative;
        margin-top: 4px;
        margin-left: 6px;

        /* ----- Transitions ----- */
        -webkit-transition: color .5s ease;
        -moz-transition: color .5s ease;
        -ms-transition: color .5s ease;
        -o-transition: color .5s ease;
        transition: color .5s ease;
    }

    .videobutton:hover>i {
        /* Text */
        color: white;

        /* ----- Transitions ----- */
        -webkit-transition: color .5s ease;
        -moz-transition: color .5s ease;
        -ms-transition: color .5s ease;
        -o-transition: color .5s ease;
        transition: color .5s ease;

        /* When we hover on the button make the play sign white. */
    }

    #videolightbox {
        /* ----- Positioning ----- */
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1;

        /* The code above makes sure that the
lightbox covers the entire page*/

        /* ----- Visibility ----- */
        display: none;

        /* ----- Styling ----- */
        background-color: rgba(0, 0, 0, 0.95);

        /* Normally, most lightboxes do not use
a completely solid black, but with about
90-95% opacity so that the background is
somewhat visible */
    }

    #video-wrapper {
        /* ----- Positioning ----- */
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 2;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);

        /* The code above makes sure the video is
both vertically and horizontally centered
to the screen */

        /* ----- Styling ----- */
        box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.1);

        /* The code above is used to add a little shadow to the video making blend in better */
    }

    #close-btn {
        /* ----- Text ----- */
        color: grey;
        font-size: 25px;

        /* ----- Positioning ----- */
        position: fixed;
        top: 75px;
        right: 3%;
        z-index: 2;

        /* The code above is used to put the button on the upper right corner of the lightbox */

        /* ----- Transformations ----- */
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);

        /* The code above is used to initialize the scale for the button so that it can be used in transitions */

        /* ----- Transitions ----- */
        -webkit-transition: transform .5s ease, color .5s ease;
        -moz-transition: transform .5s ease, color .5s ease;
        -ms-transition: transform .5s ease, color .5s ease;
        -o-transition: transform .5s ease, color .5s ease;
        transition: transform .5s ease, color .5s ease;
    }

    #close-btn:hover {
        /* ----- Text ----- */
        color: white;

        /* ----- Styling ----- */
        cursor: pointer;

        /* ----- Transformations ----- */
        -webkit-transform: scale(1.2, 1.2);
        -moz-transform: scale(1.2, 1.2);
        -ms-transform: scale(1.2, 1.2);
        -o-transform: scale(1.2, 1.2);
        transform: scale(1.2, 1.2);

        /* ----- Transitions ----- */
        -webkit-transition: transform .5s ease, color .5s ease;
        -moz-transition: transform .5s ease, color .5s ease;
        -ms-transition: transform .5s ease, color .5s ease;
        -o-transition: transform .5s ease, color .5s ease;
        transition: transform .5s ease, color .5s ease;
    }