Fix broken layout in /documentation

Also rearrange box colors to compensate for layout changes

source/documentation/index.html

@@ -39,16 +39,6 @@ <h3>For Newcomers</h3>
     </section>
     </div>
 
-    <div class="autosize">
-    <section id="examples">
-    	<h3>Code examples</h3>
-    	<ul>
-            <li><a href="http://rosettacode.org/wiki/Category:Perl_6">Rosetta Code</a>, programming problems solved in Perl&nbsp;6 side-by-side with hundreds of other languages</li>
-            <li><a href="http://github.com/perl6/perl6-examples">perl6-examples</a>, lots of example programs written in Perl&nbsp;6</li>
-        </ul>
-    </section>
-    </div>
-
     <div class="autosize">
     <section id="p5programmers">
 	<h3>For Perl 5 programmers</h3>
@@ -60,7 +50,7 @@ <h3>For Perl 5 programmers</h3>
 
 </div>
 
-<div class="col3">
+<div class="col2">
 
     <div class="autosize">
     <section id="compendiums">
@@ -75,6 +65,20 @@ <h3>Compendiums and cheatsheets</h3>
     </section>
     </div>
 
+    <div class="autosize">
+    <section id="examples">
+    	<h3>Code examples</h3>
+    	<ul>
+            <li><a href="http://rosettacode.org/wiki/Category:Perl_6">Rosetta Code</a>, programming problems solved in Perl&nbsp;6 side-by-side with hundreds of other languages</li>
+            <li><a href="http://github.com/perl6/perl6-examples">perl6-examples</a>, lots of example programs written in Perl&nbsp;6</li>
+        </ul>
+    </section>
+    </div>
+
+</div>
+
+<div class="col3">
+
     <div class="autosize">
     <section id="misc">
     	<h3>Miscellaneous sources</h3>

source/style.css

@@ -248,14 +248,14 @@ dl#botlist dd {
 }
 
 #examples {
-    background: #f5ef7b;
-    border-color: #f2c100;
+    background: #c0e472;
+    border-color: #8bc313;
     height: auto;
 }
 
 #misc {
-    background: #c0e472;
-    border-color: #8bc313;
+    background: #e47286;
+    border-color: #e43b59;
     height: auto;
 }