.adjustme {
  max-width:100%;
}
	
section {
  --p: var(--parity, 0);
  --s: calc(1 - 2*var(--p));
  position: relative;
  margin-top: calc(var(--i)*-4.5rem);
  border-bottom: solid 0.75rem transparent;
  max-width: 100%;
  min-height: 13.5rem;
  background: linear-gradient(#f2f2f2, #f2f2f2) padding-box, radial-gradient(at 50% 0, rgba(0, 0, 0, 0.3), transparent 70%) 50% 100%/115% 0.75rem border-box;
  color: #222;
}
section:before {
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: solid calc(var(--k)*0.75rem) transparent;
  width: calc(var(--k)*21.75rem + var(--narr)*100%);
  height: calc(4.5rem + var(--k)*0.75rem);
  background: linear-gradient(calc(var(--s)*90deg), var(--slist)) padding-box, linear-gradient(calc(var(--s)*90deg), var(--slist) 0.75rem, #e6e6e6 0) calc(var(--p)*100%) 0/ 17.25rem no-repeat border-box;
  color: #fff;
  font-size: 3rem;
  font-weight: 300;
  text-shadow: calc(var(--s)*-1px) 1px 2px rgba(0, 0, 0, 0.85);
  content: attr(data-year);
}
section:after {
  position: absolute;
  top: 0;
  border: solid 0.75rem transparent;
  padding: 0.75rem;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  transform: scale(var(--i));
  -webkit-mask: var(--m);
  -webkit-mask-composite: xor;
  mask: var(--m);
  mask-composite: exclude;
}
section:nth-of-type(2n) {
  --parity: 1 ;
}
section:first-of-type, section:last-of-type {
  --mid: linear-gradient(red, red) content-box ,
  ;
}

h3, p {
  padding: 0 0.75rem;
}

h3 {
  margin-top: .25em;
  font-size: 1.375em;
  font-weight: 600;
  line-height: 2;
  text-transform: uppercase;
}