.post-number {
  position: relative;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 38px;
  color: #fff;
  overflow: hidden;
  background: linear-gradient(145deg, #10252e 0%, #0b6f92 58%, #13a8d8 100%);
}
.post-number::before,
.post-number::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .18);
}
.post-number::before { width: 260px; height: 260px; right: -125px; top: -105px; }
.post-number::after { width: 180px; height: 180px; left: -100px; bottom: -100px; }
.post-number span {
  position: relative;
  margin-bottom: 18px;
  color: #bfefff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.post-number strong {
  position: relative;
  font-size: 46px;
  line-height: 1;
  letter-spacing: -.05em;
}
@media (max-width: 900px) {
  .post-number { min-height: 230px; }
}