1 files changed, 53 insertions, 40 deletions

diff --git a/StoneIsland/platforms/ios/www/css/nav.css b/StoneIsland/platforms/ios/www/css/nav.css
index b7002f20..f555ce99 100755
--- a/StoneIsland/platforms/ios/www/css/nav.css
+++ b/StoneIsland/platforms/ios/www/css/nav.css
@@ -35,7 +35,7 @@
 }
 #nav .menu span {
   display: block;
-  font-size: 14px;
+  font-size: 1rem;
   letter-spacing:1.25px;
   text-shadow:0px 0px 1px rgba(0,0,0,.2);
   color: #000;
@@ -77,9 +77,9 @@
 
 #nav .submenu span {
   display: block;
-  font-size: 14px;
+  font-size: 1rem;
   letter-spacing:1.25px;
-  color: #bbb;
+  color: #666;
   padding: 4px 0 12px 20px
 }
 
@@ -94,8 +94,8 @@
   float: left;
   width: 61px;
   border-left: 1px solid #ddd;
-  color: #bbb;
-  font-size: 18px;
+  color: #666;
+  font-size: 1.125rem;
   padding: 5px 0;
   text-align: center;
 }
@@ -137,11 +137,14 @@ padding-bottom:0px;
 }
 #intro div {
   position: absolute;
-  top: 50%; left: 50%;
+  top: 50%;
+  left: 50%;
   width: 200px;
-  padding: 50px;
-  text-align: center;
-  font-size: 17px;
+  height: 100px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 1.063rem;
 }
 #intro #compass {
   pointer-events: none;
@@ -177,7 +180,7 @@ padding-bottom:0px;
   box-sizing: border-box;
   width: calc(100vw);
   text-align: center;
-  font-size: 14pt;
+  font-size: 0.875rem;
   font-weight: bold;
   line-height: 0;
   text-transform: uppercase;
@@ -198,7 +201,7 @@ padding-bottom:0px;
   display: block;
   position: absolute;
   top: 0; left: 0; width: 100%;
-  height: 42px;
+  height: 48px;
   border-bottom: 1px solid black;
 }
 #header .logo {
@@ -207,43 +210,43 @@ padding-bottom:0px;
   background-position: center center;
   position: absolute;
   background-size: contain;
-  width: 100px; height: 40px;
-  left: 50%; top: -4px;
+  width: 100px; height: 48px;
+  left: 50%; top: -3px;
   margin-left: -50px;
   top:0px;
 }
 #header .burger {
   display: inline-block;
   font-size: 24px;
-  padding: 9px 10px 5px;
+  padding: 12px 13px 7px;
 }
 
 #header .cart_rapper {
-  display: inline-block;
+  display: flex;
+  justify-content: center;
+  align-items: flex-end;
   position: relative;
   float: right;
-  width: 40px; height: 40px;
+  width: 44px; height: 48px;
 }
 #header .cart {
   position: relative;
-  float: right;
   width: 18px;
-  top: 15px;
+  margin-bottom: 10px;
   height: 18px;
-  margin-right: 18px;
   background: #fff;
   background-image:url(../img/cart-box.png);
   background-size:100%;
   background-repeat:no-repeat;
 }
 
-.cart .cart_count {
+#header .cart .cart_count {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translateY(-50%) translateX(-50%);
-  color: #bbb;
-  font-size:12.35px;
+  color: #666;
+  font-size: 12.35px;
 }
 
 #header .cart::before {
@@ -273,12 +276,16 @@ padding-bottom:0px;
 }
 #footer div {
   width: 50%;
+  height: 48px;
   text-align: center;
-  padding: 10px 0;
   color: #000;
   float: left;
-  font-size:14px;
+  font-size: 1rem;
   font-weight:bold;
+  padding: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
 #footer .ok {
   color: #000;
@@ -287,7 +294,7 @@ padding-bottom:0px;
   width: 100%;
 }
 #footer .ok.disabled {
-  color: #bbb;
+  color: #666;
 }
 
 
@@ -300,8 +307,10 @@ padding-bottom:0px;
   width: 100%; height: 100%;
   background: rgba(255,255,255,0.8);
   opacity: 0;
-  -webkit-transition: opacity 0.2s;
-  transition: opacity 0.2s;
+  -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
+  transition: opacity 0.2s, transform 0.2s;
+  -webkit-transform: translateZ(0) translateX(0);
+  transform: translateZ(0) translateX(0);
 }
 #curtain.visible {
   pointer-events: auto;
@@ -346,13 +355,14 @@ padding-bottom:0px;
 #consent_modal {
   display: none;
   z-index: 2;
+  font-size: 1rem;
 }
 #consent_modal a {
   color: black;
 }
 .modal button {
   font-family: pfd, sans-serif;
-  font-size: 12px;
+  font-size: 0.875rem;
   padding: 10px;
   box-sizing: border-box;
   margin: 0;
@@ -400,9 +410,9 @@ padding-bottom:0px;
 #selector:not(.selector-outer-wrap) .options div {
   background: white;
   text-align: center;
-  padding: 7px 12px;
+  padding: 12px 12px;
   box-sizing:border-box;
-  font-size: 14px;
+  font-size: 0.875rem;
   border-left:1px solid black;
   border-right:1px solid black;
   border-top:1px solid black;
@@ -437,7 +447,7 @@ padding-bottom:0px;
   background: white;
   text-align: center;
   padding: 7px 12px;
-  font-size:14px!important;
+  font-size: 0.875rem!important;
 }
 
 .selector-outer-wrap .options div:nth-of-type(odd){
@@ -462,28 +472,31 @@ padding-bottom:0px;
 #cart,
 #profile, #shipping, #payment, #settings, #orders {
   position: absolute;
-  top: 43px;
-  height: -webkit-calc(100% - 43px - 39px);
-  height: calc(100% - 43px - 39px);
+  top: 49px;
+  height: -webkit-calc(100% - 49px - 39px);
+  height: calc(100% - 49px - 39px);
   width: 100%;
   overflow: hidden;
 }
 #collection.single {
-  height: -webkit-calc(100% - 43px);
-  height: calc(100% - 43px);
+  height: -webkit-calc(100% - 49px);
+  height: calc(100% - 49px);
 }
 #story, #hub, #archive, .page, #closed {
   /* these things do not have a footer */
-  height: -webkit-calc(100% - 43px);
-  height: calc(100% - 43px);
+  height: -webkit-calc(100% - 49px);
+  height: calc(100% - 49px);
 }
 
 h1 {
   text-align: center;
   margin: 0;
-  padding: 16px 10px 12px 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
   border-bottom: 1px solid #000;
-  font-size: 14px;
+  height: 48px;
+  font-size: 1rem;
   color: #000;
   letter-spacing: 1px;
   font-weight: bold;