CSS no me obedece

[Tecna]

Buenas.

Si hay varias reglas que afectan al mismo elemento sólo se aplica la que esté declarada la última en el caso de que todas tengan el mismo peso y la misma importancia.

En el ejemplo que muestras tienen la misma importancia, ya que en ninguna has usado la declaración !important pero no tienen el mismo peso, en el primer caso es 101 (100 por el id y 1 por el div) y en el segundo 10 (10 por la clase) el primero es mayor luego es el que se aplica.