diff --git a/.gitignore b/.gitignore
index b5007c5..fc3cf56 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 output/*
 tmp/*
 crash.log
+*.swp
diff --git a/content/stylesheet.css b/content/stylesheet.css
index 05f3e81..8d664d7 100644
--- a/content/stylesheet.css
+++ b/content/stylesheet.css
@@ -1,13 +1,16 @@
 * {
   margin: 0;
   padding: 0;
+}
 
+html {
   font-family: Tahoma, 'Times New Roman', sans-serif;
   color: #000;
 }
 
 body {
   background: #fff;
+  font-size: 100%;
 }
 
 a {
@@ -28,7 +31,6 @@ a:hover {
 #cssmenu {
   display: block;
   float: left;
-  position: absolute;
   top: 0px;
   left: 0px;
   padding: 0 0 0 0;
@@ -37,41 +39,21 @@ a:hover {
 #main {
   padding-top: 40px;
   padding-left: 10px;
-
-  top: 40px;
-  left: 10px;
-}
-
-/* For mobile users */
-@media screen and (max-device-width: 500px){
-  #main {
-    width: 100%;
-    padding-right: 10px;
-  }
-}
-
-@media screen and (min-device-width:501px){
-  #main {
-    width: 500px;
-  }
+  max-width: 480px;
 }
 
 #main h1 {
-  font-size: 40px;
+  font-size: 2.5em;
   font-weight: normal;
-
-  line-height: 40px;
-
+  line-height: 1.2em;
   letter-spacing: -1px;
   color: #0B5FA5;
 }
 
 #main p {
   margin: 20px 0;
-
-  font-size: 15px;
-
-  line-height: 20px;
+  font-size: 1em;
+  line-height: 1.1em;
 }
 
 #main ul, #main ol {
@@ -79,9 +61,9 @@ a:hover {
 }
 
 #main li {
-  font-size: 15px;
+  font-size: 1em;
 
-  line-height: 20px;
+  line-height: 1.1em;
 }
 
 #main ul li {
@@ -129,9 +111,9 @@ a:hover {
 }
 
 #sidebar li {
-  font-size: 14px;
+  font-size: 1em;
 
-  line-height: 20px;
+  line-height: 1.1em;
 }
 
 code {
@@ -145,7 +127,10 @@ pre {
   background-color: #fff;
   padding: 1em;
   font-family: monospace;
-  border: 1px solid #ccc;
+  border: 1px solid #062270;
+  max-width: 100%;
+  white-space: pre-wrap;
+  word-wrap: break-word;
   overflow-x: auto;
 }
 
@@ -154,15 +139,13 @@ pre pre {
 }
 
 pre code {
-  color: #062270;
-  font-family: monospace;
   border: 0px solid #fff;
 }
 
 pre.license {
   color: #2B4281;
   background-color: transparent;
-  font-size: 11px;
+  font-size: 0.75em;
   font-family: normal;
   border: 1px solid #ccc;
   margin-left: -9px;
@@ -170,7 +153,7 @@ pre.license {
 
 pre.license b {
   color: #007929;
-  font-size: 11px;
+  font-size: 0.75em;
   font-family: normal;
 }
 
@@ -278,114 +261,109 @@ ul.pureCssMenu li:hover>ul{display:block}
 ul.pureCssMenu ul{position: absolute;left:-1px;top:98%;}
 ul.pureCssMenu ul ul{position: absolute;left:98%;top:-2px;}
 ul.pureCssMenu,ul.pureCssMenu ul {
-  margin:0px;
-  list-style:none;
-  padding:0px 2px 2px 0px;
-  background-color:#FFFFFF;
-  background-repeat:repeat;
-  border-color:#AAAAAA;
-  border-width:1px;
-  border-style:solid;
+	margin:0px;
+	list-style:none;
+	padding:0px 2px 2px 0px;
+	background-color:#FFFFFF;
+	background-repeat:repeat;
+	border-color:#AAAAAA;
+	border-width:1px;
+	border-style:solid;
 }
 ul.pureCssMenu table {border-collapse:collapse}
 ul.pureCssMenu {
-  display:block;
-  zoom:1;
-  float: left;
+	display:block;
+	zoom:1;
+	float: left;
 }
 ul.pureCssMenu ul{
-  width:91.35000000000001px;
-}
-ul.pureCssMenu li{
-  display:block;
-  margin:2px 0px 0px 2px;
-  font-size:0px;
+	width:91.35000000000001px;
 }
+
 ul.pureCssMenu a:active, ul.pureCssMenu a:focus {
-  outline-style:none;
+outline-style:none;
 }
+
 ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover {
-  display:block;
-  vertical-align:middle;
-  background-color:#FFFFFF;
-  border-width:0px;
-  border-color:#6655ff;
-  border-style:solid;
-  text-align:left;
-  text-decoration:none;
-  padding:4px;
-  _padding-left:0;
-  font:13px Tahoma;
-  color: #000;
-  text-decoration:none;
-  cursor:default;
+	display:block;
+	vertical-align:middle;
+	background-color:#FFFFFF;
+	border-width:0px;
+	border-color:#6655ff;
+	border-style:solid;
+	text-align:left;
+	text-decoration:none;
+	padding:4px;
+	font: 14px Tahoma;
+	color: #000;
+	text-decoration:none;
+	cursor:default;
+	vertical-align: text-bottom;
 }
 
 ul.pureCssMenu span{
-  overflow:hidden;
+	overflow:hidden;
 }
-ul.pureCssMenu li {
-  float:left;
+
+ul.pureCssMenu li{
+	display:block;
+	margin:2px 0px 0px 2px;
+	font-size:0px;
+	float: left;
 }
+
 ul.pureCssMenu ul li {
-  float:none;
+	float:none;
 }
 ul.pureCssMenu ul a {
-  text-align:left;
-  white-space:nowrap;
+	text-align:left;
 }
 ul.pureCssMenu li.sep{
-  text-align:center;
-  padding:0px;
-  line-height:0;
-  height:100%;
+	text-align:center;
+	padding:0px;
+	line-height:0;
+	height:100%;
 }
 ul.pureCssMenu li.sep span{
-  float:none;
-  padding-right:0;
-  width:5;
-  height:16;
-  display:inline-block;
-  background-color:#AAAAAA;
-  background-image:none;}
+	float:none;	padding-right:0;
+	width:5;
+	height:16;
+	display:inline-block;
+	background-color:#AAAAAA;
+	background-image:none;
+}
 ul.pureCssMenu ul li.sep span{
-  width:80%;
-  height:3;
+	width:80%;
+	height:3;
 }
 ul.pureCssMenu li:hover{
-  position:relative;
+	position:relative;
 }
 ul.pureCssMenu li:hover>a{
-  background-color:#66A1D2;
-  border-color:#665500;
-  border-style:solid;
-  font:13px Tahoma;
-  color: #FFFFFF;
-  text-decoration:none;
+	background-color:#66A1D2;
+	border-color:#665500;
+	border-style:solid;
+	font:14px Tahoma;
+	color: #FFFFFF;
+	text-decoration:none;
 }
 ul.pureCssMenu li a:hover{
-  position:relative;
-  background-color:#66A1D2;
-  border-color:#665500;
-  border-style:solid;
-  font:13px Tahoma;
-  color: #FFFFFF;
-  text-decoration:none;
+	position:relative;
+	background-color:#66A1D2;
+	border-color:#665500;
+	border-style:solid;
+	font:14px Tahoma;
+	color: #FFFFFF;
+	text-decoration:none;
 }
 ul.pureCssMenu li.dis a {
-  color: #AAAAAA !important;
+	color: #AAAAAA !important;
 }
-ul.pureCssMenu img {
-  border: none;
-  float:left;
-  _float:none;
-  margin-right:4px;
-  width:16px;
-  height:16px;
+ul.pureCssMenu img {border: none;float:left;_float:none;margin-right:4px;width:16px;
+height:16px;
 }
-ul.pureCssMenu ul img {
-  width:16px;
-  height:16px;
+ul.pureCssMenu ul img {width:16px;
+height:16px;
 }
 ul.pureCssMenu img.over{display:none}
 ul.pureCssMenu li.dis a:hover img.over{display:none !important}
@@ -396,24 +374,35 @@ ul.pureCssMenu a:hover img.over,ul.pureCssMenu a:hover ul img.def,ul.pureCssMenu
 ul.pureCssMenu a:hover img.def,ul.pureCssMenu a:hover ul img.over,ul.pureCssMenu a:hover a:hover img.def{display:none}
 ul.pureCssMenu a:hover ul{display:block}
 ul.pureCssMenu span{
-  display:block;
-  background-image:url(/i/cssmenu/arrv_anim_1.gif);
-  background-position:right center;
-  background-repeat: no-repeat;
-  padding-right:13px;
-}
-ul.pureCssMenu li:hover>a>span{
-  background-image:url(/i/cssmenu/arrv_anim_1o.gif);
-}
-ul.pureCssMenu a:hover span{
-  _background-image:url(/i/cssmenu/arrv_anim_1o.gif);
-}
-ul.pureCssMenu ul span,ul.pureCssMenu a:hover table span{
-  background-image:url(/i/cssmenu/arr_double_1.gif);
-}
-ul.pureCssMenu ul li:hover > a span{
-  background-image:url(/i/cssmenu/arr_double_1o.gif);
-}
-ul.pureCssMenu table a:hover span{
-  background-image:url(/i/cssmenu/arr_double_1o.gif);
+	display:block;
+	background-image:url(/i/cssmenu/arrv_anim_1.gif);
+	background-position:right center;
+	background-repeat: no-repeat;
+   padding-right:12px;}
+ul.pureCssMenu li:hover>a>span{	background-image:url(/i/cssmenu/arrv_anim_1o.gif);
+}
+ul.pureCssMenu a:hover span{_background-image:url(/i/cssmenu/arrv_anim_1o.gif)}
+ul.pureCssMenu ul span,ul.pureCssMenu a:hover table span{background-image:url(/i/cssmenu/arr_double_1.gif)}
+ul.pureCssMenu ul li:hover > a span{	background-image:url(/i/cssmenu/arr_double_1o.gif);}
+ul.pureCssMenu table a:hover span{background-image:url(/i/cssmenu/arr_double_1o.gif)}
+
+/* For mobile */
+@media only screen and (max-width: 480px) {
+	#main {
+		width: 95%;
+	}
+
+	ul.pureCssMenu a, ul.pureCssMenu li.dis a:hover, ul.pureCssMenu li.sep a:hover,
+	ul.pureCssMenu li a:hover,
+	ul.pureCssMenu li:hover>a {
+		font-size: 18px;
+	}
+}
+
+@media only screen and (max-width: 320px)
+	and (max-width: 320px) {
+	body {
+		font-size: 120%;
+	}
 }
+