diff --git a/index.html b/index.html
index 671d918..535c2bf 100644
--- a/index.html
+++ b/index.html
@@ -1,207 +1,53 @@
-<!DOCTYPE html>
-<!--[if IE 8]><html class="no-js lt-ie9" lang="en" > <![endif]-->
-<!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  
-  <title>gdns</title>
-  
-
-  <link rel="shortcut icon" href="./img/favicon.ico">
-
-  
-  <link href='https://fonts.googleapis.com/css?family=Lato:400,700|Roboto+Slab:400,700|Inconsolata:400,700' rel='stylesheet' type='text/css'>
-
-  <link rel="stylesheet" href="./css/theme.css" type="text/css" />
-  <link rel="stylesheet" href="./css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="./css/highlight.css">
-
-  
-  <script>
-    // Current page data
-    var mkdocs_page_name = "None";
-  </script>
-  
-  <script src="./js/jquery-2.1.1.min.js"></script>
-  <script src="./js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="./js/highlight.pack.js"></script>
-  <script src="./js/theme.js"></script> 
-
-  
-</head>
-
-<body class="wy-body-for-nav" role="document">
-
-  <div class="wy-grid-for-nav">
-
-    
-    <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
-      <div class="wy-side-nav-search">
-        <a href="." class="icon icon-home"> gdns</a>
-        <div role="search">
-  <form id ="rtd-search-form" class="wy-form" action="./search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
-  </form>
-</div>
-      </div>
-
-      <div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="main navigation">
-        <ul class="current">
-          
-            <li>
-    <li class="toctree-l1 current">
-        <a class="current" href=".">Usage</a>
-        
-            <ul>
-            
-                <li class="toctree-l3"><a href="#gdns">gdns</a></li>
-                
-            
-                <li class="toctree-l3"><a href="#features">Features</a></li>
-                
-            
-                <li class="toctree-l3"><a href="#install">Install</a></li>
-                
-            
-                <li class="toctree-l3"><a href="#arguments">Arguments</a></li>
-                
-            
-                <li class="toctree-l3"><a href="#third-part-library">Third-part library</a></li>
-                
-            
-            </ul>
-        
-    </li>
-<li>
-          
-            <li>
-    <li class="toctree-l1 ">
-        <a class="" href="command_line/">Command line options</a>
-        
-    </li>
-<li>
-          
-            <li>
-    <li class="toctree-l1 ">
-        <a class="" href="ex_config/">Config example</a>
-        
-    </li>
-<li>
-          
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <title>Gdns by fangdingjun</title>
+
+    <link rel="stylesheet" href="stylesheets/styles.css">
+    <link rel="stylesheet" href="stylesheets/github-light.css">
+    <meta name="viewport" content="width=device-width">
+    <!--[if lt IE 9]>
+    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+  </head>
+  <body>
+    <div class="wrapper">
+      <header>
+        <h1>Gdns</h1>
+        <p>a dns proxy server write by go</p>
+
+        <p class="view"><a href="https://github.com/fangdingjun/gdns">View the Project on GitHub <small>fangdingjun/gdns</small></a></p>
+
+
+        <ul>
+          <li><a href="https://github.com/fangdingjun/gdns/zipball/master">Download <strong>ZIP File</strong></a></li>
+          <li><a href="https://github.com/fangdingjun/gdns/tarball/master">Download <strong>TAR Ball</strong></a></li>
+          <li><a href="https://github.com/fangdingjun/gdns">View On <strong>GitHub</strong></a></li>
         </ul>
-      </div>
-      &nbsp;
-    </nav>
-
-    <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap">
-
-      
-      <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
-        <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href=".">gdns</a>
-      </nav>
-
-      
-      <div class="wy-nav-content">
-        <div class="rst-content">
-          <div role="navigation" aria-label="breadcrumbs navigation">
-  <ul class="wy-breadcrumbs">
-    <li><a href=".">Docs</a> &raquo;</li>
-    
-      
-    
-    <li>Usage</li>
-    <li class="wy-breadcrumbs-aside">
-      
-    </li>
-  </ul>
-  <hr/>
-</div>
-          <div role="main">
-            <div class="section">
-              
-                <h1 id="gdns">gdns</h1>
-<p>a dns proxy server write by go</p>
-<p>gdns much like dnsmasq or chinadns, but it can run on windows.</p>
-<h1 id="features">Features</h1>
-<p>support different domains use different upstream dns servers</p>
-<p>support contact to the upstream dns server by tcp or udp</p>
-<p>support blacklist list to block the fake ip</p>
-<h1 id="install">Install</h1>
-<pre><code class="bash"># get the depended library
-go get github.com/miekg/dns
-go get github.com/vharitonsky/iniflags
-
-git clone https://github.com/fangdingjun/gdns
-cd gdns
-go build
-
-# generate a sample config file
-./gdns -dumpflags &gt; dns.ini
-
-# edit the dns.ini and run, need root privileges to bind on port 53
-sudo ./gdns -config dns.ini
-
-# test it
-dig @localhost twitter.com
-</code></pre>
-
-<h1 id="arguments">Arguments</h1>
-<p>use <code>gdns -h</code> to show the command line arguments.</p>
-<p>all arguments can specialed in config file or in command line.</p>
-<p>there is a sample file in the <code>config_sample/</code> directory.</p>
-<h1 id="third-part-library">Third-part library</h1>
-<p>use 
-<a href="https://github.com/miekg/dns">dns</a>
-library to parse the dns message</p>
-<p>use
-<a href="https://github.com/vharitonsky/iniflags">iniflags</a>
-library to process the command line arguments and the config file</p>
-              
-            </div>
-          </div>
-          <footer>
-  
-    <div class="rst-footer-buttons" role="navigation" aria-label="footer navigation">
-      
-        <a href="command_line/" class="btn btn-neutral float-right" title="Command line options"/>Next <span class="icon icon-circle-arrow-right"></span></a>
-      
-      
+      </header>
+      <section>
+        <h1>
+<a id="gdns" class="anchor" href="#gdns" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>gdns</h1>
+
+<p>a dns forward proxy write by go</p>
+
+<p><strong>Features</strong></p>
+
+<ul>
+<li>support listen tcp and udp protocol</li>
+<li>support configure different domains to forward to different upstream servers</li>
+<li>support tcp or udp to communicate to upstream servers</li>
+<li>support ip blacklist to filter unwanted dns reply</li>
+</ul>
+      </section>
+      <footer>
+        <p>This project is maintained by <a href="https://github.com/fangdingjun">fangdingjun</a></p>
+        <p><small>Hosted on GitHub Pages &mdash; Theme by <a href="https://github.com/orderedlist">orderedlist</a></small></p>
+      </footer>
     </div>
-  
-
-  <hr/>
-
-  <div role="contentinfo">
-    <!-- Copyright etc -->
+    <script src="javascripts/scale.fix.js"></script>
     
-  </div>
-
-  Built with <a href="http://www.mkdocs.org">MkDocs</a> using a <a href="https://github.com/snide/sphinx_rtd_theme">theme</a> provided by <a href="https://readthedocs.org">Read the Docs</a>.
-</footer>
-	  
-        </div>
-      </div>
-
-    </section>
-
-  </div>
-
-<div class="rst-versions" role="note" style="cursor: pointer">
-    <span class="rst-current-version" data-toggle="rst-current-version">
-      
-      
-      
-        <span style="margin-left: 15px"><a href="command_line/" style="color: #fcfcfc">Next &raquo;</a></span>
-      
-    </span>
-</div>
-
-</body>
+  </body>
 </html>
-
-<!--
-MkDocs version : 0.14.0
-Build Date UTC : 2015-09-01 02:30:24.602000
--->
diff --git a/javascripts/scale.fix.js b/javascripts/scale.fix.js
new file mode 100644
index 0000000..87a40ca
--- /dev/null
+++ b/javascripts/scale.fix.js
@@ -0,0 +1,17 @@
+var metas = document.getElementsByTagName('meta');
+var i;
+if (navigator.userAgent.match(/iPhone/i)) {
+  for (i=0; i<metas.length; i++) {
+    if (metas[i].name == "viewport") {
+      metas[i].content = "width=device-width, minimum-scale=1.0, maximum-scale=1.0";
+    }
+  }
+  document.addEventListener("gesturestart", gestureStart, false);
+}
+function gestureStart() {
+  for (i=0; i<metas.length; i++) {
+    if (metas[i].name == "viewport") {
+      metas[i].content = "width=device-width, minimum-scale=0.25, maximum-scale=1.6";
+    }
+  }
+}
\ No newline at end of file
diff --git a/params.json b/params.json
index f9ceee1..2463c67 100644
--- a/params.json
+++ b/params.json
@@ -1 +1,7 @@
-{"name":"Gdns","tagline":"a dns proxy server write by go","body":"# gdns\r\na dns proxy server write by go\r\n\r\ngdns much like dnsmasq or chinadns, but it can run on windows.\r\n\r\nFeatures\r\n========\r\n\r\nsupport different domains use different upstream dns servers\r\n\r\nsupport contact to the upstream dns server by tcp or udp\r\n\r\nsupport blacklist list to block the fake ip\r\n\r\nInstall\r\n=======\r\n\r\n```bash\r\n# get the depended library\r\ngo get github.com/miekg/dns\r\ngo get github.com/vharitonsky/iniflags\r\n    \r\ngit clone https://github.com/fangdingjun/gdns\r\ncd gdns\r\ngo build\r\n    \r\n# generate a sample config file\r\n./gdns -dumpflags > dns.ini\r\n    \r\n# edit the dns.ini and run, need root privileges to bind on port 53\r\nsudo ./gdns -config dns.ini\r\n    \r\n# test it\r\ndig @localhost twitter.com\r\n```\r\n\r\nArguments\r\n===========\r\n\r\nuse `gdns -h` to show the command line arguments.\r\n\r\nall arguments can specialed in config file or in command line.\r\n\r\nthere is a sample file in the `config_sample/` directory.\r\n\r\nThird-part library\r\n==================\r\nuse \r\n[dns](https://github.com/miekg/dns)\r\nlibrary to parse the dns message\r\n\r\nuse\r\n[iniflags](https://github.com/vharitonsky/iniflags)\r\nlibrary to process the command line arguments and the config file\r\n","google":"","note":"Don't delete this file! It's used internally to help with page regeneration."}
\ No newline at end of file
+{
+  "name": "Gdns",
+  "tagline": "a dns proxy server write by go",
+  "body": "gdns\r\n====\r\n\r\na dns forward proxy write by go\r\n\r\n**Features**\r\n\r\n- support listen tcp and udp protocol\r\n- support configure different domains to forward to different upstream servers\r\n- support tcp or udp to communicate to upstream servers\r\n- support ip blacklist to filter unwanted dns reply\r\n",
+  "google": "",
+  "note": "Don't delete this file! It's used internally to help with page regeneration."
+}
\ No newline at end of file
diff --git a/stylesheets/github-light.css b/stylesheets/github-light.css
index 872a6f4..0c6b24d 100644
--- a/stylesheets/github-light.css
+++ b/stylesheets/github-light.css
@@ -1,17 +1,25 @@
 /*
-   Copyright 2014 GitHub Inc.
+The MIT License (MIT)
 
-   Licensed under the Apache License, Version 2.0 (the "License");
-   you may not use this file except in compliance with the License.
-   You may obtain a copy of the License at
+Copyright (c) 2016 GitHub, Inc.
 
-       http://www.apache.org/licenses/LICENSE-2.0
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
 
-   Unless required by applicable law or agreed to in writing, software
-   distributed under the License is distributed on an "AS IS" BASIS,
-   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-   See the License for the specific language governing permissions and
-   limitations under the License.
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
 
 */
 
@@ -19,18 +27,18 @@
   color: #969896;
 }
 
-.pl-c1      /* constant, markup.raw, meta.diff.header, meta.module-reference, meta.property-name, support, support.constant, support.variable, variable.other.constant */,
+.pl-c1 /* constant, variable.other.constant, support, meta.property-name, support.constant, support.variable, meta.module-reference, markup.raw, meta.diff.header */,
 .pl-s .pl-v /* string variable */ {
   color: #0086b3;
 }
 
-.pl-e  /* entity */,
+.pl-e /* entity */,
 .pl-en /* entity.name */ {
   color: #795da3;
 }
 
-.pl-s .pl-s1 /* string source */,
-.pl-smi      /* storage.modifier.import, storage.modifier.package, storage.type.java, variable.other, variable.parameter.function */ {
+.pl-smi /* variable.parameter.function, storage.modifier.package, storage.modifier.import, storage.type.java, variable.other */,
+.pl-s .pl-s1 /* string source */ {
   color: #333;
 }
 
@@ -42,13 +50,13 @@
   color: #a71d5d;
 }
 
-.pl-pds              /* punctuation.definition.string, string.regexp.character-class */,
-.pl-s                /* string */,
+.pl-s /* string */,
+.pl-pds /* punctuation.definition.string, string.regexp.character-class */,
 .pl-s .pl-pse .pl-s1 /* string punctuation.section.embedded source */,
-.pl-sr               /* string.regexp */,
-.pl-sr .pl-cce       /* string.regexp constant.character.escape */,
-.pl-sr .pl-sra       /* string.regexp string.regexp.arbitrary-repitition */,
-.pl-sr .pl-sre       /* string.regexp source.ruby.embedded */ {
+.pl-sr /* string.regexp */,
+.pl-sr .pl-cce /* string.regexp constant.character.escape */,
+.pl-sr .pl-sre /* string.regexp source.ruby.embedded */,
+.pl-sr .pl-sra /* string.regexp string.regexp.arbitrary-repitition */ {
   color: #183691;
 }
 
@@ -61,24 +69,24 @@
 }
 
 .pl-ii /* invalid.illegal */ {
-  background-color: #b52a1d;
   color: #f8f8f8;
+  background-color: #b52a1d;
 }
 
 .pl-sr .pl-cce /* string.regexp constant.character.escape */ {
-  color: #63a35c;
   font-weight: bold;
+  color: #63a35c;
 }
 
 .pl-ml /* markup.list */ {
   color: #693a17;
 }
 
-.pl-mh        /* markup.heading */,
+.pl-mh /* markup.heading */,
 .pl-mh .pl-en /* markup.heading entity.name */,
-.pl-ms        /* meta.separator */ {
-  color: #1d3e81;
+.pl-ms /* meta.separator */ {
   font-weight: bold;
+  color: #1d3e81;
 }
 
 .pl-mq /* markup.quote */ {
@@ -86,28 +94,28 @@
 }
 
 .pl-mi /* markup.italic */ {
-  color: #333;
   font-style: italic;
+  color: #333;
 }
 
 .pl-mb /* markup.bold */ {
-  color: #333;
   font-weight: bold;
+  color: #333;
 }
 
 .pl-md /* markup.deleted, meta.diff.header.from-file */ {
-  background-color: #ffecec;
   color: #bd2c00;
+  background-color: #ffecec;
 }
 
 .pl-mi1 /* markup.inserted, meta.diff.header.to-file */ {
-  background-color: #eaffea;
   color: #55a532;
+  background-color: #eaffea;
 }
 
 .pl-mdr /* meta.diff.range */ {
-  color: #795da3;
   font-weight: bold;
+  color: #795da3;
 }
 
 .pl-mo /* meta.output */ {
diff --git a/stylesheets/styles.css b/stylesheets/styles.css
new file mode 100644
index 0000000..2e1768e
--- /dev/null
+++ b/stylesheets/styles.css
@@ -0,0 +1,324 @@
+@font-face {
+  font-family: 'Noto Sans';
+  font-weight: 400;
+  font-style: normal;
+  src: url('../fonts/Noto-Sans-regular/Noto-Sans-regular.eot');
+  src: url('../fonts/Noto-Sans-regular/Noto-Sans-regular.eot?#iefix') format('embedded-opentype'),
+       local('Noto Sans'),
+       local('Noto-Sans-regular'),
+       url('../fonts/Noto-Sans-regular/Noto-Sans-regular.woff2') format('woff2'),
+       url('../fonts/Noto-Sans-regular/Noto-Sans-regular.woff') format('woff'),
+       url('../fonts/Noto-Sans-regular/Noto-Sans-regular.ttf') format('truetype'),
+       url('../fonts/Noto-Sans-regular/Noto-Sans-regular.svg#NotoSans') format('svg');
+}
+
+@font-face {
+  font-family: 'Noto Sans';
+  font-weight: 700;
+  font-style: normal;
+  src: url('../fonts/Noto-Sans-700/Noto-Sans-700.eot');
+  src: url('../fonts/Noto-Sans-700/Noto-Sans-700.eot?#iefix') format('embedded-opentype'),
+       local('Noto Sans Bold'),
+       local('Noto-Sans-700'),
+       url('../fonts/Noto-Sans-700/Noto-Sans-700.woff2') format('woff2'),
+       url('../fonts/Noto-Sans-700/Noto-Sans-700.woff') format('woff'),
+       url('../fonts/Noto-Sans-700/Noto-Sans-700.ttf') format('truetype'),
+       url('../fonts/Noto-Sans-700/Noto-Sans-700.svg#NotoSans') format('svg');
+}
+
+@font-face {
+  font-family: 'Noto Sans';
+  font-weight: 400;
+  font-style: italic;
+  src: url('../fonts/Noto-Sans-italic/Noto-Sans-italic.eot');
+  src: url('../fonts/Noto-Sans-italic/Noto-Sans-italic.eot?#iefix') format('embedded-opentype'),
+       local('Noto Sans Italic'),
+       local('Noto-Sans-italic'),
+       url('../fonts/Noto-Sans-italic/Noto-Sans-italic.woff2') format('woff2'),
+       url('../fonts/Noto-Sans-italic/Noto-Sans-italic.woff') format('woff'),
+       url('../fonts/Noto-Sans-italic/Noto-Sans-italic.ttf') format('truetype'),
+       url('../fonts/Noto-Sans-italic/Noto-Sans-italic.svg#NotoSans') format('svg');
+}
+
+@font-face {
+  font-family: 'Noto Sans';
+  font-weight: 700;
+  font-style: italic;
+  src: url('../fonts/Noto-Sans-700italic/Noto-Sans-700italic.eot');
+  src: url('../fonts/Noto-Sans-700italic/Noto-Sans-700italic.eot?#iefix') format('embedded-opentype'),
+       local('Noto Sans Bold Italic'),
+       local('Noto-Sans-700italic'),
+       url('../fonts/Noto-Sans-700italic/Noto-Sans-700italic.woff2') format('woff2'),
+       url('../fonts/Noto-Sans-700italic/Noto-Sans-700italic.woff') format('woff'),
+       url('../fonts/Noto-Sans-700italic/Noto-Sans-700italic.ttf') format('truetype'),
+       url('../fonts/Noto-Sans-700italic/Noto-Sans-700italic.svg#NotoSans') format('svg');
+}
+
+body {
+  background-color: #fff;
+  padding:50px;
+  font: 14px/1.5 "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  color:#727272;
+  font-weight:400;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  color:#222;
+  margin:0 0 20px;
+}
+
+p, ul, ol, table, pre, dl {
+  margin:0 0 20px;
+}
+
+h1, h2, h3 {
+  line-height:1.1;
+}
+
+h1 {
+  font-size:28px;
+}
+
+h2 {
+  color:#393939;
+}
+
+h3, h4, h5, h6 {
+  color:#494949;
+}
+
+a {
+  color:#39c;
+  text-decoration:none;
+}
+
+a:hover {
+  color:#069;
+}
+
+a small {
+  font-size:11px;
+  color:#777;
+  margin-top:-0.3em;
+  display:block;
+}
+
+a:hover small {
+  color:#777;
+}
+
+.wrapper {
+  width:860px;
+  margin:0 auto;
+}
+
+blockquote {
+  border-left:1px solid #e5e5e5;
+  margin:0;
+  padding:0 0 0 20px;
+  font-style:italic;
+}
+
+code, pre {
+  font-family:Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal, Consolas, Liberation Mono, DejaVu Sans Mono, Courier New, monospace;
+  color:#333;
+  font-size:12px;
+}
+
+pre {
+  padding:8px 15px;
+  background: #f8f8f8;
+  border-radius:5px;
+  border:1px solid #e5e5e5;
+  overflow-x: auto;
+}
+
+table {
+  width:100%;
+  border-collapse:collapse;
+}
+
+th, td {
+  text-align:left;
+  padding:5px 10px;
+  border-bottom:1px solid #e5e5e5;
+}
+
+dt {
+  color:#444;
+  font-weight:700;
+}
+
+th {
+  color:#444;
+}
+
+img {
+  max-width:100%;
+}
+
+header {
+  width:270px;
+  float:left;
+  position:fixed;
+  -webkit-font-smoothing:subpixel-antialiased;
+}
+
+header ul {
+  list-style:none;
+  height:40px;
+  padding:0;
+  background: #f4f4f4;
+  border-radius:5px;
+  border:1px solid #e0e0e0;
+  width:270px;
+}
+
+header li {
+  width:89px;
+  float:left;
+  border-right:1px solid #e0e0e0;
+  height:40px;
+}
+
+header li:first-child a {
+  border-radius:5px 0 0 5px;
+}
+
+header li:last-child a {
+  border-radius:0 5px 5px 0;
+}
+
+header ul a {
+  line-height:1;
+  font-size:11px;
+  color:#999;
+  display:block;
+  text-align:center;
+  padding-top:6px;
+  height:34px;
+}
+
+header ul a:hover {
+  color:#999;
+}
+
+header ul a:active {
+  background-color:#f0f0f0;
+}
+
+strong {
+  color:#222;
+  font-weight:700;
+}
+
+header ul li + li + li {
+  border-right:none;
+  width:89px;
+}
+
+header ul a strong {
+  font-size:14px;
+  display:block;
+  color:#222;
+}
+
+section {
+  width:500px;
+  float:right;
+  padding-bottom:50px;
+}
+
+small {
+  font-size:11px;
+}
+
+hr {
+  border:0;
+  background:#e5e5e5;
+  height:1px;
+  margin:0 0 20px;
+}
+
+footer {
+  width:270px;
+  float:left;
+  position:fixed;
+  bottom:50px;
+  -webkit-font-smoothing:subpixel-antialiased;
+}
+
+@media print, screen and (max-width: 960px) {
+
+  div.wrapper {
+    width:auto;
+    margin:0;
+  }
+
+  header, section, footer {
+    float:none;
+    position:static;
+    width:auto;
+  }
+
+  header {
+    padding-right:320px;
+  }
+
+  section {
+    border:1px solid #e5e5e5;
+    border-width:1px 0;
+    padding:20px 0;
+    margin:0 0 20px;
+  }
+
+  header a small {
+    display:inline;
+  }
+
+  header ul {
+    position:absolute;
+    right:50px;
+    top:52px;
+  }
+}
+
+@media print, screen and (max-width: 720px) {
+  body {
+    word-wrap:break-word;
+  }
+
+  header {
+    padding:0;
+  }
+
+  header ul, header p.view {
+    position:static;
+  }
+
+  pre, code {
+    word-wrap:normal;
+  }
+}
+
+@media print, screen and (max-width: 480px) {
+  body {
+    padding:15px;
+  }
+
+  header ul {
+    width:99%;
+  }
+
+  header li, header ul li + li + li {
+    width:33%;
+  }
+}
+
+@media print {
+  body {
+    padding:0.4in;
+    font-size:12pt;
+    color:#444;
+  }
+}
