Add Flexbox support for Safari. I sigh at Safari

public/css/main.css

@@ -56,18 +56,22 @@ body {
   font-size: 100%; }
 
 .flexcontainer {
+  display: -webkit-flex;
   display: flex;
+  -webkit-flex-direction: column;
   flex-direction: column; }
 
 .flexpage, .intro-page, .info-page, .footer-page, .login-page, .panel-page {
   display: flex;
+  display: -webkit-flex;
   justify-content: center;
   align-items: center; }
 
 .intro-page {
   background: linear-gradient(#070a15, #252b46);
   height: 100vh;
-  flex-direction: column; }
+  flex-direction: column;
+  -webkit-flex-direction: column; }
   @media (max-width: 1200px) {
     .intro-page {
       height: 100%; } }
@@ -100,10 +104,12 @@ body {
 .info-page {
   background: linear-gradient(#F1D4AF, #eee9d9);
   flex-direction: row;
+  -webkit-flex-direction: row;
   min-height: 80vh; }
   @media (max-width: 1200px) {
     .info-page {
       flex-direction: column;
+      -webkit-flex-direction: column;
       height: 100%; } }
 
 .info-page h1 {
@@ -136,6 +142,7 @@ body {
   flex: 1;
   background-color: #e2f2f0;
   flex-direction: column;
+  -webkit-flex-direction: column;
   min-height: 20vh; }
   @media (max-width: 1200px) {
     .footer-page {
@@ -163,6 +170,7 @@ body {
 .login-page {
   background: linear-gradient(#070a15, #252b46);
   flex-direction: column;
+  -webkit-flex-direction: column;
   padding: 40px; }
 
 .login-page-logo {
@@ -184,6 +192,7 @@ body {
 
 .panel-page {
   background: linear-gradient(#F1D4AF, #eee9d9);
-  flex-direction: column; }
+  flex-direction: column;
+  -webkit-flex-direction: column; }
 
 /*# sourceMappingURL=main.css.map */

public/css/main.css.map

@@ -1,6 +1,6 @@
 {
 "version": 3,
-"mappings": "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",
+"mappings": "AACQ,0BAAe;AACf,yBAAc;AAGd,uBAAY;AACZ,uFAA+E;ACNvF,SAAS;EACP,eAAe,EAAE,IAAI;EACrB,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,IAAI;EACb,QAAQ,EAAE,MAAM;;AAElB,YAAY;EACV,KAAK,EAAE,IAAI;;AAEb,cAAc;EACZ,OAAO,EAAE,YAAY;EACrB,OAAO,EAAE,SAAS;EAClB,eAAe,EAAE,IAAI;EACrB,SAAS,EAAE,IAAI;EACf,gBAAgB,EAAE,IAAI;EACtB,MAAM,EAAE,eAAe;EACvB,aAAa,EAAE,GAAG;EAClB,KAAK,EAAE,OAAO;;AAEhB,oBAAoB;EAClB,gBAAgB,EAAE,OAAO;EACzB,eAAe,EAAE,IAAI;;AAEvB,iBAAiB;EACf,OAAO,EAAE,IAAI;;ACxBf,KAAK;EACH,OAAO,EAAE,IAAI;EACb,UAAU,EAAE,UAAU;EACtB,MAAM,EAAE,iBAAiB;EACzB,aAAa,EAAE,GAAG;EAClB,SAAS,EAAE,KAAK;EAChB,WAAW,EAAE,YAAY;;AAE3B,WAAW;EACT,MAAM,EAAE,cAAc;;AAExB,MAAM;EACJ,gBAAgB,EAAE,OAAO;EACzB,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,KAAK;EACZ,OAAO,EAAE,SAAS;EAClB,eAAe,EAAE,IAAI;EACrB,MAAM,EAAE,OAAO;EACf,MAAM,EAAE,OAAO;EACf,SAAS,EAAE,KAAK;EAChB,WAAW,EAAE,YAAY;;AFX3B,IAAK;EACH,gBAAgB,EAAE,OAAO;EACzB,WAAW,EAAE,mBAAmB;EAChC,SAAS,EAAC,IAAI;;AAGhB,cAAe;EACb,OAAO,EAAE,YAAY;EACrB,OAAO,EAAE,IAAI;EAEb,sBAAsB,EAAE,MAAM;EAC9B,cAAc,EAAE,MAAM;;AAGxB,0EAAU;EACR,OAAO,EAAE,IAAI;EACb,OAAO,EAAE,YAAY;EAErB,eAAe,EAAE,MAAM;EACvB,WAAW,EAAE,MAAM;;AAuBrB,WAAY;EAEV,UAAU,EAAE,iCAAiC;EAC7C,MAAM,EAAE,KAAK;EACb,cAAc,EAAE,MAAM;EACtB,sBAAsB,EAAE,MAAM;EAX9B,0BAAoC;IAMtC,WAAY;MAOT,MAAM,EAAE,IAAI;;AAIf,gBAAiB;EACf,WAAW,EAAE,mBAAmB;EAChC,SAAS,EAAE,IAAI;EACf,cAAc,EAAE,SAAS;EACzB,KAAK,EAAE,OAAO;EA3Bd,WAAW,EAFC,mrBAAmD;EAQ/D,0BAAoC;IAiBtC,gBAAiB;MAOd,SAAS,EAAE,KAAK;MAChB,OAAO,EAAE,IAAI;MA/Bd,WAAW,EAFC,6cAAmD;;AAsCjE,wBAAyB;EACvB,WAAW,EAAE,oBAAoB;EACjC,SAAS,EAAE,GAAG;EACd,cAAc,EAAE,SAAS;EACzB,KAAK,EAAE,IAAI;EAlCX,0BAAoC;IA8BtC,wBAAyB;MAMtB,SAAS,EAAE,GAAG;MACd,WAAW,EAAE,IAAI;;AAIpB,qBAAsB;EACpB,KAAK,EAAE,OAAO;;AAIhB,UAAW;EAET,UAAU,EAAE,iCAAiC;EAC7C,cAAc,EAAE,GAAG;EACnB,sBAAsB,EAAE,GAAG;EAC3B,UAAU,EAAE,IAAI;EAnDhB,0BAAoC;IA8CtC,UAAW;MAOR,cAAc,EAAE,MAAM;MACtB,sBAAsB,EAAE,MAAM;MAC9B,MAAM,EAAE,IAAI;;AAIf,aAAc;EACZ,WAAW,EAAE,OAAO;EACpB,KAAK,EAAE,OAAO;EACd,UAAU,EAAE,MAAM;EAClB,SAAS,EAAE,GAAG;EACd,cAAc,EAAE,SAAS;EACzB,WAAW,EAAE,GAAG;EAjEhB,0BAAoC;IA2DtC,aAAc;MAQX,WAAW,EAAE,GAAG;;AAInB,eAAgB;EACd,SAAS,EAAE,GAAG;EACd,WAAW,EAAE,KAAK;EAClB,KAAK,EAAE,OAAO;EACd,MAAM,EAAE,IAAI;;AAGd;uDACwD;EACtD,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;EAjFX,0BAAoC;IA8EtC;2DACwD;MAIpD,SAAS,EAAE,GAAG;;AAKlB,YAAa;EAEX,IAAI,EAAE,CAAC;EACP,gBAAgB,EAAE,OAAO;EACzB,cAAc,EAAE,MAAM;EACtB,sBAAsB,EAAE,MAAM;EAC9B,UAAU,EAAE,IAAI;EA9FhB,0BAAoC;IAwFtC,YAAa;MAQV,MAAM,EAAE,IAAI;;AAIf,cAAe;EACb,KAAK,EAAE,KAAK;;AAGd,oDAAmB;EACjB,WAAW,EAAE,aAAa;EAC1B,KAAK,EAAE,OAAO;EACd,WAAW,EAAE,OAAO;EACpB,cAAc,EAAE,SAAS;;AAG3B,eAAgB;EAEd,SAAS,EAAE,KAAK;;AAGlB,eAAgB;EAEd,SAAS,EAAE,KAAK;EAtHhB,0BAAoC;IAoHtC,eAAgB;MAIZ,SAAS,EAAE,GAAG;MACd,MAAM,EAAE,IAAI;;AAKhB,WAAY;EAEV,UAAU,EAAE,iCAAiC;EAC7C,cAAc,EAAE,MAAM;EACtB,sBAAsB,EAAE,MAAM;EAC9B,OAAO,EAAE,IAAI;;AAGf,gBAAiB;EACf,WAAW,EAAE,mBAAmB;EAChC,SAAS,EAAE,GAAG;EACd,cAAc,EAAE,SAAS;EACzB,KAAK,EAAE,OAAO;EAhJd,WAAW,EAFC,uOAAmD;;AAqJjE,gBAAiB;EACf,gBAAgB,EAAE,IAAI;EACtB,OAAO,EAAE,KAAK;EACd,UAAU,EAAE,UAAU;EACtB,aAAa,EAAE,GAAG;EAClB,UAAU,EAAE,CAAC;EACb,aAAa,EAAE,iBAAiB;EAChC,YAAY,EAAE,iBAAiB;EAC/B,WAAW,EAAE,CAAC;;AAIhB,WAAY;EAEV,UAAU,EAAE,iCAAiC;EAC7C,cAAc,EAAE,MAAM;EACtB,sBAAsB,EAAE,MAAM",
 "sources": ["main.scss","navigation.sass","forms.sass"],
 "names": [],
 "file": "main.css"

public/css/main.scss

@@ -14,12 +14,17 @@ body {
 }
 
 .flexcontainer {
+  display: -webkit-flex;
   display: flex;
+
+  -webkit-flex-direction: column;
   flex-direction: column;
 }
 
 .flexpage {
   display: flex;
+  display: -webkit-flex;
+
   justify-content: center;
   align-items: center;
 }
@@ -49,6 +54,7 @@ $break-small: 1200px;
   background: linear-gradient(#070a15, #252b46);
   height: 100vh;
   flex-direction: column;
+  -webkit-flex-direction: column;
   @include break-small {
    height: 100%; // remove the 100 VH on mobile devices to prevent unneccessary scrolling
  }
@@ -87,9 +93,11 @@ $break-small: 1200px;
   @extend .flexpage;
   background: linear-gradient(#F1D4AF, #eee9d9);
   flex-direction: row;
+  -webkit-flex-direction: row;
   min-height: 80vh;
   @include break-small {
    flex-direction: column;
+   -webkit-flex-direction: column;
    height: 100%;
  }
 }
@@ -128,6 +136,7 @@ $break-small: 1200px;
   flex: 1;
   background-color: #e2f2f0;
   flex-direction: column;
+  -webkit-flex-direction: column;
   min-height: 20vh;
   @include break-small {
    height: 100%;
@@ -164,6 +173,7 @@ $break-small: 1200px;
   @extend .flexpage;
   background: linear-gradient(#070a15, #252b46);
   flex-direction: column;
+  -webkit-flex-direction: column;
   padding: 40px;
   }
 
@@ -190,4 +200,5 @@ $break-small: 1200px;
   @extend .flexpage;
   background: linear-gradient(#F1D4AF, #eee9d9);
   flex-direction: column;
+  -webkit-flex-direction: column;
 }