* {
  /* The width and height properties (and min/max properties) includes content,
   * padding and border */
  box-sizing: border-box;
}

body {
  background: #F0F0F0;
  margin: 0;
}

.bulbs {
  display: grid;
  /*
   * These settngs tell the browser to make each image at the very least 200px
   * wide, and to outo fill whichever space remains evenly, whenever the
   * browser has enough width to fit an extra image at 200px wide it will
   * automaticaly do so using 1fr one fraction of a space.
   */
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 
}

img {
  display: block;
  box-shadow: -1px 0px 0px rgba(0,0,0,0.6);
  width: 100%;
}