commit:     48a2b5b46c90d7ed528571154778d6fafe05aada
Author:     Jimi Huotari <chiitoo <AT> gentoo <DOT> org>
AuthorDate: Thu Feb  6 08:15:51 2020 +0000
Commit:     Jimi Huotari <chiitoo <AT> gentoo <DOT> org>
CommitDate: Thu Feb  6 08:27:17 2020 +0000
URL:        https://gitweb.gentoo.org/proj/forums.git/commit/?id=48a2b5b4

Let there be Gentoo Light.

Use (at least mostly) the colours of the Gentoo forums phpBB 2
edition, move poster profiles from right to left, and enable wide
layout (among other, smaller tweaks).

Signed-off-by: Jimi Huotari <chiitoo <AT> gentoo.org>

 template/index_body.html                    |  13 +-
 template/overall_footer.html                |  15 +-
 template/overall_header.html                |  19 +-
 template/ucp_pm_viewmessage.html            |  16 +-
 template/viewtopic_body.html                |  28 +-
 theme/base.css                              |   4 +-
 theme/colours.css                           | 380 +++++++++++++++++-----------
 theme/common.css                            |  65 +++--
 theme/content.css                           |  75 +++++-
 theme/en/icon_user_online.png               | Bin 0 -> 4707 bytes
 theme/en/stylesheet.css                     |   2 +-
 theme/images/cellpic3.gif                   | Bin 0 -> 243 bytes
 theme/images/site_logo.png                  | Bin 0 -> 70815 bytes
 theme/{responsive.css => responsive-pm.css} |  97 +++++--
 theme/responsive.css                        |  75 +++++-
 15 files changed, 543 insertions(+), 246 deletions(-)

diff --git a/template/index_body.html b/template/index_body.html
index 239a91c58..7b5fab3f4 100644
--- a/template/index_body.html
+++ b/template/index_body.html
@@ -15,6 +15,14 @@
 
 <!-- EVENT index_body_forumlist_body_after -->
 
+<div class="stats-area">
+       <div class="stats-header">
+               <h3>{L_STATISTICS}</h3>
+       </div>
+
+       <div class="stats-data">
+
+
 <!-- IF not S_USER_LOGGED_IN and not S_IS_BOT -->
        <form method="post" action="{S_LOGIN_ACTION}" class="headerspace">
        <h3><a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a><!-- IF 
S_REGISTER_ENABLED -->&nbsp; &bull; &nbsp;<a 
href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF --></h3>
@@ -41,7 +49,7 @@
                <!-- IF U_VIEWONLINE --><h3><a 
href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE 
--><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF -->
                <p>
                        <!-- EVENT index_body_block_online_prepend -->
-                       {TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br 
/>{RECORD_USERS}<br /> 
+                       {TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br 
/>{RECORD_USERS}<br />
                        <!-- IF U_VIEWONLINE -->
                                <br />{LOGGED_IN_USER_LIST}
                                <!-- IF LEGEND --><br /><em>{L_LEGEND}{L_COLON} 
{LEGEND}</em><!-- ENDIF -->
@@ -76,5 +84,6 @@
 <!-- ENDIF -->
 
 <!-- EVENT index_body_stat_blocks_after -->
-
+       </div>
+</div>
 <!-- INCLUDE overall_footer.html -->

diff --git a/template/overall_footer.html b/template/overall_footer.html
index bdff1a0c0..222f65e6e 100644
--- a/template/overall_footer.html
+++ b/template/overall_footer.html
@@ -9,6 +9,13 @@
        <div class="copyright">
                <!-- EVENT overall_footer_copyright_prepend -->
                <p class="footer-row">
+                       <span class="footer-copyright">© 2001–2020 Gentoo 
Foundation, Inc.</span>
+               </p>
+               <p class="footer-row">Hosting by
+                       <a class="footer-link" 
href="https://www.gossamer-threads.com/"; title="Hosting" role="menuitem">
+                               <span class="footer-link-text">Gossamer Threads 
Inc.</span>
+                       </a>
+                       |
                        <span class="footer-copyright">{{ CREDIT_LINE }}</span>
                </p>
                <!-- IF TRANSLATION_INFO -->
@@ -18,12 +25,8 @@
                <!-- ENDIF -->
                <!-- EVENT overall_footer_copyright_append -->
                <p class="footer-row">
-                       <a class="footer-link" href="{{ U_PRIVACY }}" title="{{ 
lang('PRIVACY_LINK') }}" role="menuitem">
-                               <span class="footer-link-text">{{ 
lang('PRIVACY_LINK') }}</span>
-                       </a>
-                       |
-                       <a class="footer-link" href="{{ U_TERMS_USE }}" 
title="{{ lang('TERMS_LINK') }}" role="menuitem">
-                               <span class="footer-link-text">{{ 
lang('TERMS_LINK') }}</span>
+                       <a class="footer-link" 
href="https://wiki.gentoo.org/wiki/Foundation:Privacy_Policy"; title="Privacy 
Policy" role="menuitem">
+                               <span class="footer-link-text">Privacy 
Policy</span>
                        </a>
                </p>
                <!-- IF DEBUG_OUTPUT -->

diff --git a/template/overall_header.html b/template/overall_header.html
index 09824d0a1..412e95298 100644
--- a/template/overall_header.html
+++ b/template/overall_header.html
@@ -23,10 +23,11 @@
 <!-- ENDIF -->
 
 <!--
-       phpBB style name: prosilver
+       phpBB style name: Gentoo Light
        Based on style:   prosilver (this is the default phpBB3 style)
+       Based on style:   Gentoo phpBB 2 (Derived from subSilver by Kyle Manna)
        Original author:  Tom Beddard ( http://www.subBlue.com/ )
-       Modified by:
+       Modified by:      Gentoo ( https://www.gentoo.org/ )
 -->
 
 <!-- IF S_ALLOW_CDN -->
@@ -76,7 +77,7 @@
 
 <!-- EVENT overall_header_body_before -->
 
-<div id="wrap" class="wrap">
+<div id="header-wide">
        <a id="top" class="top-anchor" accesskey="t"></a>
        <div id="page-header">
                <div class="headerbar" role="banner">
@@ -85,8 +86,8 @@
 
                        <div id="site-description" class="site-description">
                                <a id="logo" class="logo" href="<!-- IF 
U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- 
IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->"><span 
class="site_logo"></span></a>
-                               <h1>{SITENAME}</h1>
-                               <p>{SITE_DESCRIPTION}</p>
+                               <!--<h1>{SITENAME}</h1>
+                               <p>{SITE_DESCRIPTION}</p>-->
                                <p class="skiplink"><a 
href="#start_here">{L_SKIP}</a></p>
                        </div>
 
@@ -112,9 +113,12 @@
                        </div>
                        <!-- EVENT overall_header_headerbar_after -->
                </div>
+       </div>
+</div>
                <!-- EVENT overall_header_navbar_before -->
                <!-- INCLUDE navbar_header.html -->
-       </div>
+
+<div id="wrap" class="wrap">
 
        <!-- EVENT overall_header_page_body_before -->
 
@@ -126,6 +130,9 @@
                                <strong>{L_INFORMATION}{L_COLON}</strong> 
{L_BOARD_DISABLED}
                        </div>
                </div>
+       </div>
                <!-- ENDIF -->
 
                <!-- EVENT overall_header_content_before -->
+
+</div> <!-- End Wrap -->

diff --git a/template/ucp_pm_viewmessage.html b/template/ucp_pm_viewmessage.html
index 7cb44a018..dab6a9bab 100644
--- a/template/ucp_pm_viewmessage.html
+++ b/template/ucp_pm_viewmessage.html
@@ -5,6 +5,7 @@
        </div>
 </div>
 
+<link rel="stylesheet" href="{T_THEME_PATH}/responsive-pm.css">
 
 <!-- IF S_DISPLAY_HISTORY and (U_VIEW_PREVIOUS_HISTORY or U_VIEW_NEXT_HISTORY) 
-->
        <fieldset class="display-options clearfix">
@@ -22,16 +23,11 @@
 <!-- ENDIF -->
 
 
-<div id="post-{MESSAGE_ID}" class="post pm has-profile<!-- IF 
S_POST_UNAPPROVED or S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF S_ONLINE 
--> online<!-- ENDIF -->">
+<div id="post-{MESSAGE_ID}" class="post pm has-profile">
 <div class="inner">
 
-       <dl class="postprofile" id="profile{MESSAGE_ID}">
+       <dl class="postprofile<!-- IF S_POST_UNAPPROVED or S_POST_REPORTED --> 
reported<!-- ENDIF --><!-- IF S_ONLINE --> online<!-- ENDIF -->" 
id="profile{MESSAGE_ID}">
                <dt class="<!-- IF RANK_TITLE or RANK_IMG 
-->has-profile-rank<!-- ELSE -->no-profile-rank<!-- ENDIF --> <!-- IF 
AUTHOR_AVATAR -->has-avatar<!-- ELSE -->no-avatar<!-- ENDIF -->">
-                       <div class="avatar-container">
-                               <!-- EVENT ucp_pm_viewmessage_avatar_before -->
-                               <!-- IF AUTHOR_AVATAR --><a 
href="{U_MESSAGE_AUTHOR}" class="avatar">{AUTHOR_AVATAR}</a><!-- ENDIF -->
-                               <!-- EVENT ucp_pm_viewmessage_avatar_after -->
-                       </div>
                        {MESSAGE_AUTHOR_FULL}
                </dt>
 
@@ -39,6 +35,12 @@
                <!-- IF RANK_TITLE or RANK_IMG --><dd 
class="profile-rank">{RANK_TITLE}<!-- IF RANK_TITLE and RANK_IMG --><br /><!-- 
ENDIF -->{RANK_IMG}</dd><!-- ENDIF -->
                <!-- EVENT ucp_pm_viewmessage_rank_after -->
 
+                       <div class="avatar-container">
+                               <!-- EVENT ucp_pm_viewmessage_avatar_before -->
+                               <!-- IF AUTHOR_AVATAR --><a 
href="{U_MESSAGE_AUTHOR}" class="avatar">{AUTHOR_AVATAR}</a><!-- ENDIF -->
+                               <!-- EVENT ucp_pm_viewmessage_avatar_after -->
+                       </div>
+
                <dd class="profile-posts"><strong>{L_POSTS}{L_COLON}</strong> 
<!-- IF U_AUTHOR_POSTS != '' --><a 
href="{U_AUTHOR_POSTS}">{AUTHOR_POSTS}</a><!-- ELSE -->{AUTHOR_POSTS}<!-- ENDIF 
--></dd>
                <!-- IF AUTHOR_JOINED --><dd 
class="profile-joined"><strong>{L_JOINED}{L_COLON}</strong> 
{AUTHOR_JOINED}</dd><!-- ENDIF -->
 

diff --git a/template/viewtopic_body.html b/template/viewtopic_body.html
index 8d7e26f09..2d96997d2 100644
--- a/template/viewtopic_body.html
+++ b/template/viewtopic_body.html
@@ -131,23 +131,25 @@
 
 <!-- EVENT viewtopic_body_poll_after -->
 
+<div id="topic-header">
+       <div class="inner">
+               <div class="post has-profile">
+                       <div class="postprofile 
topic-header-author">{L_AUTHOR}</div>
+                               <div class="postbody topic-header-title 
inner">{L_MESSAGE}</div>
+                       </div>
+               </div>
+       </div>
+
 <!-- BEGIN postrow -->
        <!-- EVENT viewtopic_body_postrow_post_before -->
        <!-- IF postrow.S_FIRST_UNREAD -->
                <a id="unread" class="anchor"<!-- IF S_UNREAD_VIEW --> 
data-url="{postrow.U_MINI_POST}"<!-- ENDIF -->></a>
        <!-- ENDIF -->
-       <div id="p{postrow.POST_ID}" class="post has-profile <!-- IF 
postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF --><!-- IF 
postrow.S_UNREAD_POST --> unreadpost<!-- ENDIF --><!-- IF 
postrow.S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF 
postrow.S_POST_DELETED --> deleted<!-- ENDIF --><!-- IF postrow.S_ONLINE and 
not postrow.S_POST_HIDDEN --> online<!-- ENDIF --><!-- IF 
postrow.POSTER_WARNINGS --> warned<!-- ENDIF -->">
+       <div id="p{postrow.POST_ID}" class="post has-profile <!-- IF 
postrow.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF --><!-- IF 
postrow.S_UNREAD_POST --> unreadpost<!-- ENDIF --><!-- IF 
postrow.S_POST_REPORTED --> reported<!-- ENDIF --><!-- IF 
postrow.S_POST_DELETED --> deleted<!-- ENDIF --><!-- IF postrow.POSTER_WARNINGS 
--> warned<!-- ENDIF -->">
                <div class="inner">
 
-               <dl class="postprofile" id="profile{postrow.POST_ID}"<!-- IF 
postrow.S_POST_HIDDEN --> style="display: none;"<!-- ENDIF -->>
+               <dl class="postprofile<!-- IF postrow.S_ONLINE and not 
postrow.S_IGNORE_POST --> online<!-- ENDIF -->" 
id="profile{postrow.POST_ID}"<!-- IF postrow.S_POST_HIDDEN --> style="display: 
none;"<!-- ENDIF -->>
                        <dt class="<!-- IF postrow.RANK_TITLE or 
postrow.RANK_IMG -->has-profile-rank<!-- ELSE -->no-profile-rank<!-- ENDIF --> 
<!-- IF postrow.POSTER_AVATAR -->has-avatar<!-- ELSE -->no-avatar<!-- ENDIF 
-->">
-                               <div class="avatar-container">
-                                       <!-- EVENT viewtopic_body_avatar_before 
-->
-                                       <!-- IF postrow.POSTER_AVATAR -->
-                                               <!-- IF postrow.U_POST_AUTHOR 
--><a href="{postrow.U_POST_AUTHOR}" 
class="avatar">{postrow.POSTER_AVATAR}</a><!-- ELSE --><span 
class="avatar">{postrow.POSTER_AVATAR}</span><!-- ENDIF -->
-                                       <!-- ENDIF -->
-                                       <!-- EVENT viewtopic_body_avatar_after 
-->
-                               </div>
                                <!-- EVENT viewtopic_body_post_author_before -->
                                <!-- IF not postrow.U_POST_AUTHOR 
--><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ELSE 
-->{postrow.POST_AUTHOR_FULL}<!-- ENDIF -->
                                <!-- EVENT viewtopic_body_post_author_after -->
@@ -157,6 +159,14 @@
                        <!-- IF postrow.RANK_TITLE or postrow.RANK_IMG --><dd 
class="profile-rank">{postrow.RANK_TITLE}<!-- IF postrow.RANK_TITLE and 
postrow.RANK_IMG --><br /><!-- ENDIF -->{postrow.RANK_IMG}</dd><!-- ENDIF -->
                        <!-- EVENT viewtopic_body_postrow_rank_after -->
 
+                               <div class="avatar-container">
+                                       <!-- EVENT viewtopic_body_avatar_before 
-->
+                                       <!-- IF postrow.POSTER_AVATAR -->
+                                               <!-- IF postrow.U_POST_AUTHOR 
--><a href="{postrow.U_POST_AUTHOR}" 
class="avatar">{postrow.POSTER_AVATAR}</a><!-- ELSE --><span 
class="avatar">{postrow.POSTER_AVATAR}</span><!-- ENDIF -->
+                                       <!-- ENDIF -->
+                                       <!-- EVENT viewtopic_body_avatar_after 
-->
+                               </div>
+
                <!-- IF postrow.POSTER_POSTS != '' --><dd 
class="profile-posts"><strong>{L_POSTS}{L_COLON}</strong> <!-- IF 
postrow.U_SEARCH !== '' --><a href="{postrow.U_SEARCH}"><!-- ENDIF 
-->{postrow.POSTER_POSTS}<!-- IF postrow.U_SEARCH !== '' --></a><!-- ENDIF 
--></dd><!-- ENDIF -->
                <!-- IF postrow.POSTER_JOINED --><dd 
class="profile-joined"><strong>{L_JOINED}{L_COLON}</strong> 
{postrow.POSTER_JOINED}</dd><!-- ENDIF -->
                <!-- IF postrow.POSTER_WARNINGS --><dd 
class="profile-warnings"><strong>{L_WARNINGS}{L_COLON}</strong> 
{postrow.POSTER_WARNINGS}</dd><!-- ENDIF -->

diff --git a/theme/base.css b/theme/base.css
index 98c57d926..20cf61983 100644
--- a/theme/base.css
+++ b/theme/base.css
@@ -47,14 +47,14 @@ hr {
 }
 
 a {
-       color: #428bca;
+       color: #a0a0d0;
        text-decoration: none;
 }
 
 a:hover,
 a:focus,
 a:active {
-       color: #2a6496;
+       color: #a0a0d0;
        text-decoration: underline;
 }
 

diff --git a/theme/colours.css b/theme/colours.css
index ffaa71034..0279fd093 100644
--- a/theme/colours.css
+++ b/theme/colours.css
@@ -4,12 +4,12 @@ Colours and backgrounds for common.css
 -------------------------------------------------------------- */
 
 html, body {
-       color: #536482;
-       background-color: #F5F7FA;
+       color: #000000;
+       background-color: #ffffff;
 }
 
 h1 {
-       color: #FFFFFF;
+       color: #46357c;
 }
 
 h2 {
@@ -18,7 +18,7 @@ h2 {
 
 h3 {
        border-bottom-color: #CCCCCC;
-       color: #115098;
+       color: #333333;
 }
 
 hr {
@@ -26,21 +26,50 @@ hr {
        border-top-color: #CCCCCC;
 }
 
+.rightside {
+       color: #efefef;
+}
+
+.responsive-center {
+       color: #333333;
+}
+
 /*
 --------------------------------------------------------------
 Colours and backgrounds for links.css
 -------------------------------------------------------------- */
 
-a { color: #105289; }
-a:hover { color: #D31141; }
+a {
+       color: #663399;
+}
+
+a:hover {
+       color: #ff6633;
+}
+
+.linklist a {
+       color: #a0a0d0;
+}
+
+.linklist a:hover {
+       color: #00ff00;
+}
+
+.mark-read {
+       color: #46357c;
+}
+
+.mark-read:hover {
+       color: #ff6633;
+}
 
 /* Links on gradient backgrounds */
 .forumbg .header a, .forabg .header a, th a {
-       color: #FFFFFF;
+       color: #efefef;
 }
 
 .forumbg .header a:hover, .forabg .header a:hover, th a:hover {
-       color: #A8D8FF;
+       color: #004768;
 }
 
 /* Notification mark read link */
@@ -50,18 +79,18 @@ a:hover { color: #D31141; }
 
 /* Post body links */
 .postlink {
-       border-bottom-color: #368AD2;
-       color: #368AD2;
+       border-bottom-color: #105289;
+       color: #105289;
 }
 
 .postlink:visited {
-       border-bottom-color: #5D8FBD;
-       color: #5D8FBD;
+       border-bottom-color: #005075;
+       color: #005075;
 }
 
 .postlink:hover {
-       background-color: #D0E4F6;
-       color: #0D4473;
+       background-color: #ced7Db;
+       color: #004768;
 }
 
 .signature a, .signature a:hover {
@@ -75,41 +104,35 @@ a:hover { color: #D31141; }
 
 /* Arrow links  */
 .arrow-left:hover, .arrow-right:hover {
-       color: #368AD2;
+       color: #ff6633;
 }
 
-/* Round cornered boxes and backgrounds
+/* Boxes and Backgrounds
 ---------------------------------------- */
-.wrap {
-       background-color: #FFF;
-       border-color: #E6E9ED;
+
+#header-wide {
+       background-color: #46357c;
 }
 
 .headerbar {
-       color: #FFFFFF;
+       color: #46357c;
 }
 
-.headerbar, .forumbg {
-       background-color: #12A3EB;
-       background-image: -webkit-linear-gradient(top, #6ACEFF 0%, #0076B1 2px, 
#12A3EB 92px, #12A3EB 100%);
-       background-image: linear-gradient(to bottom, #6ACEFF 0%,#0076B1 
2px,#12A3EB 92px,#12A3EB 100%);
-       background-repeat: repeat-x;
+.forumbg, .forabg {
+       background-color: #46357c;
+       background-image: url("./images/cellpic3.gif");
 }
 
-.forabg {
-       background-color: #0076B1;
-       background-image: -webkit-linear-gradient(top, #6ACEFF 0%, #12A3EB 2px, 
#0076B1 92px, #0076B1 100%);
-       background-image: linear-gradient(to bottom, #6ACEFF 0%,#12A3EB 
2px,#0076B1 92px,#0076B1 100%);
-       background-repeat: repeat-x;
+.navbar {
+       background-color: #000000;
 }
 
-.navbar {
-       background-color: #CADCEB;
+.forabg, .forumbg, .panel, .post, .responsive {
+       border: 1px solid #333333;
 }
 
 .panel {
-       background-color: #ECF1F3;
-       color: #28313F;
+       background-color: #ececec;
 }
 
 .post:target .content {
@@ -117,31 +140,31 @@ a:hover { color: #D31141; }
 }
 
 .post:target h3 a {
-       color: #000000;
+       color: #5c2e8a;
 }
 
 .bg1 {
-       background-color: #ECF3F7;
+       background-color: #ececec;
 }
 
 table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd) {
-       background-color: #ECF3F7;
+       background-color: #ececec;
 }
 
 .bg2 {
-       background-color: #E1EBF2;
+       background-color: #e5e8ea;
 }
 
 table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
-       background-color: #E1EBF2;
+       background-color: #e5e8ea;
 }
 
-.bg3   {
-       background-color: #CADCEB;
+.bg3 {
+       background-color: #ececec;
 }
 
 .ucprowbg {
-       background-color: #DCDEE2;
+       background-color: #e5e8ea;
 }
 
 .fieldsbg {
@@ -149,20 +172,32 @@ table.zebra-list tr:nth-child(even) td, ul.zebra-list 
li:nth-child(even) {
 }
 
 .site_logo {
-       background-image: url("./images/site_logo.gif");
+       background-image: url("./images/site_logo.png");
 }
 
-/* Horizontal lists
+/* Statistics
 ----------------------------------------*/
 
-ul.navlinks {
-       border-top-color: #FFFFFF;
+.stats-area {
+       background-color: #efefef;
+       border: 1px solid #333333;
+}
+
+.stats-header h3 {
+       background-image: url("./images/cellpic3.gif");
+       border-bottom-color: #a9b8c2;
+       color: #efefef;
+}
+
+.stats-data h3 {
+       border-bottom-color: #a9b8c2;
 }
 
 /* Table styles
 ----------------------------------------*/
+
 table.table1 thead th {
-       color: #FFFFFF;
+       color: #333333;
 }
 
 table.table1 tbody tr {
@@ -170,7 +205,7 @@ table.table1 tbody tr {
 }
 
 table.table1 tbody tr:hover, table.table1 tbody tr.hover {
-       background-color: #CFE1F6;
+       background-color: #dee3e5;
        color: #000;
 }
 
@@ -179,13 +214,21 @@ table.table1 td {
 }
 
 table.table1 tbody td {
-       border-top-color: #FAFAFA;
+       border-top-color: #a9b8c2;
+}
+
+table.table1 tbody td.posts {
+       border-left: 1px solid #a9b8c2;
+       border-right: 1px solid #a9b8c2;
+}
+
+table.table1 tbody td.info {
+       border-right: 1px solid #a9b8c2;
 }
 
 table.table1 tbody th {
-       border-bottom-color: #000000;
+       border-bottom-color: #a9b8c2;
        color: #333333;
-       background-color: #FFFFFF;
 }
 
 table.info tbody th {
@@ -194,12 +237,18 @@ table.info tbody th {
 
 /* Misc layout styles
 ---------------------------------------- */
+
 dl.details dt {
        color: #000000;
 }
 
 dl.details dd {
-       color: #536482;
+       color: #000000;
+       font-weight: bold;
+}
+
+dl.details dd a {
+       font-weight: normal;
 }
 
 .sep {
@@ -208,6 +257,7 @@ dl.details dd {
 
 /* Icon styles
 ---------------------------------------- */
+
 .icon.icon-blue, a:hover .icon.icon-blue {
        color: #196db5;
 }
@@ -250,23 +300,23 @@ dl.details dd {
 }
 
 .jumpbox-cat-link {
-       background-color: #0076b1;
+       background-color: #d2d5d7;
        border-top-color: #0076B1;
-       color: #FFFFFF;
+       color: #373737;
 }
 
 .jumpbox-cat-link:hover {
-       background-color: #12A3EB;
+       background-color: #c7cacc;
        border-top-color: #12A3EB;
-       color: #FFFFFF;
+       color: #000000;
 }
 
 .jumpbox-forum-link {
-       background-color: #E1EBF2;
+       background-color: #ececec;
 }
 
 .jumpbox-forum-link:hover {
-       background-color: #F6F4D0;
+       background-color: #dee3e5;
 }
 
 .jumpbox .dropdown .pointer-inner {
@@ -274,18 +324,23 @@ dl.details dd {
 }
 
 .jumpbox-sub-link {
-       background-color: #E1EBF2;
+       background-color: #ececec;
 }
 
 .jumpbox-sub-link:hover {
-       background-color: #F1F8FF;
+       background-color: #dee3e5;
 }
 
 /* Miscellaneous styles
 ---------------------------------------- */
 
 .copyright {
-       color: #555555;
+       color: #efefef;
+       background-color: #000000;
+}
+
+.copyright a {
+       color: #a0a0d0;
 }
 
 .error {
@@ -319,28 +374,24 @@ Colours and backgrounds for content.css
 -------------------------------------------------------------- */
 
 ul.forums {
-       background-color: #EEF5F9; /* Old browsers */ /* FF3.6+ */
-       background-image: -webkit-linear-gradient(top, #D2E0EB 0%, #EEF5F9 
100%);
-       background-image: linear-gradient(to bottom, #D2E0EB 0%,#EEF5F9 100%); 
/* W3C */
-       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#D2E0EB', endColorstr='#EEF5F9',GradientType=0 ); /* IE6-9 */
+       background-color: #ececec;
 }
 
 ul.topiclist li {
-       color: #4C5D77;
+       color: #000000;
 }
 
 ul.topiclist dd {
-       border-left-color: #FFFFFF;
+       border-left-color: #a9b8c2;
 }
 
 .rtl ul.topiclist dd {
-       border-right-color: #FFFFFF;
+       border-right-color: #a9b8c2;
        border-left-color: transparent;
 }
 
 li.row {
-       border-top-color:  #FFFFFF;
-       border-bottom-color: #00608F;
+       border-top-color:  #a9b8c2;
 }
 
 li.row strong {
@@ -348,37 +399,48 @@ li.row strong {
 }
 
 li.row:hover {
-       background-color: #F6F4D0;
+       background-color: #dee3e5;
 }
 
 li.row:hover dd {
-       border-left-color: #CCCCCC;
+       border-left-color: #a9b8c2;
 }
 
 .rtl li.row:hover dd {
-       border-right-color: #CCCCCC;
+       border-right-color: #a9b8c2;
        border-left-color: transparent;
 }
 
 li.header dt, li.header dd {
-       color: #FFFFFF;
+       color: #efefef;
 }
 
 /* Post body styles
 ----------------------------------------*/
-.postbody {
-       color: #333333;
+
+#topic-header {
+       background-color: #46357c;
+       background-image: url("./images/cellpic3.gif");
+}
+
+.postprofile.topic-header-author {
+       color: #efefef;
+}
+
+.postbody.topic-header-title {
+       color: #efefef;
 }
 
 /* Content container styles
 ----------------------------------------*/
+
 .content {
        color: #333333;
 }
 
 .content h2, .panel h2 {
-       color: #115098;
-       border-bottom-color:  #CCCCCC;
+       color: #333333;
+       border-bottom-color: #a9b8c2;
 }
 
 dl.faq dt {
@@ -396,30 +458,37 @@ dl.faq dt {
 
 /* Post signature */
 .signature {
-       border-top-color: #CCCCCC;
+       border-top-color: #a9b8c2;
+       color: #333333;
+       opacity: 0.7;
+}
+
+.signature:hover {
+       opacity: 1.0;
 }
 
 /* Post noticies */
 .notice {
-       border-top-color:  #CCCCCC;
+       border-top-color: #a9b8c2;
 }
 
 /* BB Code styles
 ----------------------------------------*/
+
 /* Quote block */
 blockquote {
-       background-color: #EBEADD;
-       border-color:#DBDBCE;
+       background-color: #dcdcdc;
+       border-color: #d1d7dc;
 }
 
 blockquote blockquote {
        /* Nested quotes */
-       background-color:#EFEED9;
+       background-color: #ededed;
 }
 
 blockquote blockquote blockquote {
        /* Nested quotes */
-       background-color: #EBEADD;
+       background-color: #fefefe;
 }
 
 /* Code block */
@@ -438,9 +507,10 @@ blockquote blockquote blockquote {
 
 /* Attachments
 ----------------------------------------*/
+
 .attachbox {
        background-color: #FFFFFF;
-       border-color:  #C9D2D8;
+       border-color: #C9D2D8;
 }
 
 .pm-message .attachbox {
@@ -464,7 +534,6 @@ blockquote blockquote blockquote {
 }
 
 /* Inline image thumbnails */
-
 dl.file dd {
        color: #666666;
 }
@@ -558,13 +627,20 @@ fieldset.polls dd div {
 
 /* Poster profile block
 ----------------------------------------*/
-.postprofile {
-       color: #666666;
-       border-color: #FFFFFF;
+
+.leftsided .postprofile {
+       border-right: 1px solid #d5dbe0 !important;
 }
 
-.pm .postprofile {
-       border-color: #DDDDDD;
+.postprofile .avatar img {
+       background-color: white;
+       border: 1px solid #d3d9de;
+       box-shadow: 0 0 7px grey;
+}
+
+.postprofile {
+       color: #666666;
+       border-color: #999999;
 }
 
 .postprofile strong {
@@ -572,7 +648,7 @@ fieldset.polls dd div {
 }
 
 .online {
-       background-image: url("./en/icon_user_online.gif");
+       background-image: url("./en/icon_user_online.png");
 }
 
 dd.profile-warnings {
@@ -583,38 +659,39 @@ dd.profile-warnings {
 --------------------------------------------------------------
 Colours and backgrounds for buttons.css
 -------------------------------------------------------------- */
+
 .button {
        border-color: #C7C3BF;
        background-color: #E9E9E9; /* Old browsers */ /* FF3.6+ */
        background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #E9E9E9 
100%);
-       background-image: linear-gradient(to bottom, #FFFFFF 0%,#E9E9E9 100%); 
/* W3C */
+       background-image: linear-gradient(to bottom, #FFFFFF 0%, #E9E9E9 100%); 
/* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#FFFFFF', endColorstr='#E9E9E9',GradientType=0 ); /* IE6-9 */
        box-shadow: 0 0 0 1px #FFFFFF inset;
        -webkit-box-shadow: 0 0 0 1px #FFFFFF inset;
-       color: #D31141;
+       color: #663399;
 }
 
 .button:hover,
 .button:focus {
-       border-color: #0A8ED0;
+       border-color: #663399;
        background-color: #FFFFFF; /* Old browsers */ /* FF3.6+ */
        background-image: -webkit-linear-gradient(top, #E9E9E9 0%, #FFFFFF 
100%);
-       background-image: linear-gradient(to bottom, #E9E9E9 0%,#FFFFFF 100%); 
/* W3C */
+       background-image: linear-gradient(to bottom, #E9E9E9 0%, #FFFFFF 100%); 
/* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#E9E9E9', endColorstr='#FFFFFF',GradientType=0 ); /* IE6-9 */
        text-shadow: 1px 1px 0 #FFFFFF, -1px -1px 0 #FFFFFF, -1px -1px 0 
rgba(188, 42, 77, 0.2);
+       color: #ff6633;
 }
 
-
 .button .icon,
 .button-secondary {
-       color: #8f8f8f;
+       color: #663399;
 }
 
 .button-secondary:focus,
 .button-secondary:hover,
 .button:focus .icon,
 .button:hover .icon {
-       color: #0A8ED0;
+       color: #ff6633;
 }
 
 .button-search:hover,
@@ -669,7 +746,7 @@ Colours and backgrounds for buttons.css
 }
 
 .search-header {
-       box-shadow: 0 0 10px #0075B0;
+       box-shadow: 0 0 50px #999999;
 }
 
 /* Icon images
@@ -744,7 +821,6 @@ Colours and backgrounds for buttons.css
 .topic_unread_locked                           { background-image: 
url("./images/topic_unread_locked.gif"); }
 .topic_unread_locked_mine                      { background-image: 
url("./images/topic_unread_locked_mine.gif"); }
 
-
 /*
 --------------------------------------------------------------
 Colours and backgrounds for cp.css
@@ -763,7 +839,7 @@ Colours and backgrounds for cp.css
 }
 
 ul.cplist {
-       border-top-color: #B5C1CB;
+       border-top-color: #a9b8c2;
 }
 
 .panel-container .panel li.header dd, .panel-container .panel li.header dt {
@@ -776,39 +852,43 @@ ul.cplist {
 }
 
 .cp-main .pm-message {
-       border-color: #DBDEE2;
-       background-color: #FFFFFF;
+       border-color: #333444;
+       background-color: #e0e0e0;
 }
 
 /* CP tabbed menu
 ----------------------------------------*/
+
 .tabs .tab > a {
-       background: #BACCD9;
-       color: #536482;
+       background: #ececec;
+       border: 1px solid #a9b8c2;
+       color: #663399;
 }
 
 .tabs .tab > a:hover {
-       background: #DDEDFB;
-       color: #D31141;
+       background: #dee3e5;
+       color: #ff6633;
 }
 
 .tabs .activetab > a,
 .tabs .activetab > a:hover {
-       background-color: #CADCEB; /* Old browsers */ /* FF3.6+ */
-       background-image: -webkit-linear-gradient(top, #E2F2FF 0%, #CADCEB 
100%);
-       background-image: linear-gradient(to bottom, #E2F2FF 0%,#CADCEB 100%); 
/* W3C */
-       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#E2F2FF', endColorstr='#CADCEB',GradientType=0 ); /* IE6-9 */
-       border-color: #CADCEB;
+       background-color: #ced7db; /* Old browsers */ /* FF3.6+ */
+       background-image: -webkit-linear-gradient(top, #ececec 0%, #ced7db 
100%);
+       background-image: linear-gradient(to bottom, #ececec 0%, #ced7db 100%); 
/* W3C */
+       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#ececec', endColorstr='#ced7db',GradientType=0 ); /* IE6-9 */
+       border-color: #663399;
+       border-bottom: none;
        box-shadow: 0 1px 1px #F2F9FF inset;
-       color: #333333;
+       color: #663399;
 }
 
 .tabs .activetab > a:hover {
-       color: #000000;
+       color: #a0a0d0;
 }
 
 /* Mini tabbed menu used in MCP
 ----------------------------------------*/
+
 .minitabs .tab > a {
        background-color: #E1EBF2;
 }
@@ -821,6 +901,7 @@ ul.cplist {
 
 /* Responsive tabs
 ----------------------------------------*/
+
 .responsive-tab .responsive-tab-link:before {
        border-color: #536482;
 }
@@ -834,45 +915,46 @@ ul.cplist {
 
 /* Link styles for the sub-section links */
 .navigation a {
-       color: #333;
-       background: #CADCEB; /* Old browsers */ /* FF3.6+ */
-       background: -webkit-linear-gradient(left, #B4C4D1 50%, #CADCEB 100%);
-       background: linear-gradient(to right, #B4C4D1 50%,#CADCEB 100%); /* W3C 
*/
-       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#B4C4D1', endColorstr='#CADCEB',GradientType=1 ); /* IE6-9 */
+       color: #663399;
+       background: #cbd5db; /* Old browsers */ /* FF3.6+ */
+       background: -webkit-linear-gradient(left, #cbd5db 50%, #ececec 100%);
+       background: linear-gradient(to right, #cbd5db 50%, #ececec 100%); /* 
W3C */
+       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#cbd5db', endColorstr='#ececec',GradientType=1 ); /* IE6-9 */
 }
 
 .rtl .navigation a {
-       background: #B4C4D1; /* Old browsers */ /* FF3.6+ */
-       background: -webkit-linear-gradient(left, #CADCEB 50%, #B4C4D1 100%);
-       background: linear-gradient(to right, #CADCEB 50%,#B4C4D1 100%); /* W3C 
*/
-       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#CADCEB', endColorstr='#B4C4D1',GradientType=1 ); /* IE6-9 */
+       background: #663399; /* Old browsers */ /* FF3.6+ */
+       background: -webkit-linear-gradient(left, #cbd5db 50%, #ececec 100%);
+       background: linear-gradient(to right, #cbd5db 50%, #ececec 100%); /* 
W3C */
+       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#cbd5db', endColorstr='#ececec',GradientType=1 ); /* IE6-9 */
 }
 
 .navigation a:hover {
-       background: #AABAC6;
-       color: #BC2A4D;
+       background: #c7d2d8;
+       color: #ff6633;
        filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
 }
 
 .navigation .active-subsection a {
-       background: #F9F9F9;
-       color: #D31141;
+       background: #ffffff;
+       color: #663399;
        filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
 }
 
 .navigation .active-subsection a:hover {
-       color: #D31141;
+       color: #a0a0d0;
 }
 
 @media only screen and (max-width: 900px), only screen and (max-device-width: 
900px)
 {
        #navigation a, .rtl #navigation a {
-               background: #B2C2CF;
+               background: #cbd5db;
        }
 }
 
 /* Preferences pane layout
 ----------------------------------------*/
+
 .panel-container h2 {
        color: #333333;
 }
@@ -882,20 +964,23 @@ ul.cplist {
 }
 
 .cp-main .pm {
-       background-color: #FFFFFF;
+       background-color: #e0e0e0;
 }
 
 /* Friends list */
 .cp-mini {
-       background-color: #EEF5F9;
+       background-color: #ffffff;
+       border: 1px solid #a9b8c2;
 }
 
 dl.mini dt {
+       border-bottom: 1px solid #a9b8c2;
        color: #425067;
 }
 
 /* PM Styles
 ----------------------------------------*/
+
 /* PM Message history */
 .current {
        color: #000000 !important;
@@ -947,7 +1032,11 @@ select {
 }
 
 label {
-       color: #425067;
+       color: #333333;
+}
+
+.display-options label {
+       color: #efefef;
 }
 
 option.disabled-option {
@@ -956,6 +1045,7 @@ option.disabled-option {
 
 /* Definition list layout for forms
 ---------------------------------------- */
+
 dd label {
        color: #333;
 }
@@ -995,8 +1085,9 @@ fieldset.quick-login input.inputbox {
 
 /* Input field styles
 ---------------------------------------- */
+
 .inputbox {
-       background-color: #FFFFFF;
+       background-color: #f5f5f5;
        border-color: #B4BAC0;
        color: #333333;
 }
@@ -1025,7 +1116,6 @@ fieldset.quick-login input.inputbox {
        color: transparent;
 }
 
-
 /* Form button styles
 ---------------------------------------- */
 
@@ -1033,7 +1123,7 @@ a.button1, input.button1, input.button3, a.button2, 
input.button2 {
        color: #000;
        background-color: #EFEFEF; /* Old browsers */ /* FF3.6+ */
        background-image: -webkit-linear-gradient(top, #D2D2D2 0%, #EFEFEF 
100%);
-       background-image: linear-gradient(to bottom, #D2D2D2 0%,#EFEFEF 100%); 
/* W3C */
+       background-image: linear-gradient(to bottom, #D2D2D2 0%, #EFEFEF 100%); 
/* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#D2D2D2', endColorstr='#EFEFEF',GradientType=0 ); /* IE6-9 */
 }
 
@@ -1061,7 +1151,7 @@ a.button1:hover, input.button1:hover, a.button2:hover, 
input.button2:hover, inpu
        color: #D31141;
        background-color: #D2D2D2; /* Old browsers */ /* FF3.6+ */
        background-image: -webkit-linear-gradient(top, #EFEFEF 0%, #D2D2D2 
100%);
-       background-image: linear-gradient(to bottom, #EFEFEF 0%,#D2D2D2 100%); 
/* W3C */
+       background-image: linear-gradient(to bottom, #EFEFEF 0%, #D2D2D2 100%); 
/* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#EFEFEF', endColorstr='#D2D2D2',GradientType=0 ); /* IE6-9 */
 }
 
@@ -1077,10 +1167,12 @@ input.disabled {
 
 /* jQuery popups
 ---------------------------------------- */
+
 .phpbb_alert {
        background-color: #FFFFFF;
        border-color: #999999;
 }
+
 .darken {
        background-color: #000000;
 }
@@ -1095,7 +1187,7 @@ input.disabled {
 }
 
 .dropdown-extended ul li:hover {
-       background-color: #CFE1F6;
+       background-color: #e5e8ea;
        color: #000000;
 }
 
@@ -1111,9 +1203,9 @@ input.disabled {
 
 .dropdown-extended .header {
        background-color: #F1F8FF; /* Old browsers */ /* FF3.6+ */
-       background-image: -webkit-linear-gradient(top, #F1F8FF 0%, #CADCEB 
100%);
-       background-image: linear-gradient(to bottom, #F1F8FF 0%,#CADCEB 100%); 
/* W3C */
-       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#F1F8FF', endColorstr='#CADCEB',GradientType=0 ); /* IE6-9 */
+       background-image: -webkit-linear-gradient(top, #F1F8FF 0%, #e5e8ea 
100%);
+       background-image: linear-gradient(to bottom, #F1F8FF 0%, #e5e8ea 100%); 
/* W3C */
+       filter: progid:DXImageTransform.Microsoft.gradient( 
startColorstr='#F1F8FF', endColorstr='#e5e8ea',GradientType=0 ); /* IE6-9 */
 }
 
 .dropdown .pointer {
@@ -1129,7 +1221,7 @@ input.disabled {
 }
 
 .dropdown .dropdown-contents {
-       background: #fff;
+       background: #000000;
        border-color: #B9B9B9;
        box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
 }
@@ -1138,6 +1230,10 @@ input.disabled {
        box-shadow: 1px 0 5px rgba(0, 0, 0, 0.2);
 }
 
+.dropdown-contents a {
+       color: #a0a0d0;
+}
+
 .dropdown li, .dropdown li li {
        border-color: #DCDCDC;
 }

diff --git a/theme/common.css b/theme/common.css
index a0dc5e043..79a9fa86b 100644
--- a/theme/common.css
+++ b/theme/common.css
@@ -11,7 +11,7 @@ body {
        font-size: 10px;
        line-height: normal;
        margin: 0;
-       padding: 12px 0;
+       padding: 0;
        word-wrap: break-word;
        -webkit-print-color-adjust: exact;
 }
@@ -138,18 +138,10 @@ a:hover   { text-decoration: underline; }
 /* Main blocks
 ---------------------------------------- */
 .wrap {
-       border: 1px solid transparent;
-       border-radius: 8px;
        margin: 0 auto;
-       max-width: 1152px;
+       max-width: 100%;
        min-width: 625px;
-       padding: 15px;
-}
-
-@media only screen and (max-width: 1220px), only screen and (max-device-width: 
1220px) {
-       .wrap {
-               margin: 0 12px;
-       }
+       padding: 0 10px 10px
 }
 
 .page-body {
@@ -168,7 +160,8 @@ a:hover     { text-decoration: underline; }
 .logo {
        float: left;
        width: auto;
-       padding: 10px 13px 0 10px;
+       max-height: 109px;
+       padding: 0 0;
 }
 
 .logo:hover {
@@ -177,8 +170,8 @@ a:hover     { text-decoration: underline; }
 
 .site_logo {
        display: inline-block;
-       width: 149px;
-       height: 52px;
+       height: 109px;
+       width: 532px;
 }
 
 /* Site description and logo */
@@ -191,45 +184,33 @@ a:hover   { text-decoration: underline; }
        margin-right: 0;
 }
 
-/* Round cornered boxes and backgrounds
+/* Boxes and Backgrounds
 ---------------------------------------- */
 .headerbar {
-       margin-bottom: 4px;
-       padding: 5px;
-       border-radius: 7px;
+       margin: 0 auto;
+       max-width: 100%;
+       padding: 0 0;
 }
 
 .navbar {
-       padding: 3px 10px;
-       border-radius: 7px;
-}
-
-.forabg {
-       margin-bottom: 4px;
-       padding: 5px;
-       clear: both;
-       border-radius: 7px;
+       padding: 0 5px;
 }
 
-.forumbg {
+.forabg, .forumbg {
        margin-bottom: 4px;
-       padding: 5px;
        clear: both;
-       border-radius: 7px;
 }
 
 .panel {
        margin-bottom: 4px;
        padding: 5px 10px;
-       border-radius: 7px;
 }
 
 .post {
-       padding: 5px 10px;
+       padding: 5px 5px;
        margin-bottom: 4px;
        background-repeat: no-repeat;
        background-position: 100% 0;
-       border-radius: 7px;
        position: relative;
 }
 
@@ -237,6 +218,21 @@ a:hover    { text-decoration: underline; }
        margin: 5px 5px 2px 5px;
 }
 
+.stats-area {
+       margin: 2px 0 1px;
+}
+
+.stats-header h3 {
+       margin: 0 !important;
+       padding: 8px 10px;
+       text-align: center;
+       text-transform: uppercase;
+}
+
+.stats-data {
+       padding: 0 10px 5px;
+}
+
 /* Horizontal lists
 ----------------------------------------*/
 .navbar ul.linklist {
@@ -667,7 +663,7 @@ table.table1 tbody th {
 
 /* Specific column styles */
 table.table1 .name             { text-align: left; }
-table.table1 .center           { text-align: center; }
+table.table1 .center   { text-align: center; }
 table.table1 .reportby { width: 15%; }
 table.table1 .posts            { text-align: center; width: 7%; }
 table.table1 .joined   { text-align: left; width: 15%; }
@@ -983,7 +979,6 @@ fieldset.fields1 dl.pmlist dd.recipients {
 .copyright {
        font-size: 10px;
        text-align: center;
-       padding: 10px;
 }
 
 .footer-row {

diff --git a/theme/content.css b/theme/content.css
index 807633864..1e05211de 100644
--- a/theme/content.css
+++ b/theme/content.css
@@ -100,12 +100,14 @@ li.row strong {
 li.header dt, li.header dd {
        line-height: 1em;
        border-left-width: 0;
-       margin: 2px 0 4px 0;
+       margin: 8px 0 6px 0;
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 1em;
-       font-family: Arial, Helvetica, sans-serif;
+       font-family: Verdana, Arial, Helvetica, sans-serif;
+       text-align: center;
        text-transform: uppercase;
+       font-weight: bold;
 }
 
 li.header dt {
@@ -136,8 +138,6 @@ li.header dl.row-item dt .list-inner {
 }
 
 /* Forum list column styles */
-.row .list-inner { padding: 4px 0; }
-
 dl.row-item {
        background-position: 10px 50%;          /* Position of folder icon */
        background-repeat: no-repeat;
@@ -228,10 +228,40 @@ dd.option {
 
 /* Post body styles
 ----------------------------------------*/
+#topic-header {
+       display: block;
+       font-weight: bold;
+       text-transform: uppercase;
+}
+
+#topic-header .post.has-profile {
+       border: none;
+}
+
+.topic-header-title, .topic-header-author {
+       text-align: center;
+}
+
+.topic-header-title {
+       width: 77%;
+}
+
+.topic-header-author {
+       border: none !important;
+       min-height: 0px;
+       width: 18%;
+}
+
+.postprofile.topic-header-author {
+       margin: 6px 0 0 0;
+       min-height: 0px;
+       width: 140px;
+}
+
 .postbody {
-       padding: 0;
+       padding: 5px;
        line-height: 1.48em;
-       width: 76%;
+       width: 100%;
        float: left;
        position: relative;
 }
@@ -242,13 +272,13 @@ dd.option {
 
 .postbody h3.first {
        /* The first post on the page uses this */
-       font-size: 1.7em;
+       font-size: 1.2em;
 }
 
 .postbody h3 {
        /* Postbody requires a different h3 format - so change it here */
        float: left;
-       font-size: 1.5em;
+       font-size: 1.2em;
        padding: 2px 0 0 0;
        margin-top: 0 !important;
        margin-bottom: 0.3em !important;
@@ -701,15 +731,14 @@ fieldset.polls dd div {
        margin: 5px 0 10px 0;
        min-height: 80px;
        border: 1px solid transparent;
-       border-width: 0 0 0 1px;
-       width: 22%;
-       float: right;
+       border-width: 1px 1px 0 0;
+       width: 140px;
+       float: left;
        display: inline;
 }
 
 .postprofile dd, .postprofile dt {
        line-height: 1.2em;
-       margin-left: 8px;
 }
 
 .postprofile dd {
@@ -721,7 +750,7 @@ fieldset.polls dd div {
        font-weight: normal;
 }
 
-.postprofile dt.no-profile-rank, .postprofile dd.profile-rank, .postprofile 
.search-result-date {
+.postprofile dt.no-profile-rank, .postprofile .search-result-date {
        margin-bottom: 10px;
 }
 
@@ -731,6 +760,22 @@ fieldset.polls dd div {
        overflow: hidden;
 }
 
+.avatar-container {
+       max-width: 130px;
+}
+
+.has-profile, .has-avatar {
+       padding-top: 5px;
+}
+
+.no-profile, .no-avatar {
+       padding-top: 5px;
+}
+
+.profile-rank {
+       padding-bottom: 5px;
+}
+
 .postprofile .avatar {
        display: block;
        float: left;
@@ -743,6 +788,10 @@ fieldset.polls dd div {
        max-width: 100%;
 }
 
+.profile-posts {
+       padding-top: 5px;
+}
+
 .postprofile .profile-posts a {
        font-weight: normal;
 }

diff --git a/theme/en/icon_user_online.png b/theme/en/icon_user_online.png
new file mode 100644
index 000000000..488e3bb99
Binary files /dev/null and b/theme/en/icon_user_online.png differ

diff --git a/theme/en/stylesheet.css b/theme/en/stylesheet.css
index 604b29948..faab4aa73 100644
--- a/theme/en/stylesheet.css
+++ b/theme/en/stylesheet.css
@@ -1,2 +1,2 @@
 /* Online image */
-.online { background-image: url("./icon_user_online.gif"); }
+.online { background-image: url("./icon_user_online.png"); }

diff --git a/theme/images/cellpic3.gif b/theme/images/cellpic3.gif
new file mode 100644
index 000000000..4099d1cc9
Binary files /dev/null and b/theme/images/cellpic3.gif differ

diff --git a/theme/images/site_logo.png b/theme/images/site_logo.png
new file mode 100644
index 000000000..f0daf7b49
Binary files /dev/null and b/theme/images/site_logo.png differ

diff --git a/theme/responsive.css b/theme/responsive-pm.css
similarity index 87%
copy from theme/responsive.css
copy to theme/responsive-pm.css
index ca4054c27..a3e31f057 100644
--- a/theme/responsive.css
+++ b/theme/responsive-pm.css
@@ -7,6 +7,7 @@
        }
 }
 
+
 /* Notifications list
 ----------------------------------------*/
 @media (max-width: 350px) {
@@ -25,16 +26,16 @@
        }
 
        .action-bar .search-box .inputbox ::-moz-placeholder {
-       content: "Search...";
-       }
+               content: "Search...";
+       }
 
-       .action-bar .search-box .inputbox :-ms-input-placeholder {
-               content: "Search...";
-       }
+       .action-bar .search-box .inputbox :-ms-input-placeholder {
+               content: "Search...";
+       }
 
-       .action-bar .search-box .inputbox ::-webkit-input-placeholder {
-               content: "Search...";
-       }
+       .action-bar .search-box .inputbox ::-webkit-input-placeholder {
+               content: "Search...";
+       }
 }
 
 @media (max-width: 500px) {
@@ -72,7 +73,7 @@
 
        .action-bar > div {
                margin-bottom: 5px;
-       }
+       }
 
        .action-bar > .pagination {
                float: none;
@@ -119,6 +120,8 @@
 }
 
 @media (max-width: 700px) {
+       #topic-header { display: none; }
+
        .responsive-hide { display: none !important; }
        .responsive-show { display: block !important; }
        .responsive-show-inline { display: inline !important; }
@@ -554,30 +557,92 @@
 }
 
 @media (min-width: 700px) {
-       .postbody { width: 70%; }
+       .postbody { width: 100%; }
 }
 
-@media (min-width: 850px) {
+@media (min-width: 701px) {
        .postbody { width: 76%; }
 }
 
-@media (max-width: 850px) {
-       .postprofile { width: 28%; }
+@media (min-width: 750px) {
+       .postbody { width: 77%; }
+}
+
+@media (min-width: 800px) {
+       .postbody { width: 79%; }
+}
+
+@media (min-width: 850px) {
+       .postbody { width: 80%; }
+}
+
+@media (min-width: 900px) {
+       .postbody { width: 81%; }
+}
+
+@media (min-width: 901px) {
+       .postbody { width: 77%; }
+}
+
+@media (min-width: 950px) {
+       .postbody { width: 78%; }
+}
+
+@media (min-width: 1000px) {
+       .postbody { width: 79%; }
+}
+
+@media (min-width: 1100px) {
+       .postbody { width: 81%; }
+}
+
+@media (min-width: 1200px) {
+       .postbody { width: 83%; }
+}
+
+@media (min-width: 1300px) {
+       .postbody { width: 84%; }
+}
+
+@media (min-width: 1400px) {
+       .postbody { width: 85%; }
+}
 
+@media (min-width: 1500px) {
+       .postbody { width: 86%; }
+}
+
+@media (min-width: 1600px) {
+       .postbody { width: 87%; }
+}
+
+@media (min-width: 1700px) {
+       .postbody { width: 88%; }
+}
+
+@media (min-width: 1800px) {
+       .postbody { width: 89%; }
+}
+
+@media (min-width: 1900px) {
+       .postbody { width: 89%; }
+}
 
+@media (min-width: 2000px) {
+       .postbody { width: 90%; }
 }
 
 @media (min-width: 701px) and (max-width: 950px) {
 
        ul.topiclist dt {
-       margin-right: -410px;
+               margin-right: -410px;
        }
 
        ul.topiclist dt .list-inner {
-       margin-right: 410px;
+               margin-right: 410px;
        }
 
        dd.posts, dd.topics, dd.views {
-       width: 80px;
+               width: 80px;
        }
 }

diff --git a/theme/responsive.css b/theme/responsive.css
index ca4054c27..9d603e357 100644
--- a/theme/responsive.css
+++ b/theme/responsive.css
@@ -7,6 +7,7 @@
        }
 }
 
+
 /* Notifications list
 ----------------------------------------*/
 @media (max-width: 350px) {
@@ -119,6 +120,8 @@
 }
 
 @media (max-width: 700px) {
+       #topic-header { display: none; }
+
        .responsive-hide { display: none !important; }
        .responsive-show { display: block !important; }
        .responsive-show-inline { display: inline !important; }
@@ -554,30 +557,88 @@
 }
 
 @media (min-width: 700px) {
-       .postbody { width: 70%; }
+       .postbody { width: 100%; }
 }
 
-@media (min-width: 850px) {
+@media (min-width: 701px) {
        .postbody { width: 76%; }
 }
 
-@media (max-width: 850px) {
-       .postprofile { width: 28%; }
+@media (min-width: 750px) {
+       .postbody { width: 78%; }
+}
+
+@media (min-width: 800px) {
+       .postbody { width: 79%; }
+}
+
+@media (min-width: 850px) {
+       .postbody { width: 80%; }
+}
+
+@media (min-width: 900px) {
+       .postbody { width: 81%; }
+}
+
+@media (min-width: 950px) {
+       .postbody { width: 82%; }
+}
+
+@media (min-width: 1000px) {
+       .postbody { width: 83%; }
+}
+
+@media (min-width: 1100px) {
+       .postbody { width: 84%; }
+}
+
+@media (min-width: 1200px) {
+       .postbody { width: 85%; }
+}
+
+@media (min-width: 1300px) {
+       .postbody { width: 86%; }
+}
+
+@media (min-width: 1400px) {
+       .postbody { width: 87%; }
+}
+
+@media (min-width: 1500px) {
+       .postbody { width: 88%; }
+}
+
+@media (min-width: 1600px) {
+       .postbody { width: 89%; }
+}
+
+@media (min-width: 1700px) {
+       .postbody { width: 90%; }
+}
+
+@media (min-width: 1800px) {
+       .postbody { width: 91%; }
+}
 
+@media (min-width: 1900px) {
+       .postbody { width: 92%; }
+}
 
+@media (min-width: 2000px) {
+       .postbody { width: 93%; }
 }
 
 @media (min-width: 701px) and (max-width: 950px) {
 
        ul.topiclist dt {
-       margin-right: -410px;
+               margin-right: -410px;
        }
 
        ul.topiclist dt .list-inner {
-       margin-right: 410px;
+               margin-right: 410px;
        }
 
        dd.posts, dd.topics, dd.views {
-       width: 80px;
+               width: 80px;
        }
 }

Reply via email to