final version done

css/styles.min.css

@@ -29,14 +29,21 @@
 body {
     background-image: url(../images/background.png);
     background-repeat: repeat;
+
+    background-size: auto;
+    background-position: top left;
+
     font-family: "LM Roman",Georgia,Palatino,"Palatino Linotype","Times New Roman","Times",serif;
+
     line-height: 1.25;
+
     margin: 0;
-    color: #f2f2f2; 
+
+    color: #f2f2f2;
+
     overflow: hidden;
 }
 
-
 h1 {
     font-size: 20px;
     text-shadow: 1px 1px 1px #0F111F;
@@ -44,12 +51,19 @@ h1 {
 }
 
 #background {
-    width: 100%;
-    height: 100%;
     position: fixed;
-    left: 0;
+
-    top: 0;
+    inset: 0;
+
+    width: 100vw;
+    height: 100vh;
+
     z-index: -999;
+
+    background-image: inherit;
+    background-repeat: repeat;
+
+    pointer-events: none;
 }
 
 .transparentbox {
@@ -273,13 +287,14 @@ h1 {
     right: 0;
 
     width: 28%;
-    height: 100%;
+
+    min-height: 100%;
 
     padding-left: 20px;
 
     box-sizing: border-box;
 
-    overflow: hidden;
+    overflow: visible;
 }
 
 #careerContainer {
@@ -323,30 +338,12 @@ h1 {
 
     scrollbar-width: thin;
 }
-/* Optional: nicer scrollbar */
-/* #innerScrollbox::-webkit-scrollbar {
-    width: 8px;
-}
-
-#innerScrollbox::-webkit-scrollbar-thumb {
-    background: rgba(255,255,255,0.3);
-    border-radius: 10px;
-} */
 
 #innerScrollbox {
     max-height: 60vh;
     overflow-y: auto;
 }
 
-/* #careerContainer::-webkit-scrollbar {
-    width: 10px;
-}
-
-#careerContainer::-webkit-scrollbar-thumb {
-    background: rgba(255,255,255,0.25);
-    border-radius: 999px;
-} */
-
 .career-progress-wrapper {
     position: sticky;
     top: 0;
@@ -610,18 +607,7 @@ a:hover {
     }
 }
 
-@media screen and (max-width: 700px) {
 
-    body {
-        min-width: 700px;
-        overflow-x: auto;
-        overflow-y: hidden;
-    }
-
-    .Info {
-        min-width: 700px;
-    }
-}
 
 /* Global scrollbar styling */
 
@@ -655,4 +641,18 @@ a:hover {
 /* Corner where vertical + horizontal scrollbars meet */
 *::-webkit-scrollbar-corner {
     background: transparent;
+}
+
+@media screen and (max-height: 750px) {
+
+    body {
+        overflow-y: auto;
+        overflow-x: auto;
+    }
+
+    .Info {
+        height: auto;
+        min-height: calc(100vh - 40px);
+        min-width: 700px;
+    }
 }