minor CSS tweaks for legibility and compatibility

css/pg-style.css

@@ -83,10 +83,12 @@
 
 /* CAROUSEL AND EXHIBITION BASICS */
 
+/*
 html {
   scroll-snap-type: block proximity;
   scroll-behavior: smooth;
 }
+*/
 
 .pg-exhibition-wrapper {
   scroll-snap-align: start;
@@ -122,8 +124,6 @@ html {
 .pg-carousel-wrapper, .pg-exhibition-wrapper {
   box-sizing: border-box;
   display: block;
-  max-height: 100vh;
-  max-width: 100vw;
   width: 100%;
   height: 100%;
   overflow: hidden;
@@ -390,21 +390,27 @@ html {
   top: 50%;
   width: auto;
   margin-top: -15px;
-  padding: 15px;
+  font-size: 15px;
+  user-select: none;
   color: white;
-  font-weight: bold;
-  font-size: 20px;
+  font-weight: normal;
   user-select: none;
   box-sizing: border-box;
-  opacity: 50%;
+  opacity: 80%;
+  background-color: rgb(58, 58, 58);
 }
 
 .pg-exhibition .gallery-prev span, .pg-exhibition .gallery-next span {
-  color: black;
+  background-color: rgb(51, 51, 51);
+}
+
+.gallery-prev span {
+  padding: 7px 12px 7px 11px;
 }
 
 .gallery-next span{
   right: 0;
+  padding: 7px 11px 7px 12px;
 }
 
 .gallery-prev:hover span, .gallery-next:hover span {

js/pg-script.js

@@ -255,12 +255,12 @@ window.addEventListener('scroll', function (event) {
 
     for (i = 0; i < carousels.length; i++) {
       var elem = carousels[i];
-      if (isInViewport(elem)) elem.focus({ preventScroll: false });
+      if (isInViewport(elem)) elem.focus({ preventScroll: true });
       else elem.blur();
     }
     for (i = 0; i < exhibitions.length; i++) {
       var elem = exhibitions[i];
-      if (isInViewport(elem)) elem.focus({ preventScroll: false });
+      if (isInViewport(elem)) elem.focus({ preventScroll: true });
       else elem.blur();
     }
   }, 100);