Improve readability on mobile devices.

Improve readability on mobile devices, especially when user using pre
code tags.

themes/default/css/style.css

@@ -15,7 +15,7 @@ body {
 	color: #343A3F;
 	padding: 0;
 	margin: 0;
-	font-weight:500;
+	word-wrap:break-word;
 }
 
 section, footer, header, aside, nav{
@@ -192,7 +192,6 @@ ul li, ol li{
 --------------------------*/
 
 #menu-wrapper {
-	font-weight:bold;
 	font-family: 'Open Sans',sans-serif;
 	color: #7E909D;
 	padding: 10px 0;
@@ -204,6 +203,7 @@ ul li, ol li{
 	font-weight:bold;
 	font-family: 'Open Sans',sans-serif;
 	color: #7E909D;
+	font-size: 14px;
 }
 
 #menu ul {
@@ -219,7 +219,7 @@ ul li, ol li{
 	float:left;
 	margin:0 20px 0 0;
 	list-style:none;
-	padding-top:2px;
+	padding-top:3px;
 }
 
 #menu ul li:last-child {
@@ -238,7 +238,6 @@ ul li, ol li{
 .search-input{
 	margin: 0;
 	padding: 4px 15px;
-	font-family: Arial, Helvetica, sans-serif;
 	font-size:14px;
 	border:1px solid #0076a3; 
 	border-top-left-radius: 5px 5px;
@@ -249,7 +248,6 @@ ul li, ol li{
 .search-button {
 	margin: 0;
 	padding: 4px;
-	font-family: Arial, Helvetica, sans-serif;
 	font-size:14px;
 	outline: none;
 	cursor: pointer;
@@ -463,6 +461,7 @@ h1.title-post a:hover, h2.title-index a:hover {
 
 .postnav .newer {
 	float:left;
+	margin-right:1em;
 }
 
 .postnav .older {
@@ -654,7 +653,11 @@ h1.title-post a:hover, h2.title-index a:hover {
 
 	.social .inner {
 		padding-left:0px;
-	}	
+	}
+
+	pre {
+		white-space: pre-wrap;
+	}
 	
 }
 
@@ -681,8 +684,8 @@ h1.title-post a:hover, h2.title-index a:hover {
 		left: 0;
 		position: absolute;
 		top: 0;
-		width: 100%;
 		max-width:420px!important;
+		width: 100%;
 		max-height:315px!important;
 	}
 
@@ -706,5 +709,4 @@ h1.title-post a:hover, h2.title-index a:hover {
 		width: 100%;
 	}
 
-}
-
+}