Frontend: fixing some scrolling issues

frontend/src/lib/components/projects-popup.svelte

@@ -92,7 +92,7 @@
 
   <div class="project-popup-container">
     <!-- Information -->
-    <div>
+    <div class="prout">
       <h1 class="slide-title">{title}</h1>
       <div class="project-popup-img-container">
         <img class="project-popup-img" src={picture} alt="Project Popup" />

frontend/src/lib/css/project-popup.css

@@ -1,10 +1,10 @@
 #project-popup-main {
     height: 80dvh;
-    top: calc(10vh - 1.5rem);
     /* 100-height/2 */
-    width: 50dvw;
-    left: calc(25vw - 1.5rem);
+    top: calc(10vh - 1.5rem);
+    width: 60dvw;
     /* 100-width/2 */
+    left: calc(20vw - 1.5rem);
     border-radius: 0.4rem;
     box-shadow: 0px 20px 50px -10px rgba(0, 0, 0, 0.2);
     position: fixed;
@@ -18,8 +18,8 @@
     height: 100%;
     width: 100%;
     position: fixed;
-    background-color: rgba(0, 0, 0, 0.5);
-    backdrop-filter: blur(1.5rem);
+    background-color: rgba(0, 0, 0, 0.6);
+    backdrop-filter: blur(1rem);
     z-index: 4;
     visibility: hidden;
 }
@@ -56,7 +56,7 @@
 .project-popup-img-container {
     display: flex;
     justify-content: center;
-    height: 17.25rem;
+    height: 30dvh;
 }
 
 .project-popup-img {
@@ -77,6 +77,11 @@
 .project-popup-container>div {
     width: 50%;
     margin: 0.5rem;
+    padding-left: 1rem;
+    padding-right: 1rem;
+    overflow-y : scroll;
+    overflow-x: hidden;
+    height: 80dvh;
 }
 
 .project-popup-subinfo-container {