Video de fondo con menu responsive

[BaSingSe]

Tengo un video en html5 y le he insertado un menu dentro todo bien, pero trato de hacerlo que sea responsive usando bootstrap.. el problema esta en que cada cambio que hace la pagina de tamaño debo adaptar el menu que esta dentro del video (el menu tiene una posicion absoluta) con @mediaquery y cada informacion que agrege debajo me cambia el "top" del menu... les dejo el link de la pagina lo subi para que puedan ver como aparece y reduzcan el tamano de su navegador... http://giafactory.com/fother/

aqui les dejo las etiqueta que son responsable de eso html

Código HTML:

<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 -->
 

aqui el ccs responsable

Código CSS:

.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;
}
 

se les agraedce