Cacher is the code snippet organizer for pro developers

.box { position: absolute; width: 200px; height: 200px; }
#box_1 { background: #ee3e64; top: 0; left: 0; }
#box_2 { background: #44accf; top: 0; right: 0; }
#box_3 { background: #b7d84b; bottom: 0; left: 0; }
#box_4 { background: #ebde52; bottom: 0; right: 0; }
.orange { background: #f95b34; position: absolute; top: 39%; left: 41%; width: 40px; height: 40px; }

<div id="box_1" class="box">
  <div class="orange"></div>
</div>
<div id="box_2" class="box">
  <div class="orange"></div>
</div>
<div id="box_3" class="box">
  <div class="orange"></div>
</div>
<div id="box_4" class="box">
  <div class="orange"></div>
</div>