From 913483172ca58cf06a03f1b2b51fd695dfe51f8d Mon Sep 17 00:00:00 2001
From: Estelle Weyl <estelle@weyl.org>
Date: Thu, 6 Jun 2013 01:47:54 -0700
Subject: [PATCH] finishing touches

---
 mobilecss.css          |  2 +-
 play/mediaqueries.html |  2 +-
 responsive.html        | 19 ++++++++++++++++++-
 3 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/mobilecss.css b/mobilecss.css
index 39e2562..f070014 100755
--- a/mobilecss.css
+++ b/mobilecss.css
@@ -232,7 +232,7 @@ body > footer{
   padding-top: 10px;
 	border: 3px solid #A8ABAE;
 }
-@media screen and (max-width: 600px){
+@media screen and (max-width: 480px){
  body .slide.current {
     position: static;
     width: 90%;
diff --git a/play/mediaqueries.html b/play/mediaqueries.html
index dd5e25e..36c3559 100644
--- a/play/mediaqueries.html
+++ b/play/mediaqueries.html
@@ -13,7 +13,7 @@
 
 </style>
 
-<style contenteditable>@media screen and (max-width: 500px){
+<style contenteditable>@media screen and (max-width: 550px){
   :root {background-color: lightsteelblue;}
   body {text-decoration: underline;}
 }
diff --git a/responsive.html b/responsive.html
index 4da8914..116a2b4 100644
--- a/responsive.html
+++ b/responsive.html
@@ -81,6 +81,23 @@ <h1 style="text-align: left">1.    Screen Size <br/>
   </header>
 </div>
 
+<div class="slide normal" style="background-image: url(images/devicesizes.jpg); background-position:bottom;">
+  <header><h1>Varied Screen Sizes</h1></header>
+    <section class="content">
+      <ul style="margin-top: 270px; font-size:1.1em">
+      <li>Wrist Watch</li>
+      <li>Smart Phone</li>
+      <li>Tablet</li>
+      <li>Laptop</li>
+      <li>Monitor</li>
+      <li>TV</li>
+      <li></li>
+      <li>portrait v. landscape?</li>
+      <li>high and low resolution?</li>
+      </ul>
+    </section>
+</div>
+
 
 <!-- media queries: browser support -->
  <div class="slide normal">
@@ -163,7 +180,7 @@ <h1 style="text-align: left">1.    Screen Size <br/>
 
 <div class="slide object">
   <object data="play/mediaqueries.html"></object>
-  <a href="files/mediaqueries.html" class="objectlink" target="play">Play</a>
+  <a href="play/mediaqueries.html" class="objectlink" target="play">Play</a>
  </div>