move css

2 files changed, 61 insertions, 66 deletions

diff --git a/StoneIsland/www/css/blogs.css b/StoneIsland/www/css/blogs.css
index 239e99bf..d81dc587 100644
--- a/StoneIsland/www/css/blogs.css
+++ b/StoneIsland/www/css/blogs.css
@@ -39,6 +39,8 @@
   display: none;
 }
 
+/* FAQ */
+
 .privacy #privacy { display: block }
 .terms #terms { display: block }
 .returns #returns { display: block }
@@ -188,15 +190,65 @@ ul.links {
   font-size:14px;
 }
 
-/* NOTE: not really sure how this is going to work on the archive page
-         based on the pdf mockup */
+.archive h2 {
+  font-size:32px
+}
 
-.archive .above {
-  width:calc(100vw - 80px);
-  box-sizing:border-box;
-  margin:0 auto;
+#archive .heading {
+  position: absolute;
+  top: 0; left: 0;
+  width: 100%;
+  pointer-events: none;
+}
+#archive .menu .items,
+#archive .row .image,
+#archive .row .text {
+  position: absolute;
+  top: 50%; left: 50%;
+  transform-origin: 50% 50%;
+  transform: translateZ(0) translateX(-50%) translateY(-50%);
 }
 
-.archive h2 {
-font-size:32px
-}
\ No newline at end of file
+#archive.menu .menu {
+  opacity: 1;
+  pointer-events: auto;
+}
+#archive .menu {
+  background: rgba(255,255,255,0.8);
+  position: absolute;;
+  top: 0; left: 0;
+  height: 100%;
+  width: 100%;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.2s;
+}
+#archive .menu .items {
+  border-top: 1px solid black;
+  width: 100%;
+}
+#archive .menu .item {
+  width: 100%;
+  text-align: center;
+  border-bottom: 1px solid black;
+  background: white;
+}
+
+#archive .scroll {
+  top: 0; left: 0;
+  height: 100%;
+}
+#archive .row {
+  position: relative;
+  min-height: 80vh;
+  perspective: 500;
+}
+#archive .row .image {
+  width: 100%; height: 100%;
+  background-repeat: no-repeat;
+  background-size: 80% auto;
+  background-position: center center;
+}
+#archive .row .text {
+  width: 80%;
+}
diff --git a/StoneIsland/www/index.html b/StoneIsland/www/index.html
index d3e182ea..b06b3297 100644
--- a/StoneIsland/www/index.html
+++ b/StoneIsland/www/index.html
@@ -160,63 +160,6 @@
     </div>
     <div class="fade-cover"></div>
   </div>
-<style>
-#archive .heading {
-  position: absolute;
-  top: 0; left: 0;
-  width: 100%;
-  pointer-events: none;
-}
-#archive.menu .menu {
-  opacity: 1;
-  pointer-events: auto;
-}
-#archive .menu {
-  background: rgba(255,255,255,0.8);
-  position: absolute;;
-  top: 0; left: 0;
-  height: 100%;
-  width: 100%;
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 0.2s;
-}
-#archive .menu .items {
-  border-top: 1px solid black;
-  width: 100%;
-}
-#archive .menu .item {
-  width: 100%;
-  text-align: center;
-  border-bottom: 1px solid black;
-  background: white;
-}
-#archive .scroll {
-  top: 0; left: 0;
-  height: 100%;
-}
-#archive .row {
-  position: relative;
-  min-height: 80vh;
-  perspective: 500;
-}
-#archive .menu .items,
-#archive .row .image,
-#archive .row .text {
-  position: absolute;
-  top: 50%; left: 50%;
-  transform-origin: 50% 50%;
-  transform: translateZ(0) translateX(-50%) translateY(-50%);
-}
-#archive .row .image {
-  width: 100%; height: 100%;
-  background-repeat: no-repeat;
-  background-size: 80% auto;
-  background-position: center center;
-}
-#archive .row .text {
-}
-</style>
 
   <div id="archive">
     <div class="scroll">