src/photoDisplays/PhotoGrid.scss

@@ -1,12 +1,13 @@
 .photo-grid {
     display: flex;
-    justify-content: space-evenly;
+    justify-content: center;
     flex-direction: row;
     flex-wrap: wrap;
-
+    margin-left: 50px;
+    margin-right: 50px;
     .photo-grid-thumb-container {
-        margin: 10px 0;
-        
+        max-width: 30%;
+        margin: 10px;
         .photo-grid-thumb {
             position: relative;
             left: 50%;
@@ -16,39 +17,4 @@
             width: 100%;
         }
     }
-}
-
-@media only screen and (min-width: 1500px) {
-    .photo-grid {
-        .photo-grid-thumb-container {
-            width: 23%;
-        }
-    }
-}
-
-
-@media only screen and (max-width: 1499px) and (min-width: 1000px) {
-    .photo-grid {
-        .photo-grid-thumb-container {
-            width: 30%;
-        }
-    }
-}
-
-@media only screen and (max-width: 999px) and (min-width: 700px) {
-    .photo-grid {
-        .photo-grid-thumb-container {
-            width: 44%;
-        }
-    }
-}
-
-@media only screen and (max-width: 699px) {
-    .photo-grid {
-        .photo-grid-thumb-container {
-            
-            margin: 10px 10px 0 10px;
-            width: 100%;
-        }
-    }
 }

src/sections/Portfolio.jsx

@@ -1,5 +1,4 @@
 import PhotoGrid from '../photoDisplays/PhotoGrid';
-import './Portfolio.scss';
 
 const images = [{
     id: 0,

src/sections/Portfolio.scss

@@ -1,6 +0,0 @@
-@media only screen and (min-width: 700px) {
-    .portfolio-section {
-        padding-left: 100px;
-        padding-right: 100px;
-    }
-}