SOURCE

<div class="box">
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
</div>

* {
  margin: 0;
  padding: 0;
}

.box {
  width: 360px;
  height: 180px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -180px;
  margin-top: -90px;
}

.box div {
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

.box div:first-child {
  border: 10px solid red;
  position: relative;
  left: 0px;
  top: 0px;
}

.box div:nth-child(2) {
  border: 10px solid blue;
  position: relative;
  left: 120px;
  top: -120px;
}

.box div:nth-child(3) {
  border: 10px solid yellow;
  position: relative;
  left: 240px;
  top: -240px;
}

.box div:nth-child(4) {
  border: 10px solid black;
  position: relative;
  left: 60px;
  top: -300px;
}

.box div:last-child {
  border: 10px solid green;
  position: relative;
  left: 180px;
  top: -420px;
}