.add-on { margin:2rem 0; }
.add-on .add-on-img {  width:100%; padding-bottom:77%; background-size:cover; background-repeat:no-repeat; background-position:center; margin-bottom:0.5rem; }
.add-on .add-on-info { display:flex; flex-wrap:wrap; font-weight:var(--wHeavy); }
.add-on .add-on-info div:first-child { padding-right:0.5rem;  }
.add-on .add-on-info div:nth-child(2) { padding-left:0.5rem; position:relative; }
.add-on .add-on-info div:nth-child(2):before { content:''; position:absolute; left:0; top:50%; transform:translate(0,-50%); width:1px; height:1rem; background-color:hsl(var(--siteColor2)); }

.add-on-detail-img { width:100%; object-fit:cover; margin-bottom:1rem; height:15rem; }

@media(min-width:1025px){
  .add-on img { margin-bottom:0; }
  .add-on-detail-img { height:25rem; }
}