Fix phone website and media queries

1 files changed, 13 insertions, 4 deletions

diff --git a/assets/scss/web/_education.scss b/assets/scss/web/_education.scss
index 3707c4a..39e769a 100644
--- a/assets/scss/web/_education.scss
+++ b/assets/scss/web/_education.scss
@@ -7,7 +7,7 @@
   display: flex;
   flex-flow: row wrap;
   justify-content: space-between;
-  @media screen and (max-width: 780px) {
+  @media (max-width: 780px) {
     flex-flow: column wrap;
   }
 }
@@ -25,14 +25,23 @@
 .education__location {
   min-width: 50%;
   margin: 0;
+  @media (max-width: 812px) {
+    @media (orientation: landscape) {
+      font-size: 0.9rem;
+    }
+  }
 }
 
 .education__university {
+  text-align: left;
+  align-self: flex-start;
 }
 
 .education__gpa {
   order: 3;
-  @media screen and (max-width: 780px) {
+  text-align: left;
+  align-self: flex-start;
+  @media (max-width: 780px) {
     order: 2;
   }
 }
@@ -41,7 +50,7 @@
   order: 2;
   text-align: right;
   align-self: flex-end;
-  @media screen and (max-width: 780px) {
+  @media (max-width: 780px) {
     text-align: left;
     align-self: flex-start;
   }
@@ -51,7 +60,7 @@
   order: 4;
   text-align: right;
   align-self: flex-end;
-  @media screen and (max-width: 780px) {
+  @media (max-width: 780px) {
     text-align: left;
     align-self: flex-start;
   }