diff --git a/app/views/category/_article.rhtml b/app/views/category/_article.rhtml
index 83ee999..6f7c9e0 100644
--- a/app/views/category/_article.rhtml
+++ b/app/views/category/_article.rhtml
@@ -1 +1,9 @@
-<li><%= _('"%s", by %s. Last update: %s.') % [link_to(article.title, article.url), link_to(article.last_changed_by.name, article.last_changed_by.url), show_date(article.updated_on) ] %></li>
+<li>
+  <strong><%= link_to(article.title, article.url) %></strong>
+  <div class="item_meta">
+    <span class="cat_item_by"><%=
+      _('by %s') % link_to(article.last_changed_by.name, article.last_changed_by.url)
+    %></span>
+    <span class="cat_item_update"><%= _('Last update: %s.') % show_date(article.updated_on) %></span>
+  </div>
+</li>
diff --git a/app/views/category/_category.rhtml b/app/views/category/_category.rhtml
index de35a9d..ae00189 100644
--- a/app/views/category/_category.rhtml
+++ b/app/views/category/_category.rhtml
@@ -1,16 +1,24 @@
 <h2><%= _('Recent articles') %></h2>
-<ul>
+<ul class="recent_on_cat recent_articles">
   <%= render :partial => 'article', :collection => @recent_articles %>
 </ul>
 
 <h2><%= _('Recent Comments') %></h2>
-<ul>
+<ul class="recent_on_cat recent_comments">
 <% @recent_comments.each do |comment| %>
-  <li><%= _('"%{comment}" by %{author} on "%{article}"') % { :comment => link_to(comment.title, comment.url), :article => link_to(comment.article.title, comment.article.url), :author => comment.author_name } %></li>
+  <li>
+    <strong><%= link_to(comment.title, comment.url) %></strong>
+    <div class="item_meta">
+      <%= _('by %{author} on "%{article}"') % {
+                :comment => link_to(comment.title, comment.url),
+                :article => link_to(comment.article.title, comment.article.url),
+                :author => comment.author_name } %>
+    </div>
+  </li>
 <% end %>
 </ul>
 
 <h2><%= _('Most commented articles') %></h2>
-<ul>
+<ul class="most_commented">
   <%= render :partial => 'article', :collection => @most_commented_articles %>
 </ul>
diff --git a/app/views/category/view.rhtml b/app/views/category/view.rhtml
index 4ba4e26..25465d1 100644
--- a/app/views/category/view.rhtml
+++ b/app/views/category/view.rhtml
@@ -6,7 +6,9 @@
 
   <h1 id="categiry-name"><%= _('Category: %s') % @category.name %></h1>
 
+  <div class="category_itens">
   <%= render :partial => @category.class.name.underscore %>
+  </div><!-- end class="category_itens" -->
 
   <div id="category-childs">
     <h2> <%= _('Sub-categories')  %> </h2>
diff --git a/app/views/layouts/application.rhtml b/app/views/layouts/application.rhtml
index 4f6f355..965d19a 100644
--- a/app/views/layouts/application.rhtml
+++ b/app/views/layouts/application.rhtml
@@ -15,8 +15,10 @@
     %>
     <%=
       # Load the principal css files:
-      stylesheet_import( %w( common help menu article button search blocks forms login-box ) ) +
-      "\n" +
+      stylesheet_import( %w( common help menu article button search blocks forms login-box )
+                         ) + "\n" +
+      stylesheet_import( %w( common help menu article button search blocks forms login-box ),
+                         :themed_source => true ) + "\n" +
       # Load the boxes's css file if each exists:
       import_blocks_stylesheets +
       # Load the controller's css file if it exists:
diff --git a/public/designs/themes/default/images/bg-top-azul.png b/public/designs/themes/default/images/bg-top-azul.png
new file mode 100644
index 0000000..32a5e88
Binary files /dev/null and b/public/designs/themes/default/images/bg-top-azul.png differ
diff --git a/public/designs/themes/default/images/bg-top-cinza.jpg b/public/designs/themes/default/images/bg-top-cinza.jpg
new file mode 100644
index 0000000..ae5798a
Binary files /dev/null and b/public/designs/themes/default/images/bg-top-cinza.jpg differ
diff --git a/public/designs/themes/default/images/bg-top-laranja.png b/public/designs/themes/default/images/bg-top-laranja.png
new file mode 100644
index 0000000..1b5a988
Binary files /dev/null and b/public/designs/themes/default/images/bg-top-laranja.png differ
diff --git a/public/designs/themes/default/images/bg-top-lilas.png b/public/designs/themes/default/images/bg-top-lilas.png
new file mode 100644
index 0000000..37c91f3
Binary files /dev/null and b/public/designs/themes/default/images/bg-top-lilas.png differ
diff --git a/public/designs/themes/default/images/bg-top-verde.png b/public/designs/themes/default/images/bg-top-verde.png
new file mode 100644
index 0000000..e64d058
Binary files /dev/null and b/public/designs/themes/default/images/bg-top-verde.png differ
diff --git a/public/designs/themes/default/images/bg-top-vermelho.png b/public/designs/themes/default/images/bg-top-vermelho.png
new file mode 100644
index 0000000..9464e9c
Binary files /dev/null and b/public/designs/themes/default/images/bg-top-vermelho.png differ
diff --git a/public/designs/themes/default/stylesheets/common.css b/public/designs/themes/default/stylesheets/common.css
new file mode 100644
index 0000000..c5d9514
--- /dev/null
+++ b/public/designs/themes/default/stylesheets/common.css
@@ -0,0 +1,154 @@
+
+body.noosfero {
+  /*
+  ** a imagem de fundo colorida é mais pesada, por isso carregamos
+  ** essa cinza mais leve antes para melhorar a esperiência do usuário.
+  */
+  background-position: 50% 25px;
+  background-repeat: repeat-x;
+  background-image: url(../images/bg-top-cinza.jpg);
+}
+
+#wrap {
+  background-position: 50% 22px;
+  background-repeat: repeat-x;
+  background-image: url(../images/bg-top-azul.png);
+}
+
+body.category1 #wrap { background-image: url("../images/bg-top-laranja.png");  }
+body.category2 #wrap { background-image: url("../images/bg-top-verde.png");    }
+body.category3 #wrap { background-image: url("../images/bg-top-lilas.png");    }
+body.category4 #wrap { background-image: url("../images/bg-top-vermelho.png"); }
+
+#path_category {
+  position: absolute;
+  top: 40px;
+  left: 30px;
+  font-weight: bold;
+  z-index: 10;
+}
+
+a                        { color: #05B }
+body.category2 a         { color: #270 }
+a:visited                { color: #68C }
+body.category2 a:visited { color: #8A6 }
+a:hover, a:active        { color: #08F }
+body.category2 a:hover   { color: #5C0 }
+
+/* List of Category Item */
+
+.category_itens ul a {
+  text-decoration: none;
+}
+
+.category_itens .item_meta {
+  font-size: 12px;
+  padding: 0px 0px 5px 0px;
+}
+
+.category_itens .cat_item_update {
+  color: #999;
+}
+
+/* file manager (big) style */
+
+div.file-manager {
+  clear: both;
+}
+
+div.file-manager
+div.file-manager-button {
+  float: left;
+  width: 140px;
+  text-align: center;
+  margin-right: 0.5em;
+  margin-top: 0.5em;
+}
+
+div.file-manager
+div.file-manager-button a img {
+  border: none;
+}
+
+div.file-manager
+div.file-manager-button a {
+  border: 1px solid #e0e0e0;
+  display: block;
+  padding: 3px;
+  height: 90px;
+  overflow: hidden;
+  background: white;
+  font-size: 90%;
+}
+
+div.file-manager
+div.file-manager-button a:hover {
+  border: 1px solid #006;
+  background: #acf;
+  color: #006;
+}
+
+/************* file manager (small) style *****************/
+.file-manager-small {
+  background: white;
+  border: 1px solid gray;
+}
+
+.file-manager-title {
+  font-weight: bold;
+  border: 1px solid gray;
+  border-bottom: none;
+  border-top: none;
+  padding: 2px;
+  background: #579;
+  color: white;
+  height: 24px;
+}
+
+.file-manager-small ul {
+  padding: 5px;
+  margin: 0px;
+}
+
+.file-manager-small li {
+  list-style: none;
+  padding: 2px;
+}
+
+div.file-manager-small
+div.file-manager-button a div {
+  display: inline;
+}
+
+div.file-manager-small
+div.file-manager-button a img {
+  border: none;
+  vertical-align: middle;
+}
+
+div.file-manager-small
+div.file-manager-button a {
+  border: 1px solid transparent;
+}
+
+div.file-manager-small
+div.file-manager-button a:hover {
+  border: 1px solid #006;
+  background: #acf;
+  color: #006;
+}
+
+.file-manager-small {
+  position: relative;
+}
+
+.file-manager-small .file-manager-controls {
+  border-top: 1px solid gray;
+  padding: 4px;
+}
+
+.file-manager-small .file-manager-controls * {
+  text-align: right;
+}
+
+
diff --git a/public/images/bg-top-azul.png b/public/images/bg-top-azul.png
deleted file mode 100644
index 32a5e88..0000000
Binary files a/public/images/bg-top-azul.png and /dev/null differ
diff --git a/public/images/bg-top-cinza.jpg b/public/images/bg-top-cinza.jpg
deleted file mode 100644
index ae5798a..0000000
Binary files a/public/images/bg-top-cinza.jpg and /dev/null differ
diff --git a/public/images/bg-top-laranja.png b/public/images/bg-top-laranja.png
deleted file mode 100644
index 1b5a988..0000000
Binary files a/public/images/bg-top-laranja.png and /dev/null differ
diff --git a/public/images/bg-top-lilas.png b/public/images/bg-top-lilas.png
deleted file mode 100644
index 37c91f3..0000000
Binary files a/public/images/bg-top-lilas.png and /dev/null differ
diff --git a/public/images/bg-top-verde.png b/public/images/bg-top-verde.png
deleted file mode 100644
index e64d058..0000000
Binary files a/public/images/bg-top-verde.png and /dev/null differ
diff --git a/public/images/bg-top-vermelho.png b/public/images/bg-top-vermelho.png
deleted file mode 100644
index 9464e9c..0000000
Binary files a/public/images/bg-top-vermelho.png and /dev/null differ
diff --git a/public/images/bg_bgheader.png b/public/images/bg_bgheader.png
deleted file mode 100644
index 9320cdc..0000000
Binary files a/public/images/bg_bgheader.png and /dev/null differ
diff --git a/public/stylesheets/button.css b/public/stylesheets/button.css
index 2a08ca5..fa29b91 100644
--- a/public/stylesheets/button.css
+++ b/public/stylesheets/button.css
@@ -1,6 +1,6 @@
 
-a.button,
-a.button:visited,
+body.noosfero a.button,
+body.noosfero a.button:visited,
 input.button {
   margin: 0px 2px;
   background-repeat: no-repeat;
@@ -31,8 +31,8 @@ input.button {
   padding-right: 4px;
 }
 
-a.button.with-text,
-a.button.with-text:visited,
+body.noosfero a.button.with-text,
+body.noosfero a.button.with-text:visited,
 input.button.with-text {
   background-color: #EEE;
   padding: 3px 2px 3px 22px;
@@ -47,23 +47,23 @@ input.button.with-text {
   padding: 0px 2px 2px 20px;
   background-position: 3px 50%;
 }
-.msie a.button.with-text,
-.msie a.button.with-text:visited,
-.msie input.button.with-text {
+body.noosfero.msie a.button.with-text,
+body.noosfero.msie a.button.with-text:visited,
+body.noosfero.msie input.button.with-text {
   padding: 0px 2px 0px 22px;
   background-position: 3px 50%;
   line-height: 20px;
   margin: 2px;
 }
-.msie input.button.with-text {
+body.noosfero.msie input.button.with-text {
   line-height: 16px;
   padding: 0px 0px 1px 15px;
   background-position: 2px 50%;
 }
 
-a.button:hover,
+body.noosfero a.button:hover,
 input.button:hover,
-a.button.with-text:hover,
+body.noosfero a.button.with-text:hover,
 input.button.with-text:hover {
   border: 1px solid #678;
   background-color: #CDE;
diff --git a/public/stylesheets/common.css b/public/stylesheets/common.css
index 945f6e9..68d326f 100644
--- a/public/stylesheets/common.css
+++ b/public/stylesheets/common.css
@@ -4,15 +4,6 @@ body {
   font-family: Verdana, Sans-Serif;
   font-size: 14px;
 }
-body.noosfero {
-  /*
-  ** a imagem de fundo colorida é mais pesada, por isso carregamos
-  ** essa cinza mais leve antes para melhorar a esperiência do usuário.
-  */
-  background-position: 50% 25px;
-  background-repeat: repeat-x;
-  background-image: url(../images/bg-top-cinza.jpg);
-}
 
 #beta-tag {
   position: absolute;
@@ -26,25 +17,6 @@ body.noosfero {
   display: none;
 }
 
-#wrap {
-  background-position: 50% 22px;
-  background-repeat: repeat-x;
-  background-image: url(../images/bg-top-azul.png);
-}
-
-body.category1 #wrap { background-image: url("../images/bg-top-laranja.png");  }
-body.category2 #wrap { background-image: url("../images/bg-top-verde.png");    }
-body.category3 #wrap { background-image: url("../images/bg-top-lilas.png");    }
-body.category4 #wrap { background-image: url("../images/bg-top-vermelho.png"); }
-
-#path_category {
-  position: absolute;
-  top: 40px;
-  left: 30px;
-  font-weight: bold;
-  z-index: 10;
-}
-
 #header {
   height: 60px;
 }
@@ -56,7 +28,6 @@ body.category4 #wrap { background-image: url("../images/bg-top-vermelho.png"); }
   padding: 0em;
 }
 
-
 #notice {
   cursor: pointer;
 }
@@ -77,16 +48,6 @@ body.category4 #wrap {
   border-color: #B80000;
 }
 
-a {
-  color: #05B;
-}
-a:visited {
-  color: #68C;
-}
-a:hover a:active {
-  color: #08F;
-}
-
 #environment_identification {
   position: absolute !important;
   background: url("../images/bg_blue_logo.png") 5px no-repeat !important;
@@ -162,107 +123,6 @@ div#footer li {
   height: 20px;
 }
 
-/* file manager (big) style */
-
-div.file-manager {
-  clear: both;
-}
-
-div.file-manager
-div.file-manager-button {
-  float: left;
-  width: 140px;
-  text-align: center;
-  margin-right: 0.5em;
-  margin-top: 0.5em;
-}
-
-div.file-manager
-div.file-manager-button a img {
-  border: none;
-}
-
-div.file-manager
-div.file-manager-button a {
-  border: 1px solid #e0e0e0;
-  display: block;
-  padding: 3px;
-  height: 90px;
-  overflow: hidden;
-  background: white;
-  font-size: 90%;
-}
-
-div.file-manager
-div.file-manager-button a:hover {
-  border: 1px solid #006;
-  background: #acf;
-  color: #006;
-}
-
-/************* file manager (small) style *****************/
-.file-manager-small {
-  background: white;
-  border: 1px solid gray;
-}
-
-.file-manager-title {
-  font-weight: bold;
-  border: 1px solid gray;
-  border-bottom: none;
-  border-top: none;
-  padding: 2px;
-  background: #579;
-  color: white;
-  height: 24px;
-}
-
-.file-manager-small ul {
-  padding: 5px;
-  margin: 0px;
-}
-
-.file-manager-small li {
-  list-style: none;
-  padding: 2px;
-}
-
-div.file-manager-small
-div.file-manager-button a div {
-  display: inline;
-}
-
-div.file-manager-small
-div.file-manager-button a img {
-  border: none;
-  vertical-align: middle;
-}
-
-div.file-manager-small
-div.file-manager-button a {
-  border: 1px solid transparent;
-}
-
-div.file-manager-small
-div.file-manager-button a:hover {
-  border: 1px solid #006;
-  background: #acf;
-  color: #006;
-}
-
-.file-manager-small {
-  position: relative;
-}
-
-.file-manager-small .file-manager-controls {
-  border-top: 1px solid gray;
-  padding: 4px;
-}
-
-.file-manager-small .file-manager-controls * {
-  text-align: right;
-}
-
 
 /*********************************************************/
 
--
libgit2 0.21.2