css improvements related to fonts and notes paragraphs

css/style.css

@@ -1,3 +1,14 @@
+body h1,
+body h2,
+body h3,
+body h4,
+body h5,
+body h6,
+body p,
+body div,
+body span {
+  font-family: "Open Sans", Helvetica, Arial, sans-serif;
+}
 body .page-header {
   background: url("/images/header.png");
   margin-top: 0;
@@ -32,9 +43,6 @@ body .page-header .content h1 .tiny {
   color: #eee;
   font-size: 22px;
 }
-body .page-header .content h1 img {
-  margin: 20px;
-}
 body .container {
   max-width: 960px;
 }
@@ -43,7 +51,6 @@ body .container.amber-main {
 }
 body .container h2 {
   font-weight: bold;
-  border-bottom: 1px solid #ccc;
   padding-bottom: 20px;
   margin-bottom: 20px;
   color: #444;
@@ -55,17 +62,27 @@ body .container h4 {
 }
 body .container h3 {
   padding-bottom: 10px;
-  border-bottom: 1px solid #999;
+}
+body .container img {
+  margin: 20px 0;
 }
 body .container p.note {
   background: #FFFFDD;
-  padding: 5px 10px;
-  border: 1px solid #BBBB7A;
+  padding: 10px;
+  border-left: 6px solid #BBBB7A;
+  margin-left: -6px;
 }
 body .container p.warning {
   background: #ffDDDD;
-  padding: 5px 10px;
-  border: 1px solid #bb9999;
+  padding: 10px;
+  border-left: 6px solid #bb9999;
+  margin-left: -6px;
+}
+body .container pre {
+  border-radius: 0;
+  border: 0 none;
+  border-left: 6px solid #ccc;
+  margin-left: -6px;
 }
 body .container .nav.amber-nav {
   background: #eee;

css/style.less

@@ -1,5 +1,9 @@
 body {
 
+	h1, h2, h3, h4, h5, h6, p, div, span {
+		font-family: "Open Sans", Helvetica, Arial, sans-serif;
+	}
+
 	.page-header {
 		background: url("/images/header.png");
 		margin-top: 0;
@@ -37,10 +41,6 @@ body {
 					color: #eee;
 					font-size: 22px;
 				}
-
-				img {
-					margin: 20px;
-				}
 			}
 		}
 	}
@@ -54,7 +54,6 @@ body {
 
 		h2 {
 			font-weight: bold;
-			border-bottom: 1px solid #ccc;
 			padding-bottom: 20px;
 			margin-bottom: 20px;
 			color: #444;
@@ -67,23 +66,35 @@ body {
 
 		h3 {
 			padding-bottom: 10px;
-			border-bottom: 1px solid #999;
+		}
+
+		img {
+			margin: 20px 0;
 		}
 
 		p {
 			&.note {
 				background: #FFFFDD;
-				padding: 5px 10px;
-				border: 1px solid #BBBB7A;
+				padding: 10px;
+				border-left: 6px solid #BBBB7A;
+				margin-left: -6px;
 			}
 
 			&.warning {
 				background: #ffDDDD;
-				padding: 5px 10px;
-				border: 1px solid #bb9999;
+				padding: 10px;
+				border-left: 6px solid #bb9999;
+				margin-left: -6px;
 			}
 		}
 
+		pre {
+			border-radius: 0;
+			border: 0 none;
+			border-left: 6px solid #ccc;
+			margin-left: -6px;
+		}
+
 		.nav {
 			&.amber-nav {
 				background: #eee;