/* added by me */
.image_preview {
    width: 100px; 
    height: 100px;
}

/* dl{border-bottom:1px solid #000;}
dt{border-top:1px solid rgb(139, 128, 128);}
dt:first-child{border-top:0} */

dl {
    /* color: #eee; */
  /* background-color: #666; */
  /* border-radius: 5px; */
  /* padding: 1rem; */
  box-sizing: border-box;
   
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* grid-template-columns: auto auto;
  grid-template-columns: auto 5px auto; */
  grid-template-rows: 1fr 1fr;
  grid-auto-rows: min-content;
  /* display: inline-grid; */
  /* border: 2px solid #000; */

  /* grid-gap: 1rem; */
  
  /* This is to allow the `dl > dt:first-child::after` to fill the height */
  position: relative;
}

dt {
  min-height: 2em;
  /* border: 2px solid #000; */
}

/* dd {
  align-items: center;
  text-align: end;
  justify-content: center;
} */

dt:after {
  content: ": ";
}