8 files changed, 252 insertions, 429 deletions

diff --git a/css/_toc.css b/css/_toc.css
index fcccf4fc1..5bff9f648 100755
--- a/css/_toc.css
+++ b/css/_toc.css
@@ -9,14 +9,18 @@
 /* toc container */
 .dokuwiki div.toc {
     float: right;
-    margin: 0 0 1.4em 1.4em;
-    width: 12em;
+    margin:  -0.3em 0 .5em 1.4em;
+    /* @todo: possible to make calculation sort of automatic? */
+    width: 200px; /* __sidebar_width__ - margin-left */
+    margin-left: 20px;
+    /*width: 12em;*/
+    font-size: 0.75em;
 }
 
 /*____________ toc header ____________*/
 
 .dokuwiki div.tocheader {
-    padding: .2em .5em;
+    padding: 0.5em 1em;
     margin-bottom: .2em;
     font-weight: bold;
     background-color: __background_alt__;
@@ -47,16 +51,16 @@
 /*____________ toc list ____________*/
 
 .dokuwiki #toc__inside {
-    padding: .2em .5em;
+    padding: 0.75em 1em 1.5em;
     background-color: __background_alt__;
     color: __text__;
 }
 .dokuwiki #toc__inside ul {
-    padding: 0;
+    padding: 0 0 0 1.5em;
     margin: 0;
 }
 .dokuwiki #toc__inside ul li {
-    list-style: none;
+    list-style: disc;
     padding: 0;
     margin: 0;
 }
diff --git a/css/basic.css b/css/basic.css
index ef209d54a..fc0b99efc 100755
--- a/css/basic.css
+++ b/css/basic.css
@@ -19,7 +19,7 @@ html, body {
     padding: 0;
 }
 body {
-    font: normal 100%/1.4 Frutiger, "Frutiger Linotype", Univers, Calibri, Myriad, "Liberation Sans", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
+    font: normal 87.5%/1.4 Arial, sans-serif;
     /* default font size: 100% => 16px; 93.75% => 15px; 87.5% => 14px; 81.25% => 13px; 75% => 12px */
 }
 
@@ -28,15 +28,22 @@ body {
 
 h1, h2, h3, h4, h5, h6,
 caption, legend {
-    font-family: Constantia, Utopia, Lucidabright, Lucida, Georgia, serif;
-    font-weight: bold;
-    color: __text_neu__;
+    font-family: Arial, sans-serif;
+    font-weight: normal;
+    color: #000;/* @todo: style.ini */
     background-color: inherit;
     padding: 0;
     clear: left; /* ideally 'both', but problems with toc */
 }
 
-h1 { font-size: 2.25em;  margin: 0 0 0.444em; }
+h1 {
+    font-size: 2em;
+    margin: 0 0 0.444em;
+    letter-spacing: -0.035em;
+    /*2 lines below makes ascenders of h1 be at the top of block*/
+    line-height: 0.75;
+    padding-bottom: 0.3em;
+}
 h2 { font-size: 1.5em;   margin: 0 0 0.666em; }
 h3 { font-size: 1.125em; margin: 0 0 0.888em; }
 h4 { font-size: 1em;     margin: 0 0 1.0em; }
@@ -243,6 +250,34 @@ input[readonly], button[readonly] {
 optgroup { font-style: italic; font-weight: bold; }
 option   { font-style: normal; font-weight: normal; }
 
+/* @todo: either make input.edit and buttons more generic or put into design.css */
+.dokuwiki input.edit {
+    border: 1px solid __border__;
+    padding: 0.41em 0;
+    -moz-box-shadow: inset 0 0 1px __background_alt__;
+    -webkit-box-shadow: inset 0 0 1px __background_alt__;
+    box-shadow: inset 0 0 1px __background_alt__;
+    border-radius: 2px;
+    vertical-align: middle;
+}
+.dokuwiki input.button,
+.dokuwiki button.button,
+.dokuwiki div.toolbar button.toolbutton {
+    /* @todo: make style.ini colours any sense here? */
+    vertical-align: middle;
+    color: inherit;
+    background-color: #eee;
+    background: -moz-linear-gradient(top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(30%,#f4f4f4), color-stop(99%,#eeeeee), color-stop(99%,#cccccc));
+    background: -webkit-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
+    background: -o-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
+    background: -ms-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cccccc',GradientType=0 );
+    background: linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
+    border: 1px solid #ccc;
+    border-radius: 2px;
+}
+
 
 /*____________ general classes ____________*/
 
diff --git a/css/content.css b/css/content.css
index 57c313d6c..60b1d6771 100755
--- a/css/content.css
+++ b/css/content.css
@@ -3,6 +3,7 @@
  *
  * @author Anika Henke <anika@selfthinker.org>
  * @author Andreas Gohr <andi@splitbrain.org>
+ * @author Clarence Lee <spicynoodles@gmail.com>
  */
 
 
@@ -35,14 +36,15 @@
 
 .dokuwiki table.inline {
     min-width: 50%;
+    border-width: 0;
 }
 .dokuwiki table.inline th,
 .dokuwiki table.inline td {
-    border: 1px solid __text_alt__;
+    border: 1px solid __border__;
 }
 .dokuwiki table.inline th {
     color: inherit;
-    background-color: __background_neu__;
+    background-color: __background_alt__;
 }
 .dokuwiki table.inline td {
 }
@@ -70,7 +72,7 @@
 }
 .dokuwiki pre {
     border: 1px solid __border__;
-    padding: 0 .2em;
+    padding: .75em 1em;
 }
 /* for code in <file> */
 .dokuwiki pre.file {
@@ -84,19 +86,28 @@
 .dokuwiki dl.code dt,
 .dokuwiki dl.file dt {
     background-color: __background_alt__;
-    border: solid __border__;
-    border-width: 1px 1px 0;
+    /* @todo: add gradients for other browsers */
+    background: -webkit-linear-gradient(top, __background__ 0%, __background_alt__ 100%);
     color: inherit;
-    display: inline;
-    padding: 0 .5em;
-    margin-left: 1em;
+    border: 1px solid __border__;
+    border-bottom-color: __background_alt__;
+    border-top-left-radius: .3em;
+    border-top-right-radius: .3em;
+    padding: .3em .6em .1em;
+    margin-bottom: -1px;
+    float: left;
 }
 .dokuwiki dl.code dt a,
 .dokuwiki dl.file dt a {
+    background-color: transparent;
+    /* @todo: those 19px should better be in exe/css.php for all media icons */
+    padding: 0.2em 0 0.1em 19px;
+    font-size: 0.875em;
+    font-weight: normal;
 }
-
 .dokuwiki dl.code dd,
 .dokuwiki dl.file dd {
     margin: 0;
+    clear: left;
 }
 
diff --git a/css/default.css b/css/default.css
index 005a77918..8d42d733b 100644
--- a/css/default.css
+++ b/css/default.css
@@ -1,132 +1,16 @@
-body{
-  font: 0.875em/1.4 'Arial', sans-serif;
-}
-
-h1, h2, h3, h4, h5{
-  font-family: 'Arial', sans-serif;
-  font-weight: normal;
-  color: black;
-}
-
-h1{
-  font-size: 2em;
-  letter-spacing: -0.035em;
-}
-
-h1{
-  /*2 lines below makes ascenders of h1 be at the top of block*/
-  line-height: 0.75em;
-  padding-bottom: 0.3em;
-}
 
-table{
-  border: none;
-}
+/*____________ basic ____________*/
 
 a:link{
   color: #06d;
 }
-
 a:visited{
   color: #2E5E94;
   border-bottom: 1px dotted #09d;
 }
 
-.button{
-  background-color: #eee;
-  background: -moz-linear-gradient(top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(30%,#f4f4f4), color-stop(99%,#eeeeee), color-stop(99%,#cccccc));
-  background: -webkit-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
-  background: -o-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
-  background: -ms-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cccccc',GradientType=0 );
-  background: linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
-  border: 1px solid #ccc;
-}
-
-.dokuwiki pre{
-  padding: 0.75em 1em;
-}
-
-#dokuwiki__site{
-  max-width: 1024px;
-  padding: 1.4em 20px; /* don't like mixing units, but with max-width set in px, I don't have another solution? */
-}
-
-#dokuwiki__header{
-  padding-top: 2em;
-  padding-bottom: 2em;
-  background: #eee;
-}
-
-#dokuwiki__header #dokuwiki__sitetools,
-#dokuwiki__header .headings{
-  z-index: 12;
-  position: relative;
-}
-
-.header_background{
-  background: #eee;
-  background: -webkit-linear-gradient(top, #eeeeee 98%,#dfdfdf 100%);
-  position: absolute;
-  top: 0;
-  height: 165px;
-  width: 100%;
-  z-index: 1;
-}
-
-#dokuwiki__header .tools{
-  text-align: left;
-}
-
-#dokuwiki__header .tools,
-#dokuwiki__header .headings{
-  margin-bottom: 1em;
-}
-
-#dokuwiki__header h1 a{
-  font-size: 1.5em;
-  font-weight: bold;
-  text-shadow: 1px 1px 0px #fff;
-}
-
-#dokuwiki__header h1 a{
-  color: black;
-}
-
-#dokuwiki__header .claim{
-  color: #888;
-  font-style: italic;
-  font-size: 0.875em;
-}
-
-#dokuwiki__header form.search{
-  margin-top: 0;
-  font-size: 0.875em;
-}
 
-.wrapper{
-  padding-top: 30px;
-}
-
-.wrapper div.breadcrumbs{
-  /*border: 1px solid #ccc;*/
-  border-left: 0;
-  border-right: 0;
-  border-bottom: 0;
-  padding: 0.2em 0 0.75em 0;
-  margin-bottom: 0.6em;
-  font-size: 0.875em;
-}
-
-div.breadcrumbs .bcsep{
-  font-size: 0.75em;
-}
-
-.mode_show #dokuwiki__content{
-  float: right;
-  width: 99%; /* 99% of what? */
-}
+/*____________ content ____________*/
 
 .mode_show #dokuwiki__content h1{
   line-height: 1.175em;
@@ -134,9 +18,8 @@ div.breadcrumbs .bcsep{
 
 .mode_show #dokuwiki__aside{
   /*border-top: 1px solid #ccc;*/
-  float: left;
-  width: 220px;
   font-size: 0.87em;
+  /* @todo: is 1.5 intentional? shouldn't it be less? */
   line-height: 1.5;
 }
 
@@ -150,208 +33,17 @@ div.breadcrumbs .bcsep{
 }
 
 
-#dokuwiki__usertools,
-#dokuwiki__pagetools{
-  padding: 10px;
-  padding-left: 0;
-  padding-right: 0;
-  background: #eee;
-  border: none;
-}
+/*____________ _edit ____________*/
 
-#dokuwiki__usertools{
-  padding: 0;
-  z-index: 11;
-  background: transparent;
+.dokuwiki .secedit {
+    float: none;
+    margin: 0 0 1.4em 0;
+    text-align: right;
 }
-
-#dokuwiki__usertools .inner{
-  margin: 0 auto;
-  border-bottom-left-radius: 4px;
-  border-bottom-right-radius: 4px;
-  background: #ffffff;
-  background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f2f2f2));
-  background: -webkit-linear-gradient(top, #ffffff 0%,#f2f2f2 100%);
-  background: -o-linear-gradient(top, #ffffff 0%,#f2f2f2 100%);
-  background: -ms-linear-gradient(top, #ffffff 0%,#f2f2f2 100%);
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 );
-  background: linear-gradient(top, #ffffff 0%,#f2f2f2 100%);
-  width: 1004px;
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-top: none;
+.dokuwiki div.secedit {
 }
-
-.wrapper #dokuwiki__pagetools ul, /* making a mess :P */
-.tools #dokuwiki__usertools ul{
-  padding: 0 20px;
+.dokuwiki .secedit input.button {
+    padding: 0.5em 0.9em;
+    color: #555;
 }
 
-#dokuwiki__pagetools{
-  background: #dbdfe0;
-  background: -moz-linear-gradient(top, #dbdfe0 0%, #eaeaea 12%, #edf1f2 100%);
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dbdfe0), color-stop(12%,#eaeaea), color-stop(100%,#edf1f2));
-  background: -webkit-linear-gradient(top, #dbdfe0 0%,#eaeaea 12%,#edf1f2 100%);
-  background: -o-linear-gradient(top, #dbdfe0 0%,#eaeaea 12%,#edf1f2 100%);
-  background: -ms-linear-gradient(top, #dbdfe0 0%,#eaeaea 12%,#edf1f2 100%);
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dbdfe0', endColorstr='#edf1f2',GradientType=0 );
-  background: linear-gradient(top, #dbdfe0 0%,#eaeaea 12%,#edf1f2 100%);
-}
-
-#dokuwiki__sitetools{
-  width: 220px;
-}
-
-#dokuwiki__sitetools ul,
-#dokuwiki__usertools ul,
-#dokuwiki__pagetools ul{
-  max-width: 1004px;
-  font-size: 0.875em;
-  padding-left: 0;
-}
-
-#dokuwiki__sitetools li,
-#dokuwiki__usertools li,
-#dokuwiki__pagetools li{
-  margin-left: 1em;
-}
-
-#dokuwiki__sitetools ul{
-  margin-top: 0.5em;
-}
-
-#dokuwiki__header form.search #qsearch__in{
-  border: 1px solid #ccc;
-  border-right: none;
-  padding: 0.41em 0;
-  margin-right: 0;
-  -webkit-border-bottom-left-radius: 2px;
-  -webkit-border-top-left-radius: 2px;
-  -moz-border-radius-bottomleft: 2px;
-  -moz-border-radius-topleft: 2px;
-  border-bottom-left-radius: 2px;
-  border-top-left-radius: 2px;
-  -moz-box-shadow:inset 0 0 1px #eee;
-  -webkit-box-shadow:inset 0 0 1px #eee;
-  box-shadow:inset 0 0 1px #eee;
-}
-
-#dokuwiki__header #dokuwiki__sitetools ul,
-#dokuwiki__header form.search{
-  text-align: right;
-}
-
-#dokuwiki__sitetools .button{
-  border: 1px solid #ddd;
-  -webkit-border-bottom-right-radius: 2px;
-  -webkit-border-top-right-radius: 2px;
-  -moz-border-radius-bottomright: 2px;
-  -moz-border-radius-topright: 2px;
-  border-bottom-right-radius: 2px;
-  border-top-right-radius: 2px;
-  padding: 0.5em 0.75em;
-}
-
-#dokuwiki__pagetools a,
-#dokuwiki__usertools a{
-}
-
-#dokuwiki__pagetools a.wikilink1,
-#dokuwiki__pagetools a.wikilink2,
-#dokuwiki__usertools a.wikilink1,
-#dokuwiki__usertools a.wikilink2{
-  color: #06d;
-}
-
-.dokuwiki div.toc{
-  font-size: 0.75em;
-  line-height: 1.4em;
-  width: 200px;
-  margin-bottom: 0.5em;
-  margin-left: 20px;
-  margin-top: -0.3em;
-}
-
-.dokuwiki div.tocheader{
-  padding: 0.5em 1em;
-}
-
-.dokuwiki #toc__inside{
-  padding: 0.75em 1em 1.5em;
-}
-
-.dokuwiki #toc__inside ul li{
-  list-style: disc;
-  margin-left: 1.5em;
-}
-
-.dokuwiki .secedit{
-  float: none;
-  margin: 0 0 1.4em 0;
-  text-align: right;
-}
-
-.dokuwiki div.secedit{
-}
-
-.dokuwiki .secedit input.button{
-  -webkit-border-bottom-right-radius: 4px;
-  -webkit-border-bottom-left-radius: 4px;
-  -moz-border-radius-bottomright: 4px;
-  -moz-border-radius-bottomleft: 4px;
-  border-bottom-right-radius: 4px;
-  border-bottom-left-radius: 4px;
-  border-radius: 2px;
-  padding: 0.5em 0.9em;
-  color: #555;
-}
-
-.dokuwiki dl.code dt, .dokuwiki dl.file dt{
-  padding: 5px 8px 2px;
-  border-top-left-radius: 4px;
-  border-top-right-radius: 4px;
-  border-bottom: 1px dashed #ccc;
-  background: -webkit-linear-gradient(top, #ffffff 0%,#eeeeee 100%);
-  margin-left: 0;
-}
-
-.dokuwiki dl.code dt, .dokuwiki dl.file dt a{
-  background-color: transparent;
-  padding: 0.2em 0 0.1em 1.6em;
-  font-size: 0.875em;
-  font-weight: normal;
-}
-
-.dokuwiki table.inline th, .dokuwiki table.inline td{
-  border: 1px solid #ccc;
-}
-
-.dokuwiki table.inline th{
-  background: #eee;
-}
-
-.dokuwiki div.toolbar button.toolbutton{
-  background: none;
-  background-color: #eee;
-  background: -moz-linear-gradient(top, #ffffff 0%, #f4f4f4 30%, #eeeeee 99%, #cccccc 99%);
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(30%,#f4f4f4), color-stop(99%,#eeeeee), color-stop(99%,#cccccc));
-  background: -webkit-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
-  background: -o-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
-  background: -ms-linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cccccc',GradientType=0 );
-  background: linear-gradient(top, #ffffff 0%,#f4f4f4 30%,#eeeeee 99%,#cccccc 99%);
-  border: 1px solid #ccc;
-  border-right: none;
-}
-
-.dokuwiki div.toolbar button.toolbutton:first-child{
-  border-top-left-radius: 4px;
-  border-bottom-left-radius: 4px;
-}
-
-.dokuwiki div.toolbar button.toolbutton:last-child{
-  border-left: 1px solid #eee;
-  border-top-right-radius: 4px;
-  border-bottom-right-radius: 4px;
-}
diff --git a/css/design.css b/css/design.css
index cfed4f078..751631afc 100755
--- a/css/design.css
+++ b/css/design.css
@@ -4,6 +4,7 @@
  *
  * @author Anika Henke <anika@selfthinker.org>
  * @author Andreas Gohr <andi@splitbrain.org>
+ * @author Clarence Lee <spicynoodles@gmail.com>
  */
 
 
@@ -11,34 +12,42 @@
 ********************************************************************/
 
 #dokuwiki__header {
-    margin: 1em 0 0;
+    padding: 4em 0 2em;
+    background-color: __background_alt__;
+    /* @todo: add gradients for other browsers */
+    background: -webkit-linear-gradient(top, __background_alt__ 98%, __background_neu__ 100%);
 }
 #IE7 #dokuwiki__header {
-    margin-top: 2em;
+}
+#dokuwiki__header .pad {
+    padding: 0 1em; /* @pad */
 }
 
 #dokuwiki__header .headings {
-    margin-bottom: 2.1em;
+    margin-bottom: 1em;
 }
 #dokuwiki__header h1 {
     margin-bottom: 0;
-    font-size: 1.5em;
+    font-size: 2.25em;
+    font-weight: bold;
+    text-shadow: 1px 1px 0px #fff;
 }
 #dokuwiki__header h1 a {
     text-decoration: none;
-    color: #00c;
+    /* @todo: style.ini */
+    color: #000;
     background-color: inherit;
 }
 #dokuwiki__header p.claim {
     margin-bottom: 0;
-}
-#dokuwiki__header h2 {
-    margin-bottom: 0;
-    font-size: 1.125em;
+    /* @todo: style.ini */
+    color: #888;
+    font-style: italic;
+    font-size: 0.875em;
 }
 
 #dokuwiki__header .tools {
-    margin-bottom: 2.1em;
+    margin-bottom: 1em;
 }
 #dokuwiki__header .tools ul {
     margin-bottom: 0;
@@ -47,44 +56,10 @@
     display: inline;
 }
 
-#dokuwiki__header form.search {
-    margin: .5em 0 0;
-    display: block;
-}
-#dokuwiki__header form.search #qsearch__in {
-    width: 12em;
-    margin-right: .5em;
-}
-
-#dokuwiki__header div.breadcrumbs {
-    margin-bottom: .3em;
-}
-#dokuwiki__header div.breadcrumbs a {
-    color: __existing__;
-    background-color: inherit;
-}
-
 
 /* tools
 ********************************************************************/
 
-/* make wiki links look the same as tool links in tool bars */
-#dokuwiki__usertools a.wikilink1,
-#dokuwiki__pagetools a.wikilink1,
-#dokuwiki__usertools a.wikilink2,
-#dokuwiki__pagetools a.wikilink2 {
-    color: #00c;
-    border-bottom-width: 0;
-}
-#dokuwiki__usertools a.wikilink2:hover,
-#dokuwiki__pagetools a.wikilink2:hover,
-#dokuwiki__usertools a.wikilink2:active,
-#dokuwiki__pagetools a.wikilink2:active,
-#dokuwiki__usertools a.wikilink2:focus,
-#dokuwiki__pagetools a.wikilink2:focus {
-    text-decoration: underline;
-}
-
 /* highlight selected tool */
 .mode_admin a.action.admin,
 .mode_login a.action.login,
@@ -98,29 +73,62 @@
     font-weight: bold;
 }
 
+#dokuwiki__usertools ul,
+#dokuwiki__sitetools ul,
+#dokuwiki__pagetools ul {
+    padding-left: 0;
+}
+#dokuwiki__usertools ul li,
+#dokuwiki__sitetools ul li,
+#dokuwiki__pagetools ul li {
+    font-size: 0.875em;
+    margin-left: 1em;
+}
+#dokuwiki__usertools ul li,
+#dokuwiki__pagetools ul li {
+    margin-top: .7em;
+    margin-bottom: .7em;
+    float: left;
+    list-style: none;
+}
+
 /*____________ user tools ____________*/
 
 #dokuwiki__usertools {
     position: absolute;
     top: 0;
-    right: 0;
-    border-bottom: 1px solid __border__;
-    background-color: __background_alt__;
+    left: 0;
+    text-align: left;
     width: 100%;
 }
-#dokuwiki__usertools ul,
-#dokuwiki__pagetools ul {
-    /* imitate #dokuwiki__site */
+#dokuwiki__usertools ul {
+    /* @todo: style.ini colours for gradients? */
+    background-color: __background__;
+    background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f2f2f2));
+    background: -webkit-linear-gradient(top, #ffffff 0%,#f2f2f2 100%);
+    background: -o-linear-gradient(top, #ffffff 0%,#f2f2f2 100%);
+    background: -ms-linear-gradient(top, #ffffff 0%,#f2f2f2 100%);
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 );
+    background: linear-gradient(top, #ffffff 0%,#f2f2f2 100%);
+    border: solid __background_neu__;
+    border-width: 0 1px 1px;
+    border-bottom-left-radius: .3em;
+    border-bottom-right-radius: .3em;
     margin: 0 auto;
-    max-width: 64em;
-    padding: 0 1em;
+    padding: 0;
+    max-width: __site_width__;
+    overflow: hidden;
 }
 #IE6 #dokuwiki__usertools ul {
     width: 100%;
 }
-#dokuwiki__usertools ul li.user {
+#dokuwiki__usertools ul li {
+    margin: .7em 0 .7em 1em;
     float: left;
-    margin-left: 0;
+    list-style: none;
+}
+#dokuwiki__usertools ul li.user {
 }
 
 /*____________ page tools ____________*/
@@ -129,32 +137,68 @@
     position: fixed;
     bottom: 0;
     left: 0;
-    border-top: 1px solid __border__;
-    background-color: __background_alt__;
     width: 100%;
     z-index: 10;
+    background: #dbdfe0;
+    background: -moz-linear-gradient(top, #dbdfe0 0%, #eaeaea 12%, #edf1f2 100%);
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dbdfe0), color-stop(12%,#eaeaea), color-stop(100%,#edf1f2));
+    background: -webkit-linear-gradient(top, #dbdfe0 0%,#eaeaea 12%,#edf1f2 100%);
+    background: -o-linear-gradient(top, #dbdfe0 0%,#eaeaea 12%,#edf1f2 100%);
+    background: -ms-linear-gradient(top, #dbdfe0 0%,#eaeaea 12%,#edf1f2 100%);
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dbdfe0', endColorstr='#edf1f2',GradientType=0 );
+    background: linear-gradient(top, #dbdfe0 0%,#eaeaea 12%,#edf1f2 100%);
 }
 #IE6 #dokuwiki__content {
     margin-bottom: 1.4em;
 }
-#dokuwiki__pagetools ul li {
-    display: inline;
-    margin: 0 1.5em 0 0;
+#dokuwiki__pagetools ul {
+    margin: 0 auto;
+    max-width: __site_width__;
+    padding: 0 1em; /* @pad */
 }
-#dokuwiki__pagetools ul li a.action.top {
-    float: right;
+#dokuwiki__pagetools ul li {
+    margin: .7em 1em .7em 0;
 }
-#IE6 #dokuwiki__pagetools ul,
-#IE7 #dokuwiki__pagetools ul {
+#dokuwiki__pagetools ul {
     position: relative;
 }
-#IE6 #dokuwiki__pagetools ul li a.action.top,
-#IE7 #dokuwiki__pagetools ul li a.action.top {
+#dokuwiki__pagetools ul li a.action.top {
     position: absolute;
-    top: 0;
+    top: .7em;
     right: 0;
 }
 
+/*____________ site tools ____________*/
+
+#dokuwiki__sitetools {
+    /* @todo: is the width still needed? */
+    width: __sidebar_width__;
+    text-align: right;
+}
+
+#dokuwiki__sitetools form.search {
+    display: block;
+    font-size: 0.875em;
+}
+#dokuwiki__sitetools form.search input.edit {
+    /* @todo: em doesn't fit with px value for sitetools div */
+    width: 12em;
+    border-right: none;
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0;
+}
+#dokuwiki__sitetools form.search input.button {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0;
+    padding: 0.5em 0.75em;
+}
+
+#dokuwiki__sitetools ul {
+    margin-top: 0.5em;
+}
+#dokuwiki__sitetools li {
+}
+
 
 /* sidebar
 ********************************************************************/
@@ -192,6 +236,23 @@
 .dokuwiki .page {
 }
 
+/*____________ breadcrumbs ____________*/
+
+.dokuwiki div.breadcrumbs {
+    /*border-top: 1px solid #ccc;*/
+    padding: 0.2em 0 0.75em 0;
+    margin-bottom: 0.6em;
+    font-size: 0.875em;
+}
+.dokuwiki div.breadcrumbs a {
+    /* @todo: wiki page colour or external link colour? */
+    color: __existing__;
+    background-color: inherit;
+}
+.dokuwiki div.breadcrumbs .bcsep {
+    font-size: 0.75em;
+}
+
 /*____________ misc ____________*/
 
 /* license note in footer and under edit window */
@@ -204,6 +265,20 @@
     line-height: 1.4;
 }
 
+.dokuwiki div.toolbar button.toolbutton {
+    border-radius: 0;
+    border-right-width: 0;
+}
+.dokuwiki div.toolbar button.toolbutton:first-child {
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+}
+.dokuwiki div.toolbar button.toolbutton:last-child {
+    border-right-width: 1px;
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+}
+
 /*____________ JS popup ____________*/
 
 .JSpopup {
diff --git a/css/structure.css b/css/structure.css
index 14490a0b0..638d882b4 100755
--- a/css/structure.css
+++ b/css/structure.css
@@ -8,16 +8,16 @@ body {
     margin: 0 auto;
 }
 #dokuwiki__site {
-    margin: 0 auto;
-    max-width: 64em;
-    padding: 1.4em 1em;
 }
 #dokuwiki__site .site {
 }
 
 #dokuwiki__header {
+    width: 100%;
 }
 #dokuwiki__header .pad {
+    margin: 0 auto;
+    max-width: __site_width__;
 }
     #dokuwiki__header .headings {
         float: left;
@@ -35,6 +35,9 @@ body {
 
 #dokuwiki__site .wrapper {
     position: relative;
+    margin: 0 auto;
+    max-width: __site_width__;
+    padding: 1.4em 1em; /* @pad */
 }
 #IE6 #dokuwiki__site .wrapper,
 #IE7 #dokuwiki__site .wrapper {
@@ -67,6 +70,9 @@ body {
 
 #dokuwiki__footer {
     clear: both;
+    margin: 0 auto;
+    max-width: __site_width__;
+    padding: 0 1em 2.4em; /* @pad */
 }
 #dokuwiki__footer .pad {
 }
diff --git a/main.php b/main.php
index 428a2f122..e0f03d7d5 100755
--- a/main.php
+++ b/main.php
@@ -56,23 +56,21 @@ $showTools = !tpl_getConf('hideTools') || ( tpl_getConf('hideTools') && $_SERVER
                 <!-- USER TOOLS -->
                 <?php if ($conf['useacl'] && $showTools): ?>
                     <div id="dokuwiki__usertools">
-                      <div class="inner">
-                          <h3 class="a11y"><?php echo tpl_getLang('user_tools') ?></h3>
-                          <ul>
-                              <?php /* the optional second parameter of tpl_action() switches between a link and a button,
-                                       e.g. a button inside a <li> would be: tpl_action('edit',0,'li') */
-                                  if ($_SERVER['REMOTE_USER']) {
-                                      echo '<li class="user">';
-                                      tpl_userinfo(); /* 'Logged in as ...' */
-                                      echo '</li>';
-                                  }
-                                  tpl_action('admin', 1, 'li');
-                                  tpl_action('profile', 1, 'li');
-                                  tpl_action('register', 1, 'li');
-                                  tpl_action('login', 1, 'li');
-                              ?>
-                          </ul>
-                        </div>
+                        <h3 class="a11y"><?php echo tpl_getLang('user_tools') ?></h3>
+                        <ul>
+                            <?php /* the optional second parameter of tpl_action() switches between a link and a button,
+                                     e.g. a button inside a <li> would be: tpl_action('edit',0,'li') */
+                                if ($_SERVER['REMOTE_USER']) {
+                                    echo '<li class="user">';
+                                    tpl_userinfo(); /* 'Logged in as ...' */
+                                    echo '</li>';
+                                }
+                                tpl_action('admin', 1, 'li');
+                                tpl_action('profile', 1, 'li');
+                                tpl_action('register', 1, 'li');
+                                tpl_action('login', 1, 'li');
+                            ?>
+                        </ul>
                     </div>
                 <?php endif ?>
 
@@ -89,7 +87,6 @@ $showTools = !tpl_getConf('hideTools') || ( tpl_getConf('hideTools') && $_SERVER
                 </div>
 
             </div>
-            <div class="clearer"></div>
 
             <div class="clearer"></div>
             <hr class="a11y" />
@@ -161,6 +158,5 @@ $showTools = !tpl_getConf('hideTools') || ( tpl_getConf('hideTools') && $_SERVER
 
     <div class="no"><?php tpl_indexerWebBug() /* provide DokuWiki housekeeping, required in all templates */ ?></div>
     <!--[if ( IE 6 | IE 7 | IE 8 ) ]></div><![endif]-->
-    <div class="header_background"></div>
 </body>
 </html>
diff --git a/style.ini b/style.ini
index 426fd9be4..0eeaf15d3 100755
--- a/style.ini
+++ b/style.ini
@@ -62,4 +62,8 @@ __missing__        = "#f30"
 __highlight__      = "#ff9"
 
 ; sidebar width
-__sidebar_width__       = "16em"
+; @todo: width in em or px?
+;__site_width__       = "64em"
+__site_width__       = "1000px"
+;__sidebar_width__       = "16em"
+__sidebar_width__       = "220px"