html, body {
    margin: 0;
    padding: 0;
    height: 100%;
  }
  body {
    background-color: #0167A7;
  }
  /* Mobile ≤767px */
  @media (max-width: 767px) {
    body {
      background-image: url("assets/background-options/mobile/economapper-map-bg-mobile-4.png");
      background-position: center top;
      background-size: cover;
      background-repeat: no-repeat;
      background-attachment: fixed;
    }
  
    @supports (background-image: image-set("a.png" type("image/png"))) {
      body {
        background-image: image-set(
          url("assets/background-options/mobile/economapper-map-bg-mobile-4.avif")   type("image/avif"),
          url("assets/background-options/mobile/economapper-map-bg-mobile-4.webp")  type("image/webp"),
          url("assets/background-options/mobile/economapper-map-bg-mobile-4.png")   type("image/png")
        );
      }
    }
  
    @supports (background-image: -webkit-image-set(url("a.png") 1x)) {
      body {
        background-image: -webkit-image-set(
          url("assets/background-options/mobile/economapper-map-bg-mobile-4.avif") 1x,
          url("assets/background-options/mobile/economapper-map-bg-mobile-4.webp") 1x,
          url("assets/background-options/mobile/economapper-map-bg-mobile-4.png") 1x
        );
      }
    }
  }
  
  /* Tablet / square 768–1024px */
  @media (min-width: 768px) and (max-width: 1024px) {
    body {
      background-image: url("assets/background-options/square/economapper-map-bg-square-3.png");
      background-position: center top;
      background-size: cover;
      background-repeat: no-repeat;
      background-attachment: fixed;
    }
  
    @supports (background-image: image-set("a.png" type("image/png"))) {
      body {
        background-image: image-set(
          url("assets/background-options/square/economapper-map-bg-square-3.avif")   type("image/avif"),
          url("assets/background-options/square/economapper-map-bg-square-3.webp")  type("image/webp"),
          url("assets/background-options/square/economapper-map-bg-square-3.png")   type("image/png")
        );
      }
    }
  
    @supports (background-image: -webkit-image-set(url("a.png") 1x)) {
      body {
        background-image: -webkit-image-set(
          url("assets/background-options/square/economapper-map-bg-square-3.avif") 1x,
          url("assets/background-options/square/economapper-map-bg-square-3.webp") 1x,
          url("assets/background-options/square/economapper-map-bg-square-3.png") 1x
        );
      }
    }
  }
  
  /* Desktop ≥1025px */
  @media (min-width: 1025px) {
    body {
      background-image: url("assets/background-options/desktop/economapper-map-bg-desktop-1.png");
      background-position: top center;
      background-size: cover;
      background-repeat: no-repeat;
      background-attachment: fixed;
    }
  
    @supports (background-image: image-set("a.png" type("image/png"))) {
      body {
        background-image: image-set(
          url("assets/background-options/desktop/economapper-map-bg-desktop-1.avif")   type("image/avif"),
          url("assets/background-options/desktop/economapper-map-bg-desktop-1.webp")  type("image/webp"),
          url("assets/background-options/desktop/economapper-map-bg-desktop-1.png")   type("image/png")
        );
      }
    }
  
    @supports (background-image: -webkit-image-set(url("a.png") 1x)) {
      body {
        background-image: -webkit-image-set(
          url("assets/background-options/desktop/economapper-map-bg-desktop-1.avif") 1x,
          url("assets/background-options/desktop/economapper-map-bg-desktop-1.webp") 1x,
          url("assets/background-options/desktop/economapper-map-bg-desktop-1.png") 1x
        );
      }
    }
  }