html, body {
  height: 100%;
  width: 100%;
  font-family:Verdana, Geneva, Tahoma, sans-serif;
}

.gallery { 
  display: grid;
  grid-template-columns: 1fr;  /* 1 column on phone-sized browsers */
  margin:0;
}
.gallery figure {
  width: 400px;
  margin:0 0 3% 0;
  padding:0;
  border:1px solid black;
}
.gallery img {
  width:100%;
}
.gallery figcaption {
  display:block;
  padding:3px;
}

.alignright {float:right; width:220px; border:2px solid gray;}


  /*   ===== DESKTOP  media query overrides mobile and tablet styles ===== */
  @media all and (min-width: 1080px) {
    .gallery { 
      grid-template-columns: 1fr 1fr 1fr; /* 3 columns on desktop-sized browsers */
  }