* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  width: 100vw;
  min-height: 100vh;
  font-family: "Exo", Arial, sans-serif;
  background-color: #557;

  display: grid;
  place-content: center;

  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;

  background-image: url("https://www.w3cplus.com/sites/default/files/blogs/2021/2112/hero@2x.png");

  background-image: image-set(
    "https://www.w3cplus.com/sites/default/files/blogs/2021/2112/hero@1x.png" 1x,
    "https://www.w3cplus.com/sites/default/files/blogs/2021/2112/hero@2x.png" 2x,
    "https://www.w3cplus.com/sites/default/files/blogs/2021/2112/hero@3x.png" 3x
  );
}