images

start.html

@@ -42,23 +42,25 @@ Maybe you want to <button id="paper_1">read</button>,<button id="paper_2">read</
 
 <div id="gardenSpace" style="display:none">
     <div id="pane">
-        <div id ="square"></div>
+        <div id ="square">
+            <img src="walking.gif">
+        </div>
     </div>
 </div>
 
 <div id="papers"> 
 
     <div id="readme_1" style="display: none;">
-        <iframe width="400px" height="250px" src="readme/readme_1.html" title="read me"></iframe>
+        <iframe width="300px" height="250px" src="readme/readme_1.html" title="read me"></iframe>
     </div>
     <div id="readme_2" style="display: none;">
-        <iframe width="400px" height="500px"src="readme/readme_2.html" title="read me"></iframe>
+        <iframe width="300px" height="400px"src="readme/readme_2.html" title="read me"></iframe>
     </div>
     <div id="readme_3" style="display: none;">
-        <iframe width="400px" height="300px" src="readme/readme_3.html" title="read me"></iframe>
+        <iframe width="300px" height="200px" src="readme/readme_3.html" title="read me"></iframe>
     </div>
     <div id="readme_4" style="display: none;">
-        <iframe width="400px" height="300px" src="readme/readme_4.html" title="read me"></iframe>
+        <iframe width="300px" height="200px" src="readme/readme_4.html" title="read me"></iframe>
     </div>
 </div>
 

style_1.css

@@ -87,16 +87,16 @@ z-index: -1;
 
 #pane {
     position:relative;
-    width:800px;
+    width:900px;
-    height:800px;
+    height:700px;
     border:2px solid red;
 }
 
 #square {
     position: absolute;
-    width: 50px;
+    width: 70px;
-    height: 50px;
+    height: 115px;
-    border: 2px solid black;
+    
 
 
 }