* { margin: 0; padding: 0; border: none; outline: none; background: transparent; } @each $object in (Death, Empty, Goal, HorizontalBridge, Player, Portal, Trap, VerticalBridge, Wall) { .$(object) { background: url('../img/$(object).png'); } } body { background-color: #e0e0e0; } h1 { font-size: 48px; text-align: center; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; color: #fff; background-color: #2196f3; padding: 32px 0; margin-bottom: 64px; } a { display: block; text-align: center; margin-top: 64px; img { text-align: center; max-width: 512px; height: auto; } } .level { position: relative; max-width: 512px; width: 100%; margin: 0 auto; } .empties, .objects, .players { position: absolute; top: 0; left: 0; } .object { position: absolute; background-size: contain; background-repeat: no-repeat; } .empties { z-index: 1; } .objects { z-index: 2; } .players { z-index: 3; }