// This class should be used on an element that wraps an image to prevent jank
// (aka that thing where the page jumps around because the image has loaded and
// now takes up space). For much more information (and a couple of other
// techniques) take a look at https://css-tricks.com/aspect-ratio-boxes/.
.aspect-ratio-3\:2 {
  background-color: govuk-colour("mid-grey", #f3f2f1);
  display: block;
  height: 0;
  overflow: hidden;
  padding: 66% 0 0 0;
  position: relative;

  img {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
  }
}

// This class should be used on an element that wraps an image to prevent jank
// (aka that thing where the page jumps around because the image has loaded and
// now takes up space). For much more information (and a couple of other
// techniques) take a look at https://css-tricks.com/aspect-ratio-boxes/.
.aspect-ratio-3\:2 {
  display: block;
  height: 0;
  overflow: hidden;
  padding: 66% 0 0 0;
  position: relative;

  img {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
  }
}

Remove grey background from aspect-ratio class
Remove grey background from aspect-ratio class
