docs: Use WEBP instead of PNG for images.

This saves a ton of bandwidth, making the page's background load
much faster. While AVIF would be a more efficient approach, it's
not as widely supported yet.

There is some quality loss but it's not really visible due to how
they're integrated into the page.

docs/_css/index.css

@@ -83,21 +83,21 @@ body {
 }
 
 #element1 {
-    background-image: url("../images/Backgrounds/FreeJ2ME_BG2.png");
+    background-image: url("../images/Backgrounds/FreeJ2ME_BG2.webp");
     background-repeat: repeat-x;
     width: 5660px;
     animation: slidegamebg 90s linear reverse infinite;
 }
 
 #element2 {
-    background-image: url("../images/Backgrounds/FreeJ2ME_BG1.png");
+    background-image: url("../images/Backgrounds/FreeJ2ME_BG1.webp");
     background-repeat: repeat-x;
     width: 5660px;
     animation: slidegamebg 60s linear infinite;
 }
 
 #element3 {
-    background-image: url("../images/Backgrounds/FreeJ2ME_BG3.png");
+    background-image: url("../images/Backgrounds/FreeJ2ME_BG3.webp");
     background-repeat: repeat-x;
     width: 5660px;
     animation: slidegamebg 45s linear reverse infinite;
@@ -491,4 +491,4 @@ iframe {
     #firstpane-content-right p {
         font-size: 1.3em;
     }
-}
+}