clases en div's anidados

[Zeromm]

Los archivos css se leen siempre hacia abajo, por lo tanto cualquier elemento situado en la parte inferior del archivo va a sobreescribir otro elemento, aunque se llame igual, situado en la parte superior.

Lo que pasa en tu archivo es que las dos clases llaman al mismo elemento, es decir, al h1 que hay dentro de ".info_tabla". Lo explico:

Si pones en la parte superior del css:
.datos_tabla h1
Lo que sucede es que a todos los h1 que aparezcan dentro de .datos_tabla tengan unos estilos...

Y si luego más abajo en el css pones:
.info_tabla h1
Lo que se le está diciendo es que a todos los h1 que aparezcan dentro de ".info_tabla" tengan unos estilos... es decir, se está llamando a los mismos h1 a los que se llamaban en los westilos de antes, por eso se sobreescriben.

Para que los estilos de la clase ".info_tabla h1" solo afectaran al primer h1 que aparece, tendrias que llamarlos así:
.info_tabla > h1

Con lo que le estarias diciendo que solo aplique estilos al primer h1 que sea hijo de .info_tabla

No se si me expliqué bien xD, si no te intento poner un ejemplo más claro :)