.tile {
  width: 100%;
  display: inline-block;
  box-sizing: border-box;
  background: #fff;
  padding: 20px;
  margin-bottom: 30px;
}
.tile .title {
  margin-top: 0px;
}
.tile.purple, .tile.blue, .tile.red, .tile.orange, .tile.green, .tile.rouse, .tile.sepr {
  color: #fff;
}
.tile.purple {
  background: #5133ab;
}
.tile.purple:hover {
  background: #3e2784;
}
.tile.red {
  background: #ac193d;
}
.tile.red:hover {
  background: #7f132d;
}
.tile.green {
  background: #00a600;
}
.tile.green:hover {
  background: #007300;
}
.tile.blue {
  background: #2672ec;
}
.tile.blue:hover {
  background: #125acd;
}
.tile.orange {
  background: #dc572e;
}
.tile.orange:hover {
  background: #b8431f;
}
.tile.sepr {
  background: #899505;
}
.tile.sepr:hover {
  background: #616904;
}
.tile.rouse {
  background: #0766d2;
}
.tile.rouse:hover {
  background: #054995;
}