Merge branch 'master' of github.com:Pylons/pyramid

96 files changed, 1008 insertions, 1265 deletions

diff --git a/docs/tutorials/wiki/authorization.rst b/docs/tutorials/wiki/authorization.rst
index 1b66ace96..ee86eb543 100644
--- a/docs/tutorials/wiki/authorization.rst
+++ b/docs/tutorials/wiki/authorization.rst
@@ -136,7 +136,6 @@ Add a ``login.pt`` template to your templates directory.  It's
 referred to within the login view we just added to ``login.py``.
 
 .. literalinclude:: src/authorization/tutorial/templates/login.pt
-   :linenos:
    :language: xml
 
 Change ``view.pt`` and ``edit.pt``
@@ -146,11 +145,10 @@ We'll also need to change our ``edit.pt`` and ``view.pt`` templates to
 display a "Logout" link if someone is logged in.  This link will
 invoke the logout view.
 
-To do so we'll add this to both templates within the ``<div
-class="main_content">`` div:
+To do so we'll add this to both templates within the ``<div id="right"
+class="app-welcome align-right">`` div:
 
 .. code-block:: xml
-   :linenos:
 
    <span tal:condition="logged_in">
       <a href="${request.application_url}/logout">Logout</a>
diff --git a/docs/tutorials/wiki/basiclayout.rst b/docs/tutorials/wiki/basiclayout.rst
index f6e1f800a..4017d7af8 100644
--- a/docs/tutorials/wiki/basiclayout.rst
+++ b/docs/tutorials/wiki/basiclayout.rst
@@ -169,7 +169,6 @@ The ``development.ini`` (in the tutorial :term:`project` directory, as
 opposed to the tutorial :term:`package` directory) looks like this:
 
 .. literalinclude:: src/views/development.ini
-   :linenos:
    :language: ini
 
 
diff --git a/docs/tutorials/wiki/definingmodels.rst b/docs/tutorials/wiki/definingmodels.rst
index f201f6dc7..5e4b8fb22 100644
--- a/docs/tutorials/wiki/definingmodels.rst
+++ b/docs/tutorials/wiki/definingmodels.rst
@@ -163,7 +163,7 @@ On Windows:
 
 .. code-block::  text
 
-   c:\bigfntut\tutorial> ..\Scripts\python setup.py test -q
+   c:\pyramidtut\tutorial> ..\Scripts\python setup.py test -q
 
 The expected output is something like this:
 
diff --git a/docs/tutorials/wiki/definingviews.rst b/docs/tutorials/wiki/definingviews.rst
index 5b0e5dca1..90768f320 100644
--- a/docs/tutorials/wiki/definingviews.rst
+++ b/docs/tutorials/wiki/definingviews.rst
@@ -230,7 +230,6 @@ Once we're done with the ``view.pt`` template, it will look a lot like
 the below:
 
 .. literalinclude:: src/views/tutorial/templates/view.pt
-   :linenos:
    :language: xml
 
 .. note:: The names available for our use in a template are always those that
@@ -257,23 +256,24 @@ Once we're done with the ``edit.pt`` template, it will look a lot like the
 below:
 
 .. literalinclude:: src/views/tutorial/templates/edit.pt
-   :linenos:
    :language: xml
 
 Static Assets
 -------------
 
-Our templates name a single static asset named ``style.css``.  We need to
-create this and place it in a file named ``style.css`` within our package's
-``static`` directory.  This file is a little too long to replicate within the
-body of this guide, however it is available `online
-<http://github.com/Pylons/pyramid/blob/master/docs/tutorials/wiki/src/views/tutorial/static/style.css>`_.
+Our templates name a single static asset named ``pylons.css``.  We don't need
+to create this file within our package's ``static`` directory because it was
+provided at the time we created the project. This file is a little too long to
+replicate within the body of this guide, however it is available `online
+<http://github.com/Pylons/pyramid/blob/master/docs/tutorials/wiki/src/views/tutorial/static/pylons.css>`_.
 
 This CSS file will be accessed via
-e.g. ``http://localhost:6543/static/style.css`` by virtue of the call to
+e.g. ``http://localhost:6543/static/pylons.css`` by virtue of the call to
 ``add_static_view`` directive we've made in the ``__init__`` file.  Any
 number and type of static assets can be placed in this directory (or
-subdirectories) and are just referred to by URL within templates.
+subdirectories) and are just referred to by URL or by using the convenience
+method ``static_url`` e.g. ``request.static_url('{{package}}:static/foo.css')``
+within templates.
 
 Testing the Views
 =================
@@ -308,7 +308,7 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bigfntut\tutorial> ..\Scripts\python setup.py test -q
+   c:\pyramidtut\tutorial> ..\Scripts\python setup.py test -q
 
 The expected result looks something like:
 
diff --git a/docs/tutorials/wiki/distributing.rst b/docs/tutorials/wiki/distributing.rst
index ad717e72a..855d54eab 100644
--- a/docs/tutorials/wiki/distributing.rst
+++ b/docs/tutorials/wiki/distributing.rst
@@ -18,7 +18,7 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bigfntut> ..\Scripts\python setup.py sdist
+   c:\pyramidtut> ..\Scripts\python setup.py sdist
 
 .. warning:: If your project files are not checked in to a version
    control repository (such as Subversion), the dist tarball will
diff --git a/docs/tutorials/wiki/installation.rst b/docs/tutorials/wiki/installation.rst
index 82265170d..95bc7a03e 100644
--- a/docs/tutorials/wiki/installation.rst
+++ b/docs/tutorials/wiki/installation.rst
@@ -26,28 +26,28 @@ Preparation, UNIX
    <http://peak.telecommunity.com/dist/ez_setup.py>`_ and run it using
    the ``python`` interpreter of your Python 2.6 installation:
 
-   .. code-block:: bash
+   .. code-block:: text
 
     $ /path/to/my/Python-2.6/bin/python ez_setup.py
 
 #. Use that Python's `bin/easy_install` to install `virtualenv`:
 
-   .. code-block:: bash
+   .. code-block:: text
 
     $ /path/to/my/Python-2.6/bin/easy_install virtualenv
 
 #. Use that Python's virtualenv to make a workspace:
 
-   .. code-block:: bash
+   .. code-block:: text
 
      $ path/to/my/Python-2.6/bin/virtualenv --no-site-packages \
-               bigfntut
+               pyramidtut
 
-#. Switch to the ``bigfntut`` directory:
+#. Switch to the ``pyramidtut`` directory:
 
-   .. code-block:: bash
+   .. code-block:: text
 
-     $ cd bigfntut
+     $ cd pyramidtut
 
 #. (Optional) Consider using ``source bin/activate`` to make your
    shell environment wired to use the virtualenv.
@@ -55,14 +55,14 @@ Preparation, UNIX
 #. Use ``easy_install`` to get :app:`Pyramid` and its direct
    dependencies installed:
 
-   .. code-block:: bash
+   .. code-block:: text
 
      $ bin/easy_install pyramid
 
 #. Use ``easy_install`` to install ``docutils``, ``repoze.tm``,
    ``repoze.zodbconn``, ``nose`` and ``coverage``:
 
-   .. code-block:: bash
+   .. code-block:: text
 
      $ bin/easy_install docutils repoze.tm repoze.zodbconn \
                nose coverage
@@ -79,27 +79,27 @@ Preparation, Windows
    the ``python`` interpreter of your Python 2.6 installation using a
    command prompt:
 
-   .. code-block:: bat
+   .. code-block:: text
 
     c:\> c:\Python26\python ez_setup.py
 
 #. Use that Python's `bin/easy_install` to install `virtualenv`:
 
-   .. code-block:: bat
+   .. code-block:: text
 
     c:\> c:\Python26\Scripts\easy_install virtualenv
 
 #. Use that Python's virtualenv to make a workspace:
 
-   .. code-block:: bat
+   .. code-block:: text
 
-     c:\> c:\Python26\Scripts\virtualenv --no-site-packages bigfntut
+     c:\> c:\Python26\Scripts\virtualenv --no-site-packages pyramidtut
 
-#. Switch to the ``bigfntut`` directory:
+#. Switch to the ``pyramidtut`` directory:
 
-   .. code-block:: bat
+   .. code-block:: text
 
-     c:\> cd bigfntut
+     c:\> cd pyramidtut
 
 #. (Optional) Consider using ``bin\activate.bat`` to make your shell
    environment wired to use the virtualenv.
@@ -107,16 +107,16 @@ Preparation, Windows
 #. Use ``easy_install`` to get :app:`Pyramid` and its direct
    dependencies installed:
 
-   .. code-block:: bat
+   .. code-block:: text
 
-     c:\bigfntut> Scripts\easy_install pyramid
+     c:\pyramidtut> Scripts\easy_install pyramid
 
 #. Use ``easy_install`` to install ``docutils``, ``repoze.tm``,
    ``repoze.zodbconn``, ``nose`` and ``coverage``:
 
-   .. code-block:: bat
+   .. code-block:: text
 
-     c:\bigfntut> Scripts\easy_install docutils repoze.tm \
+     c:\pyramidtut> Scripts\easy_install docutils repoze.tm \
            repoze.zodbconn nose coverage
 
 .. _making_a_project:
@@ -129,19 +129,19 @@ variety of templates to generate sample projects.  For this tutorial,
 we will use the :term:`ZODB` -oriented template named ``pyramid_zodb``.
 
 The below instructions assume your current working directory is the
-"virtualenv" named "bigfntut".
+"virtualenv" named "pyramidtut".
 
 On UNIX:
 
-.. code-block:: bash
+.. code-block:: text
 
   $ bin/paster create -t pyramid_zodb tutorial
 
 On Windows:
 
-.. code-block:: bat
+.. code-block:: text
 
-   c:\bigfntut> Scripts\paster create -t pyramid_zodb tutorial
+   c:\pyramidtut> Scripts\paster create -t pyramid_zodb tutorial
 
 .. note:: If you are using Windows, the ``pyramid_zodb`` Paster template
    doesn't currently deal gracefully with installation into a location
@@ -160,17 +160,17 @@ directory you created in :ref:`making_a_project`, and run the
 
 On UNIX:
 
-.. code-block:: bash
+.. code-block:: text
 
   $ cd tutorial
   $ ../bin/python setup.py develop
 
 On Windows:
 
-.. code-block:: bat
+.. code-block:: text
 
-  C:\bigfntut> cd tutorial
-  C:\bigfntut\tutorial> ..\Scripts\python setup.py develop
+  C:\pyramidtut> cd tutorial
+  C:\pyramidtut\tutorial> ..\Scripts\python setup.py develop
 
 .. _running_tests:
 
@@ -182,15 +182,15 @@ the tests for the project.
 
 On UNIX:
 
-.. code-block:: bash
+.. code-block:: text
 
   $ ../bin/python setup.py test -q
 
 On Windows:
 
-.. code-block:: bat
+.. code-block:: text
 
-  c:\bigfntut\tutorial> ..\Scripts\python setup.py test -q
+  c:\pyramidtut\tutorial> ..\Scripts\python setup.py test -q
 
 Starting the Application
 ========================
@@ -199,15 +199,15 @@ Start the application.
 
 On UNIX:
 
-.. code-block:: bash
+.. code-block:: text
 
   $ ../bin/paster serve development.ini --reload
 
 On Windows:
 
-.. code-block:: bat
+.. code-block:: text
 
-  c:\bifgfntut\tutorial> ..\Scripts\paster serve development.ini --reload
+  c:\pyramidtut\tutorial> ..\Scripts\paster serve development.ini --reload
 
 Exposing Test Coverage Information
 ==================================
@@ -220,15 +220,15 @@ tests.
 
 On UNIX:
 
-.. code-block:: bash
+.. code-block:: text
 
   $ ../bin/nosetests --cover-package=tutorial --cover-erase --with-coverage
 
 On Windows:
 
-.. code-block:: bat
+.. code-block:: text
 
-  c:\bigfntut\tutorial> ..\Scripts\nosetests --cover-package=tutorial \
+  c:\pyramidtut\tutorial> ..\Scripts\nosetests --cover-package=tutorial \
        --cover-erase --with-coverage
 
 Looks like the code in the ``pyramid_zodb`` template for ZODB projects is
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/authorization/tutorial/static/footerbg.png
new file mode 100644
index 000000000..1fbc873da
--- /dev/null
+++ b/docs/tutorials/wiki/src/authorization/tutorial/static/footerbg.png
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/authorization/tutorial/static/headerbg.png
new file mode 100644
index 000000000..0596f2020
--- /dev/null
+++ b/docs/tutorials/wiki/src/authorization/tutorial/static/headerbg.png
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/ie6.css b/docs/tutorials/wiki/src/authorization/tutorial/static/ie6.css
new file mode 100644
index 000000000..b7c8493d8
--- /dev/null
+++ b/docs/tutorials/wiki/src/authorization/tutorial/static/ie6.css
@@ -0,0 +1,8 @@
+* html img,
+* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
+this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
+this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
+);}
+#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/logo.png b/docs/tutorials/wiki/src/authorization/tutorial/static/logo.png
deleted file mode 100644
index 88f5d9865..000000000
--- a/docs/tutorials/wiki/src/authorization/tutorial/static/logo.png
+++ /dev/null
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/authorization/tutorial/static/middlebg.png
new file mode 100644
index 000000000..2369cfb7d
--- /dev/null
+++ b/docs/tutorials/wiki/src/authorization/tutorial/static/middlebg.png
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/pylons.css b/docs/tutorials/wiki/src/authorization/tutorial/static/pylons.css
index c153be07f..4ebc5a081 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/static/pylons.css
+++ b/docs/tutorials/wiki/src/authorization/tutorial/static/pylons.css
@@ -4,34 +4,23 @@ body{line-height:1;}
 ol,ul{list-style:none;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
-/* remember to define focus styles! */
 :focus{outline:0;}
-/* remember to highlight inserts somehow! */
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
-/* tables still need 'cellspacing="0"' in the markup */
 table{border-collapse:collapse;border-spacing:0;}
-/* restyling */
 sub{vertical-align:sub;font-size:smaller;line-height:normal;}
 sup{vertical-align:super;font-size:smaller;line-height:normal;}
-/* lists */
 ul,menu,dir{display:block;list-style-type:disc;margin:1em 0;padding-left:40px;}
 ol{display:block;list-style-type:decimal-leading-zero;margin:1em 0;padding-left:40px;}
 li{display:list-item;}
-/* nested lists have no top/bottom margins */
 ul ul,ul ol,ul dir,ul menu,ul dl,ol ul,ol ol,ol dir,ol menu,ol dl,dir ul,dir ol,dir dir,dir menu,dir dl,menu ul,menu ol,menu dir,menu menu,menu dl,dl ul,dl ol,dl dir,dl menu,dl dl{margin-top:0;margin-bottom:0;}
-/* 2 deep unordered lists use a circle */
 ol ul,ul ul,menu ul,dir ul,ol menu,ul menu,menu menu,dir menu,ol dir,ul dir,menu dir,dir dir{list-style-type:circle;}
-/* 3 deep (or more) unordered lists use a square */
 ol ol ul,ol ul ul,ol menu ul,ol dir ul,ol ol menu,ol ul menu,ol menu menu,ol dir menu,ol ol dir,ol ul dir,ol menu dir,ol dir dir,ul ol ul,ul ul ul,ul menu ul,ul dir ul,ul ol menu,ul ul menu,ul menu menu,ul dir menu,ul ol dir,ul ul dir,ul menu dir,ul dir dir,menu ol ul,menu ul ul,menu menu ul,menu dir ul,menu ol menu,menu ul menu,menu menu menu,menu dir menu,menu ol dir,menu ul dir,menu menu dir,menu dir dir,dir ol ul,dir ul ul,dir menu ul,dir dir ul,dir ol menu,dir ul menu,dir menu menu,dir dir menu,dir ol dir,dir ul dir,dir menu dir,dir dir dir{list-style-type:square;}
 .hidden{display:none;}
 p{line-height:1.5em;}
-h1{font-size:1.75em;/* 28px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h2{font-size:1.5em;/* 24px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h3{font-size:1.25em;/* 20px */
-line-height:1.7em;font-family:helvetica,verdana;}
+h1{font-size:1.75em;line-height:1.7em;font-family:helvetica,verdana;}
+h2{font-size:1.5em;line-height:1.7em;font-family:helvetica,verdana;}
+h3{font-size:1.25em;line-height:1.7em;font-family:helvetica,verdana;}
 h4{font-size:1em;line-height:1.7em;font-family:helvetica,verdana;}
 html,body{width:100%;height:100%;}
 body{margin:0;padding:0;background-color:#ffffff;position:relative;font:16px/24px "Nobile","Lucida Grande",Lucida,Verdana,sans-serif;}
@@ -42,23 +31,25 @@ body h2,
 body h3,
 body h4,
 body h5,
-body h6{font-family:"Nobile","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#144fb2;font-style:normal;}
-#wrap {min-height: 100%;}
-#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;}
-#header{background-color:#e88f00;top:0;font-size:14px;}
-#footer{background-color:#000000;bottom:0;position: relative;margin-top:-40px;clear:both;}
-.header,.footer{width:700px;margin-right:auto;margin-left:auto;}
+body h6{font-family:"Neuton","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#373839;font-style:normal;}
+#wrap{min-height:100%;}
+#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;vertical-align:middle;}
+#header{background:#000000;top:0;font-size:14px;}
+#footer{bottom:0;background:#000000 url(footerbg.png) repeat-x 0 top;position:relative;margin-top:-40px;clear:both;}
+.header,.footer{width:750px;margin-right:auto;margin-left:auto;}
 .wrapper{width:100%}
 #top,#bottom{width:100%;}
-#top{color:#888;background-color:#eee;height:300px;border-bottom:2px solid #ddd;}
-#bottom{color:#222;background-color:#ffffff;overflow:hidden;padding-bottom:80px;}
-.top,.bottom{width:700px;margin-right:auto;margin-left:auto;}
-.top{padding-top:100px;}
+#top{color:#000000;height:230px;
+background:#ffffff url(headerbg.png) repeat-x 0 top;position:relative;}
+#bottom{color:#222;background-color:#ffffff;}
+.top,.middle,.bottom{width:750px;margin-right:auto;margin-left:auto;}
+.top{padding-top:40px;}
+#middle{width:100%;height:100px;background:url(middlebg.png) repeat-x;border-top:2px solid #ffffff;border-bottom:2px solid #b2b2b2;}
 .app-welcome{margin-top:25px;}
 .app-name{color:#000000;font-weight:bold;}
 .bottom{padding-top:50px;}
-#left{width:325px;float:left;padding-right:25px;}
-#right{width:325px;float:right;padding-left:25px;}
+#left{width:350px;float:left;padding-right:25px;}
+#right{width:350px;float:right;padding-left:25px;}
 .align-left{text-align:left;}
 .align-right{text-align:right;}
 .align-center{text-align:center;}
@@ -67,7 +58,7 @@ ul.links li{list-style-type:none;font-size:14px;}
 form{border-style:none;}
 fieldset{border-style:none;}
 input{color:#222;border:1px solid #ccc;font-family:sans-serif;font-size:12px;line-height:16px;}
-input[type=text]{}
+input[type=text],input[type=password]{width:205px;}
 input[type=submit]{background-color:#ddd;font-weight:bold;}
 /*Opera Fix*/
-body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}
+body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid.png
new file mode 100644
index 000000000..347e05549
--- /dev/null
+++ b/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid.png
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/style.css b/docs/tutorials/wiki/src/authorization/tutorial/static/style.css
deleted file mode 100644
index cad87e0d4..000000000
--- a/docs/tutorials/wiki/src/authorization/tutorial/static/style.css
+++ /dev/null
@@ -1,109 +0,0 @@
-html, body {
-  color: black;
-  background-color: #ddd;
-  font: x-small "Lucida Grande", "Lucida Sans Unicode", geneva, sans-serif;
-  margin: 0;
-  padding: 0;
-}
-
-td, th {padding:3px;border:none;}
-tr th {text-align:left;background-color:#f0f0f0;color:#333;}
-tr.odd td {background-color:#edf3fe;}
-tr.even td {background-color:#fff;}
-
-#header {
-  height: 80px;
-  width: 777px;
-  background: blue URL('../images/header_inner.png') no-repeat;
-  border-left: 1px solid #aaa;
-  border-right: 1px solid #aaa;
-  margin: 0 auto 0 auto;
-}
-
-a.link, a, a.active {
-  color: #369;
-}
-
-
-#main_content {
-  color: black;
-  font-size: 127%;
-  background-color: white;
-  width: 757px;
-  margin: 0 auto 0 auto;
-  border-left: 1px solid #aaa;
-  border-right: 1px solid #aaa;
-  padding: 10px;
-}
-
-#sidebar {
-  border: 1px solid #aaa;
-  background-color: #eee;
-  margin: 0.5em;
-  padding: 1em;
-  float: right;
-  width: 200px;
-  font-size: 88%;
-}
-
-#sidebar h2 {
-  margin-top: 0;
-}
-
-#sidebar ul {
-  margin-left: 1.5em;
-  padding-left: 0;
-}
-
-h1,h2,h3,h4,h5,h6,#getting_started_steps {
-  font-family: "Century Schoolbook L", Georgia, serif;
-  font-weight: bold;
-}
-
-h2 {
-  font-size: 150%;
-}
-
-#footer {
-  border: 1px solid #aaa;
-  border-top: 0px none;
-  color: #999;
-  background-color: white;
-  padding: 10px;
-  font-size: 80%;
-  text-align: center;
-  width: 757px;
-  margin: 0 auto 1em auto;
-}
-
-.code {
-  font-family: monospace;
-}
-
-span.code {
-  font-weight: bold;
-  background: #eee;
-}
-
-#status_block {
-  margin: 0 auto 0.5em auto;
-  padding: 15px 10px 15px 55px;
-  background: #cec URL('../images/ok.png') left center no-repeat;
-  border: 1px solid #9c9;
-  width: 450px;
-  font-size: 120%;
-  font-weight: bolder;
-}
-
-.notice {
-  margin: 0.5em auto 0.5em auto;
-  padding: 15px 10px 15px 55px;
-  width: 450px;
-  background: #eef URL('../images/info.png') left center no-repeat;
-  border: 1px solid #cce;
-}
-
-.fielderror {
-    color: red;
-    font-weight: bold;
-}
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/authorization/tutorial/static/transparent.gif
new file mode 100644
index 000000000..0341802e5
--- /dev/null
+++ b/docs/tutorials/wiki/src/authorization/tutorial/static/transparent.gif
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/templates/edit.pt b/docs/tutorials/wiki/src/authorization/tutorial/templates/edit.pt
index 5f8b22207..1c764f924 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki/src/authorization/tutorial/templates/edit.pt
@@ -1,34 +1,51 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-    <title>Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki) 
-           Editing: ${page.__name__}</title>
-        <link rel="stylesheet" type="text/css"
-          href="${request.application_url}/static/style.css" />
+	<title>${page.__name__} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<div class="main_content">
-  <div style="float:right; width: 10em;"> Viewing
-    <span tal:replace="page.__name__">Page Name Goes Here</span> <br/>
-    You can return to the <a href="${request.application_url}"
-          >FrontPage</a>.
-   <span tal:condition="logged_in"><a 
-         href="${request.application_url}/logout">Logout</a></span>
-  </div>
-
-  <div>
-    <form action="${save_url}" method="post">
-      <textarea name="body" tal:content="page.data" rows="10" cols="60"/>
-      <input type="submit" name="form.submitted" value="Save"/>
-    </form>
-  </div>
-</div>  
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					Editing <b><span tal:replace="page.__name__">Page Name Goes Here</span></b><br/>
+					You can return to the <a href="${request.application_url}">FrontPage</a>.<br/>
+				</div>
+				<div id="right" class="app-welcome align-right">
+					<span tal:condition="logged_in">
+  						<a href="${request.application_url}/logout">Logout</a>
+					</span>
+				</div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<form action="${save_url}" method="post">
+      				<textarea name="body" tal:content="page.data" rows="10" cols="60"/><br/>
+      				<input type="submit" name="form.submitted" value="Save"/>
+    			</form>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/templates/login.pt b/docs/tutorials/wiki/src/authorization/tutorial/templates/login.pt
index c56983d64..4473b701a 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/templates/login.pt
+++ b/docs/tutorials/wiki/src/authorization/tutorial/templates/login.pt
@@ -1,32 +1,49 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-    xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-  <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-  <title>Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
-  <link rel="stylesheet" type="text/css"
-        href="${request.application_url}/static/style.css" />
+	<title>Login - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<h1>Log In</h1>
-
-<div tal:replace="message"/>
-
-<div class="main_content">
-  <form action="${url}" method="post">
-    <input type="hidden" name="came_from" value="${came_from}"/>
-    <input type="text" name="login" value="${login}"/>
-    <br/>
-    <input type="password" name="password" value="${password}"/>
-    <br/>
-    <input type="submit" name="form.submitted" value="Log In"/>
-  </form>
-</div>  
-
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					<b>Login</b><br/>
+					<span tal:replace="message"/>
+				</div>
+				<div id="right" class="app-welcome align-right"></div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<form action="${url}" method="post">
+    				<input type="hidden" name="came_from" value="${came_from}"/>
+    				<input type="text" name="login" value="${login}"/><br/>
+    				<input type="password" name="password" value="${password}"/><br/>
+    				<input type="submit" name="form.submitted" value="Log In"/>
+  				</form>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/authorization/tutorial/templates/mytemplate.pt
index a5a0dd214..cac9ccaa7 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/src/authorization/tutorial/templates/mytemplate.pt
@@ -5,65 +5,72 @@
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 	<meta name="keywords" content="python web application" />
 	<meta name="description" content="pyramid web application" />
-	<link rel="shortcut icon" href="${request.application_url}/static/favicon.ico" />
-	<link rel="stylesheet" href="${request.application_url}/static/pylons.css" type="text/css" media="screen" charset="utf-8" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
 	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
 <body>
-	<div id="header">
-		<div class="header">The Pyramid Web Application Development Framework</div>
-	</div>
-	<div id="top">
-		<div class="top align-center">
-			<img src="${request.application_url}/static/logo.png" width="300" height="80"/>
-			<p class="app-welcome">
-				Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
-				the Pyramid web application development framework.
-			</p>
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
+			</div>
 		</div>
-	</div>
-	<div id="bottom">
-		<div class="bottom">
-			<div id="left" class="align-right">
-				<h3>Search Pyramid documentation</h3>
-				<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
-	      			<input type="text" id="q" name="q" value="" />
-	      			<input type="submit" id="x" value="Search" />
-	  			</form>
+		<div id="middle">
+			<div class="middle align-center">
+				<p class="app-welcome">
+					Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
+					the Pyramid web application development framework.
+				</p>
 			</div>
-			<div id="right" class="align-left">
-				<h3>Pyramid links</h3>
-				<ul class="links">
-					<li>
-						<a href="http://pylonshq.com">Pylons Website</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#api-documentation">API Documentation</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#tutorials">Tutorials</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#change-history">Change History</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#sample-applications">Sample Applications</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#support-and-development">Support and Development</a>
-					</li>
-					<li>
-						<a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
-					</li>
-	  			</ul>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<div id="left" class="align-right">
+					<h2>Search documentation</h2>
+					<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
+		      			<input type="text" id="q" name="q" value="" />
+		      			<input type="submit" id="x" value="Go" />
+		  			</form>
+				</div>
+				<div id="right" class="align-left">
+					<h2>Pyramid links</h2>
+					<ul class="links">
+						<li>
+							<a href="http://pylonshq.com">Pylons Website</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#api-documentation">API Documentation</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#tutorials">Tutorials</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#change-history">Change History</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#sample-applications">Sample Applications</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#support-and-development">Support and Development</a>
+						</li>
+						<li>
+							<a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
+						</li>
+		  			</ul>
+				</div>
 			</div>
 		</div>
 	</div>
 	<div id="footer">
-		<div class="footer">© Copyright 2008-2010, Agendaless Consulting.</div>
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
 	</div>
 </body>
 </html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/templates/view.pt b/docs/tutorials/wiki/src/authorization/tutorial/templates/view.pt
index f957176f1..003349ea5 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki/src/authorization/tutorial/templates/view.pt
@@ -1,31 +1,55 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-    <title>${page.__name__} - Pyramid tutorial wiki 
-           (based on TurboGears 20-Minute Wiki)
-    </title>
-        <link rel="stylesheet" type="text/css"
-          href="${request.application_url}/static/style.css" />
+	<title>${page.__name__} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<div class="main_content">
-<div style="float:right; width: 10em;"> Viewing
-<span tal:replace="page.__name__">Page Name Goes Here</span> <br/>
-You can return to the <a href="${request.application_url}">FrontPage</a>.
-<span tal:condition="logged_in">
-  <a href="${request.application_url}/logout">Logout</a>
-</span>
-</div>
-
-<div tal:replace="structure content">Page text goes here.</div>
-<p><a tal:attributes="href edit_url" href="">Edit this page</a></p>
-</div>
-
-</body></html>
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					Viewing <b><span tal:replace="page.__name__">Page Name Goes Here</span></b><br/>
+					You can return to the <a href="${request.application_url}">FrontPage</a>.<br/>
+				</div>
+				<div id="right" class="app-welcome align-right">
+					<span tal:condition="logged_in">
+  						<a href="${request.application_url}/logout">Logout</a>
+					</span>
+				</div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<div tal:replace="structure content">
+					Page text goes here.
+				</div>
+				<p>
+					<a tal:attributes="href edit_url" href="">
+						Edit this page
+					</a>
+				</p>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
+</body>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/footerbg.png
new file mode 100644
index 000000000..1fbc873da
--- /dev/null
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/static/footerbg.png
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/headerbg.png
new file mode 100644
index 000000000..0596f2020
--- /dev/null
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/static/headerbg.png
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/ie6.css b/docs/tutorials/wiki/src/basiclayout/tutorial/static/ie6.css
new file mode 100644
index 000000000..b7c8493d8
--- /dev/null
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/static/ie6.css
@@ -0,0 +1,8 @@
+* html img,
+* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
+this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
+this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
+);}
+#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/logo.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/logo.png
deleted file mode 100644
index 88f5d9865..000000000
--- a/docs/tutorials/wiki/src/basiclayout/tutorial/static/logo.png
+++ /dev/null
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/middlebg.png
new file mode 100644
index 000000000..2369cfb7d
--- /dev/null
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/static/middlebg.png
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/pylons.css b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pylons.css
index c153be07f..4ebc5a081 100644
--- a/docs/tutorials/wiki/src/basiclayout/tutorial/static/pylons.css
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pylons.css
@@ -4,34 +4,23 @@ body{line-height:1;}
 ol,ul{list-style:none;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
-/* remember to define focus styles! */
 :focus{outline:0;}
-/* remember to highlight inserts somehow! */
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
-/* tables still need 'cellspacing="0"' in the markup */
 table{border-collapse:collapse;border-spacing:0;}
-/* restyling */
 sub{vertical-align:sub;font-size:smaller;line-height:normal;}
 sup{vertical-align:super;font-size:smaller;line-height:normal;}
-/* lists */
 ul,menu,dir{display:block;list-style-type:disc;margin:1em 0;padding-left:40px;}
 ol{display:block;list-style-type:decimal-leading-zero;margin:1em 0;padding-left:40px;}
 li{display:list-item;}
-/* nested lists have no top/bottom margins */
 ul ul,ul ol,ul dir,ul menu,ul dl,ol ul,ol ol,ol dir,ol menu,ol dl,dir ul,dir ol,dir dir,dir menu,dir dl,menu ul,menu ol,menu dir,menu menu,menu dl,dl ul,dl ol,dl dir,dl menu,dl dl{margin-top:0;margin-bottom:0;}
-/* 2 deep unordered lists use a circle */
 ol ul,ul ul,menu ul,dir ul,ol menu,ul menu,menu menu,dir menu,ol dir,ul dir,menu dir,dir dir{list-style-type:circle;}
-/* 3 deep (or more) unordered lists use a square */
 ol ol ul,ol ul ul,ol menu ul,ol dir ul,ol ol menu,ol ul menu,ol menu menu,ol dir menu,ol ol dir,ol ul dir,ol menu dir,ol dir dir,ul ol ul,ul ul ul,ul menu ul,ul dir ul,ul ol menu,ul ul menu,ul menu menu,ul dir menu,ul ol dir,ul ul dir,ul menu dir,ul dir dir,menu ol ul,menu ul ul,menu menu ul,menu dir ul,menu ol menu,menu ul menu,menu menu menu,menu dir menu,menu ol dir,menu ul dir,menu menu dir,menu dir dir,dir ol ul,dir ul ul,dir menu ul,dir dir ul,dir ol menu,dir ul menu,dir menu menu,dir dir menu,dir ol dir,dir ul dir,dir menu dir,dir dir dir{list-style-type:square;}
 .hidden{display:none;}
 p{line-height:1.5em;}
-h1{font-size:1.75em;/* 28px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h2{font-size:1.5em;/* 24px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h3{font-size:1.25em;/* 20px */
-line-height:1.7em;font-family:helvetica,verdana;}
+h1{font-size:1.75em;line-height:1.7em;font-family:helvetica,verdana;}
+h2{font-size:1.5em;line-height:1.7em;font-family:helvetica,verdana;}
+h3{font-size:1.25em;line-height:1.7em;font-family:helvetica,verdana;}
 h4{font-size:1em;line-height:1.7em;font-family:helvetica,verdana;}
 html,body{width:100%;height:100%;}
 body{margin:0;padding:0;background-color:#ffffff;position:relative;font:16px/24px "Nobile","Lucida Grande",Lucida,Verdana,sans-serif;}
@@ -42,23 +31,25 @@ body h2,
 body h3,
 body h4,
 body h5,
-body h6{font-family:"Nobile","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#144fb2;font-style:normal;}
-#wrap {min-height: 100%;}
-#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;}
-#header{background-color:#e88f00;top:0;font-size:14px;}
-#footer{background-color:#000000;bottom:0;position: relative;margin-top:-40px;clear:both;}
-.header,.footer{width:700px;margin-right:auto;margin-left:auto;}
+body h6{font-family:"Neuton","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#373839;font-style:normal;}
+#wrap{min-height:100%;}
+#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;vertical-align:middle;}
+#header{background:#000000;top:0;font-size:14px;}
+#footer{bottom:0;background:#000000 url(footerbg.png) repeat-x 0 top;position:relative;margin-top:-40px;clear:both;}
+.header,.footer{width:750px;margin-right:auto;margin-left:auto;}
 .wrapper{width:100%}
 #top,#bottom{width:100%;}
-#top{color:#888;background-color:#eee;height:300px;border-bottom:2px solid #ddd;}
-#bottom{color:#222;background-color:#ffffff;overflow:hidden;padding-bottom:80px;}
-.top,.bottom{width:700px;margin-right:auto;margin-left:auto;}
-.top{padding-top:100px;}
+#top{color:#000000;height:230px;
+background:#ffffff url(headerbg.png) repeat-x 0 top;position:relative;}
+#bottom{color:#222;background-color:#ffffff;}
+.top,.middle,.bottom{width:750px;margin-right:auto;margin-left:auto;}
+.top{padding-top:40px;}
+#middle{width:100%;height:100px;background:url(middlebg.png) repeat-x;border-top:2px solid #ffffff;border-bottom:2px solid #b2b2b2;}
 .app-welcome{margin-top:25px;}
 .app-name{color:#000000;font-weight:bold;}
 .bottom{padding-top:50px;}
-#left{width:325px;float:left;padding-right:25px;}
-#right{width:325px;float:right;padding-left:25px;}
+#left{width:350px;float:left;padding-right:25px;}
+#right{width:350px;float:right;padding-left:25px;}
 .align-left{text-align:left;}
 .align-right{text-align:right;}
 .align-center{text-align:center;}
@@ -67,7 +58,7 @@ ul.links li{list-style-type:none;font-size:14px;}
 form{border-style:none;}
 fieldset{border-style:none;}
 input{color:#222;border:1px solid #ccc;font-family:sans-serif;font-size:12px;line-height:16px;}
-input[type=text]{}
+input[type=text],input[type=password]{width:205px;}
 input[type=submit]{background-color:#ddd;font-weight:bold;}
 /*Opera Fix*/
-body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}
+body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid.png
new file mode 100644
index 000000000..347e05549
--- /dev/null
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid.png
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/basiclayout/tutorial/static/transparent.gif
new file mode 100644
index 000000000..0341802e5
--- /dev/null
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/static/transparent.gif
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt
index 6ad23d44f..cac9ccaa7 100644
--- a/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt
@@ -5,23 +5,23 @@
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 	<meta name="keywords" content="python web application" />
 	<meta name="description" content="pyramid web application" />
-	<link rel="shortcut icon" href="${request.application_url}/static/favicon.ico" />
-	<link rel="stylesheet" href="${request.application_url}/static/pylons.css" type="text/css" media="screen" charset="utf-8" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
 	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
-	<!--[if !IE 7]>
-	<style type="text/css">
-		#wrap {display:table;height:100%}
-	</style>
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
 	<![endif]-->
 </head>
 <body>
 	<div id="wrap">
-		<div id="header">
-			<div class="header">The Pyramid Web Application Development Framework</div>
-		</div>
 		<div id="top">
 			<div class="top align-center">
-				<img src="${request.application_url}/static/logo.png" width="300" height="80"/>
+				<div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-center">
 				<p class="app-welcome">
 					Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
 					the Pyramid web application development framework.
@@ -31,22 +31,19 @@
 		<div id="bottom">
 			<div class="bottom">
 				<div id="left" class="align-right">
-					<h3>Search Pyramid documentation</h3>
+					<h2>Search documentation</h2>
 					<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
 		      			<input type="text" id="q" name="q" value="" />
-		      			<input type="submit" id="x" value="Search" />
+		      			<input type="submit" id="x" value="Go" />
 		  			</form>
 				</div>
 				<div id="right" class="align-left">
-					<h3>Pyramid links</h3>
+					<h2>Pyramid links</h2>
 					<ul class="links">
 						<li>
 							<a href="http://pylonshq.com">Pylons Website</a>
 						</li>
 						<li>
-							<a href="http://docs.pylonshq.com/">The Pylons Project Documentation</a>
-						</li>
-						<li>
 							<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
 						</li>
 						<li>
@@ -73,7 +70,7 @@
 		</div>
 	</div>
 	<div id="footer">
-		<div class="footer">© Copyright 2008-2010, Agendaless Consulting.</div>
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
 	</div>
 </body>
 </html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/models/tutorial/static/footerbg.png
new file mode 100644
index 000000000..1fbc873da
--- /dev/null
+++ b/docs/tutorials/wiki/src/models/tutorial/static/footerbg.png
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/models/tutorial/static/headerbg.png
new file mode 100644
index 000000000..0596f2020
--- /dev/null
+++ b/docs/tutorials/wiki/src/models/tutorial/static/headerbg.png
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/ie6.css b/docs/tutorials/wiki/src/models/tutorial/static/ie6.css
new file mode 100644
index 000000000..b7c8493d8
--- /dev/null
+++ b/docs/tutorials/wiki/src/models/tutorial/static/ie6.css
@@ -0,0 +1,8 @@
+* html img,
+* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
+this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
+this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
+);}
+#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/logo.png b/docs/tutorials/wiki/src/models/tutorial/static/logo.png
deleted file mode 100644
index 88f5d9865..000000000
--- a/docs/tutorials/wiki/src/models/tutorial/static/logo.png
+++ /dev/null
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/models/tutorial/static/middlebg.png
new file mode 100644
index 000000000..2369cfb7d
--- /dev/null
+++ b/docs/tutorials/wiki/src/models/tutorial/static/middlebg.png
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/pylons.css b/docs/tutorials/wiki/src/models/tutorial/static/pylons.css
index c153be07f..4ebc5a081 100644
--- a/docs/tutorials/wiki/src/models/tutorial/static/pylons.css
+++ b/docs/tutorials/wiki/src/models/tutorial/static/pylons.css
@@ -4,34 +4,23 @@ body{line-height:1;}
 ol,ul{list-style:none;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
-/* remember to define focus styles! */
 :focus{outline:0;}
-/* remember to highlight inserts somehow! */
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
-/* tables still need 'cellspacing="0"' in the markup */
 table{border-collapse:collapse;border-spacing:0;}
-/* restyling */
 sub{vertical-align:sub;font-size:smaller;line-height:normal;}
 sup{vertical-align:super;font-size:smaller;line-height:normal;}
-/* lists */
 ul,menu,dir{display:block;list-style-type:disc;margin:1em 0;padding-left:40px;}
 ol{display:block;list-style-type:decimal-leading-zero;margin:1em 0;padding-left:40px;}
 li{display:list-item;}
-/* nested lists have no top/bottom margins */
 ul ul,ul ol,ul dir,ul menu,ul dl,ol ul,ol ol,ol dir,ol menu,ol dl,dir ul,dir ol,dir dir,dir menu,dir dl,menu ul,menu ol,menu dir,menu menu,menu dl,dl ul,dl ol,dl dir,dl menu,dl dl{margin-top:0;margin-bottom:0;}
-/* 2 deep unordered lists use a circle */
 ol ul,ul ul,menu ul,dir ul,ol menu,ul menu,menu menu,dir menu,ol dir,ul dir,menu dir,dir dir{list-style-type:circle;}
-/* 3 deep (or more) unordered lists use a square */
 ol ol ul,ol ul ul,ol menu ul,ol dir ul,ol ol menu,ol ul menu,ol menu menu,ol dir menu,ol ol dir,ol ul dir,ol menu dir,ol dir dir,ul ol ul,ul ul ul,ul menu ul,ul dir ul,ul ol menu,ul ul menu,ul menu menu,ul dir menu,ul ol dir,ul ul dir,ul menu dir,ul dir dir,menu ol ul,menu ul ul,menu menu ul,menu dir ul,menu ol menu,menu ul menu,menu menu menu,menu dir menu,menu ol dir,menu ul dir,menu menu dir,menu dir dir,dir ol ul,dir ul ul,dir menu ul,dir dir ul,dir ol menu,dir ul menu,dir menu menu,dir dir menu,dir ol dir,dir ul dir,dir menu dir,dir dir dir{list-style-type:square;}
 .hidden{display:none;}
 p{line-height:1.5em;}
-h1{font-size:1.75em;/* 28px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h2{font-size:1.5em;/* 24px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h3{font-size:1.25em;/* 20px */
-line-height:1.7em;font-family:helvetica,verdana;}
+h1{font-size:1.75em;line-height:1.7em;font-family:helvetica,verdana;}
+h2{font-size:1.5em;line-height:1.7em;font-family:helvetica,verdana;}
+h3{font-size:1.25em;line-height:1.7em;font-family:helvetica,verdana;}
 h4{font-size:1em;line-height:1.7em;font-family:helvetica,verdana;}
 html,body{width:100%;height:100%;}
 body{margin:0;padding:0;background-color:#ffffff;position:relative;font:16px/24px "Nobile","Lucida Grande",Lucida,Verdana,sans-serif;}
@@ -42,23 +31,25 @@ body h2,
 body h3,
 body h4,
 body h5,
-body h6{font-family:"Nobile","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#144fb2;font-style:normal;}
-#wrap {min-height: 100%;}
-#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;}
-#header{background-color:#e88f00;top:0;font-size:14px;}
-#footer{background-color:#000000;bottom:0;position: relative;margin-top:-40px;clear:both;}
-.header,.footer{width:700px;margin-right:auto;margin-left:auto;}
+body h6{font-family:"Neuton","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#373839;font-style:normal;}
+#wrap{min-height:100%;}
+#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;vertical-align:middle;}
+#header{background:#000000;top:0;font-size:14px;}
+#footer{bottom:0;background:#000000 url(footerbg.png) repeat-x 0 top;position:relative;margin-top:-40px;clear:both;}
+.header,.footer{width:750px;margin-right:auto;margin-left:auto;}
 .wrapper{width:100%}
 #top,#bottom{width:100%;}
-#top{color:#888;background-color:#eee;height:300px;border-bottom:2px solid #ddd;}
-#bottom{color:#222;background-color:#ffffff;overflow:hidden;padding-bottom:80px;}
-.top,.bottom{width:700px;margin-right:auto;margin-left:auto;}
-.top{padding-top:100px;}
+#top{color:#000000;height:230px;
+background:#ffffff url(headerbg.png) repeat-x 0 top;position:relative;}
+#bottom{color:#222;background-color:#ffffff;}
+.top,.middle,.bottom{width:750px;margin-right:auto;margin-left:auto;}
+.top{padding-top:40px;}
+#middle{width:100%;height:100px;background:url(middlebg.png) repeat-x;border-top:2px solid #ffffff;border-bottom:2px solid #b2b2b2;}
 .app-welcome{margin-top:25px;}
 .app-name{color:#000000;font-weight:bold;}
 .bottom{padding-top:50px;}
-#left{width:325px;float:left;padding-right:25px;}
-#right{width:325px;float:right;padding-left:25px;}
+#left{width:350px;float:left;padding-right:25px;}
+#right{width:350px;float:right;padding-left:25px;}
 .align-left{text-align:left;}
 .align-right{text-align:right;}
 .align-center{text-align:center;}
@@ -67,7 +58,7 @@ ul.links li{list-style-type:none;font-size:14px;}
 form{border-style:none;}
 fieldset{border-style:none;}
 input{color:#222;border:1px solid #ccc;font-family:sans-serif;font-size:12px;line-height:16px;}
-input[type=text]{}
+input[type=text],input[type=password]{width:205px;}
 input[type=submit]{background-color:#ddd;font-weight:bold;}
 /*Opera Fix*/
-body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}
+body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/models/tutorial/static/pyramid.png
new file mode 100644
index 000000000..347e05549
--- /dev/null
+++ b/docs/tutorials/wiki/src/models/tutorial/static/pyramid.png
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/models/tutorial/static/transparent.gif
new file mode 100644
index 000000000..0341802e5
--- /dev/null
+++ b/docs/tutorials/wiki/src/models/tutorial/static/transparent.gif
diff --git a/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt
index a5a0dd214..cac9ccaa7 100644
--- a/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt
@@ -5,65 +5,72 @@
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 	<meta name="keywords" content="python web application" />
 	<meta name="description" content="pyramid web application" />
-	<link rel="shortcut icon" href="${request.application_url}/static/favicon.ico" />
-	<link rel="stylesheet" href="${request.application_url}/static/pylons.css" type="text/css" media="screen" charset="utf-8" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
 	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
 <body>
-	<div id="header">
-		<div class="header">The Pyramid Web Application Development Framework</div>
-	</div>
-	<div id="top">
-		<div class="top align-center">
-			<img src="${request.application_url}/static/logo.png" width="300" height="80"/>
-			<p class="app-welcome">
-				Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
-				the Pyramid web application development framework.
-			</p>
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
+			</div>
 		</div>
-	</div>
-	<div id="bottom">
-		<div class="bottom">
-			<div id="left" class="align-right">
-				<h3>Search Pyramid documentation</h3>
-				<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
-	      			<input type="text" id="q" name="q" value="" />
-	      			<input type="submit" id="x" value="Search" />
-	  			</form>
+		<div id="middle">
+			<div class="middle align-center">
+				<p class="app-welcome">
+					Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
+					the Pyramid web application development framework.
+				</p>
 			</div>
-			<div id="right" class="align-left">
-				<h3>Pyramid links</h3>
-				<ul class="links">
-					<li>
-						<a href="http://pylonshq.com">Pylons Website</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#api-documentation">API Documentation</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#tutorials">Tutorials</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#change-history">Change History</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#sample-applications">Sample Applications</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#support-and-development">Support and Development</a>
-					</li>
-					<li>
-						<a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
-					</li>
-	  			</ul>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<div id="left" class="align-right">
+					<h2>Search documentation</h2>
+					<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
+		      			<input type="text" id="q" name="q" value="" />
+		      			<input type="submit" id="x" value="Go" />
+		  			</form>
+				</div>
+				<div id="right" class="align-left">
+					<h2>Pyramid links</h2>
+					<ul class="links">
+						<li>
+							<a href="http://pylonshq.com">Pylons Website</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#api-documentation">API Documentation</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#tutorials">Tutorials</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#change-history">Change History</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#sample-applications">Sample Applications</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#support-and-development">Support and Development</a>
+						</li>
+						<li>
+							<a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
+						</li>
+		  			</ul>
+				</div>
 			</div>
 		</div>
 	</div>
 	<div id="footer">
-		<div class="footer">© Copyright 2008-2010, Agendaless Consulting.</div>
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
 	</div>
 </body>
 </html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/views/tutorial/static/footerbg.png
new file mode 100644
index 000000000..1fbc873da
--- /dev/null
+++ b/docs/tutorials/wiki/src/views/tutorial/static/footerbg.png
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/views/tutorial/static/headerbg.png
new file mode 100644
index 000000000..0596f2020
--- /dev/null
+++ b/docs/tutorials/wiki/src/views/tutorial/static/headerbg.png
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/ie6.css b/docs/tutorials/wiki/src/views/tutorial/static/ie6.css
new file mode 100644
index 000000000..b7c8493d8
--- /dev/null
+++ b/docs/tutorials/wiki/src/views/tutorial/static/ie6.css
@@ -0,0 +1,8 @@
+* html img,
+* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
+this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
+this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
+);}
+#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/logo.png b/docs/tutorials/wiki/src/views/tutorial/static/logo.png
deleted file mode 100644
index 88f5d9865..000000000
--- a/docs/tutorials/wiki/src/views/tutorial/static/logo.png
+++ /dev/null
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/views/tutorial/static/middlebg.png
new file mode 100644
index 000000000..2369cfb7d
--- /dev/null
+++ b/docs/tutorials/wiki/src/views/tutorial/static/middlebg.png
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/pylons.css b/docs/tutorials/wiki/src/views/tutorial/static/pylons.css
index c153be07f..4ebc5a081 100644
--- a/docs/tutorials/wiki/src/views/tutorial/static/pylons.css
+++ b/docs/tutorials/wiki/src/views/tutorial/static/pylons.css
@@ -4,34 +4,23 @@ body{line-height:1;}
 ol,ul{list-style:none;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
-/* remember to define focus styles! */
 :focus{outline:0;}
-/* remember to highlight inserts somehow! */
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
-/* tables still need 'cellspacing="0"' in the markup */
 table{border-collapse:collapse;border-spacing:0;}
-/* restyling */
 sub{vertical-align:sub;font-size:smaller;line-height:normal;}
 sup{vertical-align:super;font-size:smaller;line-height:normal;}
-/* lists */
 ul,menu,dir{display:block;list-style-type:disc;margin:1em 0;padding-left:40px;}
 ol{display:block;list-style-type:decimal-leading-zero;margin:1em 0;padding-left:40px;}
 li{display:list-item;}
-/* nested lists have no top/bottom margins */
 ul ul,ul ol,ul dir,ul menu,ul dl,ol ul,ol ol,ol dir,ol menu,ol dl,dir ul,dir ol,dir dir,dir menu,dir dl,menu ul,menu ol,menu dir,menu menu,menu dl,dl ul,dl ol,dl dir,dl menu,dl dl{margin-top:0;margin-bottom:0;}
-/* 2 deep unordered lists use a circle */
 ol ul,ul ul,menu ul,dir ul,ol menu,ul menu,menu menu,dir menu,ol dir,ul dir,menu dir,dir dir{list-style-type:circle;}
-/* 3 deep (or more) unordered lists use a square */
 ol ol ul,ol ul ul,ol menu ul,ol dir ul,ol ol menu,ol ul menu,ol menu menu,ol dir menu,ol ol dir,ol ul dir,ol menu dir,ol dir dir,ul ol ul,ul ul ul,ul menu ul,ul dir ul,ul ol menu,ul ul menu,ul menu menu,ul dir menu,ul ol dir,ul ul dir,ul menu dir,ul dir dir,menu ol ul,menu ul ul,menu menu ul,menu dir ul,menu ol menu,menu ul menu,menu menu menu,menu dir menu,menu ol dir,menu ul dir,menu menu dir,menu dir dir,dir ol ul,dir ul ul,dir menu ul,dir dir ul,dir ol menu,dir ul menu,dir menu menu,dir dir menu,dir ol dir,dir ul dir,dir menu dir,dir dir dir{list-style-type:square;}
 .hidden{display:none;}
 p{line-height:1.5em;}
-h1{font-size:1.75em;/* 28px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h2{font-size:1.5em;/* 24px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h3{font-size:1.25em;/* 20px */
-line-height:1.7em;font-family:helvetica,verdana;}
+h1{font-size:1.75em;line-height:1.7em;font-family:helvetica,verdana;}
+h2{font-size:1.5em;line-height:1.7em;font-family:helvetica,verdana;}
+h3{font-size:1.25em;line-height:1.7em;font-family:helvetica,verdana;}
 h4{font-size:1em;line-height:1.7em;font-family:helvetica,verdana;}
 html,body{width:100%;height:100%;}
 body{margin:0;padding:0;background-color:#ffffff;position:relative;font:16px/24px "Nobile","Lucida Grande",Lucida,Verdana,sans-serif;}
@@ -42,23 +31,25 @@ body h2,
 body h3,
 body h4,
 body h5,
-body h6{font-family:"Nobile","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#144fb2;font-style:normal;}
-#wrap {min-height: 100%;}
-#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;}
-#header{background-color:#e88f00;top:0;font-size:14px;}
-#footer{background-color:#000000;bottom:0;position: relative;margin-top:-40px;clear:both;}
-.header,.footer{width:700px;margin-right:auto;margin-left:auto;}
+body h6{font-family:"Neuton","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#373839;font-style:normal;}
+#wrap{min-height:100%;}
+#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;vertical-align:middle;}
+#header{background:#000000;top:0;font-size:14px;}
+#footer{bottom:0;background:#000000 url(footerbg.png) repeat-x 0 top;position:relative;margin-top:-40px;clear:both;}
+.header,.footer{width:750px;margin-right:auto;margin-left:auto;}
 .wrapper{width:100%}
 #top,#bottom{width:100%;}
-#top{color:#888;background-color:#eee;height:300px;border-bottom:2px solid #ddd;}
-#bottom{color:#222;background-color:#ffffff;overflow:hidden;padding-bottom:80px;}
-.top,.bottom{width:700px;margin-right:auto;margin-left:auto;}
-.top{padding-top:100px;}
+#top{color:#000000;height:230px;
+background:#ffffff url(headerbg.png) repeat-x 0 top;position:relative;}
+#bottom{color:#222;background-color:#ffffff;}
+.top,.middle,.bottom{width:750px;margin-right:auto;margin-left:auto;}
+.top{padding-top:40px;}
+#middle{width:100%;height:100px;background:url(middlebg.png) repeat-x;border-top:2px solid #ffffff;border-bottom:2px solid #b2b2b2;}
 .app-welcome{margin-top:25px;}
 .app-name{color:#000000;font-weight:bold;}
 .bottom{padding-top:50px;}
-#left{width:325px;float:left;padding-right:25px;}
-#right{width:325px;float:right;padding-left:25px;}
+#left{width:350px;float:left;padding-right:25px;}
+#right{width:350px;float:right;padding-left:25px;}
 .align-left{text-align:left;}
 .align-right{text-align:right;}
 .align-center{text-align:center;}
@@ -67,7 +58,7 @@ ul.links li{list-style-type:none;font-size:14px;}
 form{border-style:none;}
 fieldset{border-style:none;}
 input{color:#222;border:1px solid #ccc;font-family:sans-serif;font-size:12px;line-height:16px;}
-input[type=text]{}
+input[type=text],input[type=password]{width:205px;}
 input[type=submit]{background-color:#ddd;font-weight:bold;}
 /*Opera Fix*/
-body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}
+body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/views/tutorial/static/pyramid.png
new file mode 100644
index 000000000..347e05549
--- /dev/null
+++ b/docs/tutorials/wiki/src/views/tutorial/static/pyramid.png
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/style.css b/docs/tutorials/wiki/src/views/tutorial/static/style.css
deleted file mode 100644
index cad87e0d4..000000000
--- a/docs/tutorials/wiki/src/views/tutorial/static/style.css
+++ /dev/null
@@ -1,109 +0,0 @@
-html, body {
-  color: black;
-  background-color: #ddd;
-  font: x-small "Lucida Grande", "Lucida Sans Unicode", geneva, sans-serif;
-  margin: 0;
-  padding: 0;
-}
-
-td, th {padding:3px;border:none;}
-tr th {text-align:left;background-color:#f0f0f0;color:#333;}
-tr.odd td {background-color:#edf3fe;}
-tr.even td {background-color:#fff;}
-
-#header {
-  height: 80px;
-  width: 777px;
-  background: blue URL('../images/header_inner.png') no-repeat;
-  border-left: 1px solid #aaa;
-  border-right: 1px solid #aaa;
-  margin: 0 auto 0 auto;
-}
-
-a.link, a, a.active {
-  color: #369;
-}
-
-
-#main_content {
-  color: black;
-  font-size: 127%;
-  background-color: white;
-  width: 757px;
-  margin: 0 auto 0 auto;
-  border-left: 1px solid #aaa;
-  border-right: 1px solid #aaa;
-  padding: 10px;
-}
-
-#sidebar {
-  border: 1px solid #aaa;
-  background-color: #eee;
-  margin: 0.5em;
-  padding: 1em;
-  float: right;
-  width: 200px;
-  font-size: 88%;
-}
-
-#sidebar h2 {
-  margin-top: 0;
-}
-
-#sidebar ul {
-  margin-left: 1.5em;
-  padding-left: 0;
-}
-
-h1,h2,h3,h4,h5,h6,#getting_started_steps {
-  font-family: "Century Schoolbook L", Georgia, serif;
-  font-weight: bold;
-}
-
-h2 {
-  font-size: 150%;
-}
-
-#footer {
-  border: 1px solid #aaa;
-  border-top: 0px none;
-  color: #999;
-  background-color: white;
-  padding: 10px;
-  font-size: 80%;
-  text-align: center;
-  width: 757px;
-  margin: 0 auto 1em auto;
-}
-
-.code {
-  font-family: monospace;
-}
-
-span.code {
-  font-weight: bold;
-  background: #eee;
-}
-
-#status_block {
-  margin: 0 auto 0.5em auto;
-  padding: 15px 10px 15px 55px;
-  background: #cec URL('../images/ok.png') left center no-repeat;
-  border: 1px solid #9c9;
-  width: 450px;
-  font-size: 120%;
-  font-weight: bolder;
-}
-
-.notice {
-  margin: 0.5em auto 0.5em auto;
-  padding: 15px 10px 15px 55px;
-  width: 450px;
-  background: #eef URL('../images/info.png') left center no-repeat;
-  border: 1px solid #cce;
-}
-
-.fielderror {
-    color: red;
-    font-weight: bold;
-}
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/views/tutorial/static/transparent.gif
new file mode 100644
index 000000000..0341802e5
--- /dev/null
+++ b/docs/tutorials/wiki/src/views/tutorial/static/transparent.gif
diff --git a/docs/tutorials/wiki/src/views/tutorial/templates/edit.pt b/docs/tutorials/wiki/src/views/tutorial/templates/edit.pt
index 1d40f526d..8ed9f8b63 100644
--- a/docs/tutorials/wiki/src/views/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki/src/views/tutorial/templates/edit.pt
@@ -1,32 +1,47 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-    <title>Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki) 
-           Editing: ${page.__name__}</title>
-        <link rel="stylesheet" type="text/css"
-          href="${request.application_url}/static/style.css" />
+	<title>${page.__name__} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<div class="main_content">
-  <div style="float:right; width: 10em;"> Viewing
-    <span tal:replace="page.__name__">Page Name Goes Here</span> <br/>
-    You can return to the <a href="${request.application_url}"
-        >FrontPage</a>.
-  </div>  
-
-  <div>
-    <form action="${save_url}" method="post">
-      <textarea name="body" tal:content="page.data" rows="10" cols="60"/>
-      <input type="submit" name="form.submitted" value="Save"/>
-    </form>
-  </div>
-</div>  
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					Editing <b><span tal:replace="page.__name__">Page Name Goes Here</span></b><br/>
+					You can return to the <a href="${request.application_url}">FrontPage</a>.<br/>
+				</div>
+				<div id="right" class="app-welcome align-right"></div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<form action="${save_url}" method="post">
+      				<textarea name="body" tal:content="page.data" rows="10" cols="60"/><br/>
+      				<input type="submit" name="form.submitted" value="Save"/>
+    			</form>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki/src/views/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/views/tutorial/templates/mytemplate.pt
index a5a0dd214..cac9ccaa7 100644
--- a/docs/tutorials/wiki/src/views/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/src/views/tutorial/templates/mytemplate.pt
@@ -5,65 +5,72 @@
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 	<meta name="keywords" content="python web application" />
 	<meta name="description" content="pyramid web application" />
-	<link rel="shortcut icon" href="${request.application_url}/static/favicon.ico" />
-	<link rel="stylesheet" href="${request.application_url}/static/pylons.css" type="text/css" media="screen" charset="utf-8" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
 	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
 <body>
-	<div id="header">
-		<div class="header">The Pyramid Web Application Development Framework</div>
-	</div>
-	<div id="top">
-		<div class="top align-center">
-			<img src="${request.application_url}/static/logo.png" width="300" height="80"/>
-			<p class="app-welcome">
-				Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
-				the Pyramid web application development framework.
-			</p>
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
+			</div>
 		</div>
-	</div>
-	<div id="bottom">
-		<div class="bottom">
-			<div id="left" class="align-right">
-				<h3>Search Pyramid documentation</h3>
-				<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
-	      			<input type="text" id="q" name="q" value="" />
-	      			<input type="submit" id="x" value="Search" />
-	  			</form>
+		<div id="middle">
+			<div class="middle align-center">
+				<p class="app-welcome">
+					Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
+					the Pyramid web application development framework.
+				</p>
 			</div>
-			<div id="right" class="align-left">
-				<h3>Pyramid links</h3>
-				<ul class="links">
-					<li>
-						<a href="http://pylonshq.com">Pylons Website</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#api-documentation">API Documentation</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#tutorials">Tutorials</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#change-history">Change History</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#sample-applications">Sample Applications</a>
-					</li>
-					<li>
-						<a href="http://docs.pylonshq.com/pyramid/dev/#support-and-development">Support and Development</a>
-					</li>
-					<li>
-						<a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
-					</li>
-	  			</ul>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<div id="left" class="align-right">
+					<h2>Search documentation</h2>
+					<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
+		      			<input type="text" id="q" name="q" value="" />
+		      			<input type="submit" id="x" value="Go" />
+		  			</form>
+				</div>
+				<div id="right" class="align-left">
+					<h2>Pyramid links</h2>
+					<ul class="links">
+						<li>
+							<a href="http://pylonshq.com">Pylons Website</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#api-documentation">API Documentation</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#tutorials">Tutorials</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#change-history">Change History</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#sample-applications">Sample Applications</a>
+						</li>
+						<li>
+							<a href="http://docs.pylonshq.com/pyramid/dev/#support-and-development">Support and Development</a>
+						</li>
+						<li>
+							<a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
+						</li>
+		  			</ul>
+				</div>
 			</div>
 		</div>
 	</div>
 	<div id="footer">
-		<div class="footer">© Copyright 2008-2010, Agendaless Consulting.</div>
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
 	</div>
 </body>
 </html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki/src/views/tutorial/templates/view.pt b/docs/tutorials/wiki/src/views/tutorial/templates/view.pt
index 50719f9e9..f104e481c 100644
--- a/docs/tutorials/wiki/src/views/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki/src/views/tutorial/templates/view.pt
@@ -1,29 +1,51 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-    <title>${page.__name__} - Pyramid tutorial wiki 
-           (based on TurboGears 20-Minute Wiki)
-    </title>
-        <link rel="stylesheet" type="text/css"
-          href="${request.application_url}/static/style.css" />
+	<title>${page.__name__} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<div class="main_content">
-<div style="float:right; width: 10em;"> Viewing
-<span tal:replace="page.__name__">Page Name Goes Here</span> <br/>
-You can return to the 
-<a href="${request.application_url}">FrontPage</a>.
-</div>
-
-<div tal:replace="structure content">Page text goes here.</div>
-<p><a tal:attributes="href edit_url" href="">Edit this page</a></p>
-</div>
-
-</body></html>
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					Viewing <b><span tal:replace="page.__name__">Page Name Goes Here</span></b><br/>
+					You can return to the <a href="${request.application_url}">FrontPage</a>.<br/>
+				</div>
+				<div id="right" class="app-welcome align-right"></div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<div tal:replace="structure content">
+					Page text goes here.
+				</div>
+				<p>
+					<a tal:attributes="href edit_url" href="">
+						Edit this page
+					</a>
+				</p>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
+</body>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/authorization.rst b/docs/tutorials/wiki2/authorization.rst
index 8d30ab807..5b07fe788 100644
--- a/docs/tutorials/wiki2/authorization.rst
+++ b/docs/tutorials/wiki2/authorization.rst
@@ -202,7 +202,6 @@ Add a ``login.pt`` template to your templates directory.  It's
 referred to within the login view we just added to ``login.py``.
 
 .. literalinclude:: src/authorization/tutorial/templates/login.pt
-   :linenos:
    :language: xml
 
 Change ``view.pt`` and ``edit.pt``
@@ -212,11 +211,10 @@ We'll also need to change our ``edit.pt`` and ``view.pt`` templates to
 display a "Logout" link if someone is logged in.  This link will
 invoke the logout view.
 
-To do so we'll add this to both templates within the ``<div
-class="main_content">`` div:
+To do so we'll add this to both templates within the ``<div id="right"
+class="app-welcome align-right">`` div:
 
 .. code-block:: xml
-   :linenos:
 
    <span tal:condition="logged_in">
       <a href="${request.application_url}/logout">Logout</a>
@@ -261,13 +259,11 @@ Our ``views.py`` module will look something like this when we're done:
 Our ``edit.pt`` template will look something like this when we're done:
 
 .. literalinclude:: src/authorization/tutorial/templates/edit.pt
-   :linenos:
    :language: xml
 
 Our ``view.pt`` template will look something like this when we're done:
 
 .. literalinclude:: src/authorization/tutorial/templates/view.pt
-   :linenos:
    :language: xml
 
 Revisiting the Application
diff --git a/docs/tutorials/wiki2/definingviews.rst b/docs/tutorials/wiki2/definingviews.rst
index e3d611136..d4417ed0b 100644
--- a/docs/tutorials/wiki2/definingviews.rst
+++ b/docs/tutorials/wiki2/definingviews.rst
@@ -212,7 +212,6 @@ Once we're done with the ``view.pt`` template, it will look a lot like
 the below:
 
 .. literalinclude:: src/views/tutorial/templates/view.pt
-   :linenos:
    :language: xml
 
 .. note:: The names available for our use in a template are always
@@ -240,25 +239,24 @@ Once we're done with the ``edit.pt`` template, it will look a lot like
 the below:
 
 .. literalinclude:: src/views/tutorial/templates/edit.pt
-   :linenos:
    :language: xml
 
-Static Resources
-----------------
-
-Our templates name a single static resource named ``style.css``.  We need to
-create this and place it in a file named ``style.css`` within our package's
-``static`` directory.  This file is a little too long to replicate within the
-body of this guide, however it is available `online
-<http://github.com/Pylons/pyramid/blob/master/docs/tutorials/wiki2/src/views/tutorial/static/style.css>`_.
+Static Assets
+-------------
 
+Our templates name a single static asset named ``pylons.css``.  We don't need
+to create this file within our package's ``static`` directory because it was
+provided at the time we created the project. This file is a little too long to
+replicate within the body of this guide, however it is available `online
+<http://github.com/Pylons/pyramid/blob/master/docs/tutorials/wiki2/src/views/tutorial/static/pylons.css>`_.
 
 This CSS file will be accessed via
-e.g. ``http://localhost:6543/static/style.css`` by virtue of the call we've
-made to :meth:`pyramid.config.Configurator.add_static_view` within our
-``__init__.py`` file.  Any number and type of static resources can be placed
-in this directory (or subdirectories) and are just referred to by URL within
-templates.
+e.g. ``http://localhost:6543/static/pylons.css`` by virtue of the call to
+``add_static_view`` directive we've made in the ``__init__`` file.  Any
+number and type of static assets can be placed in this directory (or
+subdirectories) and are just referred to by URL or by using the convenience
+method ``static_url`` e.g. ``request.static_url('{{package}}:static/foo.css')``
+within templates.
 
 Mapping Views to URLs in ``__init__.py``
 ========================================
diff --git a/docs/tutorials/wiki2/distributing.rst b/docs/tutorials/wiki2/distributing.rst
index f4421e145..9f5db19ae 100644
--- a/docs/tutorials/wiki2/distributing.rst
+++ b/docs/tutorials/wiki2/distributing.rst
@@ -18,7 +18,7 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bigfntut> ..\Scripts\python setup.py sdist
+   c:\pyramidtut> ..\Scripts\python setup.py sdist
 
 .. warning:: If your project files are not checked in to a version
    control repository (such as Subversion), the dist tarball will
diff --git a/docs/tutorials/wiki2/installation.rst b/docs/tutorials/wiki2/installation.rst
index e6fd5e6b9..c957f641e 100644
--- a/docs/tutorials/wiki2/installation.rst
+++ b/docs/tutorials/wiki2/installation.rst
@@ -45,13 +45,13 @@ Preparation, UNIX
 
    .. code-block:: text
 
-      $ path/to/my/Python-2.6/bin/virtualenv --no-site-packages bigfntut
+      $ path/to/my/Python-2.6/bin/virtualenv --no-site-packages pyramidtut
 
-#. Switch to the ``bigfntut`` directory:
+#. Switch to the ``pyramidtut`` directory:
 
    .. code-block:: text
 
-      $ cd bigfntut
+      $ cd pyramidtut
 
 #. (Optional) Consider using ``source bin/activate`` to make your
    shell environment wired to use the virtualenv.
@@ -96,13 +96,13 @@ Preparation, Windows
 
    .. code-block:: text
 
-      c:\> c:\Python26\Scripts\virtualenv --no-site-packages bigfntut
+      c:\> c:\Python26\Scripts\virtualenv --no-site-packages pyramidtut
 
-#. Switch to the ``bigfntut`` directory:
+#. Switch to the ``pyramidtut`` directory:
 
    .. code-block:: text
 
-      c:\> cd bigfntut
+      c:\> cd pyramidtut
 
 #. (Optional) Consider using ``bin\activate.bat`` to make your shell
    environment wired to use the virtualenv.
@@ -112,13 +112,13 @@ Preparation, Windows
 
    .. code-block:: text
 
-      c:\bigfntut> Scripts\easy_install pyramid
+      c:\pyramidtut> Scripts\easy_install pyramid
 
 #. Use ``easy_install`` to install various packages from PyPI.
 
    .. code-block:: text
 
-      c:\bigfntut> Scripts\easy_install -i docutils \
+      c:\pyramidtut> Scripts\easy_install -i docutils \
                nose coverage zope.sqlalchemy SQLAlchemy repoze.tm2
 
 
@@ -133,7 +133,7 @@ variety of templates to generate sample projects.  We will use the
 that uses :term:`SQLAlchemy` and :term:`URL dispatch`.
 
 The below instructions assume your current working directory is the
-"virtualenv" named "bigfntut".
+"virtualenv" named "pyramidtut".
 
 On UNIX:
 
@@ -145,7 +145,7 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bigfntut> Scripts\paster create -t pyramid_routesalchemy tutorial
+   c:\pyramidtut> Scripts\paster create -t pyramid_routesalchemy tutorial
 
 .. note:: If you are using Windows, the ``pyramid_routesalchemy``
    Paster template may not deal gracefully with installation into a
@@ -173,8 +173,8 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bigfntut> cd tutorial
-   c:\bigfntut\tutorial> ..\Scripts\python setup.py develop
+   c:\pyramidtut> cd tutorial
+   c:\pyramidtut\tutorial> ..\Scripts\python setup.py develop
 
 .. _sql_running_tests:
 
@@ -194,7 +194,7 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bigfntut\tutorial> ..\Scripts\python setup.py test -q
+   c:\pyramidtut\tutorial> ..\Scripts\python setup.py test -q
 
 Starting the Application
 ========================
@@ -211,7 +211,7 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bifgfntut\tutorial> ..\Scripts\paster serve development.ini --reload
+   c:\pyramidtut\tutorial> ..\Scripts\paster serve development.ini --reload
 
 Exposing Test Coverage Information
 ==================================
@@ -235,7 +235,7 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bigfntut\tutorial> ..\Scripts\easy_install nose coverage
+   c:\pyramidtut\tutorial> ..\Scripts\easy_install nose coverage
 
 Once ``nose`` and ``coverage`` are installed, we can actually run the
 coverage tests.
@@ -250,7 +250,7 @@ On Windows:
 
 .. code-block:: text
 
-   c:\bigfntut\tutorial> ..\Scripts\nosetests --cover-package=tutorial \
+   c:\pyramidtut\tutorial> ..\Scripts\nosetests --cover-package=tutorial \
          --cover-erase --with-coverage
 
 Looks like our package's ``models`` module doesn't quite have 100%
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/footerbg.png
new file mode 100644
index 000000000..1fbc873da
--- /dev/null
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/footerbg.png
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/headerbg.png
new file mode 100644
index 000000000..0596f2020
--- /dev/null
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/headerbg.png
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/authorization/tutorial/static/ie6.css
new file mode 100644
index 000000000..b7c8493d8
--- /dev/null
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/ie6.css
@@ -0,0 +1,8 @@
+* html img,
+* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
+this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
+this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
+);}
+#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/logo.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/logo.png
deleted file mode 100644
index 88f5d9865..000000000
--- a/docs/tutorials/wiki2/src/authorization/tutorial/static/logo.png
+++ /dev/null
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/middlebg.png
new file mode 100644
index 000000000..2369cfb7d
--- /dev/null
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/middlebg.png
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/authorization/tutorial/static/pylons.css
index c153be07f..4ebc5a081 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/static/pylons.css
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/pylons.css
@@ -4,34 +4,23 @@ body{line-height:1;}
 ol,ul{list-style:none;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
-/* remember to define focus styles! */
 :focus{outline:0;}
-/* remember to highlight inserts somehow! */
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
-/* tables still need 'cellspacing="0"' in the markup */
 table{border-collapse:collapse;border-spacing:0;}
-/* restyling */
 sub{vertical-align:sub;font-size:smaller;line-height:normal;}
 sup{vertical-align:super;font-size:smaller;line-height:normal;}
-/* lists */
 ul,menu,dir{display:block;list-style-type:disc;margin:1em 0;padding-left:40px;}
 ol{display:block;list-style-type:decimal-leading-zero;margin:1em 0;padding-left:40px;}
 li{display:list-item;}
-/* nested lists have no top/bottom margins */
 ul ul,ul ol,ul dir,ul menu,ul dl,ol ul,ol ol,ol dir,ol menu,ol dl,dir ul,dir ol,dir dir,dir menu,dir dl,menu ul,menu ol,menu dir,menu menu,menu dl,dl ul,dl ol,dl dir,dl menu,dl dl{margin-top:0;margin-bottom:0;}
-/* 2 deep unordered lists use a circle */
 ol ul,ul ul,menu ul,dir ul,ol menu,ul menu,menu menu,dir menu,ol dir,ul dir,menu dir,dir dir{list-style-type:circle;}
-/* 3 deep (or more) unordered lists use a square */
 ol ol ul,ol ul ul,ol menu ul,ol dir ul,ol ol menu,ol ul menu,ol menu menu,ol dir menu,ol ol dir,ol ul dir,ol menu dir,ol dir dir,ul ol ul,ul ul ul,ul menu ul,ul dir ul,ul ol menu,ul ul menu,ul menu menu,ul dir menu,ul ol dir,ul ul dir,ul menu dir,ul dir dir,menu ol ul,menu ul ul,menu menu ul,menu dir ul,menu ol menu,menu ul menu,menu menu menu,menu dir menu,menu ol dir,menu ul dir,menu menu dir,menu dir dir,dir ol ul,dir ul ul,dir menu ul,dir dir ul,dir ol menu,dir ul menu,dir menu menu,dir dir menu,dir ol dir,dir ul dir,dir menu dir,dir dir dir{list-style-type:square;}
 .hidden{display:none;}
 p{line-height:1.5em;}
-h1{font-size:1.75em;/* 28px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h2{font-size:1.5em;/* 24px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h3{font-size:1.25em;/* 20px */
-line-height:1.7em;font-family:helvetica,verdana;}
+h1{font-size:1.75em;line-height:1.7em;font-family:helvetica,verdana;}
+h2{font-size:1.5em;line-height:1.7em;font-family:helvetica,verdana;}
+h3{font-size:1.25em;line-height:1.7em;font-family:helvetica,verdana;}
 h4{font-size:1em;line-height:1.7em;font-family:helvetica,verdana;}
 html,body{width:100%;height:100%;}
 body{margin:0;padding:0;background-color:#ffffff;position:relative;font:16px/24px "Nobile","Lucida Grande",Lucida,Verdana,sans-serif;}
@@ -42,23 +31,25 @@ body h2,
 body h3,
 body h4,
 body h5,
-body h6{font-family:"Nobile","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#144fb2;font-style:normal;}
-#wrap {min-height: 100%;}
-#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;}
-#header{background-color:#e88f00;top:0;font-size:14px;}
-#footer{background-color:#000000;bottom:0;position: relative;margin-top:-40px;clear:both;}
-.header,.footer{width:700px;margin-right:auto;margin-left:auto;}
+body h6{font-family:"Neuton","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#373839;font-style:normal;}
+#wrap{min-height:100%;}
+#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;vertical-align:middle;}
+#header{background:#000000;top:0;font-size:14px;}
+#footer{bottom:0;background:#000000 url(footerbg.png) repeat-x 0 top;position:relative;margin-top:-40px;clear:both;}
+.header,.footer{width:750px;margin-right:auto;margin-left:auto;}
 .wrapper{width:100%}
 #top,#bottom{width:100%;}
-#top{color:#888;background-color:#eee;height:300px;border-bottom:2px solid #ddd;}
-#bottom{color:#222;background-color:#ffffff;overflow:hidden;padding-bottom:80px;}
-.top,.bottom{width:700px;margin-right:auto;margin-left:auto;}
-.top{padding-top:100px;}
+#top{color:#000000;height:230px;
+background:#ffffff url(headerbg.png) repeat-x 0 top;position:relative;}
+#bottom{color:#222;background-color:#ffffff;}
+.top,.middle,.bottom{width:750px;margin-right:auto;margin-left:auto;}
+.top{padding-top:40px;}
+#middle{width:100%;height:100px;background:url(middlebg.png) repeat-x;border-top:2px solid #ffffff;border-bottom:2px solid #b2b2b2;}
 .app-welcome{margin-top:25px;}
 .app-name{color:#000000;font-weight:bold;}
 .bottom{padding-top:50px;}
-#left{width:325px;float:left;padding-right:25px;}
-#right{width:325px;float:right;padding-left:25px;}
+#left{width:350px;float:left;padding-right:25px;}
+#right{width:350px;float:right;padding-left:25px;}
 .align-left{text-align:left;}
 .align-right{text-align:right;}
 .align-center{text-align:center;}
@@ -67,7 +58,7 @@ ul.links li{list-style-type:none;font-size:14px;}
 form{border-style:none;}
 fieldset{border-style:none;}
 input{color:#222;border:1px solid #ccc;font-family:sans-serif;font-size:12px;line-height:16px;}
-input[type=text]{}
+input[type=text],input[type=password]{width:205px;}
 input[type=submit]{background-color:#ddd;font-weight:bold;}
 /*Opera Fix*/
-body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}
+body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid.png
new file mode 100644
index 000000000..347e05549
--- /dev/null
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid.png
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/style.css b/docs/tutorials/wiki2/src/authorization/tutorial/static/style.css
deleted file mode 100644
index cad87e0d4..000000000
--- a/docs/tutorials/wiki2/src/authorization/tutorial/static/style.css
+++ /dev/null
@@ -1,109 +0,0 @@
-html, body {
-  color: black;
-  background-color: #ddd;
-  font: x-small "Lucida Grande", "Lucida Sans Unicode", geneva, sans-serif;
-  margin: 0;
-  padding: 0;
-}
-
-td, th {padding:3px;border:none;}
-tr th {text-align:left;background-color:#f0f0f0;color:#333;}
-tr.odd td {background-color:#edf3fe;}
-tr.even td {background-color:#fff;}
-
-#header {
-  height: 80px;
-  width: 777px;
-  background: blue URL('../images/header_inner.png') no-repeat;
-  border-left: 1px solid #aaa;
-  border-right: 1px solid #aaa;
-  margin: 0 auto 0 auto;
-}
-
-a.link, a, a.active {
-  color: #369;
-}
-
-
-#main_content {
-  color: black;
-  font-size: 127%;
-  background-color: white;
-  width: 757px;
-  margin: 0 auto 0 auto;
-  border-left: 1px solid #aaa;
-  border-right: 1px solid #aaa;
-  padding: 10px;
-}
-
-#sidebar {
-  border: 1px solid #aaa;
-  background-color: #eee;
-  margin: 0.5em;
-  padding: 1em;
-  float: right;
-  width: 200px;
-  font-size: 88%;
-}
-
-#sidebar h2 {
-  margin-top: 0;
-}
-
-#sidebar ul {
-  margin-left: 1.5em;
-  padding-left: 0;
-}
-
-h1,h2,h3,h4,h5,h6,#getting_started_steps {
-  font-family: "Century Schoolbook L", Georgia, serif;
-  font-weight: bold;
-}
-
-h2 {
-  font-size: 150%;
-}
-
-#footer {
-  border: 1px solid #aaa;
-  border-top: 0px none;
-  color: #999;
-  background-color: white;
-  padding: 10px;
-  font-size: 80%;
-  text-align: center;
-  width: 757px;
-  margin: 0 auto 1em auto;
-}
-
-.code {
-  font-family: monospace;
-}
-
-span.code {
-  font-weight: bold;
-  background: #eee;
-}
-
-#status_block {
-  margin: 0 auto 0.5em auto;
-  padding: 15px 10px 15px 55px;
-  background: #cec URL('../images/ok.png') left center no-repeat;
-  border: 1px solid #9c9;
-  width: 450px;
-  font-size: 120%;
-  font-weight: bolder;
-}
-
-.notice {
-  margin: 0.5em auto 0.5em auto;
-  padding: 15px 10px 15px 55px;
-  width: 450px;
-  background: #eef URL('../images/info.png') left center no-repeat;
-  border: 1px solid #cce;
-}
-
-.fielderror {
-    color: red;
-    font-weight: bold;
-}
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/authorization/tutorial/static/transparent.gif
new file mode 100644
index 000000000..0341802e5
--- /dev/null
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/transparent.gif
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
index 05e2ecd76..31d5f4716 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
@@ -1,35 +1,51 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-    <title>Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki) 
-           Editing: ${page.name}</title>
-        <link rel="stylesheet" type="text/css"
-          href="${request.application_url}/static/style.css" />
+	<title>${page.name} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<div class="main_content">
-  <div style="float:right; width: 10em;"> Viewing
-    <span tal:replace="page.name">Page Name Goes Here</span> <br/>
-    You can return to the <a href="${request.application_url}"
-            >FrontPage</a>.
-   <span tal:condition="logged_in">
-      <a href="${request.application_url}/logout">Logout</a>
-   </span>
-  </div>  
-
-  <div>
-    <form action="${save_url}" method="post">
-      <textarea name="body" tal:content="page.data" rows="10" cols="60"/>
-      <input type="submit" name="form.submitted" value="Save"/>
-    </form>
-  </div>
-</div>  
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					Editing <b><span tal:replace="page.name">Page Name Goes Here</span></b><br/>
+					You can return to the <a href="${request.application_url}">FrontPage</a>.<br/>
+				</div>
+				<div id="right" class="app-welcome align-right">
+					<span tal:condition="logged_in">
+  						<a href="${request.application_url}/logout">Logout</a>
+					</span>
+				</div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<form action="${save_url}" method="post">
+      				<textarea name="body" tal:content="page.data" rows="10" cols="60"/><br/>
+      				<input type="submit" name="form.submitted" value="Save"/>
+    			</form>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt
index c56983d64..4473b701a 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt
@@ -1,32 +1,49 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-    xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-  <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-  <title>Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
-  <link rel="stylesheet" type="text/css"
-        href="${request.application_url}/static/style.css" />
+	<title>Login - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<h1>Log In</h1>
-
-<div tal:replace="message"/>
-
-<div class="main_content">
-  <form action="${url}" method="post">
-    <input type="hidden" name="came_from" value="${came_from}"/>
-    <input type="text" name="login" value="${login}"/>
-    <br/>
-    <input type="password" name="password" value="${password}"/>
-    <br/>
-    <input type="submit" name="form.submitted" value="Log In"/>
-  </form>
-</div>  
-
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					<b>Login</b><br/>
+					<span tal:replace="message"/>
+				</div>
+				<div id="right" class="app-welcome align-right"></div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<form action="${url}" method="post">
+    				<input type="hidden" name="came_from" value="${came_from}"/>
+    				<input type="text" name="login" value="${login}"/><br/>
+    				<input type="password" name="password" value="${password}"/><br/>
+    				<input type="submit" name="form.submitted" value="Log In"/>
+  				</form>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/mytemplate.pt
index 6ad23d44f..cac9ccaa7 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/mytemplate.pt
@@ -5,23 +5,23 @@
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 	<meta name="keywords" content="python web application" />
 	<meta name="description" content="pyramid web application" />
-	<link rel="shortcut icon" href="${request.application_url}/static/favicon.ico" />
-	<link rel="stylesheet" href="${request.application_url}/static/pylons.css" type="text/css" media="screen" charset="utf-8" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
 	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
-	<!--[if !IE 7]>
-	<style type="text/css">
-		#wrap {display:table;height:100%}
-	</style>
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
 	<![endif]-->
 </head>
 <body>
 	<div id="wrap">
-		<div id="header">
-			<div class="header">The Pyramid Web Application Development Framework</div>
-		</div>
 		<div id="top">
 			<div class="top align-center">
-				<img src="${request.application_url}/static/logo.png" width="300" height="80"/>
+				<div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-center">
 				<p class="app-welcome">
 					Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
 					the Pyramid web application development framework.
@@ -31,22 +31,19 @@
 		<div id="bottom">
 			<div class="bottom">
 				<div id="left" class="align-right">
-					<h3>Search Pyramid documentation</h3>
+					<h2>Search documentation</h2>
 					<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
 		      			<input type="text" id="q" name="q" value="" />
-		      			<input type="submit" id="x" value="Search" />
+		      			<input type="submit" id="x" value="Go" />
 		  			</form>
 				</div>
 				<div id="right" class="align-left">
-					<h3>Pyramid links</h3>
+					<h2>Pyramid links</h2>
 					<ul class="links">
 						<li>
 							<a href="http://pylonshq.com">Pylons Website</a>
 						</li>
 						<li>
-							<a href="http://docs.pylonshq.com/">The Pylons Project Documentation</a>
-						</li>
-						<li>
 							<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
 						</li>
 						<li>
@@ -73,7 +70,7 @@
 		</div>
 	</div>
 	<div id="footer">
-		<div class="footer">© Copyright 2008-2010, Agendaless Consulting.</div>
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
 	</div>
 </body>
 </html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt
index 0c654250a..529db4dcc 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt
@@ -1,31 +1,55 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-    <title>${page.name} - Pyramid tutorial wiki 
-           (based on TurboGears 20-Minute Wiki)</title>
-        <link rel="stylesheet" type="text/css"
-          href="${request.application_url}/static/style.css" />
+	<title>${page.name} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<div class="main_content">
-<div style="float:right; width: 10em;"> Viewing
-<span tal:replace="page.name">Page Name Goes Here</span> <br/>
-You can return to the <a href="${request.application_url}">FrontPage</a>.
-<span tal:condition="logged_in">
-  <a href="${request.application_url}/logout">Logout</a>
-</span>
-</div>
-
-<div tal:replace="structure content">Page text goes here.</div>
-<p><a tal:attributes="href edit_url" href="">Edit this page</a></p>
-</div>
-
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					Viewing <b><span tal:replace="page.name">Page Name Goes Here</span></b><br/>
+					You can return to the <a href="${request.application_url}">FrontPage</a>.<br/>
+				</div>
+				<div id="right" class="app-welcome align-right">
+					<span tal:condition="logged_in">
+  						<a href="${request.application_url}/logout">Logout</a>
+					</span>
+				</div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<div tal:replace="structure content">
+					Page text goes here.
+				</div>
+				<p>
+					<a tal:attributes="href edit_url" href="">
+						Edit this page
+					</a>
+				</p>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/footerbg.png
new file mode 100644
index 000000000..1fbc873da
--- /dev/null
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/footerbg.png
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/headerbg.png
new file mode 100644
index 000000000..0596f2020
--- /dev/null
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/headerbg.png
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/ie6.css
new file mode 100644
index 000000000..b7c8493d8
--- /dev/null
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/ie6.css
@@ -0,0 +1,8 @@
+* html img,
+* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
+this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
+this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
+);}
+#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/logo.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/logo.png
deleted file mode 100644
index 88f5d9865..000000000
--- a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/logo.png
+++ /dev/null
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/middlebg.png
new file mode 100644
index 000000000..2369cfb7d
--- /dev/null
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/middlebg.png
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pylons.css
index c153be07f..4ebc5a081 100644
--- a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pylons.css
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pylons.css
@@ -4,34 +4,23 @@ body{line-height:1;}
 ol,ul{list-style:none;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
-/* remember to define focus styles! */
 :focus{outline:0;}
-/* remember to highlight inserts somehow! */
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
-/* tables still need 'cellspacing="0"' in the markup */
 table{border-collapse:collapse;border-spacing:0;}
-/* restyling */
 sub{vertical-align:sub;font-size:smaller;line-height:normal;}
 sup{vertical-align:super;font-size:smaller;line-height:normal;}
-/* lists */
 ul,menu,dir{display:block;list-style-type:disc;margin:1em 0;padding-left:40px;}
 ol{display:block;list-style-type:decimal-leading-zero;margin:1em 0;padding-left:40px;}
 li{display:list-item;}
-/* nested lists have no top/bottom margins */
 ul ul,ul ol,ul dir,ul menu,ul dl,ol ul,ol ol,ol dir,ol menu,ol dl,dir ul,dir ol,dir dir,dir menu,dir dl,menu ul,menu ol,menu dir,menu menu,menu dl,dl ul,dl ol,dl dir,dl menu,dl dl{margin-top:0;margin-bottom:0;}
-/* 2 deep unordered lists use a circle */
 ol ul,ul ul,menu ul,dir ul,ol menu,ul menu,menu menu,dir menu,ol dir,ul dir,menu dir,dir dir{list-style-type:circle;}
-/* 3 deep (or more) unordered lists use a square */
 ol ol ul,ol ul ul,ol menu ul,ol dir ul,ol ol menu,ol ul menu,ol menu menu,ol dir menu,ol ol dir,ol ul dir,ol menu dir,ol dir dir,ul ol ul,ul ul ul,ul menu ul,ul dir ul,ul ol menu,ul ul menu,ul menu menu,ul dir menu,ul ol dir,ul ul dir,ul menu dir,ul dir dir,menu ol ul,menu ul ul,menu menu ul,menu dir ul,menu ol menu,menu ul menu,menu menu menu,menu dir menu,menu ol dir,menu ul dir,menu menu dir,menu dir dir,dir ol ul,dir ul ul,dir menu ul,dir dir ul,dir ol menu,dir ul menu,dir menu menu,dir dir menu,dir ol dir,dir ul dir,dir menu dir,dir dir dir{list-style-type:square;}
 .hidden{display:none;}
 p{line-height:1.5em;}
-h1{font-size:1.75em;/* 28px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h2{font-size:1.5em;/* 24px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h3{font-size:1.25em;/* 20px */
-line-height:1.7em;font-family:helvetica,verdana;}
+h1{font-size:1.75em;line-height:1.7em;font-family:helvetica,verdana;}
+h2{font-size:1.5em;line-height:1.7em;font-family:helvetica,verdana;}
+h3{font-size:1.25em;line-height:1.7em;font-family:helvetica,verdana;}
 h4{font-size:1em;line-height:1.7em;font-family:helvetica,verdana;}
 html,body{width:100%;height:100%;}
 body{margin:0;padding:0;background-color:#ffffff;position:relative;font:16px/24px "Nobile","Lucida Grande",Lucida,Verdana,sans-serif;}
@@ -42,23 +31,25 @@ body h2,
 body h3,
 body h4,
 body h5,
-body h6{font-family:"Nobile","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#144fb2;font-style:normal;}
-#wrap {min-height: 100%;}
-#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;}
-#header{background-color:#e88f00;top:0;font-size:14px;}
-#footer{background-color:#000000;bottom:0;position: relative;margin-top:-40px;clear:both;}
-.header,.footer{width:700px;margin-right:auto;margin-left:auto;}
+body h6{font-family:"Neuton","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#373839;font-style:normal;}
+#wrap{min-height:100%;}
+#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;vertical-align:middle;}
+#header{background:#000000;top:0;font-size:14px;}
+#footer{bottom:0;background:#000000 url(footerbg.png) repeat-x 0 top;position:relative;margin-top:-40px;clear:both;}
+.header,.footer{width:750px;margin-right:auto;margin-left:auto;}
 .wrapper{width:100%}
 #top,#bottom{width:100%;}
-#top{color:#888;background-color:#eee;height:300px;border-bottom:2px solid #ddd;}
-#bottom{color:#222;background-color:#ffffff;overflow:hidden;padding-bottom:80px;}
-.top,.bottom{width:700px;margin-right:auto;margin-left:auto;}
-.top{padding-top:100px;}
+#top{color:#000000;height:230px;
+background:#ffffff url(headerbg.png) repeat-x 0 top;position:relative;}
+#bottom{color:#222;background-color:#ffffff;}
+.top,.middle,.bottom{width:750px;margin-right:auto;margin-left:auto;}
+.top{padding-top:40px;}
+#middle{width:100%;height:100px;background:url(middlebg.png) repeat-x;border-top:2px solid #ffffff;border-bottom:2px solid #b2b2b2;}
 .app-welcome{margin-top:25px;}
 .app-name{color:#000000;font-weight:bold;}
 .bottom{padding-top:50px;}
-#left{width:325px;float:left;padding-right:25px;}
-#right{width:325px;float:right;padding-left:25px;}
+#left{width:350px;float:left;padding-right:25px;}
+#right{width:350px;float:right;padding-left:25px;}
 .align-left{text-align:left;}
 .align-right{text-align:right;}
 .align-center{text-align:center;}
@@ -67,7 +58,7 @@ ul.links li{list-style-type:none;font-size:14px;}
 form{border-style:none;}
 fieldset{border-style:none;}
 input{color:#222;border:1px solid #ccc;font-family:sans-serif;font-size:12px;line-height:16px;}
-input[type=text]{}
+input[type=text],input[type=password]{width:205px;}
 input[type=submit]{background-color:#ddd;font-weight:bold;}
 /*Opera Fix*/
-body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}
+body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid.png
new file mode 100644
index 000000000..347e05549
--- /dev/null
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid.png
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/transparent.gif
new file mode 100644
index 000000000..0341802e5
--- /dev/null
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/transparent.gif
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/basiclayout/tutorial/templates/mytemplate.pt
index 6ad23d44f..cac9ccaa7 100644
--- a/docs/tutorials/wiki2/src/basiclayout/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/templates/mytemplate.pt
@@ -5,23 +5,23 @@
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 	<meta name="keywords" content="python web application" />
 	<meta name="description" content="pyramid web application" />
-	<link rel="shortcut icon" href="${request.application_url}/static/favicon.ico" />
-	<link rel="stylesheet" href="${request.application_url}/static/pylons.css" type="text/css" media="screen" charset="utf-8" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
 	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
-	<!--[if !IE 7]>
-	<style type="text/css">
-		#wrap {display:table;height:100%}
-	</style>
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
 	<![endif]-->
 </head>
 <body>
 	<div id="wrap">
-		<div id="header">
-			<div class="header">The Pyramid Web Application Development Framework</div>
-		</div>
 		<div id="top">
 			<div class="top align-center">
-				<img src="${request.application_url}/static/logo.png" width="300" height="80"/>
+				<div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-center">
 				<p class="app-welcome">
 					Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
 					the Pyramid web application development framework.
@@ -31,22 +31,19 @@
 		<div id="bottom">
 			<div class="bottom">
 				<div id="left" class="align-right">
-					<h3>Search Pyramid documentation</h3>
+					<h2>Search documentation</h2>
 					<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
 		      			<input type="text" id="q" name="q" value="" />
-		      			<input type="submit" id="x" value="Search" />
+		      			<input type="submit" id="x" value="Go" />
 		  			</form>
 				</div>
 				<div id="right" class="align-left">
-					<h3>Pyramid links</h3>
+					<h2>Pyramid links</h2>
 					<ul class="links">
 						<li>
 							<a href="http://pylonshq.com">Pylons Website</a>
 						</li>
 						<li>
-							<a href="http://docs.pylonshq.com/">The Pylons Project Documentation</a>
-						</li>
-						<li>
 							<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
 						</li>
 						<li>
@@ -73,7 +70,7 @@
 		</div>
 	</div>
 	<div id="footer">
-		<div class="footer">© Copyright 2008-2010, Agendaless Consulting.</div>
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
 	</div>
 </body>
 </html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/models/tutorial/static/footerbg.png
new file mode 100644
index 000000000..1fbc873da
--- /dev/null
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/footerbg.png
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/models/tutorial/static/headerbg.png
new file mode 100644
index 000000000..0596f2020
--- /dev/null
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/headerbg.png
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/models/tutorial/static/ie6.css
new file mode 100644
index 000000000..b7c8493d8
--- /dev/null
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/ie6.css
@@ -0,0 +1,8 @@
+* html img,
+* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
+this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
+this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
+);}
+#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/logo.png b/docs/tutorials/wiki2/src/models/tutorial/static/logo.png
deleted file mode 100644
index 88f5d9865..000000000
--- a/docs/tutorials/wiki2/src/models/tutorial/static/logo.png
+++ /dev/null
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/models/tutorial/static/middlebg.png
new file mode 100644
index 000000000..2369cfb7d
--- /dev/null
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/middlebg.png
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/models/tutorial/static/pylons.css
index c153be07f..4ebc5a081 100644
--- a/docs/tutorials/wiki2/src/models/tutorial/static/pylons.css
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/pylons.css
@@ -4,34 +4,23 @@ body{line-height:1;}
 ol,ul{list-style:none;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
-/* remember to define focus styles! */
 :focus{outline:0;}
-/* remember to highlight inserts somehow! */
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
-/* tables still need 'cellspacing="0"' in the markup */
 table{border-collapse:collapse;border-spacing:0;}
-/* restyling */
 sub{vertical-align:sub;font-size:smaller;line-height:normal;}
 sup{vertical-align:super;font-size:smaller;line-height:normal;}
-/* lists */
 ul,menu,dir{display:block;list-style-type:disc;margin:1em 0;padding-left:40px;}
 ol{display:block;list-style-type:decimal-leading-zero;margin:1em 0;padding-left:40px;}
 li{display:list-item;}
-/* nested lists have no top/bottom margins */
 ul ul,ul ol,ul dir,ul menu,ul dl,ol ul,ol ol,ol dir,ol menu,ol dl,dir ul,dir ol,dir dir,dir menu,dir dl,menu ul,menu ol,menu dir,menu menu,menu dl,dl ul,dl ol,dl dir,dl menu,dl dl{margin-top:0;margin-bottom:0;}
-/* 2 deep unordered lists use a circle */
 ol ul,ul ul,menu ul,dir ul,ol menu,ul menu,menu menu,dir menu,ol dir,ul dir,menu dir,dir dir{list-style-type:circle;}
-/* 3 deep (or more) unordered lists use a square */
 ol ol ul,ol ul ul,ol menu ul,ol dir ul,ol ol menu,ol ul menu,ol menu menu,ol dir menu,ol ol dir,ol ul dir,ol menu dir,ol dir dir,ul ol ul,ul ul ul,ul menu ul,ul dir ul,ul ol menu,ul ul menu,ul menu menu,ul dir menu,ul ol dir,ul ul dir,ul menu dir,ul dir dir,menu ol ul,menu ul ul,menu menu ul,menu dir ul,menu ol menu,menu ul menu,menu menu menu,menu dir menu,menu ol dir,menu ul dir,menu menu dir,menu dir dir,dir ol ul,dir ul ul,dir menu ul,dir dir ul,dir ol menu,dir ul menu,dir menu menu,dir dir menu,dir ol dir,dir ul dir,dir menu dir,dir dir dir{list-style-type:square;}
 .hidden{display:none;}
 p{line-height:1.5em;}
-h1{font-size:1.75em;/* 28px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h2{font-size:1.5em;/* 24px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h3{font-size:1.25em;/* 20px */
-line-height:1.7em;font-family:helvetica,verdana;}
+h1{font-size:1.75em;line-height:1.7em;font-family:helvetica,verdana;}
+h2{font-size:1.5em;line-height:1.7em;font-family:helvetica,verdana;}
+h3{font-size:1.25em;line-height:1.7em;font-family:helvetica,verdana;}
 h4{font-size:1em;line-height:1.7em;font-family:helvetica,verdana;}
 html,body{width:100%;height:100%;}
 body{margin:0;padding:0;background-color:#ffffff;position:relative;font:16px/24px "Nobile","Lucida Grande",Lucida,Verdana,sans-serif;}
@@ -42,23 +31,25 @@ body h2,
 body h3,
 body h4,
 body h5,
-body h6{font-family:"Nobile","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#144fb2;font-style:normal;}
-#wrap {min-height: 100%;}
-#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;}
-#header{background-color:#e88f00;top:0;font-size:14px;}
-#footer{background-color:#000000;bottom:0;position: relative;margin-top:-40px;clear:both;}
-.header,.footer{width:700px;margin-right:auto;margin-left:auto;}
+body h6{font-family:"Neuton","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#373839;font-style:normal;}
+#wrap{min-height:100%;}
+#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;vertical-align:middle;}
+#header{background:#000000;top:0;font-size:14px;}
+#footer{bottom:0;background:#000000 url(footerbg.png) repeat-x 0 top;position:relative;margin-top:-40px;clear:both;}
+.header,.footer{width:750px;margin-right:auto;margin-left:auto;}
 .wrapper{width:100%}
 #top,#bottom{width:100%;}
-#top{color:#888;background-color:#eee;height:300px;border-bottom:2px solid #ddd;}
-#bottom{color:#222;background-color:#ffffff;overflow:hidden;padding-bottom:80px;}
-.top,.bottom{width:700px;margin-right:auto;margin-left:auto;}
-.top{padding-top:100px;}
+#top{color:#000000;height:230px;
+background:#ffffff url(headerbg.png) repeat-x 0 top;position:relative;}
+#bottom{color:#222;background-color:#ffffff;}
+.top,.middle,.bottom{width:750px;margin-right:auto;margin-left:auto;}
+.top{padding-top:40px;}
+#middle{width:100%;height:100px;background:url(middlebg.png) repeat-x;border-top:2px solid #ffffff;border-bottom:2px solid #b2b2b2;}
 .app-welcome{margin-top:25px;}
 .app-name{color:#000000;font-weight:bold;}
 .bottom{padding-top:50px;}
-#left{width:325px;float:left;padding-right:25px;}
-#right{width:325px;float:right;padding-left:25px;}
+#left{width:350px;float:left;padding-right:25px;}
+#right{width:350px;float:right;padding-left:25px;}
 .align-left{text-align:left;}
 .align-right{text-align:right;}
 .align-center{text-align:center;}
@@ -67,7 +58,7 @@ ul.links li{list-style-type:none;font-size:14px;}
 form{border-style:none;}
 fieldset{border-style:none;}
 input{color:#222;border:1px solid #ccc;font-family:sans-serif;font-size:12px;line-height:16px;}
-input[type=text]{}
+input[type=text],input[type=password]{width:205px;}
 input[type=submit]{background-color:#ddd;font-weight:bold;}
 /*Opera Fix*/
-body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}
+body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/models/tutorial/static/pyramid.png
new file mode 100644
index 000000000..347e05549
--- /dev/null
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/pyramid.png
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/models/tutorial/static/transparent.gif
new file mode 100644
index 000000000..0341802e5
--- /dev/null
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/transparent.gif
diff --git a/docs/tutorials/wiki2/src/models/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/models/tutorial/templates/mytemplate.pt
index 6ad23d44f..cac9ccaa7 100644
--- a/docs/tutorials/wiki2/src/models/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/models/tutorial/templates/mytemplate.pt
@@ -5,23 +5,23 @@
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 	<meta name="keywords" content="python web application" />
 	<meta name="description" content="pyramid web application" />
-	<link rel="shortcut icon" href="${request.application_url}/static/favicon.ico" />
-	<link rel="stylesheet" href="${request.application_url}/static/pylons.css" type="text/css" media="screen" charset="utf-8" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
 	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
-	<!--[if !IE 7]>
-	<style type="text/css">
-		#wrap {display:table;height:100%}
-	</style>
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
 	<![endif]-->
 </head>
 <body>
 	<div id="wrap">
-		<div id="header">
-			<div class="header">The Pyramid Web Application Development Framework</div>
-		</div>
 		<div id="top">
 			<div class="top align-center">
-				<img src="${request.application_url}/static/logo.png" width="300" height="80"/>
+				<div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-center">
 				<p class="app-welcome">
 					Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
 					the Pyramid web application development framework.
@@ -31,22 +31,19 @@
 		<div id="bottom">
 			<div class="bottom">
 				<div id="left" class="align-right">
-					<h3>Search Pyramid documentation</h3>
+					<h2>Search documentation</h2>
 					<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
 		      			<input type="text" id="q" name="q" value="" />
-		      			<input type="submit" id="x" value="Search" />
+		      			<input type="submit" id="x" value="Go" />
 		  			</form>
 				</div>
 				<div id="right" class="align-left">
-					<h3>Pyramid links</h3>
+					<h2>Pyramid links</h2>
 					<ul class="links">
 						<li>
 							<a href="http://pylonshq.com">Pylons Website</a>
 						</li>
 						<li>
-							<a href="http://docs.pylonshq.com/">The Pylons Project Documentation</a>
-						</li>
-						<li>
 							<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
 						</li>
 						<li>
@@ -73,7 +70,7 @@
 		</div>
 	</div>
 	<div id="footer">
-		<div class="footer">© Copyright 2008-2010, Agendaless Consulting.</div>
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
 	</div>
 </body>
 </html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/views/tutorial/static/footerbg.png
new file mode 100644
index 000000000..1fbc873da
--- /dev/null
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/footerbg.png
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/views/tutorial/static/headerbg.png
new file mode 100644
index 000000000..0596f2020
--- /dev/null
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/headerbg.png
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/views/tutorial/static/ie6.css
new file mode 100644
index 000000000..b7c8493d8
--- /dev/null
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/ie6.css
@@ -0,0 +1,8 @@
+* html img,
+* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
+this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
+this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
+this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
+);}
+#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/logo.png b/docs/tutorials/wiki2/src/views/tutorial/static/logo.png
deleted file mode 100644
index 88f5d9865..000000000
--- a/docs/tutorials/wiki2/src/views/tutorial/static/logo.png
+++ /dev/null
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/views/tutorial/static/middlebg.png
new file mode 100644
index 000000000..2369cfb7d
--- /dev/null
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/middlebg.png
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/views/tutorial/static/pylons.css
index c153be07f..4ebc5a081 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/static/pylons.css
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/pylons.css
@@ -4,34 +4,23 @@ body{line-height:1;}
 ol,ul{list-style:none;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
-/* remember to define focus styles! */
 :focus{outline:0;}
-/* remember to highlight inserts somehow! */
 ins{text-decoration:none;}
 del{text-decoration:line-through;}
-/* tables still need 'cellspacing="0"' in the markup */
 table{border-collapse:collapse;border-spacing:0;}
-/* restyling */
 sub{vertical-align:sub;font-size:smaller;line-height:normal;}
 sup{vertical-align:super;font-size:smaller;line-height:normal;}
-/* lists */
 ul,menu,dir{display:block;list-style-type:disc;margin:1em 0;padding-left:40px;}
 ol{display:block;list-style-type:decimal-leading-zero;margin:1em 0;padding-left:40px;}
 li{display:list-item;}
-/* nested lists have no top/bottom margins */
 ul ul,ul ol,ul dir,ul menu,ul dl,ol ul,ol ol,ol dir,ol menu,ol dl,dir ul,dir ol,dir dir,dir menu,dir dl,menu ul,menu ol,menu dir,menu menu,menu dl,dl ul,dl ol,dl dir,dl menu,dl dl{margin-top:0;margin-bottom:0;}
-/* 2 deep unordered lists use a circle */
 ol ul,ul ul,menu ul,dir ul,ol menu,ul menu,menu menu,dir menu,ol dir,ul dir,menu dir,dir dir{list-style-type:circle;}
-/* 3 deep (or more) unordered lists use a square */
 ol ol ul,ol ul ul,ol menu ul,ol dir ul,ol ol menu,ol ul menu,ol menu menu,ol dir menu,ol ol dir,ol ul dir,ol menu dir,ol dir dir,ul ol ul,ul ul ul,ul menu ul,ul dir ul,ul ol menu,ul ul menu,ul menu menu,ul dir menu,ul ol dir,ul ul dir,ul menu dir,ul dir dir,menu ol ul,menu ul ul,menu menu ul,menu dir ul,menu ol menu,menu ul menu,menu menu menu,menu dir menu,menu ol dir,menu ul dir,menu menu dir,menu dir dir,dir ol ul,dir ul ul,dir menu ul,dir dir ul,dir ol menu,dir ul menu,dir menu menu,dir dir menu,dir ol dir,dir ul dir,dir menu dir,dir dir dir{list-style-type:square;}
 .hidden{display:none;}
 p{line-height:1.5em;}
-h1{font-size:1.75em;/* 28px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h2{font-size:1.5em;/* 24px */
-line-height:1.7em;font-family:helvetica,verdana;}
-h3{font-size:1.25em;/* 20px */
-line-height:1.7em;font-family:helvetica,verdana;}
+h1{font-size:1.75em;line-height:1.7em;font-family:helvetica,verdana;}
+h2{font-size:1.5em;line-height:1.7em;font-family:helvetica,verdana;}
+h3{font-size:1.25em;line-height:1.7em;font-family:helvetica,verdana;}
 h4{font-size:1em;line-height:1.7em;font-family:helvetica,verdana;}
 html,body{width:100%;height:100%;}
 body{margin:0;padding:0;background-color:#ffffff;position:relative;font:16px/24px "Nobile","Lucida Grande",Lucida,Verdana,sans-serif;}
@@ -42,23 +31,25 @@ body h2,
 body h3,
 body h4,
 body h5,
-body h6{font-family:"Nobile","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#144fb2;font-style:normal;}
-#wrap {min-height: 100%;}
-#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;}
-#header{background-color:#e88f00;top:0;font-size:14px;}
-#footer{background-color:#000000;bottom:0;position: relative;margin-top:-40px;clear:both;}
-.header,.footer{width:700px;margin-right:auto;margin-left:auto;}
+body h6{font-family:"Neuton","Lucida Grande",Lucida,Verdana,sans-serif;font-weight:normal;color:#373839;font-style:normal;}
+#wrap{min-height:100%;}
+#header,#footer{width:100%;color:#ffffff;height:40px;position:absolute;text-align:center;line-height:40px;overflow:hidden;font-size:12px;vertical-align:middle;}
+#header{background:#000000;top:0;font-size:14px;}
+#footer{bottom:0;background:#000000 url(footerbg.png) repeat-x 0 top;position:relative;margin-top:-40px;clear:both;}
+.header,.footer{width:750px;margin-right:auto;margin-left:auto;}
 .wrapper{width:100%}
 #top,#bottom{width:100%;}
-#top{color:#888;background-color:#eee;height:300px;border-bottom:2px solid #ddd;}
-#bottom{color:#222;background-color:#ffffff;overflow:hidden;padding-bottom:80px;}
-.top,.bottom{width:700px;margin-right:auto;margin-left:auto;}
-.top{padding-top:100px;}
+#top{color:#000000;height:230px;
+background:#ffffff url(headerbg.png) repeat-x 0 top;position:relative;}
+#bottom{color:#222;background-color:#ffffff;}
+.top,.middle,.bottom{width:750px;margin-right:auto;margin-left:auto;}
+.top{padding-top:40px;}
+#middle{width:100%;height:100px;background:url(middlebg.png) repeat-x;border-top:2px solid #ffffff;border-bottom:2px solid #b2b2b2;}
 .app-welcome{margin-top:25px;}
 .app-name{color:#000000;font-weight:bold;}
 .bottom{padding-top:50px;}
-#left{width:325px;float:left;padding-right:25px;}
-#right{width:325px;float:right;padding-left:25px;}
+#left{width:350px;float:left;padding-right:25px;}
+#right{width:350px;float:right;padding-left:25px;}
 .align-left{text-align:left;}
 .align-right{text-align:right;}
 .align-center{text-align:center;}
@@ -67,7 +58,7 @@ ul.links li{list-style-type:none;font-size:14px;}
 form{border-style:none;}
 fieldset{border-style:none;}
 input{color:#222;border:1px solid #ccc;font-family:sans-serif;font-size:12px;line-height:16px;}
-input[type=text]{}
+input[type=text],input[type=password]{width:205px;}
 input[type=submit]{background-color:#ddd;font-weight:bold;}
 /*Opera Fix*/
-body:before {content:"";height:100%;float:left;width:0;margin-top:-32767px;}
+body:before{content:"";height:100%;float:left;width:0;margin-top:-32767px;}
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/views/tutorial/static/pyramid.png
new file mode 100644
index 000000000..347e05549
--- /dev/null
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/pyramid.png
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/style.css b/docs/tutorials/wiki2/src/views/tutorial/static/style.css
deleted file mode 100644
index cad87e0d4..000000000
--- a/docs/tutorials/wiki2/src/views/tutorial/static/style.css
+++ /dev/null
@@ -1,109 +0,0 @@
-html, body {
-  color: black;
-  background-color: #ddd;
-  font: x-small "Lucida Grande", "Lucida Sans Unicode", geneva, sans-serif;
-  margin: 0;
-  padding: 0;
-}
-
-td, th {padding:3px;border:none;}
-tr th {text-align:left;background-color:#f0f0f0;color:#333;}
-tr.odd td {background-color:#edf3fe;}
-tr.even td {background-color:#fff;}
-
-#header {
-  height: 80px;
-  width: 777px;
-  background: blue URL('../images/header_inner.png') no-repeat;
-  border-left: 1px solid #aaa;
-  border-right: 1px solid #aaa;
-  margin: 0 auto 0 auto;
-}
-
-a.link, a, a.active {
-  color: #369;
-}
-
-
-#main_content {
-  color: black;
-  font-size: 127%;
-  background-color: white;
-  width: 757px;
-  margin: 0 auto 0 auto;
-  border-left: 1px solid #aaa;
-  border-right: 1px solid #aaa;
-  padding: 10px;
-}
-
-#sidebar {
-  border: 1px solid #aaa;
-  background-color: #eee;
-  margin: 0.5em;
-  padding: 1em;
-  float: right;
-  width: 200px;
-  font-size: 88%;
-}
-
-#sidebar h2 {
-  margin-top: 0;
-}
-
-#sidebar ul {
-  margin-left: 1.5em;
-  padding-left: 0;
-}
-
-h1,h2,h3,h4,h5,h6,#getting_started_steps {
-  font-family: "Century Schoolbook L", Georgia, serif;
-  font-weight: bold;
-}
-
-h2 {
-  font-size: 150%;
-}
-
-#footer {
-  border: 1px solid #aaa;
-  border-top: 0px none;
-  color: #999;
-  background-color: white;
-  padding: 10px;
-  font-size: 80%;
-  text-align: center;
-  width: 757px;
-  margin: 0 auto 1em auto;
-}
-
-.code {
-  font-family: monospace;
-}
-
-span.code {
-  font-weight: bold;
-  background: #eee;
-}
-
-#status_block {
-  margin: 0 auto 0.5em auto;
-  padding: 15px 10px 15px 55px;
-  background: #cec URL('../images/ok.png') left center no-repeat;
-  border: 1px solid #9c9;
-  width: 450px;
-  font-size: 120%;
-  font-weight: bolder;
-}
-
-.notice {
-  margin: 0.5em auto 0.5em auto;
-  padding: 15px 10px 15px 55px;
-  width: 450px;
-  background: #eef URL('../images/info.png') left center no-repeat;
-  border: 1px solid #cce;
-}
-
-.fielderror {
-    color: red;
-    font-weight: bold;
-}
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/views/tutorial/static/transparent.gif
new file mode 100644
index 000000000..0341802e5
--- /dev/null
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/transparent.gif
diff --git a/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt b/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt
index 047a64eb3..ae4c0c64d 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt
@@ -1,32 +1,47 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-    <title>Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki) 
-           Editing: ${page.name}</title>
-        <link rel="stylesheet" type="text/css"
-          href="${request.application_url}/static/style.css" />
+	<title>${page.name} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<div class="main_content">
-  <div style="float:right; width: 10em;"> Viewing
-    <span tal:replace="page.name">Page Name Goes Here</span> <br/>
-    You can return to the <a href="${request.application_url}"
-       >FrontPage</a>.
-  </div>  
-
-  <div>
-    <form action="${save_url}" method="post">
-      <textarea name="body" tal:content="page.data" rows="10" cols="60"/>
-      <input type="submit" name="form.submitted" value="Save"/>
-    </form>
-  </div>
-</div>  
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					Editing <b><span tal:replace="page.name">Page Name Goes Here</span></b><br/>
+					You can return to the <a href="${request.application_url}">FrontPage</a>.<br/>
+				</div>
+				<div id="right" class="app-welcome align-right"></div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<form action="${save_url}" method="post">
+      				<textarea name="body" tal:content="page.data" rows="10" cols="60"/><br/>
+      				<input type="submit" name="form.submitted" value="Save"/>
+    			</form>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
 </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/views/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/views/tutorial/templates/mytemplate.pt
index 6ad23d44f..cac9ccaa7 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/views/tutorial/templates/mytemplate.pt
@@ -5,23 +5,23 @@
 	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 	<meta name="keywords" content="python web application" />
 	<meta name="description" content="pyramid web application" />
-	<link rel="shortcut icon" href="${request.application_url}/static/favicon.ico" />
-	<link rel="stylesheet" href="${request.application_url}/static/pylons.css" type="text/css" media="screen" charset="utf-8" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
 	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
-	<!--[if !IE 7]>
-	<style type="text/css">
-		#wrap {display:table;height:100%}
-	</style>
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
 	<![endif]-->
 </head>
 <body>
 	<div id="wrap">
-		<div id="header">
-			<div class="header">The Pyramid Web Application Development Framework</div>
-		</div>
 		<div id="top">
 			<div class="top align-center">
-				<img src="${request.application_url}/static/logo.png" width="300" height="80"/>
+				<div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-center">
 				<p class="app-welcome">
 					Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
 					the Pyramid web application development framework.
@@ -31,22 +31,19 @@
 		<div id="bottom">
 			<div class="bottom">
 				<div id="left" class="align-right">
-					<h3>Search Pyramid documentation</h3>
+					<h2>Search documentation</h2>
 					<form method="get" action="http://docs.pylonshq.com/pyramid/dev/search.html">
 		      			<input type="text" id="q" name="q" value="" />
-		      			<input type="submit" id="x" value="Search" />
+		      			<input type="submit" id="x" value="Go" />
 		  			</form>
 				</div>
 				<div id="right" class="align-left">
-					<h3>Pyramid links</h3>
+					<h2>Pyramid links</h2>
 					<ul class="links">
 						<li>
 							<a href="http://pylonshq.com">Pylons Website</a>
 						</li>
 						<li>
-							<a href="http://docs.pylonshq.com/">The Pylons Project Documentation</a>
-						</li>
-						<li>
 							<a href="http://docs.pylonshq.com/pyramid/dev/#narrative-documentation">Narrative Documentation</a>
 						</li>
 						<li>
@@ -73,7 +70,7 @@
 		</div>
 	</div>
 	<div id="footer">
-		<div class="footer">© Copyright 2008-2010, Agendaless Consulting.</div>
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
 	</div>
 </body>
 </html>
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt b/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
index 86fcc914e..6761c8cf6 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
@@ -1,28 +1,51 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html
-    xmlns="http://www.w3.org/1999/xhtml"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
 <head>
-    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
-    <title>${page.name} - Pyramid tutorial wiki 
-            (based on TurboGears 20-Minute Wiki)</title>
-        <link rel="stylesheet" type="text/css"
-          href="${request.application_url}/static/style.css" />
+	<title>${page.name} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)</title>
+	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+	<meta name="keywords" content="python web application" />
+	<meta name="description" content="pyramid web application" />
+	<link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Neuton&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Nobile:regular,italic,bold,bolditalic&amp;subset=latin" type="text/css" media="screen" charset="utf-8" />
+	<!--[if lte IE 6]>
+	<link rel="stylesheet" href="${request.static_url('tutorial:static/ie6.css')}" type="text/css" media="screen" charset="utf-8" />
+	<![endif]-->
 </head>
-
 <body>
-
-<div class="main_content">
-<div style="float:right; width: 10em;"> Viewing
-<span tal:replace="page.name">Page Name Goes Here</span> <br/>
-You can return to the <a href="${request.application_url}">FrontPage</a>.
-</div>
-
-<div tal:replace="structure content">Page text goes here.</div>
-<p><a tal:attributes="href edit_url" href="">Edit this page</a></p>
-</div>
-
+	<div id="wrap">
+		<div id="top">
+			<div class="top align-center">
+				<div>
+					<img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid" />
+				</div>
+			</div>
+		</div>
+		<div id="middle">
+			<div class="middle align-right">
+				<div id="left" class="app-welcome align-left">
+					Viewing <b><span tal:replace="page.name">Page Name Goes Here</span></b><br/>
+					You can return to the <a href="${request.application_url}">FrontPage</a>.<br/>
+				</div>
+				<div id="right" class="app-welcome align-right"></div>
+			</div>
+		</div>
+		<div id="bottom">
+			<div class="bottom">
+				<div tal:replace="structure content">
+					Page text goes here.
+				</div>
+				<p>
+					<a tal:attributes="href edit_url" href="">
+						Edit this page
+					</a>
+				</p>
+			</div>
+		</div>
+	</div>
+	<div id="footer">
+		<div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
+	</div>
 </body>
-</html>
+</html>
\ No newline at end of file