Updated stuffs

stylesheets/media.css

@@ -0,0 +1,65 @@
+@media screen and (max-width: 1200px) {
+	section header
+	{
+		font-size: 2.5em;
+	}
+}
+
+@media screen and (max-width: 1024px) {
+	h1
+	{
+		font-size: 3em;
+	}
+
+	section header
+	{
+		font-size: 2em;
+	}
+}
+
+@media screen and (max-width: 768px) {
+	body
+	{
+		font-size: 14px;
+	}
+
+	h1
+	{
+		font-size: 2.5em;
+	}
+}
+
+@media screen and (max-width: 620px) {
+	article
+	{
+		width: 90%;
+	}
+
+	section header
+	{
+		float: none;
+		line-height: 1.5em;
+		width: 100%;
+	}
+
+	section .content
+	{
+		float: none;
+		line-height: 1.25em;
+		width: 100%;
+	}
+}
+
+@media screen and (max-width: 500px) {
+	body
+	{
+		font-size: 13px;
+	}
+}
+
+@media screen and (max-width: 440px) {
+	.divider
+	{
+		margin: 0;
+	}
+}

stylesheets/screen.css

@@ -1,6 +1,6 @@
 body
 {
-	background-color: #CCC;
+	background-color: #EFE9E0;
 	color: #000;
 	font-family: "Amethysta";
 	padding-top: 1em;
@@ -23,6 +23,7 @@ a:active
 article
 {
 	margin: 0 auto;
+	max-width: 1440px;
 	width: 90%;
 }
 
@@ -37,6 +38,18 @@ div
 	padding: 0;
 }
 
+dt
+{
+	border-bottom: 1px solid #999;
+}
+
+dt,
+li,
+p
+{
+	margin: 0.5em 0;
+}
+
 footer
 {
 	clear: both;
@@ -47,11 +60,13 @@ footer
 
 h1
 {
+	font-family: "Fjalla One";
 	font-size: 4em;
 }
 
 h2
 {
+	font-family: "Fjalla One";
 	font-size: 1.5em;
 	line-height: 2em;
 }
@@ -114,9 +129,4 @@ time
 .screen
 {
 	display: inherit;
-}
-
-.soft_divider
-{
-	border-bottom: 1px solid #999;
 }