:root {
  box-sizing: border-box;
  background-color: #FFF;
  color: #000;
}

*, ::before, ::after { box-sizing: inherit; }

#box1 {
  background-color: #A50;
  color: #FFF;
  margin: 0;
  padding: 0;

  position: absolute;
  left: calc(25% - 100px);
  top: calc(25% - 100px);
  width: 200px;
  height: 200px;
}

#box2 {
  background-color: #5A0;
  color: #FF0;
  margin: 0;
  padding: 0;

  position: absolute;
  right: calc(25% - 100px);
  top: calc(25% - 100px);
  width: 200px;
  height: 200px;
}

#box3 {
  background-color: #A5A;
  color: #000;
  margin: 0;
  padding: 0;

  position: absolute;
  left: calc(25% - 100px);
  bottom: calc(25% - 100px);
  width: 200px;
  height: 200px;
}

#box4 {
  background-color: #0AA;
  color: #000;
  margin: 0;
  padding: 0;

  position: absolute;
  right: calc(25% - 100px);
  bottom: calc(25% - 100px);
  width: 200px;
  height: 200px;
}

#box5 {
  background-color: #55A;
  color: #FF0;
  padding: 0;

  position: absolute;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin: -100px 0 0 -100px;
}