diff --git a/app/scss/packagegrid.scss b/app/scss/packagegrid.scss
index dfdc009..f1de7c8 100644
--- a/app/scss/packagegrid.scss
+++ b/app/scss/packagegrid.scss
@@ -1,26 +1,32 @@
 .packagegrid {
-	list-style: none;
+	display: flex;
+	flex-wrap: wrap;
+	flex-direction: row;
+	flex-grow: 1;
+	flex-shrink: 1;
+	
 	padding: 0;
 	margin: 0;
 }
 
 .packagegrid li {
-	list-style: none;
-	display: inline-block;
-	padding: 0;
-	margin: 8px;
+	flex: 1;
+	display: block;	
+	min-width: 246px;
+	min-height: 164px;
+	padding: 1;
+	margin: 5px;	
 }
 
 .packagegrid a {
 	display: block;
-	width: 246px;
-	height: 164px;
+	padding-bottom: 66.66%;
 	border-radius: 7px;
 	position: relative;
 	overflow: hidden;
-    background-size: cover;
-    background-repeat: no-repeat;
-    background-position: center;
+    	background-size: cover;
+	background-repeat: no-repeat;
+    	background-position: center;
 }
 
 
diff --git a/app/scss/page.scss b/app/scss/page.scss
index 2aede6f..c816b66 100644
--- a/app/scss/page.scss
+++ b/app/scss/page.scss
@@ -6,7 +6,7 @@ html, body {
 	margin: 0;
 }
 
-nav, main, #alerts {
+nav, main, #alerts {     	   
 	width: 90%;
 	max-width: 960px;
 	margin: auto;
@@ -57,7 +57,7 @@ nav a:hover {
 
 header {
 	padding: 20px;
-	background: #113;
+	background: #2988a4;
 }
 
 header p {