From 2f76c91b516fa9c04b6760a0e6c4037089119237 Mon Sep 17 00:00:00 2001
From: str4d <str4d@mail.i2p>
Date: Fri, 29 May 2015 14:03:20 +0000
Subject: [PATCH] Consistent CSS formatting

Via http://tools.maxcdn.com/process
---
 i2p2www/static/styles/duck/default.css     | 865 +++++++++++----------
 i2p2www/static/styles/duck/default.rtl.css |  20 +-
 i2p2www/static/styles/duck/desktop.css     | 794 ++++++++++++-------
 i2p2www/static/styles/duck/desktop.rtl.css | 137 ++--
 i2p2www/static/styles/duck/mobile.css      | 280 +++----
 5 files changed, 1173 insertions(+), 923 deletions(-)

diff --git a/i2p2www/static/styles/duck/default.css b/i2p2www/static/styles/duck/default.css
index 3a0619b6..d0163272 100644
--- a/i2p2www/static/styles/duck/default.css
+++ b/i2p2www/static/styles/duck/default.css
@@ -1,424 +1,441 @@
-@import url('reset.css');
-
-body {
-    font-family: Droid Sans, Helvetica, sans-serif;
-    font-size: 10px;
-    background-color: #ffffdd;
-    min-height:800px;
-    width:100%;
-    background:-moz-radial-gradient(50% 30% , circle , #fffff9, #ffffcc) no-repeat scroll 0 0 #ffffcc;
-    background:-webkit-radial-gradient(50% 30% , circle , #fffff9, #ffffcc) no-repeat scroll 0 0 #ffffcc;
-}
-
-a {
-    color:#d00e0e;
-    text-decoration:none;
-}
-
-a:hover {
-    color:#f00e0e;
-}
-
-div.hide {
-    display:none;
-}
-
-div#topbar {
-    width:80%;
-    /*margin:1em auto;*/
-    margin: 1em auto;
-    position:relative;
-}
-
-div#topbar #logo {
-    float: left;
-}
-
-div#topbar #logo img:hover {
-    filter:alpha(opacity=60);
-    -moz-opacity: 0.6;
-    opacity: 0.6;
-}
-
-nav {
-    clear: both;
-}
-
-div#content {
-    display:block;
-}
-
-/**
- * The .main class is for content wrapper on the home page (with the big banner)
- */
-div#content .main {
-    background:url('../../images/dots.png') 0 10% no-repeat rgba(171, 204, 113, 0.6);
-    background-size:100% auto;
-    width:auto;
-    padding:4em 10% 4em 10%;
-    position:relative;
-    margin:0 auto;
-    text-shadow:1px 1px 1px rgba(255,255,255,.5);
-    font-size:1.6em;
-    line-height:1.5em;
-    border:2px solid #abcc71;
-    border-left:none;
-    border-right:none;
-    box-shadow:0px 2px 8px rgba(0,0,0,.2)
-}
-
-div#content .main h1 {
-    font-family:"URW Gothic L", "Century Gothic", sans-serif;
-    font-size:2.5em; 
-    text-shadow:1px 1px 2px rgba(0,0,0,.3);
-    color:white;
-    margin-bottom:.5em;
-}
-
-.main .get-i2p {
-    display:block;
-    top:50%;
-    padding:.5em;
-    line-height:1em;
-    font-size:2em;
-    color:white;
-    font-family:Arial, Helvetica, sans-serif;
-    font-weight:bold; 
-    text-transform:uppercase;
-    text-decoration:none;
-    text-align:center; 
-    background:green;
-    border-radius:.3em;
-    text-shadow:1px 1px 1px rgba(0,0,0,.2);
-    box-shadow:2px 2px 4px rgba(0, 0, 0, 0.3), 1em 3em 2em 0.5em rgba(255, 255, 255, 0.3) inset, inset -.2em -.5em 1em -0em rgba(0,0,0,.3)
-}
-
-div#content .aside-wrap {
-    width:80%;
-    margin:2em auto;
-}
-
-div#content .aside {
-    position:relative;
-    display:inline-block;
-    vertical-align:top;
-    font-size:1.2em
-}
-
-div#content .aside a {
-    font-weight:bold;
-}
-
-div#content .aside h1 {
-    padding:1em 0;
-    border-bottom:1px solid rgba(171, 204, 113, 0.6);
-    font-size:1.4em;
-    color:#222200;
-    text-shadow:1px 1px 1px rgba(0,0,0,.3)
-}
-
-div#content .aside p {
-    margin:1em 0;
-}
-
-div#content .aside ul {
-    margin:1em 0;
-}
-
-div#content .aside ul li {
-    list-style-type:none;
-    margin:1em 0;
-    line-height:1.3em;
-}
-
-div#content .feed-icon {
-    background-image: url('../../images/feed-icon-28x28.png');
-    display: block;
-    float: right;
-    height: 28px;
-    margin: 1em;
-    text-indent: -9999px;
-    width: 28px;
-}
-
-div#content .lastupdated {
-    background-color: #ffffdd;
-    border-radius: 0 0 5px 5px;
-    padding: 2px 4px;
-    position: relative;
-    left: 8%;
-    text-align: right;
-    width: 80%;
-}
-
-/**
- * The .inner class is for the content wrapper on inner pages (as opposed to the home page)
- */
-div#content .inner {
-    width:auto;
-    margin: 0 5%;
-    padding: 0 5% 0.1em;
-    position:relative;
-    background: rgba(171, 204, 113, 0.6);
-    border-top:2px solid #abcc71;
-    border-left: 2px solid #abcc71;
-    border-right: 2px solid #abcc71;
-    border-radius: 5px 5px 0 0;
-    color:black;
-    font-size:1.2em;
-    line-height:1.4em;
-}
-
-div#content .inner h1, div#content .inner h2, div#content .inner h3, div#content .inner h4 {
-    color:white;
-    text-shadow:1px 1px 1px rgba(0,0,0,.3);
-    margin:1em 0 .5em;
-    padding-bottom:.2em;
-    clear:both;
-    line-height: 110%;
-}
-
-div#content .inner h2, div#content .inner h3, div#content .inner h4 {
-    border-bottom:1px solid white;
-}
-
-div#content .inner h1 {
-    font-size:2.2em;
-    margin:1em 0 0.5em;
-    text-align: center;
-    width:auto;
-}
-
-div#content .inner h2 {
-    font-size:1.6em;
-}
-
-div#content .inner h3 {
-    font-size:1.4em;
-}
-
-div#content .inner h4 {
-    font-size:1.2em;
-    font-style: italic;
-}
-
-div#content .inner ol {
-    margin:1.5em;
-}
-
-div#content .inner ul {
-    margin:1.5em; 1em;
-}
-
-div#content .inner p {
-    margin:1em 0;
-}
-
-div#content .inner th {
-    padding:2px 5px;
-}
-
-div#content .inner td {
-    border: 1px solid;
-    padding:2px 5px;
-}
-
-div#content .inner td.blue {
-    border: 2px solid blue;
-    color: blue;
-}
-
-/*
- * Download page
- */
-
-.package {
-    border: 6px solid rgba(171, 204, 113, 0.7);
-    border-radius: 5px;
-    margin: 10px;
-    padding: 10px;
-}
-
-.os {
-    color: white;
-    font-size: 1.6em;
-    font-weight: bold;
-    text-align: center;
-    text-decoration: underline;
-    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
-}
-
-.file {
-    margin-bottom: 10px;
-}
-.file > a, .filedownload {
-    padding: 5px;
-    background-color: rgba(255,255,255,0.2);
-    box-shadow: -1px -1px 1px 1px rgb(51, 51, 51) inset;
-    text-align: center;
-}
-.file .default {
-    border-radius: 5px 5px 0 0;
-    display: block;
-    overflow: hidden;
-    padding: 10px;
-}
-.file .default .name {
-    font-size: 1.6em;
-}
-.file .mirrors, .file .sig {
-    box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box;
-    display: inline-block;
-    width: 50%;
-}
-.file .mirrors {
-    border-radius: 0 0 0 5px;
-}
-.file .sig {
-    border-radius: 0 0 5px 0;
-    vertical-align: top;
-}
-.details .hash:before {
-    content: 'SHA256: ';
-}
-
-.warning {
-    background-color: rgba(171, 204, 113, 0.7);
-    border: 1px dashed rgb(208, 14, 14);
-    border-radius: 5px;
-    margin: 5px;
-    padding: 5px;
-}
-
-.filedownload {
-    border-radius: 5px;
-    text-align: center;
-}
-
-/*
- * Threat model
- */
-
-div#content .inner ul.DREAD {
-    border: 2px solid red;
-    float: left;
-    list-style: none;
-    margin: 1em 1.5em 1em 0;
-    padding: 0.5em;
-}
-
-/*
- * Additions to syntax.css
- */
-
-.highlight {
-    overflow: auto;
-}
-
-/*
- * Blog
- */
-
-#posts {
-    list-style: none;
-    margin: 1.5em 0 !important;
-}
-
-#posts article {
-    border: 2px solid #d00e0e;
-    border-radius: 5px;
-    margin: 10px 0;
-    padding: 10px;
-}
-
-#posts header {
-    font-size: 1.6em;
-}
-
-#posts header:before {
-    content: "»";
-}
-
-#posts footer {
-    font-style: italic;
-}
-
-#post-info {
-    list-style: none;
-    margin: 0 !important;
-}
-
-.system-messages {
-    background-color: rgba(171, 204, 113, 0.7);
-    border: 1px dashed rgb(208, 14, 14);
-    border-radius: 5px;
-    margin: 5px;
-    padding: 5px;
-}
-.system-messages > h1 {
-    font-size: 1.2em !important;
-    text-align: left !important;
-}
-
-/*
- * Footer
- */
-
-#global-footer {
-    width:auto;
-    border-top:3px
-    solid #883333;
-    background:#552222;
-    box-shadow:0px -4px 8px rgba(0,0,0,.3);
-    padding:1em 10%;
-    background:-moz-linear-gradient(#883333, #772222);
-}
-
-#global-footer .aside {
-    display:inline-block;
-    vertical-align:top;
-}
-
-#global-footer .aside h1 {
-    color:#ffdd88;
-    font-size:1.2em;
-    text-shadow:-1px -1px 1px rgba(0,0,0,.2);
-    border-bottom:1px solid #ccaa66;
-    margin:1em 0;
-    line-height:1.3em;
-}
-
-#global-footer .aside ul {
-    margin:0;
-    padding:0;
-}
-
-#global-footer .aside ul li {
-    color:#ffdd88;
-    list-style-type:none;
-    line-height:1.5em;
-}
-
-#global-footer .aside ul li a {
-    color:#ccaa66;
-    font-weight:bold;
-}
-
-#global-footer .aside ul li a:hover {
-    text-decoration:underline;
-}
-
-#global-footer a.button {
-    padding:.5em 2em;
-    background-color:#cc2222;
-    border:1px solid #bb2222;
-    border-radius:3px;
-    display:inline-block;
-    color:white;
-    margin:1em auto;
-    text-align:center;
-    width:auto;
-    font-weight:bold;
-}
+@import url('reset.css');
+
+body {
+    font-family: Droid Sans, Helvetica, sans-serif;
+    font-size: 10px;
+    background-color: #ffffdd;
+    min-height: 800px;
+    width: 100%;
+    background: -moz-radial-gradient(50% 30% , circle , #fffff9, #ffffcc) no-repeat scroll 0 0 #ffffcc;
+    background: -webkit-radial-gradient(50% 30% , circle , #fffff9, #ffffcc) no-repeat scroll 0 0 #ffffcc;
+}
+
+a {
+    color: #d00e0e;
+    text-decoration: none;
+}
+
+a:hover {
+    color: #f00e0e
+}
+
+div.hide {
+    display: none
+}
+
+div#topbar {
+    width: 80%;
+    /*margin: 1em auto;*/
+    margin: 1em auto;
+    position: relative;
+}
+
+div#topbar #logo {
+    float: left
+}
+
+div#topbar #logo img:hover {
+    filter: alpha(opacity=60);
+    -moz-opacity: 0.6;
+    opacity: 0.6;
+}
+
+nav {
+    clear: both
+}
+
+div#content {
+    display: block
+}
+
+/**
+ * The .main class is for content wrapper on the home page (with the big banner)
+ */
+
+div#content .main {
+    background: url('../../images/dots.png') 0 10% no-repeat rgba(171, 204, 113, 0.6);
+    background-size: 100% auto;
+    width: auto;
+    padding: 4em 10% 4em 10%;
+    position: relative;
+    margin: 0 auto;
+    text-shadow: 1px 1px 1px rgba(255,255,255,.5);
+    font-size: 1.6em;
+    line-height: 1.5em;
+    border: 2px solid #abcc71;
+    border-left: none;
+    border-right: none;
+    box-shadow: 0px 2px 8px rgba(0,0,0,.2);
+}
+
+div#content .main h1 {
+    font-family: "URW Gothic L", "Century Gothic", sans-serif;
+    font-size: 2.5em;
+    text-shadow: 1px 1px 2px rgba(0,0,0,.3);
+    color: white;
+    margin-bottom: .5em;
+}
+
+.main .get-i2p {
+    display: block;
+    top: 50%;
+    padding: .5em;
+    line-height: 1em;
+    font-size: 2em;
+    color: white;
+    font-family: Arial, Helvetica, sans-serif;
+    font-weight: bold;
+    text-transform: uppercase;
+    text-decoration: none;
+    text-align: center;
+    background: green;
+    border-radius: .3em;
+    text-shadow: 1px 1px 1px rgba(0,0,0,.2);
+    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3), 1em 3em 2em 0.5em rgba(255, 255, 255, 0.3) inset, inset -.2em -.5em 1em -0em rgba(0,0,0,.3);
+}
+
+div#content .aside-wrap {
+    width: 80%;
+    margin: 2em auto;
+}
+
+div#content .aside {
+    position: relative;
+    display: inline-block;
+    vertical-align: top;
+    font-size: 1.2em;
+}
+
+div#content .aside a {
+    font-weight: bold
+}
+
+div#content .aside h1 {
+    padding: 1em 0;
+    border-bottom: 1px solid rgba(171, 204, 113, 0.6);
+    font-size: 1.4em;
+    color: #222200;
+    text-shadow: 1px 1px 1px rgba(0,0,0,.3);
+}
+
+div#content .aside p {
+    margin: 1em 0
+}
+
+div#content .aside ul {
+    margin: 1em 0
+}
+
+div#content .aside ul li {
+    list-style-type: none;
+    margin: 1em 0;
+    line-height: 1.3em;
+}
+
+div#content .feed-icon {
+    background-image: url('../../images/feed-icon-28x28.png');
+    display: block;
+    float: right;
+    height: 28px;
+    margin: 1em;
+    text-indent: -9999px;
+    width: 28px;
+}
+
+div#content .lastupdated {
+    background-color: #ffffdd;
+    border-radius: 0 0 5px 5px;
+    padding: 2px 4px;
+    position: relative;
+    left: 8%;
+    text-align: right;
+    width: 80%;
+}
+
+/**
+ * The .inner class is for the content wrapper on inner pages (as opposed to the home page)
+ */
+
+div#content .inner {
+    width: auto;
+    margin: 0 5%;
+    padding: 0 5% 0.1em;
+    position: relative;
+    background: rgba(171, 204, 113, 0.6);
+    border-top: 2px solid #abcc71;
+    border-left: 2px solid #abcc71;
+    border-right: 2px solid #abcc71;
+    border-radius: 5px 5px 0 0;
+    color: black;
+    font-size: 1.2em;
+    line-height: 1.4em;
+}
+
+div#content .inner h1,
+div#content .inner h2,
+div#content .inner h3,
+div#content .inner h4 {
+    color: white;
+    text-shadow: 1px 1px 1px rgba(0,0,0,.3);
+    margin: 1em 0 .5em;
+    padding-bottom: .2em;
+    clear: both;
+    line-height: 110%;
+}
+
+div#content .inner h2,
+div#content .inner h3,
+div#content .inner h4 {
+    border-bottom: 1px solid white
+}
+
+div#content .inner h1 {
+    font-size: 2.2em;
+    margin: 1em 0 0.5em;
+    text-align: center;
+    width: auto;
+}
+
+div#content .inner h2 {
+    font-size: 1.6em
+}
+
+div#content .inner h3 {
+    font-size: 1.4em
+}
+
+div#content .inner h4 {
+    font-size: 1.2em;
+    font-style: italic;
+}
+
+div#content .inner ol {
+    margin: 1.5em
+}
+
+div#content .inner ul {
+    margin: 1.5em;
+    1em: ;
+}
+
+div#content .inner p {
+    margin: 1em 0
+}
+
+div#content .inner th {
+    padding: 2px 5px
+}
+
+div#content .inner td {
+    border: 1px solid;
+    padding: 2px 5px;
+}
+
+div#content .inner td.blue {
+    border: 2px solid blue;
+    color: blue;
+}
+
+/*
+ * Download page
+ */
+
+.package {
+    border: 6px solid rgba(171, 204, 113, 0.7);
+    border-radius: 5px;
+    margin: 10px;
+    padding: 10px;
+}
+
+.os {
+    color: white;
+    font-size: 1.6em;
+    font-weight: bold;
+    text-align: center;
+    text-decoration: underline;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+
+.file {
+    margin-bottom: 10px
+}
+
+.file > a,
+.filedownload {
+    padding: 5px;
+    background-color: rgba(255,255,255,0.2);
+    box-shadow: -1px -1px 1px 1px rgb(51, 51, 51) inset;
+    text-align: center;
+}
+
+.file .default {
+    border-radius: 5px 5px 0 0;
+    display: block;
+    overflow: hidden;
+    padding: 10px;
+}
+
+.file .default .name {
+    font-size: 1.6em
+}
+
+.file .mirrors,
+.file .sig {
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    display: inline-block;
+    width: 50%;
+}
+
+.file .mirrors {
+    border-radius: 0 0 0 5px
+}
+
+.file .sig {
+    border-radius: 0 0 5px 0;
+    vertical-align: top;
+}
+
+.details .hash:before {
+    content: 'SHA256: '
+}
+
+.warning {
+    background-color: rgba(171, 204, 113, 0.7);
+    border: 1px dashed rgb(208, 14, 14);
+    border-radius: 5px;
+    margin: 5px;
+    padding: 5px;
+}
+
+.filedownload {
+    border-radius: 5px;
+    text-align: center;
+}
+
+/*
+ * Threat model
+ */
+
+div#content .inner ul.DREAD {
+    border: 2px solid red;
+    float: left;
+    list-style: none;
+    margin: 1em 1.5em 1em 0;
+    padding: 0.5em;
+}
+
+/*
+ * Additions to syntax.css
+ */
+
+.highlight {
+    overflow: auto
+}
+
+/*
+ * Blog
+ */
+
+#posts {
+    list-style: none;
+    margin: 1.5em 0 !important;
+}
+
+#posts article {
+    border: 2px solid #d00e0e;
+    border-radius: 5px;
+    margin: 10px 0;
+    padding: 10px;
+}
+
+#posts header {
+    font-size: 1.6em
+}
+
+#posts header:before {
+    content: "»"
+}
+
+#posts footer {
+    font-style: italic
+}
+
+#post-info {
+    list-style: none;
+    margin: 0 !important;
+}
+
+.system-messages {
+    background-color: rgba(171, 204, 113, 0.7);
+    border: 1px dashed rgb(208, 14, 14);
+    border-radius: 5px;
+    margin: 5px;
+    padding: 5px;
+}
+
+.system-messages > h1 {
+    font-size: 1.2em !important;
+    text-align: left !important;
+}
+
+/*
+ * Footer
+ */
+
+#global-footer {
+    width: auto;
+    border-top: 3px solid #883333;
+    background: #552222;
+    box-shadow: 0px -4px 8px rgba(0,0,0,.3);
+    padding: 1em 10%;
+    background: -moz-linear-gradient(#883333, #772222);
+}
+
+#global-footer .aside {
+    display: inline-block;
+    vertical-align: top;
+}
+
+#global-footer .aside h1 {
+    color: #ffdd88;
+    font-size: 1.2em;
+    text-shadow: -1px -1px 1px rgba(0,0,0,.2);
+    border-bottom: 1px solid #ccaa66;
+    margin: 1em 0;
+    line-height: 1.3em;
+}
+
+#global-footer .aside ul {
+    margin: 0;
+    padding: 0;
+}
+
+#global-footer .aside ul li {
+    color: #ffdd88;
+    list-style-type: none;
+    line-height: 1.5em;
+}
+
+#global-footer .aside ul li a {
+    color: #ccaa66;
+    font-weight: bold;
+}
+
+#global-footer .aside ul li a:hover {
+    text-decoration: underline
+}
+
+#global-footer a.button {
+    padding: .5em 2em;
+    background-color: #cc2222;
+    border: 1px solid #bb2222;
+    border-radius: 3px;
+    display: inline-block;
+    color: white;
+    margin: 1em auto;
+    text-align: center;
+    width: auto;
+    font-weight: bold;
+}
\ No newline at end of file
diff --git a/i2p2www/static/styles/duck/default.rtl.css b/i2p2www/static/styles/duck/default.rtl.css
index 249a77a2..dc80ef1c 100644
--- a/i2p2www/static/styles/duck/default.rtl.css
+++ b/i2p2www/static/styles/duck/default.rtl.css
@@ -1,9 +1,11 @@
-/** Topbar **/
-div#topbar #logo {
-  float: right;
-}
-
-/** Frontpage **/
-div#content .feed-icon {
-  float: left;
-}
+/** Topbar **/
+
+div#topbar #logo {
+    float: right
+}
+
+/** Frontpage **/
+
+div#content .feed-icon {
+    float: left
+}
\ No newline at end of file
diff --git a/i2p2www/static/styles/duck/desktop.css b/i2p2www/static/styles/duck/desktop.css
index 99eaa065..dc6e4bc4 100644
--- a/i2p2www/static/styles/duck/desktop.css
+++ b/i2p2www/static/styles/duck/desktop.css
@@ -1,290 +1,504 @@
-body {
-    font-family:Droid Sans, Helvetica, sans-serif; font-size:10px;
-    background-color:#ffffdd;
-    min-height:800px; width:100%; padding-top:1em;
-    background:-moz-radial-gradient(50% 30% , circle , #fffff9, #ffffcc) no-repeat scroll 0 0 #ffffcc;
-    background:-webkit-radial-gradient(50% 30% , circle , #fffff9, #ffffcc) no-repeat scroll 0 0 #ffffcc;
-}
-a {color:#d00e0e; text-decoration:none;}
-    a:hover {color:#f00e0e;}
-
-div.hide {display:none;}
-
-div#topbar {width:80%; /*margin:1em auto;*/ margin: 1em auto 0; position:relative;}
-    div#topbar #logo img:hover {
-        filter:alpha(opacity=60);
-        -moz-opacity: 0.6;
-        opacity: 0.6;
-    }
-    div#topbar .title {
-        font-family:"URW Gothic L", "Century Gothic", sans-serif; text-transform:uppercase; font-size:3.5em; 
-        font-weight:bold; text-shadow:1px 1px 1px rgba(0,0,0,.2); color:#333333;
-        /*position:absolute;*/ top:0; right:0; line-height:41px; vertical-align:middle;
-        /*max-width: 70%;*/ text-align: right;
-    }
-    div#topbar .languages {
-        display: none;
-    }
-
-div.navigation {position:relative;}
-    ul.languages {margin: 0 2px !important;}
-    ul.languages li {display:inline-block; *display:inline; *zoom:1; margin: 0 -2px !important;}
-
-.langname {
-  background: green;
-  display: none;
-  padding: 0.5em;
-  position: absolute;
-  right: 0;
-  text-align: center;
-  top: 4em;
-  z-index: 1;
-}
-
-/* Dropdown menu CSS */
-
-menu ul,
-#cssmenu li,
-#cssmenu span,
-#cssmenu div.menuitem {
-  margin: 0;
-  padding: 0;
-  position: relative;
-}
-#cssmenu {
-  height: 40px;
-}
-#cssmenu:after,
-#cssmenu ul:after {
-  content: '';
-  display: block;
-  clear: both;
-}
-#cssmenu div.menuitem {
-  color: #d00e0e;
-  display: inline-block;
-  font-family: "URW Gothic L", "Century Gothic", sans-serif;
-  font-size: 2em;
-  font-weight: bold;
-  text-shadow: 1px 1px 1px rgba(100,20,20,.2);
-  line-height: 40px;
-  padding: 0 10px;
-  text-decoration: none;
-}
-#cssmenu ul {
-  list-style: none;
-}
-#cssmenu > ul {
-  float: left;
-  padding: 0 10%;
-}
-#cssmenu > ul > li {
-  float: left;
-}
-#cssmenu > ul > li.right {
-  position: absolute;
-  right: 10%;
-}
-#cssmenu > ul > li:hover:after {
-  content: '';
-  display: block;
-  width: 0;
-  height: 0;
-  position: absolute;
-  left: 50%;
-  bottom: 0;
-  border-left: 10px solid transparent;
-  border-right: 10px solid transparent;
-  border-bottom: 10px solid #abcc71;
-  margin-left: -10px;
-}
-#cssmenu > ul > li > div.menuitem {
-  border-radius: 5px 5px 0 0;
-  -moz-border-radius: 5px 5px 0 0;
-  -webkit-border-radius: 5px 5px 0 0;
-}
-#cssmenu > ul > li.active > div.menuitem {
-  box-shadow: inset 0 0 3px #000000;
-  -moz-box-shadow: inset 0 0 3px #000000;
-  -webkit-box-shadow: inset 0 0 3px #000000;
-  background: #070707;
-  background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
-  background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
-  background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
-  background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
-  background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
-  filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
-}
-#cssmenu .has-sub {
-  z-index: 1;
-}
-#cssmenu .has-sub:hover > ul {
-  display: block;
-}
-#cssmenu .has-sub ul {
-  display: none;
-  position: absolute;
-  width: 200px;
-  top: 100%;
-  left: 0;
-}
-#cssmenu .has-sub ul li {
-  border-left: 1px solid #ffffcc;
-}
-#cssmenu .has-sub ul li.has-sub > div.menuitem:after {
-    content: "►";
-    color: rgba(255,255,255,.5);
-    float: right;
-}
-#cssmenu .has-sub ul li div.menuitem {
-  background: #abcc71;
-  border-bottom: 1px dotted #ffffcc;
-  color: #ffffff;
-  font-size: 9pt;
-  display: block;
-  line-height: 120%;
-  padding: 10px;
-  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
-}
-#cssmenu .has-sub ul li div.menuitem:hover .langname {
-  display: block;
-}
-#cssmenu .has-sub ul li:hover > div.menuitem,
-#cssmenu .has-sub ul li:hover > a > div.menuitem {
-  background: #8bbc51;
-}
-#cssmenu .has-sub .has-sub:hover > ul {
-  display: block;
-}
-#cssmenu .has-sub .has-sub ul {
-  display: none;
-  position: absolute;
-  left: 100%;
-  top: 0;
-}
-#cssmenu .has-sub .has-sub ul li:first-child {
-  border-left: none;
-}
-
-/* End of dropdown menu CSS */
-
-div#content {display:block;}
-    /**
-     * The .main class is for content wrapper on the home page (with the big banner)
-     */
-div#content .main {
-    background:url('../../images/dots.png') 0 10% no-repeat rgba(171, 204, 113, 0.6); background-size:100% auto; width:auto; padding:4em 35% 4em 10%; position:relative;
-    margin:0 auto; text-shadow:1px 1px 1px rgba(255,255,255,.5); font-size:1.6em; line-height:1.5em;
-    border:2px solid #abcc71; border-left:none; border-right:none;  box-shadow:0px 2px 8px rgba(0,0,0,.2)}
-    div#content .main h1 {font-family:"URW Gothic L", "Century Gothic", sans-serif; font-size:2.5em; 
-    text-shadow:1px 1px 2px rgba(0,0,0,.3); color:white; margin-bottom:.5em;}
-    .main .get-i2p {
-        position:absolute; display:block; top:50%; right: 10%;
-        margin-top:-1em; max-width:20%; padding:.5em; line-height:1em;
-        font-size:2em; color:white; font-family:Arial, Helvetica, sans-serif; font-weight:bold; 
-        text-transform:uppercase; text-decoration:none; text-align:center; 
-        background:green; border-radius:.3em; -moz-transform:rotate(-5deg); 
-        transform:rotate(-5deg); -webkit-transform:rotate(-5deg);
-        -ms-transform:rotate(-5deg); -o-transform:rotate(-5deg);
-        text-shadow:1px 1px 1px rgba(0,0,0,.2);
-        box-shadow:2px 2px 4px rgba(0, 0, 0, 0.3), 1em 3em 2em 0.5em rgba(255, 255, 255, 0.3) inset, inset -.2em -.5em 1em -0em rgba(0,0,0,.3)}
-    .main .get-i2p:hover {box-shadow:2px 2px 2px rgba(0, 0, 0, 0.3), inset 0 -2.2em 2.2em rgba(255, 255, 255, 0.3), inset .2em .5em 1em 0em rgba(0,0,0,.3);}
-    div#content .aside-wrap {width:80%; margin:2em auto;}
-    div#content .aside {position:relative; width:30.9%; margin-left:3%;    display:inline-block; vertical-align:top; font-size:1.3em}
-        div#content .aside:first-child {margin-left:0%;}
-        div#content .aside a {font-weight:bold;}
-        div#content .aside h1 {padding:1em 0; border-bottom:1px solid rgba(171, 204, 113, 0.6); font-size:1.4em; color:#222200; text-shadow:1px 1px 1px rgba(0,0,0,.3)}
-        div#content .aside p {margin:1em 0;}
-            div#content .aside ul {margin:1em 0;}
-                div#content .aside ul li {list-style-type:none; margin:1em 0; line-height:1.3em;}
-
-    div#content .feed-icon {
-        background-image: url('../../images/feed-icon-28x28.png');
-        display: block;
-        float: right;
-        height: 28px;
-        margin: 1em;
-        text-indent: -9999px;
-        width: 28px;
-    }
-
-    div#content .lastupdated {
-        left: auto;
-        position: absolute;
-        right: 10%;
-        text-align: right;
-        top: 0;
-        width: 200px;
-    }
-
-    /**
-     * The .inner class is for the content wrapper on inner pages (as opposed to the home page)
-     */
-    div#content .inner {
-        width:auto; margin: 0 5%; padding: 4em 5% 2em; position:relative;
-        background: rgba(171, 204, 113, 0.6); border-top:2px solid #abcc71;
-        border-left: 2px solid #abcc71; border-right: 2px solid #abcc71; border-radius: 5px 5px 0 0;
-        color:black; font-size:1.3em; line-height:1.4em;
-    }
-
-div#content .inner > .title {
-    display: none;
-}
-
-    div#content .inner ol {margin:1.5em;}
-    div#content .inner ul {margin:1.5em; 1em;}
-    div#content .inner p {margin:1em 0;}
-    div#content .inner td {padding:2px 5px;}
-
-/* CSS for downloads list */
-
-.package {
-    overflow: hidden;
-}
-.package .os {
-    float: left;
-    width: 20%;
-}
-.package .details {
-    float: right;
-    width: 80%;
-}
-.file {
-    float: left;
-    width: 40%;
-}
-.file > a:hover {
-    box-shadow: 1px 1px 1px 1px rgb(51, 51, 51) inset;
-}
-.details .hash {
-    float: right;
-    overflow: auto;
-    width: 50%;
-}
-.details > p, .details > ol {
-    clear: both;
-}
-.filedownload {
-    margin-left: 29%;
-}
-
-/* End of downloads list CSS */
-
-.biblinks {
-    left: auto;
-    position: absolute;
-    right: 10%;
-    top: 0;
-}
-
-#global-footer {width:auto; border-top:3px solid #883333; background:#552222; box-shadow:0px -4px 8px rgba(0,0,0,.3); padding:1em 10%; background:-moz-linear-gradient(#883333, #772222);}
-    #global-footer .aside {display:inline-block; width:15%; margin-left:1%; vertical-align:top;}
-        #global-footer .aside.first {margin-left:0;}
-        #global-footer .aside.third, div##global-footer .aside.fifth {margin-left:2.5%}
-        #global-footer .aside h1 {color:#ffdd88; font-size:1.2em; text-shadow:-1px -1px 1px rgba(0,0,0,.2); border-bottom:1px solid #ccaa66; margin:1em 0; line-height:1.3em;}
-        #global-footer .aside ul {margin:0; padding:0;}
-        #global-footer .aside ul li {list-style-type:none; line-height:1.5em;}
-        #global-footer .aside ul li a {color:#ccaa66; font-weight:bold;}
-        #global-footer .aside ul li a:hover {text-decoration:underline;}
-        #global-footer a.button {padding:.5em 2em; background-color:#cc2222; border:1px solid #bb2222; border-radius:3px; display:inline-block; color:white; margin:1em auto; text-align:center; width:auto; font-weight:bold;}
+body {
+    font-family: Droid Sans, Helvetica, sans-serif;
+    font-size: 10px;
+    background-color: #ffffdd;
+    min-height: 800px;
+    width: 100%;
+    padding-top: 1em;
+    background: -moz-radial-gradient(50% 30% , circle , #fffff9, #ffffcc) no-repeat scroll 0 0 #ffffcc;
+    background: -webkit-radial-gradient(50% 30% , circle , #fffff9, #ffffcc) no-repeat scroll 0 0 #ffffcc;
+}
+
+a {
+    color: #d00e0e;
+    text-decoration: none;
+}
+
+a:hover {
+    color: #f00e0e
+}
+
+div.hide {
+    display: none
+}
+
+div#topbar {
+    width: 80%; /*margin: 1em auto;*/ margin: 1em auto 0; position:relative;;
+}
+
+div#topbar #logo img:hover {
+    filter: alpha(opacity=60);
+    -moz-opacity: 0.6;
+    opacity: 0.6;
+}
+
+div#topbar .title {
+    font-family: "URW Gothic L", "Century Gothic", sans-serif;
+    text-transform: uppercase;
+    font-size: 3.5em;
+    font-weight: bold;
+    text-shadow: 1px 1px 1px rgba(0,0,0,.2);
+    color: #333333;
+    /*position: absolute;*/ top:0; right:0; line-height:41px; vertical-align:middle;;
+    /*max-width: 70%;*/ text-align: right;;
+}
+
+div#topbar .languages {
+    display: none
+}
+
+div.navigation {
+    position: relative
+}
+
+ul.languages {
+    margin: 0 2px !important
+}
+
+ul.languages li {
+    display: inline-block;
+    *display: inline;
+    *zoom: 1;
+    margin: 0 -2px !important;
+}
+
+.langname {
+    background: green;
+    display: none;
+    padding: 0.5em;
+    position: absolute;
+    right: 0;
+    text-align: center;
+    top: 4em;
+    z-index: 1;
+}
+
+/* Dropdown menu CSS */
+
+menu ul,
+#cssmenu li,
+#cssmenu span,
+#cssmenu div.menuitem {
+    margin: 0;
+    padding: 0;
+    position: relative;
+}
+
+#cssmenu {
+    height: 40px
+}
+
+#cssmenu:after,
+#cssmenu ul:after {
+    content: '';
+    display: block;
+    clear: both;
+}
+
+#cssmenu div.menuitem {
+    color: #d00e0e;
+    display: inline-block;
+    font-family: "URW Gothic L", "Century Gothic", sans-serif;
+    font-size: 2em;
+    font-weight: bold;
+    text-shadow: 1px 1px 1px rgba(100,20,20,.2);
+    line-height: 40px;
+    padding: 0 10px;
+    text-decoration: none;
+}
+
+#cssmenu ul {
+    list-style: none
+}
+
+#cssmenu > ul {
+    float: left;
+    padding: 0 10%;
+}
+
+#cssmenu > ul > li {
+    float: left
+}
+
+#cssmenu > ul > li.right {
+    position: absolute;
+    right: 10%;
+}
+
+#cssmenu > ul > li:hover:after {
+    content: '';
+    display: block;
+    width: 0;
+    height: 0;
+    position: absolute;
+    left: 50%;
+    bottom: 0;
+    border-left: 10px solid transparent;
+    border-right: 10px solid transparent;
+    border-bottom: 10px solid #abcc71;
+    margin-left: -10px;
+}
+
+#cssmenu > ul > li > div.menuitem {
+    border-radius: 5px 5px 0 0;
+    -moz-border-radius: 5px 5px 0 0;
+    -webkit-border-radius: 5px 5px 0 0;
+}
+
+#cssmenu > ul > li.active > div.menuitem {
+    box-shadow: inset 0 0 3px #000000;
+    -moz-box-shadow: inset 0 0 3px #000000;
+    -webkit-box-shadow: inset 0 0 3px #000000;
+    background: #070707;
+    background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
+    background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
+    background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
+    background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
+    background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
+    filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
+}
+
+#cssmenu .has-sub {
+    z-index: 1
+}
+
+#cssmenu .has-sub:hover > ul {
+    display: block
+}
+
+#cssmenu .has-sub ul {
+    display: none;
+    position: absolute;
+    width: 200px;
+    top: 100%;
+    left: 0;
+}
+
+#cssmenu .has-sub ul li {
+    border-left: 1px solid #ffffcc
+}
+
+#cssmenu .has-sub ul li.has-sub > div.menuitem:after {
+    content: "►";
+    color: rgba(255,255,255,.5);
+    float: right;
+}
+
+#cssmenu .has-sub ul li div.menuitem {
+    background: #abcc71;
+    border-bottom: 1px dotted #ffffcc;
+    color: #ffffff;
+    font-size: 9pt;
+    display: block;
+    line-height: 120%;
+    padding: 10px;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+
+#cssmenu .has-sub ul li div.menuitem:hover .langname {
+    display: block
+}
+
+#cssmenu .has-sub ul li:hover > div.menuitem,
+#cssmenu .has-sub ul li:hover > a > div.menuitem {
+    background: #8bbc51
+}
+
+#cssmenu .has-sub .has-sub:hover > ul {
+    display: block
+}
+
+#cssmenu .has-sub .has-sub ul {
+    display: none;
+    position: absolute;
+    left: 100%;
+    top: 0;
+}
+
+#cssmenu .has-sub .has-sub ul li:first-child {
+    border-left: none
+}
+
+/* End of dropdown menu CSS */
+
+div#content {
+    display: block
+}
+
+/**
+     * The .main class is for content wrapper on the home page (with the big banner)
+     */
+
+div#content .main {
+    background: url('../../images/dots.png') 0 10% no-repeat rgba(171, 204, 113, 0.6);
+    background-size: 100% auto;
+    width: auto;
+    padding: 4em 35% 4em 10%;
+    position: relative;
+    margin: 0 auto;
+    text-shadow: 1px 1px 1px rgba(255,255,255,.5);
+    font-size: 1.6em;
+    line-height: 1.5em;
+    border: 2px solid #abcc71;
+    border-left: none;
+    border-right: none;
+    box-shadow: 0px 2px 8px rgba(0,0,0,.2);
+}
+
+div#content .main h1 {
+    font-family: "URW Gothic L", "Century Gothic", sans-serif;
+    font-size: 2.5em;
+    text-shadow: 1px 1px 2px rgba(0,0,0,.3);
+    color: white;
+    margin-bottom: .5em;
+}
+
+.main .get-i2p {
+    position: absolute;
+    display: block;
+    top: 50%;
+    right: 10%;
+    margin-top: -1em;
+    max-width: 20%;
+    padding: .5em;
+    line-height: 1em;
+    font-size: 2em;
+    color: white;
+    font-family: Arial, Helvetica, sans-serif;
+    font-weight: bold;
+    text-transform: uppercase;
+    text-decoration: none;
+    text-align: center;
+    background: green;
+    border-radius: .3em;
+    -moz-transform: rotate(-5deg);
+    transform: rotate(-5deg);
+    -webkit-transform: rotate(-5deg);
+    -ms-transform: rotate(-5deg);
+    -o-transform: rotate(-5deg);
+    text-shadow: 1px 1px 1px rgba(0,0,0,.2);
+    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3), 1em 3em 2em 0.5em rgba(255, 255, 255, 0.3) inset, inset -.2em -.5em 1em -0em rgba(0,0,0,.3);
+}
+
+.main .get-i2p:hover {
+    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3), inset 0 -2.2em 2.2em rgba(255, 255, 255, 0.3), inset .2em .5em 1em 0em rgba(0,0,0,.3)
+}
+
+div#content .aside-wrap {
+    width: 80%;
+    margin: 2em auto;
+}
+
+div#content .aside {
+    position: relative;
+    width: 30.9%;
+    margin-left: 3%;
+    display: inline-block;
+    vertical-align: top;
+    font-size: 1.3em;
+}
+
+div#content .aside:first-child {
+    margin-left: 0%
+}
+
+div#content .aside a {
+    font-weight: bold
+}
+
+div#content .aside h1 {
+    padding: 1em 0;
+    border-bottom: 1px solid rgba(171, 204, 113, 0.6);
+    font-size: 1.4em;
+    color: #222200;
+    text-shadow: 1px 1px 1px rgba(0,0,0,.3);
+}
+
+div#content .aside p {
+    margin: 1em 0
+}
+
+div#content .aside ul {
+    margin: 1em 0
+}
+
+div#content .aside ul li {
+    list-style-type: none;
+    margin: 1em 0;
+    line-height: 1.3em;
+}
+
+div#content .feed-icon {
+    background-image: url('../../images/feed-icon-28x28.png');
+    display: block;
+    float: right;
+    height: 28px;
+    margin: 1em;
+    text-indent: -9999px;
+    width: 28px;
+}
+
+div#content .lastupdated {
+    left: auto;
+    position: absolute;
+    right: 10%;
+    text-align: right;
+    top: 0;
+    width: 200px;
+}
+
+/**
+     * The .inner class is for the content wrapper on inner pages (as opposed to the home page)
+     */
+
+div#content .inner {
+    width: auto;
+    margin: 0 5%;
+    padding: 4em 5% 2em;
+    position: relative;
+    background: rgba(171, 204, 113, 0.6);
+    border-top: 2px solid #abcc71;
+    border-left: 2px solid #abcc71;
+    border-right: 2px solid #abcc71;
+    border-radius: 5px 5px 0 0;
+    color: black;
+    font-size: 1.3em;
+    line-height: 1.4em;
+}
+
+div#content .inner > .title {
+    display: none
+}
+
+div#content .inner ol {
+    margin: 1.5em
+}
+
+div#content .inner ul {
+    margin: 1.5em;
+    1em: ;
+}
+
+div#content .inner p {
+    margin: 1em 0
+}
+
+div#content .inner td {
+    padding: 2px 5px
+}
+
+/* CSS for downloads list */
+
+.package {
+    overflow: hidden
+}
+
+.package .os {
+    float: left;
+    width: 20%;
+}
+
+.package .details {
+    float: right;
+    width: 80%;
+}
+
+.file {
+    float: left;
+    width: 40%;
+}
+
+.file > a:hover {
+    box-shadow: 1px 1px 1px 1px rgb(51, 51, 51) inset
+}
+
+.details .hash {
+    float: right;
+    overflow: auto;
+    width: 50%;
+}
+
+.details > p,
+.details > ol {
+    clear: both
+}
+
+.filedownload {
+    margin-left: 29%
+}
+
+/* End of downloads list CSS */
+
+.biblinks {
+    left: auto;
+    position: absolute;
+    right: 10%;
+    top: 0;
+}
+
+#global-footer {
+    width: auto;
+    border-top: 3px solid #883333;
+    background: #552222;
+    box-shadow: 0px -4px 8px rgba(0,0,0,.3);
+    padding: 1em 10%;
+    background: -moz-linear-gradient(#883333, #772222);
+}
+
+#global-footer .aside {
+    display: inline-block;
+    width: 15%;
+    margin-left: 1%;
+    vertical-align: top;
+}
+
+#global-footer .aside.first {
+    margin-left: 0
+}
+
+#global-footer .aside.third,
+div##global-footer .aside.fifth {
+    margin-left: 2.5%
+}
+
+#global-footer .aside h1 {
+    color: #ffdd88;
+    font-size: 1.2em;
+    text-shadow: -1px -1px 1px rgba(0,0,0,.2);
+    border-bottom: 1px solid #ccaa66;
+    margin: 1em 0;
+    line-height: 1.3em;
+}
+
+#global-footer .aside ul {
+    margin: 0;
+    padding: 0;
+}
+
+#global-footer .aside ul li {
+    list-style-type: none;
+    line-height: 1.5em;
+}
+
+#global-footer .aside ul li a {
+    color: #ccaa66;
+    font-weight: bold;
+}
+
+#global-footer .aside ul li a:hover {
+    text-decoration: underline
+}
+
+#global-footer a.button {
+    padding: .5em 2em;
+    background-color: #cc2222;
+    border: 1px solid #bb2222;
+    border-radius: 3px;
+    display: inline-block;
+    color: white;
+    margin: 1em auto;
+    text-align: center;
+    width: auto;
+    font-weight: bold;
+}
\ No newline at end of file
diff --git a/i2p2www/static/styles/duck/desktop.rtl.css b/i2p2www/static/styles/duck/desktop.rtl.css
index c9bd1c57..757ede8e 100644
--- a/i2p2www/static/styles/duck/desktop.rtl.css
+++ b/i2p2www/static/styles/duck/desktop.rtl.css
@@ -1,61 +1,76 @@
-/** Topbar **/
-div#topbar .title {
-  text-align: left;
-}
-
-/** Dropdown menu **/
-#cssmenu > ul, #cssmenu > ul > li {
-  float: right;
-}
-#cssmenu > ul > li.right {
-  left: 10%;
-  right: auto;
-}
-#cssmenu .has-sub ul {
-  left: auto;
-  right: 0;
-}
-#cssmenu .has-sub ul li {
-  border-left: 0 none;
-  border-right: 1px solid #ffffcc;
-}
-#cssmenu .has-sub ul li.has-sub > div.menuitem:after {
-  content: "◄";
-  float: left;
-}
-#cssmenu .has-sub .has-sub ul {
-  left: auto;
-  right: 100%;
-}
-#cssmenu .has-sub .has-sub ul li:first-child {
-  border-right: none;
-}
-
-/** Frontpage **/
-div#content .main {
-  padding-left: 35%;
-  padding-right: 10%;
-}
-.main .get-i2p {
-  left: 10%;
-  right: auto;
-  transform:rotate(5deg);
-  -moz-transform:rotate(5deg); 
-  -webkit-transform:rotate(5deg);
-  -ms-transform:rotate(5deg);
-  -o-transform:rotate(5deg);
-}
-
-/** Downloads list **/
-.package .os {
-  float: right;
-}
-.package .details {
-  float: left;
-}
-.file {
-  float: right;
-}
-.details .hash {
-  float: left;
-}
+/** Topbar **/
+
+div#topbar .title {
+    text-align: left
+}
+
+/** Dropdown menu **/
+
+#cssmenu > ul,
+#cssmenu > ul > li {
+    float: right
+}
+
+#cssmenu > ul > li.right {
+    left: 10%;
+    right: auto;
+}
+
+#cssmenu .has-sub ul {
+    left: auto;
+    right: 0;
+}
+
+#cssmenu .has-sub ul li {
+    border-left: 0 none;
+    border-right: 1px solid #ffffcc;
+}
+
+#cssmenu .has-sub ul li.has-sub > div.menuitem:after {
+    content: "◄";
+    float: left;
+}
+
+#cssmenu .has-sub .has-sub ul {
+    left: auto;
+    right: 100%;
+}
+
+#cssmenu .has-sub .has-sub ul li:first-child {
+    border-right: none
+}
+
+/** Frontpage **/
+
+div#content .main {
+    padding-left: 35%;
+    padding-right: 10%;
+}
+
+.main .get-i2p {
+    left: 10%;
+    right: auto;
+    transform: rotate(5deg);
+    -moz-transform: rotate(5deg);
+    -webkit-transform: rotate(5deg);
+    -ms-transform: rotate(5deg);
+    -o-transform: rotate(5deg);
+}
+
+/** Downloads list **/
+
+.package .os {
+    float: right
+}
+
+.package .details {
+    float: left
+}
+
+.file {
+    float: right
+}
+
+.details .hash {
+    float: left
+}
\ No newline at end of file
diff --git a/i2p2www/static/styles/duck/mobile.css b/i2p2www/static/styles/duck/mobile.css
index 71ee2ecd..a59b12c2 100644
--- a/i2p2www/static/styles/duck/mobile.css
+++ b/i2p2www/static/styles/duck/mobile.css
@@ -1,139 +1,141 @@
-#topbar .title {
-    display: none;
-}
-
-/* Dropdown menu CSS */
-
-#cssmenu > ul {
-    width: 100%;
-    float: none;
-    background-color: #abcc71; /* change the menu color */
-    background-image: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.2));
-    background-image:    -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.2));
-    background-image:     -ms-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.2));
-    background-image:      -o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.2));
-    display: block;
-    /*height: 0;*/
-    height: auto;
-    margin: 0;
-    padding: 0;
-    overflow: hidden;
-    box-shadow: 0 1px 2px rgba(0,0,0,.6);
-    /*position: absolute;*/
-    top: 0px;
-    left: 0px;
-    z-index: 998;
-    clear: both;
-}
-
-#cssmenu > ul li {
-    /*display: none;*/
-    display: block; 
-    width: 100%;
-    font-family: Arial;
-}
-
-#cssmenu > ul li div.menuitem {
-    display: block;
-    width: 90%;
-    padding: 10px 5%;
-    font-size: 14px;
-    font-weight: bold;
-    text-shadow: -1px -1px 0 rgba(0,0,0,.15);
-    color: white;
-    text-decoration: none;
-    border-bottom: 1px solid rgba(0,0,0,.2);
-    border-top: 1px solid rgba(255,255,255,.1); 
-}
-
-#cssmenu > ul li div.menuitem:hover {
-    background-color: rgba(0,0,0,.5);
-    border-top-color: transparent;
-}
-
-#cssmenu > ul > li:first-child {
-    border-top: 1px solid rgba(0,0,0,.2);
-}
-
-/* Toggle the navigation bar open  */
-
-#cssmenu > ul.open { 
-    height: auto; 
-    /*padding-top: 50px;*/
-}
-
-#cssmenu > ul.open li { 
-    display: block; 
-}
-
-/* Submenus – .has-sub class indicates dropdowns */
-
-#cssmenu > ul > li:hover > div.menuitem {
-    background: rgba(0,0,0,.5);
-    border-bottom-color: transparent;
-}
-
-#cssmenu > ul li.has-sub > div.menuitem:after {
-    content: "▼";
-    color: rgba(255,255,255,.5);
-    float: right;
-}
-
-#cssmenu > ul li.has-sub > div.menuitem:hover {
-    background: rgba(0,0,0,.75);
-}
-
-#cssmenu > ul li ul {
-    display: none;
-    background: rgba(0,0,0,.5);
-    border-top: 0 none;
-    padding: 0;
-}
-
-#cssmenu > ul li ul div.menuitem {
-    border: 0 none;
-    font-size: 12px;
-    padding: 10px 5%;
-    font-weight: normal;
-}
-
-#cssmenu > ul li:hover > ul {
-    display: block;
-    border-top: 0 none;
-}
-
-/* End of dropdown menu CSS */
-
-div#content .main {
-    padding: 4em 10%;
-}
-
-.main .get-i2p {
-    margin-bottom: -1.5em;
-    margin-top: .5em;
-}
-
-div#content .aside {
-    width: 100%;
-}
-
-div#content .inner {
-    margin-top: 1em;
-}
-
-div#content .inner .title {
-    margin-top: 1em;
-}
-
-.details .hash {
-    display: none;
-}
-
-#global-footer .aside {
-    margin-left: 1%;
-    width: 49%;
-}
-
-#global-footer .aside.first, #global-footer .aside.third, #global-footer .aside.fifth {
-    margin-left: 0;
-}
+#topbar .title {
+    display: none
+}
+
+/* Dropdown menu CSS */
+
+#cssmenu > ul {
+    width: 100%;
+    float: none;
+    background-color: #abcc71; /* change the menu color */
+    background-image: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.2));
+    background-image: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.2));
+    background-image: -ms-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.2));
+    background-image: -o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.2));
+    display: block;
+    /*height: 0;*/
+    height: auto;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+    box-shadow: 0 1px 2px rgba(0,0,0,.6);
+    /*position: absolute;*/
+    top: 0px;
+    left: 0px;
+    z-index: 998;
+    clear: both;
+}
+
+#cssmenu > ul li {
+    /*display: none;*/
+    display: block;
+    width: 100%;
+    font-family: Arial;
+}
+
+#cssmenu > ul li div.menuitem {
+    display: block;
+    width: 90%;
+    padding: 10px 5%;
+    font-size: 14px;
+    font-weight: bold;
+    text-shadow: -1px -1px 0 rgba(0,0,0,.15);
+    color: white;
+    text-decoration: none;
+    border-bottom: 1px solid rgba(0,0,0,.2);
+    border-top: 1px solid rgba(255,255,255,.1);
+}
+
+#cssmenu > ul li div.menuitem:hover {
+    background-color: rgba(0,0,0,.5);
+    border-top-color: transparent;
+}
+
+#cssmenu > ul > li:first-child {
+    border-top: 1px solid rgba(0,0,0,.2)
+}
+
+/* Toggle the navigation bar open  */
+
+#cssmenu > ul.open {
+    height: auto;
+    /*padding-top: 50px;*/
+}
+
+#cssmenu > ul.open li {
+    display: block
+}
+
+/* Submenus – .has-sub class indicates dropdowns */
+
+#cssmenu > ul > li:hover > div.menuitem {
+    background: rgba(0,0,0,.5);
+    border-bottom-color: transparent;
+}
+
+#cssmenu > ul li.has-sub > div.menuitem:after {
+    content: "▼";
+    color: rgba(255,255,255,.5);
+    float: right;
+}
+
+#cssmenu > ul li.has-sub > div.menuitem:hover {
+    background: rgba(0,0,0,.75)
+}
+
+#cssmenu > ul li ul {
+    display: none;
+    background: rgba(0,0,0,.5);
+    border-top: 0 none;
+    padding: 0;
+}
+
+#cssmenu > ul li ul div.menuitem {
+    border: 0 none;
+    font-size: 12px;
+    padding: 10px 5%;
+    font-weight: normal;
+}
+
+#cssmenu > ul li:hover > ul {
+    display: block;
+    border-top: 0 none;
+}
+
+/* End of dropdown menu CSS */
+
+div#content .main {
+    padding: 4em 10%
+}
+
+.main .get-i2p {
+    margin-bottom: -1.5em;
+    margin-top: .5em;
+}
+
+div#content .aside {
+    width: 100%
+}
+
+div#content .inner {
+    margin-top: 1em
+}
+
+div#content .inner .title {
+    margin-top: 1em
+}
+
+.details .hash {
+    display: none
+}
+
+#global-footer .aside {
+    margin-left: 1%;
+    width: 49%;
+}
+
+#global-footer .aside.first,
+#global-footer .aside.third,
+#global-footer .aside.fifth {
+    margin-left: 0
+}
\ No newline at end of file