.ub-cover, .ub-cover-1-1, .ub-cover-3-1, .ub-cover-4-1, .ub-cover-4-3, .ub-cover-3-2, .ub-cover-2-1, .ub-cover-5-3 {
  display: block;
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;

  &:after {
    content: '';
    display: block;
  }

  &.contain {
    background-size: contain;
  }

  &.circle {
    border-radius: 50%;
  }
}

.ub-cover-1-1:after {
  margin-top: 100%;
}

.ub-cover-3-1:after {
  margin-top: 33.33%;
}

.ub-cover-4-1:after {
  margin-top: 25%;
}

.ub-cover-4-3:after {
  margin-top: 75%;
}

.ub-cover-3-4:after {
  margin-top: 133.33%;
}

.ub-cover-3-2:after {
  margin-top: 66.66%;
}

.ub-cover-2-3:after {
  margin-top: 150%;
}

.ub-cover-2-1:after {
  margin-top: 50%;
}

.ub-cover-1-2:after {
  margin-top: 200%;
}

.ub-cover-5-3:after {
  margin-top: 60%;
}

.ub-cover-3-5:after {
  margin-top: 166.66%;
}

.ub-cover-5-4:after {
  margin-top: 80%;
}

.ub-cover-4-5:after {
  margin-top: 125%;
}

.ub-cover-6-5:after {
  margin-top: 80%;
}

.ub-cover-5-6:after {
  margin-top: 120%;
}

.ub-cover-7-6:after {
  margin-top: 85.7%;
}

.ub-cover-6-7:after {
  margin-top: 116.66%;
}
