Why does the chrome console make me miss the average in media queries?

Question

Currently I want to make my website responsive, but at the moment I want to modify some measures of some elements these are not modified, for example I have a mask that covers some of my images, the image if it adapts.

Visualization of my image in responsive mode.

code to media queries

/** Se crea el diseño responsivo de forma manual **/
@media only screen and (min-width: 600px) and (max-width: 1200px) {
#navegacion {
display: none;
}

#navegacionIpad {
width: 20%;
}

#imgNi {
    width: 5%;
    height: 5%;
}

/** Este el estilo que deberia modificar la altura **/
#Mascara {
    height: 10%;
    background-color: red;
}

}

picture to console

In the console shows me the figure above, I do not know if it is a kind of error.

HTML code

  <!-- Mascara de mario bros-->
<div id="idContenedorS" >


              <div id="Mascara" class="clMascara">

<center><span id="spnMM">

                  <p>
                Precio:$1200.00 MXN.
              </p>

              <p>
                Clasificacion: Toda la Familia.
              </p>

                <p>
                Genero: Fantasia.
              </p>

</span></center>

              </div>


    <!-- Mascara de Call of duty-->
<div id="idContenedorSW" >
              <div id="MascaraW">

<center><span id="spnMW">

                  <p>
                Precio:$1500.00 MXN.
              </p>

              <p>
                Clasificacion: Para Mayores de 16 años
              </p>

                <p>
                Genero: Guerra.
              </p>

</span></center>

              </div>


    <!-- Mascara de FIFA-->
              <div id="idContenedorSF" >
              <div id="MascaraF">

<center><span id="spnMF">

                  <p>

UPDATE

I edit outside my average queries the same element, as I can make the two edit, of course one within your average querie and the other when you are not in small devices.

 #Mascara {
    display: block;
    position: absolute;
    z-index: 1;
    margin-left: 2%;
    margin-top: 0%;
    width: 30%; 
    height: 29%;
    overflow: auto;
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0,0.7); 
    color: white;
 }