3 files changed, 57 insertions, 33 deletions

diff --git a/public/assets/img/ryder-ripps.gif b/public/assets/img/ryder-ripps.gif
new file mode 100644
index 0000000..0dd6d08
--- /dev/null
+++ b/public/assets/img/ryder-ripps.gif
diff --git a/public/assets/js/lib/ProjectView.js b/public/assets/js/lib/ProjectView.js
index e9835ec..66bb3b6 100644
--- a/public/assets/js/lib/ProjectView.js
+++ b/public/assets/js/lib/ProjectView.js
@@ -17,6 +17,7 @@ var ProjectView = View.extend({
 
     this.images = this.$images.toArray().map(function(img){ return $(img).data("uri") })
 
+
     if (is_mobile) {
       this.$iframes.remove()
       this.$videos.remove()
@@ -76,6 +77,7 @@ var ProjectView = View.extend({
   },
   
   show: function(){
+    var audio = this.$("audio") 
     app.header.updatePageNumber( this.page_number )
     app.header.updateSlideNumber( 0 )
     app.header.updateSlideCount( this.slide_count )
@@ -87,6 +89,7 @@ var ProjectView = View.extend({
     }
     else {
       app.router.pushState("/project/" + this.project_id)
+
     }
     
     this.$images.each(function(){
@@ -120,6 +123,7 @@ var ProjectView = View.extend({
   },
   
   hide: function(){
+
     addClassForPeriod( this.el, "hiding", app.navigation_delay, function(){
       this.reset()
     }.bind(this) )
diff --git a/public/assets/ok.css b/public/assets/ok.css
index 14a8cd6..e28f28f 100644
--- a/public/assets/ok.css
+++ b/public/assets/ok.css
@@ -11,6 +11,7 @@ html {
     outline: 0;
     border: 0;
     -webkit-appearance: none;
+    -webkit-font-smoothing: subpixel-antialiased;
 }
 
 ::selection {
@@ -21,11 +22,17 @@ html {
     color: blue;
 }
 
+audio {
+    position: fixed;
+    top: -800000px;
+    left: -90000px;
+    opacity: 0;
+}
+
 a,
 a:visited {
     color: blue;
     font-weight: bold;
-    font-size: 11px;
     cursor: pointer;
 }
 
@@ -91,7 +98,7 @@ h3 {
 }
 
 .intro {
-    font-size: 12px;
+    font-size: 14px;
     line-height: 20px;
 }
 
@@ -115,14 +122,13 @@ h3 {
 .intro div.text {
     width: 50%;
     -webkit-column-count: 2;
-    -webkit-column-gap: 5px;
-    -moz-column-gap: 5px;
-    column-gap: 5px;
-    font-size: 12px;
+    -webkit-column-gap: 10px;
+    -moz-column-gap: 10px;
+    column-gap: 10px;
 }
 
 .intro .right {
-    background: url(http://ryder-ripps.com/press/ryder-ripps.jpg)no-repeat center;
+    background: url(img/ryder-ripps.gif)no-repeat center;
     background-size: cover;
     -webkit-filter: grayscale(100%);
     filter: grayscale(100%);
@@ -139,7 +145,7 @@ h3 {
 }
 
 .intro.cover .right {
-    background: url(img/crater.gif)no-repeat center;
+    background: url(img/ibm.jpg)no-repeat center;
     background-size: cover;
     width: 75%;
 }
@@ -328,15 +334,16 @@ span {
 }
 
 #curtain {
-  position: absolute;
-  top: 0; left: 0;
-  background: black;
-  transition: 200ms opacity cubic-bezier(0, 0, 0, 1);
-  opacity: 0;
-  z-index: 1;
-  width: 100%;
-  height: 100%;
-  pointer-events: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    background: black;
+    transition: 200ms opacity cubic-bezier(0, 0, 0, 1);
+    opacity: 0;
+    z-index: 1;
+    width: 100%;
+    height: 100%;
+    pointer-events: none;
 }
 
 .navopen #curtain {
@@ -531,6 +538,7 @@ body {
     margin-left: 20vw;
     cursor: url(img/u.png) 32 0, pointer;
 }
+
 .whitecursor .page-up {
     cursor: url(img/u-white.png) 32 0, pointer;
 }
@@ -545,6 +553,7 @@ body {
     margin-left: 20vw;
     cursor: url(img/d.png) 32 64, pointer;
 }
+
 .whitecursor .page-down {
     cursor: url(img/d-white.png) 32 64, pointer;
 }
@@ -597,6 +606,7 @@ button.next {
     cursor: url(img/r.png)64 32, pointer;
     z-index: 4;
 }
+
 .whitecursor button.next {
     cursor: url(img/r-white.png)64 32, pointer;
 }
@@ -606,6 +616,7 @@ button.previous {
     cursor: url(img/l.png) 0 32, pointer;
     z-index: 4;
 }
+
 .whitecursor button.previous {
     cursor: url(img/l-white.png) 0 32, pointer;
 }
@@ -713,7 +724,7 @@ nav {
 
 .projectLink {
     display: block;
-
+    margin-top: 3px;
 }
 
 ul li {
@@ -733,7 +744,22 @@ ul li {
     display: none;
 }
 
-@media (min-width: 1200px) {
+
+@media (min-width: 1500px) {
+    .intro div.text,
+    h3,
+    .left a {
+        font-size: 16px;
+        line-height: 25px;
+    }
+    h1 {
+        font-size: 40px;
+        line-height: 50px;
+    }
+}
+
+
+@media (min-width: 1200px)  and (max-height: 980px){
     .texts {
         font-size: 13px;
         line-height: 16px;
@@ -749,18 +775,15 @@ ul li {
     .projectLink {
         margin-top: 3px;
     }
+    .intro div.text,
+    h3,
+    .left a {
+        font-size: 14px;
+        line-height: 20px;
+    }
 }
 
-
 /*
-    @media (min-width: 1400px) {
-        .texts {
-            font-size: 14px;
-            line-height: 16px;
-        }
-
-    }
-    
     @media (min-width: 1600px) {
         .texts {
             font-size: 15px;
@@ -812,8 +835,6 @@ ul li {
     .texts {
         padding: 3px 5px;
     }
-
-
     .five span {
         width: 100%;
         border-bottom: 1px solid;
@@ -830,12 +851,11 @@ ul li {
         -moz-column-gap: 3px;
         column-gap: 3px;
         border-bottom: 0;
-        border-top:2px;
+        border-top: 2px;
         text-align: justify;
     }
-
     .projectLink {
-        display:none;
+        display: none;
     }
     .press .five span:last-child {
         display: none;