Can't change the color of one text block in mobile! Is Fluid Engine the problem or me?

I don't know what I'm doing wrong unless I'm using 7.0 tactics to tackle a fluid engine problem? 

Just want the white text to be black! 

Why does this code not change the color? 

http://www.morsecreek.com

Site password: tara 

@media screen and (max-width: 640px)
{
#block-yui_3_17_2_1_1685124174773_3864 h2
  {color: black !important;}
}

Thank you for your help whoever you are! 

omg. omg. 2 straight hours of troubleshooting. You saved me. My family thanks you.  But based on this new "span"  for the color it means I need seperate code to change the size correct? Or is there a better way to style the font all at once? Thank you again for your help.  

I

@media screen and ( max-width : 640px ) {

  #block-yui_3_17_2_1_1685124174773_3864 h2 {
  
    font-size : 50px !important;
    }
    
  }

Quote

But based on this new "span"  for the color it means I need seperate code to change the size correct?

Yes.

Quote

Or is there a better way to style the font all at once?

No.

Now to be fair one could possibly spend energy trying to figure something out to get it all in one ruleset but why spend the time for only a couple of lines of code.

If you are concerned about organization of the code just wrap the code in some comments to help you know what is going on.

/* begin my effect here */

  @media screen and ( max-width : 640px ) {
  
    #block-yui_3_17_2_1_1685124174773_3864 h2 span {
    
      color : black;
      
      }
      
    }
    
  @media screen and ( max-width : 640px ) {
  
    #block-yui_3_17_2_1_1685124174773_3864 h2 {
    
      font-size : 50px;
      
      }
      
    }
    
  /* end my effect here */

Thank you again creedon you are a good person.