如何在添加HTML5视频时删除重复的背景图像？

Question

我添加了全屏HTML5视频。当页面加载出现时，5秒后的背景图像将启动视频。问题：在视频开始之前，我会在每个视频EXAMPLE之上获得两张背景图片。我尝试删除背景或海报网址，删除容器div，更改背景大小没有任何效果。

如何删除重复的背景图片？

也许这段代码足以解决问题：

HTML

<!-- VIDEO-->

        <div class="container" id="container">
            <div class="row">
                <div align="center" class="embed-responsive embed-responsive-16by9">
                    <video poster="img/background.jpg" class="embed-responsive-item" id="bg-vid">
                        <source src="CannonStreet_Timelapse_1280.mp4" type="video/mp4">
                    </video>
                </div>
            </div>
        </div>

CSS

body {
    background: url("../img/background.jpg")no-repeat ;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

/***VIDEO***/


video#bg-vid {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url("../img/background.jpg") no-repeat;
    background-size: cover;
}