Tweaked adaptive design

chris-moore-dev · Dec 1, 2024 · 29f2d9f · 29f2d9f
1 parent 682727f
commit 29f2d9f
Showing 1 changed file with 3 additions and 3 deletions.
diff --git a/styles.css b/styles.css
@@ -175,16 +175,16 @@ footer {
     margin-top: 3vw;
 }
 
-/* Adaptive design: alter values when viewport < 1280px */
-@media (max-width: 1280px) {
+/* Adaptive design: alter values when phone aspect ratio is detected */
+@media (max-aspect-ratio: 3/2) {
     .container, .images {
         flex-direction: column;
         align-items: center;
         margin-top: 0;
         margin-bottom: 0;
     }
     .leftImage, .rightImage { 
-        width: 35vw;
+        width: 62vw;
         align-self: center;
         margin-top: 3vw;
         margin-bottom: 3vw;