diff --git a/display-exercise.html b/display-exercise.html
index 433b6cba..b8720abe 100644
--- a/display-exercise.html
+++ b/display-exercise.html
@@ -17,6 +17,32 @@
 </head>
 <body>
 <!-- your HTML here to implement the colored box design -->
-	<p>Placeholder!</p>
-</body>
+	
+<main>
+  
+  <div class="container">
+    <div class="centred">
+      <div class="caja up blue">
+        
+      </div>
+      <div class="caja up green">
+        
+      </div>
+    </div>
+    <div class="centred">
+      <div class="caja down gray">
+        
+      </div>
+      <div class="caja down black">
+        
+      </div>
+      <div class="caja down orange">
+        
+      </div>
+    </div>
+    
+  </div>
+
+</main>
+
 </html>
\ No newline at end of file
diff --git a/position-exercise.html b/position-exercise.html
index 8b60d474..70c2c7de 100644
--- a/position-exercise.html
+++ b/position-exercise.html
@@ -18,8 +18,8 @@
 </head>
 <body>
   <!-- To finish the design, the HTML for the nav requires no additional elements, just the right CSS -->
-  <nav>
-    <img src="images/icon.png">
+  <nav class="container">
+    <img src="images/icon.png" class="logo">
     <ul>
       <li><a href="index.html">Home</a></li>
       <li><a href="display-exercise.html">display</a></li>
@@ -29,6 +29,10 @@
 
   <main>
     <!-- Put the HTML you need to accomplish the design -->
+    <div class="images">
+      <img src="images/spacecat.png" class="spacecat">
+      <img src="images/spacedog.png" class="spacedog">
+    </div>
   </main>
 </body>
 </html>
diff --git a/styles/main.css b/styles/main.css
index 8d5db309..b2b2823f 100644
--- a/styles/main.css
+++ b/styles/main.css
@@ -5,4 +5,55 @@ body * {
 
 a {
   text-decoration: none;
+}
+
+main {
+	font-size: 0;
+}
+
+.container {
+	margin-top: 90px;
+    margin-left: auto;
+    margin-right: auto;
+	width: 800px;
+}
+
+.centred {
+	text-align: center;
+}
+
+.caja {
+	border: 1px solid black;
+	display: inline-block;
+}
+
+.up{
+	width: 50%;
+	height: 200px;
+}
+
+.down {
+	width: 33.33%;
+	height: 300px;
+}
+
+.green {
+	background-color: green;
+}
+
+.blue {
+	background-color: blue;
+}
+
+.orange {
+	background-color: orange;
+}
+
+.gray {
+	background-color: gray;
+}
+
+.black {
+	background-color: black;
+	border: 1px solid;
 }
\ No newline at end of file
diff --git a/styles/position-page.css b/styles/position-page.css
index 8b137891..43a350d8 100644
--- a/styles/position-page.css
+++ b/styles/position-page.css
@@ -1 +1,73 @@
+.container {
+	padding-left: 60px;
+	padding-right: 60px;
+}
 
+nav{
+	height: 60px;
+	background-color: grey;
+	position: fixed;
+	width: 100%;
+}
+
+nav .logo {
+	width: 50px;
+	height: 50px;
+	border: 1px solid black;
+	vertical-align: middle;
+	margin-bottom: 5px;
+	margin-top: 5px;
+}
+
+nav ul{
+	display: inline-block;
+	list-style: none;
+}
+
+nav li{
+	display: inline-block;
+}
+
+nav li::after {
+  content: "|";
+  margin-left: 5px;
+}
+
+nav a:hover {
+  color: black;
+}
+
+body {
+  background: url(../images/outerspace_landscape.jpeg) no-repeat;
+  background-size: cover;
+}
+
+main {
+  padding-top: 90px;
+  min-width: 1000px;
+}
+
+.images {
+  margin-top: 150px;
+  width: 600px;
+  height: 300px;
+  position: relative;
+  border: 10px dotted green;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.spacecat, .spacedog {
+  position: absolute;
+  width: 200px;
+}
+
+.spacecat {
+  top: -90px;
+  left: -90px;
+}
+
+.spacedog {
+  bottom: -120px;
+  right: -60px;
+}
\ No newline at end of file
