Browser support

Author: ricardoantonio

myattempts/09-Omnifood-Optimizations/css/queries.css

@@ -125,7 +125,9 @@
   }
 
   .main-nav {
-    background-color: rgb(255, 255, 255, 0.97);
+    background-color: rgb(255, 255, 255, 0.9);
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(5px);
     position: absolute;
     top: 0;
     left: 0;
@@ -285,3 +287,46 @@
     padding: 3.2rem;
   }
 }
+
+/*****************************/
+/* Fixing Safari flexbox gap */
+/*****************************/
+
+.no-flexbox-gap .main-nav-list li:not(:last-child) {
+  margin-right: 4.8rem;
+}
+.no-flexbox-gap .list-item:not(:last-child) {
+  margin-bottom: 1.6rem;
+}
+.no-flexbox-gap .list-icon:not(:last-child) {
+  margin-right: 1.6rem;
+}
+.no-flexbox-gap .delivered-faces {
+  margin-right: 1.6rem;
+}
+.no-flexbox-gap .meal-attribute:not(:last-child) {
+  margin-bottom: 2rem;
+}
+.no-flexbox-gap .meal-icon {
+  margin-right: 1.6rem;
+}
+.no-flexbox-gap .footer-row div:not(:last-child) {
+  margin-right: 6.4rem;
+}
+.no-flexbox-gap .social-links li:not(:last-child) {
+  margin-right: 2.4rem;
+}
+.no-flexbox-gap .footer-nav li:not(:last-child) {
+  margin-bottom: 2.4rem;
+}
+@media (max-width: 75em) {
+  .no-flexbox-gap .main-nav-list li:not(:last-child) {
+    margin-right: 3.2rem;
+  }
+}
+@media (max-width: 59em) {
+  .no-flexbox-gap .main-nav-list li:not(:last-child) {
+    margin-right: 0;
+    margin-bottom: 4.8rem;
+  }
+}