The background colour must always be assigned to the very first CSS rule. This is because each CSS background rule is essentially a layer on top of the previous one.
A background colour by default covers the entire div and will layer on top of any other previously assigned background images and/or colours. Therefore, if we place a colour in any div other than the first it will be placed on top of the preceding div's and will essentially cause them to disappear. Therefore, we must place any background colour in the very first CSS rule.
Below are screenshots of both versions, using the same code, just in a different order.