标签视频html5和使用bootstrap绝对位置的麻烦

Question

我在html5中获得了一个视频，我在其中插入了一个菜单，此时一切都很酷但是我试图使用bootstrap使网站响应所以带来不便，当我尝试减少浏览器pff时菜单熄灭我一直在使用@mediaquery几乎所有东西，因为菜单上升，继承人预览网站的链接..减少网站，你会看到，http://giafactory.com/fother/

请帮助我如何修复它，我尝试添加像http://www.seanobrien.com.au/

这样的视频

.background-video {
  width: 100%;
  height: auto;
  background-color: #242424;
}
.video-container video {
  width: 100%;
}
.menu {
  margin: 0 auto;
  position: absolute;
  z-index: 999;
  top: 90%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 85%;
}
video {
  width: 100%;
  z-index: -1000;
}
.nav-m {
  border-bottom: 3px solid white;
}
.nav-m li {
  display: inline;
  font-size: 23px;
  padding-left: 20px;
}
.nav-m li a {
  color: #ffffff;
  padding: 10px;
}
.nav-m li a:hover {
  text-decoration: none;
  background-color: red;
  opacity: .8;
}
.nav-t a {
  font-size: 48px;
  padding-right: 100px;
  text-align: left;
}
.iconos img {
  width: 4%;
}
.news-t {
  margin-top: 150px;
  padding-right: 25px;
  font-size: 45px;
  background-color: #ffffff;
  color: #000000;
  opacity: 0.8;
}
.news-n {
  font-size: 30px;
  margin-top: 10px;
  padding-right: 25px;
  background-color: #000000;
  opacity: 0.8;
  color: #ffffff;
}
.news-n span {
  color: red;
}

<div class="background-video">
    <div class="container menu">
        <div class="row">
            <div class="hidden-xs hidden-sm col-md-12">
                <ul class="nav-m">
                    <li class="nav-t"><a href="#">LaParaTuya</a></li>
                    <li><a href="#">Inicio</a></li>
                    <li><a href="#">Eventos</a></li>
                    <li><a href="#">Noticias</a></li>
                    <li><a href="#">Canciones</a></li>
                    <li><a href="#">Galeria</a></li>
                    <li><a href="#">Video</a></li>
                </ul><!--/ Fin menu -->
            </div><!--/Fin columna menu -->
        </div><!--/Fin fila menu -->
        <div class="row iconos">
            <div class="col-md-12">
                <a href="#"><img src="img/icon/fb.png" alt="facebook" title="Facebook"></a>
                <a href="#"><img src="img/icon/tw.png" alt="twitter" title="Twitter"></a>
                <a href="#"><img src="img/icon/ig.png" alt="instagram" title="Instagram"></a>
                <a href="#"><img src="img/icon/yt.png" alt="youtube" title="Youtube"></a>
            </div><!--/ Fin columna redes sociales -->
        </div><!--/ Fin fila redes sociales-->
        <div class="row">
                       <div class=" col-md-offset-8 col-md-4 text-right">
                           <div class="news-t">
                               El Fother
                           </div>
                       </div>
                   </div>
                   <div class="row">
                       <div class="col-md-offset-4 col-md-8 text-right">
                           <div class="news-n">
                               <a href=""></a><span>Nuevo!</span>Subelo Remix (ElFother ft Cosculluela)</a>
                           </div>
                       </div>
                   </div>
                   <div class="row">
                       <div class="col-md-offset-4 col-md-8 text-right">
                           <div class="news-n">
                               <a href=""></a><span>Nuevo!</span>Entrevista al Fother</a>
                           </div>
                       </div>
                   </div>
                   <div class="row">
                       <div class="col-md-offset-4 col-md-8 text-right">
                           <div class="news-n">
                               <a href=""></a><span>Nuevo!</span>6 Kilos (El Cirujn Nocturnos ft ElFother)</a>
                           </div>
                       </div>
                   </div>
                   <div class="row">
                       <div class="col-md-offset-4 col-md-8 text-right">
                           <div class="news-n">
                               <a href=""></a><span>Nuevo!</span>Concierto en el estadio Quisquella</a>
                           </div>
                       </div>
                   </div>
                </div>
            </div><!--/ Fin de la fila de noticias-->
    </div><!--/ Fin contenedor menu redes, sociales y noticias -->
    
    <div class="video-container">
        <video preload="true" autoplay="autoplay" loop="loop" volumen="0" poster="video/maxresdefault.jpg" muted="muted" class="bgvideo" id="bgvideo">
            <source src="video/fother-portada.mp4" type="video/mp4">
        </video><!--/ Fin de video-->
    </div><!--/ Fin caja de video -->   
</div><!--/ Fin contenedor video -->