Unit switch: rel. to viewport

css/style.css

@@ -11,6 +11,7 @@ body {
 	height: 100vh;
 	width: 100vw;
 	background-color: #fff;
+	min-width: 1024px;
 }
 
 .social {
@@ -33,6 +34,19 @@ p {
 	line-height: 1.2;
 	margin: 0 0;
 }
+
+a {
+	color :#727272;
+}
+
+a:hover {
+	color: #03A9F4;
+}
+
+a i {
+	color: inherit;
+}
+
 /*
 * PANELS
 */
@@ -59,39 +73,32 @@ p {
 * LANDING PANEL
 */
 
+#container-landing{
+	margin-left:2vw;
+}
+
 #greet {
 	margin-bottom: 0;
+	font-size: 7vw;
 }
 
 #landing-blurb {
 	overflow: hidden;
+	margin-left:0.4vw;
 }
 
-#main-menu {
+#container-landing ul {
-	margin-left:3em;
-}
-
-#main-menu ul {
 	list-style: none;
-	margin-left:-2.3em;
+	font-size: 4vw;
-	font-size: 1.5em;
+	padding-left: 0;
 }
 
-#main-menu ul li {
+#container-landing ul li {
 	display: inline;
-	margin: 0 1em;
+	margin-top: 0;
-}
+	margin-bottom: 0;
+	margin-right: 1vw;
 
-a {
-	color :#727272;
-}
-
-a:hover {
-	color: #03A9F4;
-}
-
-a i {
-	color: inherit;
 }
 
 /*
@@ -130,30 +137,35 @@ a i {
 .projects-row {
 	height: 100px;
 	width: 90vw;
+	margin-left: auto;
+	margin-right:auto;
 }
 
 .projects-cell {
-	width: 20vw;
+	width: 25vw;
-	height:100px;
+	height:20vh;
-	background-color: #fff;
+	background-color: #03A9F4;
 	margin:0.5em 0.5em;
 	float:left;
 }
 
+#projects-main {
+	text-align:center;
+}
+
 /*
 * MODIFIERS
 */
 
-.large { font-size: 3.0em; }
 .accentsize { font-size: 1.4em; }
-.basesize { font-size: 1.2em; }
+.basesize { font-size: 2vw; }
 
 .bold { font-weight: bold; }
 
 .pos-abs { position: absolute; }
 
 .mt-z { margin-top: 0; }
-
+.mt2 { margin-top: 0.5em;}
 .mb-z { margin-bottom: 0; }
 
 .vcenter {