misc styling

4 files changed, 91 insertions, 8 deletions

diff --git a/StoneIsland/www/css/cart.css b/StoneIsland/www/css/cart.css
index ee074f0d..5a5efcd6 100644
--- a/StoneIsland/www/css/cart.css
+++ b/StoneIsland/www/css/cart.css
@@ -2,12 +2,31 @@
 .cart #cart { display: block; }
 .cart #footer .cancel { display: block }
 .cart #footer .checkout { display: block }
+/* 
 .cart #footer .checkout_proceed { display: block }
+ */
 
 #cart {
   display: none;
 }
 
+#cart .steps {
+  width: 100%;
+  border-bottom: 1px solid #bbb;
+  font-size: 0;
+}
+#cart .steps span {
+  display: inline-block;
+  font-size: 13px;
+  text-align: center;
+  padding: 5px 0;
+  color: #bbb;
+  width: 33%;
+}
+#cart .steps span.active {
+  color: #888;
+}
+
 #summary {
   display: none;
 }
diff --git a/StoneIsland/www/css/index.css b/StoneIsland/www/css/index.css
index 3a0aefbe..db803fa9 100644
--- a/StoneIsland/www/css/index.css
+++ b/StoneIsland/www/css/index.css
@@ -27,7 +27,7 @@ body {
   margin-top: -40px;
   margin-left: -40px;
   display: none;
-} 
+}
 .loader:before {
   content: '';
   border-radius: 50%;
@@ -35,10 +35,13 @@ body {
   border-right: 3px solid transparent;
   animation: loading .5s linear infinite;
   -webkit-animation: loading .5s linear infinite;
+  width: 80px;
+  height: 80px;
+  display: block;
 }
 @keyframes loading {
   to {transform: rotate(360deg)}
 } 
 @-webkit-keyframes loading {
   to {-webkit-transform: rotate(360deg)}
-}
\ No newline at end of file
+}
diff --git a/StoneIsland/www/css/nav.css b/StoneIsland/www/css/nav.css
index 9454fcdc..2463d123 100644
--- a/StoneIsland/www/css/nav.css
+++ b/StoneIsland/www/css/nav.css
@@ -4,8 +4,8 @@
 #nav {
   position: absolute;
   top: 0; left: 0;
-  width: 250px;
-  -webkit-transform: translateZ(0) translateX(-250px);
+  width: 249px;
+  -webkit-transform: translateZ(0) translateX(-249px);
   -webkit-transition: -webkit-transform 0.3s;
   background: #eeeeee;
 }
@@ -26,15 +26,51 @@
   -webkit-transform: translateZ(0) translateX(0);
 }
 .nav #content {
-  -webkit-transform: translateZ(0) translateX(250px);
+  -webkit-transform: translateZ(0) translateX(249px);
 }
 .nav .logo {
   background-image: url(../img/wide-logo.png);
   background-repeat: no-repeat;
   background-position: center center;
   background-size: contain;
-  width: 170px;
+  width: 120px;
   height: 80px;
+  margin-left: 20px;
+}
+#nav .menu span {
+  display: block;
+  font-size: 14px;
+  color: #000;
+  padding: 15px 0 15px 20px;
+}
+#nav .submenu {
+  position: absolute;
+  width: 100%;
+  padding: 20px 0;
+  bottom: 33px;
+  border-top: 1px solid #ddd;
+}
+#nav .submenu span {
+  display: block;
+  font-size: 14px;
+  color: #bbb;
+  padding: 4px 0 5px 20px
+}
+#nav .social {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  border-top: 1px solid #ddd;
+}
+#nav .social span {
+  display: block;
+  float: left;
+  width: 82px;
+  border-left: 1px solid #ddd;
+  color: #bbb;
+  font-size: 18px;
+  padding: 5px 0;
+  text-align: center;
 }
 
 /* INTRO PAGE WITH SPINNING COMPASS */
@@ -128,6 +164,21 @@
 }
 #footer span {
   display: none;
+  padding: 10px 0;
+  color: #bbb;
+}
+#footer .filter {
+  float: right;
+  padding: 10px;
+}
+#footer .buynow,
+#footer .addtocart,
+#footer .cancel,
+#footer .checkout,
+#footer .checkout_proceed {
+  width: 50%;
+  text-align: center;
+  float: left;
 }
 
 
@@ -177,4 +228,14 @@
   height: -webkit-calc(100% - 40px);
   height: calc(100% - 40px);
   width: 100%;
-}
\ No newline at end of file
+}
+h1 {
+  text-align: center;
+  margin: 0;
+  padding: 15px 10px 10px 10px;
+  border-bottom: 1px solid #ccc;
+  font-size: 18px;
+  color: #ccc;
+  letter-spacing: 2px;
+  font-weight: 100;
+}
diff --git a/StoneIsland/www/index.html b/StoneIsland/www/index.html
index 2cbe762b..3440bcbf 100644
--- a/StoneIsland/www/index.html
+++ b/StoneIsland/www/index.html
@@ -29,7 +29,7 @@
 
 <div id="nav">
   <span class="menu">
-    <span class="logo"></span>
+    <div class="logo"></div>
     <span class="store">STORE</span>
     <span class="hub">HUB</span>
     <span class="story">STORY</span>