Merge branch 'restructuring_css' of gitlab.com:softwarepublico/noosfero-spb-theme into tabs

Conflicts: style.css

Merge branch 'restructuring_css' of gitlab.com:softwarepublico/noosfero-spb-theme into tabs
Conflicts: style.css
Juliana
2 parents 6b94fcca 6961604a
Showing 22 changed files with 1628 additions and 592 deletions Show diff stats
css/administration-panel.css
css/animate.css
css/article-page.css
css/community-pages.css
css/edition-pages.css
css/home-page.css
css/left-bar.css
css/main-content.css
css/news-page.css
css/overwriting-base-theme.css
css/popover.css
css/search-pages.css
css/software-catalog-page.css
css/software-pages.css
css/tooltip.css
css/use-report.css
footer.html.erb
header.html.erb
images/blog-teste.png
style.css
@@ -0,0 +1,142 @@
+/*** Environment Admin Pages - General Rules ***/
+.action-admin_panel-index #content .main-block h2,
+.controller-features #content .main-block h2{
+  font-family: Arial;
+  font-size: 22px;
+  font-weight: 700;
+  line-height: 21px;
+}
+
+/* Environment Settings */
+
+/* Profile tab */
+
+.action-admin_panel-site_info .main-content .ui-tabs{
+  border: none;
+}
+
+.action-admin_panel-site_info .main-content .ui-tabs .ui-tabs-nav{
+  margin: 0 0 0 1em;
+  padding: 0;
+  background: none;
+  color: #172738;
+  border: 0px solid #aaaaaa;
+  border-radius: 4px;
+  font-weight: bold;
+}
+
+.action-admin_panel-site_info .main-content .ui-widget-content .ui-state-default, 
+.action-admin_panel-site_info .main-content .ui-widget-header .ui-state-default{
+  background: #d5d5d5 none;
+  color: #555555;
+  font-weight: normal;
+}
+
+.action-admin_panel-site_info .main-content .ui-widget-content .ui-state-active, 
+.action-admin_panel-site_info .main-content .ui-widget-header .ui-state-active{
+  background: #eeeff1;
+  color: #212121;
+  font-weight: normal;
+}
+
+.action-admin_panel-site_info .main-content .ui-tabs .ui-tabs-panel{
+  display: block;
+  padding: 1em 1.4em;
+  background-color: #eeeff1;
+  color: #777;
+  border-width: 1px;
+  font-size: 13px;
+  text-decoration: none;
+}
+
+/* Organizations Settings */
+
+.action-organizations-index .main-block form#manage-profiles, 
+.action-organizations-index .main-block form#manage-profiles form{
+  background-color: transparent;
+}
+
+.action-organizations-index .main-block form#manage-profiles .search-field{
+  margin-bottom: 30px;
+}
+
+.action-organizations-index .main-block form#manage-profiles .search-field .formfield {
+  width: 100%;
+  margin-right: 0.5em;
+  float: left;
+}
+
+.action-organizations-index .main-block form#manage-profiles .search-field .formfield input {
+  margin-top: 0px;
+  margin-right: 0.5em;
+  padding: 6px;
+  min-width: 97%;
+  height: 19px;
+  max-height: 19px;
+  background: none;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+}
+
+.action-organizations-index .main-block form#manage-profiles input.button.submit{
+  height: 32px;
+  margin-top: 8px;
+  padding: 5px 15px;
+  background: #3E67B1 none;
+  color: #FFF;
+  border-radius: 4px;
+  border: 1px solid #3E67B1;
+  font-size: 14px;
+  text-transform: uppercase;
+}
+
+.action-organizations-index .main-block form#manage-profiles input.button.submit:hover{
+  background: #5E82C6;
+}
+
+.action-organizations-index .main-block #environment-profiles-filter-title,
+.action-organizations-index .main-block #environment-profiles-filter-filter{
+  line-height: 35px;
+  font-size: 12px;
+}
+
+.action-organizations-index .main-block  table#organizations-list th{
+  text-align: left;
+  vertical-align: middle;
+  padding: 2px 8px;
+}
+
+/*** Features Settings ***/
+
+.controller-features #content form *{
+  font-size: 15px;
+}
+
+.controller-features #content th{
+  text-align: left;
+}
+
+.controller-features #content h3{
+  min-height: 0;
+  margin: 20px auto 10px auto;
+}
+
+.controller-features #content hr{
+  display: none;
+}
+
+.controller-features #content ul.token-input-list{
+  padding: 6px;
+  background: none;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  font-family: Arial, helvetica;
+  font-size: 15px;
+}
+
+/*** Community Admin pages ***/
+
+/* Index */
+.action-cms-index .cms-articles th{
+  text-align: left;
+}
@@ -0,0 +1,68 @@
+.animated {
+  -webkit-animation-duration: .7s;
+  animation-duration: .7s;
+  -webkit-animation-fill-mode: both;
+  animation-fill-mode: both;
+}
+
+@-webkit-keyframes slideInDown {
+  from {
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+    visibility: visible;
+  }
+
+  100% {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes slideInDown {
+  from {
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+    visibility: visible;
+  }
+
+  100% {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.slideInDown {
+  -webkit-animation-name: slideInDown;
+  animation-name: slideInDown;
+}
+
+@-webkit-keyframes slideOutUp {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  100% {
+    visibility: hidden;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+@keyframes slideOutUp {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+
+  100% {
+    visibility: hidden;
+    -webkit-transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
+  }
+}
+
+.slideOutUp {
+  -webkit-animation-name: slideOutUp;
+  animation-name: slideOutUp;
+}
@@ -28,6 +28,15 @@
   line-height: 21px;
 }
+#content #article-parent a.button.with-text{
+  background-color: #3E67B1;
+  color: #FFF;
+}
+
+#content #article-parent a.button.with-text:hover{
+  background-color: #5E82C6;
+}
+
 /* Need a dev solution - blog internal pages*/
 #article-header .preview{
@@ -76,27 +85,34 @@
 }
 #content .main-block .article-body #article-actions:last-child{
-  padding-top: 10px;
-  border-top: 4px solid #2C4B6B;
+  margin: 0;
+  padding: 10px 0;
+  border-top: 1px solid #D3D6DE;
 }
 /*** Categories ***/
+#content .main-block #article-cat{
+  border-top: 4px solid #2C4B6B;
+  border-bottom: 1px solid #D3D6DE;
+}
+
 #content .main-block #article-cat h4 {
   float: left;
-  margin: 13px 10px 10px 0;
+  margin: 12px 10px 10px 0;
   min-height: 0px;
+  color: #5E82C6;
   font-family: Arial;
-  font-size: 1.3em;
+  font-size: 12px;
   font-weight: 300;
   text-decoration: initial;
 }
 #content .main-block #article-cat a{
-  float: left;
+  display: inline-block;
   margin: 10px 10px 10px 0;
   padding: 3px 10px;
-  color: #3E67B1;
+  color: #5E82C6;
   background-color: #ECEDF1;
   border: 1px solid #D3D6DE;
   border-radius: 3px;
@@ -104,7 +120,29 @@
   text-decoration: initial;
 }
-/*** end of categories ***/
+/*** Tags ***/
+
+#content .main-block #article-tags{
+  width: 100%; 
+  color: #5E82C6;
+  border-bottom: 1px solid #D3D6DE;
+  font-family: Arial;
+  font-size: 12px;
+  font-weight: 300; 
+  text-align: left;
+}
+
+#content .main-block #article-tags a{
+  display: inline-block;
+  margin: 10px 10px 10px 0;
+  padding: 3px 10px;
+  color: #5E82C6;
+  background-color: #ECEDF1;
+  border: 1px solid #D3D6DE;
+  border-radius: 3px;
+  font-size: 12px;
+  text-decoration: initial;
+}
 /*** Site Map page ***/
-/*** Events ***/
-
-#content .event-card {
-  border-top: 1px dotted #D3D6D3;
-  background-repeat: no-repeat;
-  width: 494px;
-  height: 116px;
-  margin-bottom: 30px;
-}
-
-#content .event-image {
-  border-right: 1px dotted #D3D6DE;
-}
-
-#content .about-event > span {
-  font-family: Arial;
-  line-height: 13px;
-}
-
-#content  .about-event .event-date {
-  font-weight: bold;
-  letter-spacing: 0.49px;
-}
-
-#content  .about-event .event-address {
-  margin-top: 19px;
-}
-
-#content  .about-event .event-address span {
-  margin-top: 4.4px;
-  line-height: 14px;
-  letter-spacing: 0.5px;
-}
-
-#content  .event-link {
-  letter-spacing: 0.48px;
-}
-
-#content .event-link a {
-  text-decoration: underline;
-}
-
-#content .event-body .event-lead p {
-  font-size: 16px;
-  font-family: Arial;
-  font-weight: bold;
-  letter-spacing: -0.4px;
-  line-height: 21px;
-}
-
-#content .event-body .event-content p {
-  font-size: 15px;
-  font-family: Arial;
-  line-height: 22px;
-}
-
 /*** Profile page ***/
 .action-profile-index #content .main-block h1 {
   color: #172738;
@@ -64,6 +8,20 @@
   font-family: Arial, open_sansbold, Helvetica, sans-serif;
 }
+/*** Profile info block ***/
+#content .profile-image-block .admin-link a{
+  color: #2c66ce;
+}
+
+#content .profile-image-block .profile-info-options{
+  padding-right: 0;
+  text-align: center;
+}
+
+#content .profile-image-block .profile-info-options a.button.with-text{
+  font-size: 11px;
+}
+
 /* Search form */
 .action-profile-index .main-block #public-profile-search, 
@@ -99,14 +57,15 @@
 .action-profile-index .main-block #public-profile-search form input.button.submit {
   height: 32px;
-  background: #2B51A8;
-  font-size: 14px;
   margin-top: 8px;
+  padding: 5px 15px;
   color: #ffffff;
-  text-transform: uppercase;
+  background: #2B51A8;
   border-radius: 4px;
   border: 1px solid #2B51A8;
-  padding: 5px 15px;
+  font-size: 14px;
+  line-height: 14px;
+  text-transform: uppercase;
 }
 /* Profile tab */
@@ -149,3 +108,59 @@
   text-decoration: none;
 }
+/*** Events ***/
+
+#content .article-body-event .event-card{
+  border-top: 1px dotted #D3D6D3;
+  background-repeat: no-repeat;
+  width: 494px;
+  height: 116px;
+  margin-bottom: 30px;
+}
+
+#content .article-body-event .event-image{
+  border-right: 1px dotted #D3D6DE;
+}
+
+#content .article-body-event .about-event > span{
+  font-family: Arial;
+  line-height: 13px;
+}
+
+#content .article-body-event .about-event .event-date{
+  font-weight: bold;
+  letter-spacing: 0.49px;
+}
+
+#content .article-body-event .about-event .event-address{
+  margin-top: 19px;
+}
+
+#content .article-body-event .about-event .event-address span{
+  margin-top: 4.4px;
+  line-height: 14px;
+  letter-spacing: 0.5px;
+}
+
+#content .article-body-event .event-link{
+  letter-spacing: 0.48px;
+}
+
+#content .article-body-event .event-link a{
+  text-decoration: underline;
+}
+
+#content .article-body-event .event-body .event-lead p{
+  font-size: 16px;
+  font-family: Arial;
+  font-weight: bold;
+  letter-spacing: -0.4px;
+  line-height: 21px;
+}
+
+#content .article-body-event .event-body .event-content p{
+  font-size: 15px;
+  font-family: Arial;
+  line-height: 22px;
+}
+
@@ -2,7 +2,7 @@
 /*** Edit Blog and Articles ***/
-.controller-cms #content .main-block h1{
+.controller-cms #content .main-content h1{
   margin: 0 0 10px 0;
   padding: 0;
   color: #172738;
@@ -13,19 +13,19 @@
   font-variant: normal;
 }
-.controller-cms #content .main-block form{
+.controller-cms #content .main-content form{
   font-size: 14px;
   font-family: Arial;
 }
-.controller-cms #content .main-block form .required-field .pseudoformlabel,
-.controller-cms #content .main-block form .required-field label.formlabel:after {
+.controller-cms #content .main-content form .required-field .pseudoformlabel,
+.controller-cms #content .main-content form .required-field label.formlabel:after {
   color: #FF0366;
   font-size: 14px;
   font-weight: 500;
 }
-.controller-cms #content .main-block .formlabel {
+.controller-cms #content .main-content .formlabel{
   display: inline-block;
   max-width: 100%;
   margin-bottom: 5px;
@@ -34,7 +34,7 @@
   font-size: 14px;
 }
-.controller-cms #content .main-block .formfieldline .formfield code {
+.controller-cms #content .main-content .formfieldline .formfield code{
   display: block;
   width: auto;
   height: 30px;
@@ -45,21 +45,21 @@
   font-family: Arial, helvetica;
 }
-.controller-cms #content .main-block .formfieldline .formfield code * {
+.controller-cms #content .main-content .formfieldline .formfield code *{
   display: inline;
 }
-.controller-cms #content .main-block .formfieldline .formfield code input[type="text"] {
+.controller-cms #content .main-content .formfieldline .formfield input[type="text"]{
   padding: 6px;
   color: #585858;
-  background: none;
+  background: #FFF;
   border: 1px solid #ccc;
   border-radius: 4px;
   font-size: 15px;
   font-family: Arial, helvetica;
 }
-.controller-cms #content .main-block .formfieldline textarea{
+.controller-cms #content .main-content .formfieldline textarea{
   padding: 6px;
   color: #585858;
   background: none;
@@ -69,18 +69,18 @@
   font-size: 15px;
 }
-.controller-cms #content .main-block .formfieldline .formfield code input[type="text"]:hover,
-.controller-cms #content .main-block .formfieldline .formfield code input[type="text"]:focus,
-.controller-cms #content .main-block .formfieldline textarea:hover,
-.controller-cms #content .main-block .formfieldline textarea:focus{
+.controller-cms #content .main-content .formfieldline .formfield code input[type="text"]:hover,
+.controller-cms #content .main-content .formfieldline .formfield code input[type="text"]:focus,
+.controller-cms #content .main-content .formfieldline textarea:hover,
+.controller-cms #content .main-content .formfieldline textarea:focus{
   border: 1px solid #172738;
 }
-.controller-cms #content .main-block .formfieldline .type-file .type-file .formlabel{
+.controller-cms #content .main-content .formfieldline .type-file .type-file .formlabel{
   display: none;
 }
-.controller-cms #content .main-block .formfieldline .type-file .type-file .type-text .formlabel{
+.controller-cms #content .main-content .formfieldline .type-file .type-file .type-text .formlabel{
   display: block;
 }
@@ -102,25 +102,25 @@
   border: 1px solid #172738;
 }
-.controller-cms #content .formfield #fetch-external-feed {
+.controller-cms #content .formfield #fetch-external-feed{
   padding-left: 20px;
   border-radius: 4px;
 }
-.controller-cms #content .formfield #fetch-external-feed > input {
+.controller-cms #content .formfield #fetch-external-feed > input{
   height: 13px;
   margin: 8px 8px 8px 0px;
   vertical-align: middle;
   width: 13px;
 }
-.controller-cms #content .formfield #fetch-external-feed #external-feed-options #external-feed-options-only-once input {
+.controller-cms #content .formfield #fetch-external-feed #external-feed-options #external-feed-options-only-once input{
   margin-right: 3px;
   width: 13px;
   vertical-align: middle;
 }
-.controller-cms #content .formfield #fetch-external-feed #external-feed-options #external-feed-options-only-once label {
+.controller-cms #content .formfield #fetch-external-feed #external-feed-options #external-feed-options-only-once label{
   margin-right: 250px;
 }
@@ -136,74 +136,76 @@
   margin-bottom: 15px;
 }
-.controller-cms #content .main-block form .button-bar input{
-  min-width: 100px;
+.controller-cms #content .main-content form .button-bar input{
+  height: 30px;
+  padding: 2px 15px;
   margin-right: 10px;
-  padding: 2px 5px;
   color: #FFF;
-  background: #2C66CE;
+  background: #3E67B1;
   font-size: 15px;
-  border: none;
 }
-.controller-cms #content .main-block form .button-bar input:hover {
+.controller-cms #content .main-content form .button-bar input:hover{
   background: #5E82C6;
   border: none;
 }
-.controller-cms #content .main-block form .button-bar a.button{
-  height: 29px;
-  min-width: 100px;
-  padding: 1px 0 0 0;
-  color: #2C66CE;
+.controller-cms #content .main-content form .button-bar input.button.with-text{
+  height: 36px;
+}
+
+.controller-cms #content .main-content form .button-bar a.button{
+  height: 30px;
+  padding: 2px 15px;
+  color: #3E67B1;
   background: #FFF;
-  border: 1px solid #2C66CE;
+  border: 1px solid #3E67B1;
   font-size: 14px;
   text-align: center;
 }
-.controller-cms #content .main-block form .button-bar a.button:hover{
+.controller-cms #content .main-content form .button-bar a.button:hover{
   background: none;
-  color: #5E82C6;
-  border-color: #5E82C6;
+  color: #3E67B1;
+  border-color: #3E67B1;
 }
-.controller-cms #content .main-block form .box-title{
+.controller-cms #content .main-content form .box-title{
   font-size: 15px;
   font-family: Arial, helvetica;
 }
-.controller-cms #content .main-block #category-ajax-selector{
+.controller-cms #content .main-content #category-ajax-selector{
   border-style: dotted;
 }
-.controller-cms #content .main-block #category-ajax-selector label{
+.controller-cms #content .main-content #category-ajax-selector label{
   font-size: 14px;
 }
-.controller-cms #content .main-block #category-ajax-selector .select-subcategory-link{
+.controller-cms #content .main-content #category-ajax-selector .select-subcategory-link{
   background: #FFF;
   border: 1px solid #2C66CE;
   color: #2C66CE;
   padding: 3px;
 }
-.controller-cms #content .main-block #category-ajax-selector .select-subcategory-link:hover{
+.controller-cms #content .main-content #category-ajax-selector .select-subcategory-link:hover{
   background: #2C66CE;
   color: #FFF;
 }
-.controller-cms #content .main-block .inputosaurus-required{
+.controller-cms #content .main-content .inputosaurus-required{
   background: none;
   border: 1px solid #ccc;
 }
-.controller-cms #content .main-block .inputosaurus-required:hover,
-.controller-cms #content .main-block .inputosaurus-required:focus{
+.controller-cms #content .main-content .inputosaurus-required:hover,
+.controller-cms #content .main-content .inputosaurus-required:focus{
   border: 1px solid #172738;
 }
-.controller-cms #content .main-block .inputosaurus-required input:hover{
+.controller-cms #content .main-content .inputosaurus-required input:hover{
   background: none;
 }
@@ -217,6 +219,34 @@
   margin-bottom: 13px;
 }
+/*** Article's edition page ***/
+
+#content .text-editor-sidebar .header{
+  padding: 13px 10px;
+  color: #172738;
+  background: #D3D6DE;
+  border-radius: 4px;
+  font-size: 14px;
+  font-weight: 300;
+  font-family: Arial;
+}
+
+#content .text-editor-sidebar .header a.button.icon-vertical-toggle{
+  padding: 0 15px;
+  background: #3E67B1;
+  color: #FFF;
+  font-size: 14px;
+  font-weight: 300;
+  font-family: Arial;
+}
+
+#content .text-editor-sidebar .header a.button.icon-vertical-toggle:hover{
+  background: #5E82C6;
+}
-/*** Edit Organizations ***/
+#content .text-editor-sidebar-box{
+  background: #ECEDF1;
+  border-radius: 4px;
+  border: 1px solid #D3D6DE;
+}
@@ -12,6 +12,10 @@
 /*** Box's patterns ***/
+.action-home-index .block-outer{
+   margin-bottom: 45px;
+}
+
 /* Read More pattern */
 .action-home-index #content .box .block-outer .read-more {
@@ -52,9 +56,9 @@
 /*** Software catalog search block **/
 .action-home-index #content #catalogo-software-search {
-  border-radius: 4px;
   width: 100%;
   background-color: #1A397D;
+  border-radius: 4px;
 }
 .action-home-index #content #catalogo-software-search h1 {
@@ -144,10 +148,10 @@
   display:none;
 }
-.action-home-index #content .software-block { 
+.action-home-index #content .software-block {
   width: 145px;
   height: 218px;
-  margin: 0px 9px 14px 9px;
+  margin: 0px 18px 14px 0px;
 }
 .action-home-index #content .software-block .software-block-logo {
@@ -232,7 +236,7 @@
 /*** News block - display content block **/
 .action-home-index #content .display-content-block .block-title {
-  margin: 0px;  
+  margin: 0px;
   border-top: 4px solid #643C67;
   background: #eee;
   color: #643C67;
@@ -247,7 +251,6 @@
 .action-home-index #content .display-content-block li:first-child  {
   border-top: 0px solid #eee;
-  padding: 36px 0px 0px 0px;
 }
 .action-home-index #content .display-content-block .published-at {
@@ -259,7 +262,6 @@
   padding-right: 25px;
   padding: 0px 25px 0px 0px;
   border: 0px solid #c0c1c1;
-  border-radius: 8px;
   width: 150px;
   display: table-cell;
 }
@@ -291,7 +293,7 @@
 }
 .action-home-index #content .display-content-block .lead {
-  max-height: 56px;
+  max-height: 47px;
   overflow: hidden;
 }
@@ -300,8 +302,8 @@
   font: 15px/1.3em arial;
 }
-.action-home-index #content .display-content-block .lead a:visited, 
-.action-home-index #content .lead a:visited, 
+.action-home-index #content .display-content-block .lead a:visited,
+.action-home-index #content .lead a:visited,
 .action-home-index #content .lead dl.portlet a:visited {
   color: #172738;
 }
@@ -329,7 +331,7 @@
 /*** What Is block - Article block **/
-.action-home-index #content .article-block .block-title {
+.template-default .action-home-index #content .box-3 .article-block .block-title {
   border-top: 4px solid #08A649;
   border-bottom: none;
   padding: 6px 8px 22px 10px;
@@ -340,20 +342,20 @@
   text-transform: none;
 }
-.action-home-index #content .article-block .read-more {
+.template-default .action-home-index #content .box-3 .article-block .read-more {
   margin-top: 30px;
   border-top: 1px solid #08A649;
 }
-.action-home-index #content .article-block .read-more a::after {
+.template-default .action-home-index #content .box-3 .article-block .read-more a::after {
   background: #08A649;
 }
-.action-home-index #content .article-block .short-post {
+.template-default .action-home-index #content .box-3 .article-block .short-post {
   padding-top: 23px;
 }
-.action-home-index #content .article-block p {
+.template-default .action-home-index #content .box-3 .article-block p {
   margin: 0px 0px 14px 0px;
   padding: 0px;
   font: 15px/18px arial, helvetica, sans-serif;
@@ -364,36 +366,33 @@
 /******* See As Well Block - Highlights block *******/
 .action-home-index #content .highlights-block .block-title {
-  margin: 11px 0px 0px;
-  border: 1px solid #c0c1c1;
-  border-bottom: 0;
-  border-radius: 8px 8px 0 0;
-  padding: 15px 1px 21px 15px;
-  width: auto;
-  height: 16px;
-  background-color: #fff;
-  color: #172638;
-  font: bold 16px/1.3em 'open_sansbold', arial, helvetica, sans-serif;
-  text-transform: uppercase;
+  display: none;
 }
 .action-home-index #content .highlights-border {
   border: 1px solid #c0c1c1;
-  border-radius: 0px 0px 8px 8px;
+  border-radius: 8px;
   width: auto;
-  max-height: 230px;
-  background: #fff;
+  height: 248px;
+  max-height: 250px;
+  background-color: #e8e9ec;
+  background-image: linear-gradient(
+    0deg,
+    transparent 45%,
+    #fff 55%);
+  background-size: 100% 100%;
 }
 .action-home-index #content .highlights-container {
-  border-radius: 0px 0px 8px 8px;
+  border-radius: 8px;
   border-width: 0px 0px 1px 0px;
-  padding: 0px 0px 0px 0px;
+  border-bottom: none;
+  padding: 0;
   width: 100% !important;
   max-height: 230px;
-  background: #fff;
+  background: transparent;
   position: relative;
-  top: 0px;
+  top: 0;
 }
 .action-home-index #content .highlights-image-link {
@@ -404,6 +403,10 @@
   background-color: #fff;
 }
+.action-home-index #content .highlights-image-link img{
+  max-height: 100px;
+}
+
 .action-home-index #content .highlights-label {
   border-top: 4px solid #3b61a7;
   padding: 23px 20px 46px 20px;
@@ -419,13 +422,9 @@
 }
 .action-home-index #content .highlights-block-pager {
-  border: 0;
-  padding: 14px 0px 0px 0px;
-  height: 1px;
-  width: 232px;
-  background-color: #FFF;
-  float: left;
-  position: static;
+  float: none;
+  display: block;
+  text-align: center;
 }
 .action-home-index #content .highlights-block-pager a {
@@ -447,6 +446,24 @@
   color: transparent;
 }
+/*** software highlights block ***/
+
+.action-home-index #content a.toggle-popover,
+.action-home-index #content a.toggle-popover:hover {
+  margin: 0 0 0 55px;
+  color: #3867b7;
+  cursor: pointer;
+}
+
+.action-home-index #content span.popover-span {
+  padding: 1px 6px;
+  border-radius: 50%;
+  background-color: #3867b7;
+  color: #ffffff;
+  font-weight: bold;
+  cursor: pointer;
+}
+
 /*** mais software block **/
 .action-home-index #content #mais-software-block {
   margin: 11px 0px;
 /******************** Box-2 ********************/
-.box-2{
+/*** WARNING - WITHOUT BOX-4 ***/
+
+.template-default .box-2 {
   width:150px;
 }
-#content .box-2 .block-outer .block-title {
+.template-default #content .box-2 .block-outer .block-title {
 	background: #eee;
 	color: #4562b1;
 	border-top: 4px solid #4562b1;
@@ -13,14 +15,86 @@
 /*** Menus - Link list block ***/
-#content .box-2 .link-list-block li {
+.template-default #content .box-2 .link-list-block li {
+  margin: 0;
+  padding: 0;
+  border-bottom: 1px solid #ddd;
+  border-top: none;
+}
+
+.template-default #content .box-2 .link-list-block li a {
+  width: auto;
+  padding: 6px 5px 8px 18px;
+  background-color: #fff;
+  background-position: 0px 50%;
+  color: #2C66CE;
+  border-right: none;
+  border-top: 0px solid #64946E;
+  border-radius: 0 0 0 0;
+  font-weight: normal;
+  font-size: 14px;
+  line-height: 17px;
+}
+
+.template-default #content .box-2 .link-list-block h3.empty + ul {
+  border-top: 1px solid #ddd;
+}
+
+.template-default #content .box-2 .link-list-block h3.empty + ul li a {
+  padding-left: 0px;
+  padding-right: 0px;
+  background-image: none;
+}
+
+.template-default #content .box-2 .link-list-block li a.link-this-page,
+.template-default #content .box-2 .link-list-block li a.link-this-page:hover {
+  border-right: none;
+}
+
+.template-default #content .box-2 .link-list-block li a:hover {
+  background-color: #FFFFFF;
+  color: #000;
+}
+.template-default #content .box-2 .link-list-block li a.link-this-page {
+  width: auto;
+  margin-left: 0px;
+  background-color: #ffffff;
+  font-weight: bold;
+}
+
+/*** END OF WARNING - WITHOUT BOX-4 ***/
+
+/*** WARNING - WITH BOX-4 ***/
+
+/************ DUPLICATE ************
+
+    This part of the code is duplicated because, if there is
+    a change of layout from template-default to lefttopright
+    the CSS fit without many complication.
+
+ */
+
+.template-lefttopright .box-3 {
+  width:150px;
+}
+
+.template-lefttopright #content .box-3 .block-outer .block-title {
+  background: #eee;
+  color: #4562b1;
+  border-top: 4px solid #4562b1;
+  line-height: 15px;
+}
+
+/*** Menus - Link list block ***/
+
+.template-lefttopright #content .box-3 .link-list-block li {
   margin: 0;
   padding: 0;
   border-bottom: 1px solid #ddd;
   border-top: none;
 }
-#content .box-2 .link-list-block li a {
+.template-lefttopright #content .box-3 .link-list-block li a {
   width: auto;
   padding: 6px 5px 8px 18px;
   background-color: #fff;
@@ -34,33 +108,41 @@
   line-height: 17px;
 }
-#content .box-2 .link-list-block h3.empty + ul {
+.template-lefttopright #content .box-3 .link-list-block h3.empty + ul {
   border-top: 1px solid #ddd;
 }
-#content .box-2 .link-list-block h3.empty + ul li a {
+.template-lefttopright #content .box-3 .link-list-block h3.empty + ul li a {
   padding-left: 0px;
   padding-right: 0px;
   background-image: none;
 }
-#content .box-2 .link-list-block li a.link-this-page,
-#content .box-2 .link-list-block li a.link-this-page:hover {
+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page,
+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page:hover {
   border-right: none;
 }
-#content .box-2 .link-list-block li a:hover {
+.template-lefttopright #content .box-3 .link-list-block li a:hover {
   background-color: #FFFFFF;
   color: #000;
 }
-#content .box-2 .link-list-block li a.link-this-page {
+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page {
   width: auto;
   margin-left: 0px;
   background-color: #ffffff;
   font-weight: bold;
 }
+/************ END OF DUPLICATE ************
+
+/*** END OF WARNING - WITH BOX-4 ***/
+
 /*** Statistics block **/
+.template-default #content .box-2 .statistics-block {
+  padding: 10px 0px 10px 10px
+}
+
 .statistics-block-data ul {
   margin-top: 10px;
 }
@@ -83,6 +165,9 @@ span.amount {
 span.label {
   font-size: 14px;
 }
+
 /*** end of statistics block **/
+/*** WARNING - WITH BOX-4 ***/
+
 /******************** end Box-2 ********************/
 /*** Box ***/
 .box-1 .block,
 .no-boxes .block {
-    margin-top: 50px;
+  margin-top: 50px;
 }
-.block-outer {
-    margin-bottom: 45px;
-    clear: both;
+.box-2 .block-outer,
+.box-3 .block-outer{
+  margin-bottom: 45px;
+  clear: both;
 }
 /*** Block Title ***/
@@ -41,13 +42,13 @@
 #content .pagination a,
 #content .pagination em,
 #content .pagination span{
-  padding: 7px 11px 7px 11px;
+  padding: 5px 9px;
   margin-right: 4px;
   color: #172738;
   border: 1px solid #D3D6DE;
   border-radius: 4px;
   letter-spacing: 0.6px;
-  font-size: 15px;
+  font-size: 12px;
   font-weight: 700;
   text-decoration: none;
   display: inline-table;
@@ -59,13 +60,11 @@
 }
 #content .pagination .previous_page{
-  padding: 7px 11px 10px 11px;
   float: left;
 }
 #content .pagination .next_page{
   float: right;
-  padding: 7px 11px 10px 11px;
 }
 #content .pagination .previous_page,
@@ -80,5 +79,50 @@
   opacity: 0.5;
 }
+/*** Button ***/
+#content a.button.with-text,
+#content #article-actions a.button.with-text{
+  height: 32px;
+  padding: 5px 15px;
+  background: #FFF none;
+  color: #3E67B1;
+  border-radius: 4px;
+  border: 1px solid #3E67B1;
+  font-size: 14px;
+  line-height: 32px;
+  text-transform: uppercase;
+}
+#content form input.button.with-text{
+  height: 42px;
+  max-height: 42px;
+  padding: 5px 15px;
+  background: #FFF none;
+  color: #3E67B1;
+  border-radius: 4px;
+  border: 1px solid #3E67B1;
+  font-size: 14px;
+  line-height: 32px;
+  text-transform: uppercase;
+}
+
+#content a.button:hover,
+#content #article-actions a.button.with-text:hover,
+#content input.button.with-text:hover{
+  background-color: #3E67B1;
+  color: #FFF;
+}
+
+/* This is a temporary solution until noosfero deals with logged-out comments in a better manner. */
+.comment-replies .comment-logged-out .comment-text, 
+.comment-logged-out .comment-picture, 
+.comment-logged-out h4 {
+  opacity: 1.0;
+}
+
+.comment-logged-out .comment-text, 
+.comment-info {
+  color: black;
+}
+/**/
@@ -2,18 +2,15 @@
 /** Header's Block **/
 #content .blog #article-header h1.title {
-  margin: 0px 0px 10px 0px;
-  border: none;
-  padding: 0px 0px 0px 0px;
-  color: #FF0366;
-  text-transform: uppercase;
-  font: normal normal normal 16px/37px 'open_sansregular';
+  margin: 20px 0px 10px 0px;
+  padding: 0px 0px 10px 0px;
+  font: normal normal bold 35px/37px arial;
 }
 /* WARNING:
  *   This solution is TEMPORARY. This informations shouldn't exist
  *   in this area.
- *   
+ *
  *   TODO: Remove this informations of the html and, then, from here.
  */
 #content .blog #article-header .publishing-info .date,
@@ -56,10 +53,14 @@
   display: inline-block;
 }
+#content .blog .blog-post h1.title a {
+  color: black;
+}
+
 /* WARNING:
  *   This solution is TEMPORARY. This informations shouldn't exist
  *   in this area.
- *   
+ *
  *   TODO: Remove this informations of the html and, then, from here.
  */
 #content .blog .blog-post .author {
@@ -96,7 +97,7 @@
 /* WARNING:
  *   This solution is TEMPORARY. This informations shouldn't exist
  *   in this area.
- *   
+ *
  *   TODO: Remove this informations of the html and, then, from here.
  *   The correct is the text is sensitive to lead to the complete text.
  */
@@ -138,9 +139,9 @@
 #content .blog .page-1 .position-3,
 #content .blog .page-1 .position-4 {
   margin: 0px 0px 0px 0px;
-  padding: 20px 30px 45px 0px;
+  padding: 20px  21px 45px 0px;
   height: 235px;
-  width: 30.5%; 
+  width: 30.5%;
   display: block;
   float: left;
 }
@@ -54,21 +54,22 @@
 #content .main-block h2,
 #content .main-block h3,
 #content .main-block h4 {
-  font-family:  'Open Sans', Arial, Helvetica, sans-serif;
+  font-family:  Arial, Helvetica, sans-serif;
 }
 #content .main-block h1,
 #not-found h1,
 #access-denied h1,
 #content .no-boxes h1 {
-  color: #444;
-  font-size: 1.7em;
-  padding: 7px 0;
-  margin-left: 0;
-  padding-left: 0.3em;
-  border-bottom: 1px solid #CCCCCC;
-  border-top: 0px solid #172838;
+  margin: 20px 0 10px 0;
+  padding: 0;
+  color: #172738;
+  border-bottom: none;
+  font-family: Arial;
+  font-size: 34px;
   font-weight: bold;
+  font-variant: normal;
+  line-height: 37px;
 }
 #content .title {
@@ -77,8 +78,8 @@
 }
 #content .main-block h3 {
-  font-size: 1.5em;
-  min-height: 48px;
+  font-size:18px;
+  line-height: 21px;
 }
 /****************************************/
@@ -0,0 +1,191 @@
+.popover {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1060;
+  display: none;
+  max-width: 276px;
+  padding: 1px;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: normal;
+  line-height: 1.42857143;
+  text-align: left;
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  letter-spacing: normal;
+  word-break: normal;
+  word-spacing: normal;
+  word-wrap: normal;
+  white-space: normal;
+  background-color: #fff;
+  -webkit-background-clip: padding-box;
+          background-clip: padding-box;
+  border: 1px solid #ccc;
+  border: 1px solid rgba(0, 0, 0, .2);
+  border-radius: 6px;
+  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
+          box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
+
+  line-break: auto;
+}
+.popover.top {
+  margin-top: -12px;
+}
+.popover.right {
+  margin-left: 10px;
+}
+.popover.bottom {
+  margin-top: 10px;
+}
+.popover.left {
+  margin-left: -10px;
+}
+.popover-title {
+  padding: 8px 14px;
+  margin: 0;
+  font-size: 14px;
+  background-color: #f7f7f7;
+  border-bottom: 1px solid #ebebeb;
+  border-radius: 5px 5px 0 0;
+}
+.popover-content {
+  padding: 9px 14px;
+}
+.popover > .arrow,
+.popover > .arrow:after {
+  position: absolute;
+  display: block;
+  width: 0;
+  height: 0;
+  border-color: transparent;
+  border-style: solid;
+}
+.popover > .arrow {
+  border-width: 11px;
+}
+.popover > .arrow:after {
+  content: "";
+  border-width: 10px;
+}
+.popover.top > .arrow {
+  bottom: -11px;
+  left: 50%;
+  margin-left: -11px;
+  border-top-color: #999;
+  border-top-color: rgba(0, 0, 0, .25);
+  border-bottom-width: 0;
+}
+.popover.top > .arrow:after {
+  bottom: 1px;
+  margin-left: -10px;
+  content: " ";
+  border-top-color: #fff;
+  border-bottom-width: 0;
+}
+.popover.right > .arrow {
+  top: 50%;
+  left: -11px;
+  margin-top: -11px;
+  border-right-color: #999;
+  border-right-color: rgba(0, 0, 0, .25);
+  border-left-width: 0;
+}
+.popover.right > .arrow:after {
+  bottom: -10px;
+  left: 1px;
+  content: " ";
+  border-right-color: #fff;
+  border-left-width: 0;
+}
+.popover.bottom > .arrow {
+  top: -11px;
+  left: 50%;
+  margin-left: -11px;
+  border-top-width: 0;
+  border-bottom-color: #999;
+  border-bottom-color: rgba(0, 0, 0, .25);
+}
+.popover.bottom > .arrow:after {
+  top: 1px;
+  margin-left: -10px;
+  content: " ";
+  border-top-width: 0;
+  border-bottom-color: #fff;
+}
+.popover.left > .arrow {
+  top: 50%;
+  right: -11px;
+  margin-top: -11px;
+  border-right-width: 0;
+  border-left-color: #999;
+  border-left-color: rgba(0, 0, 0, .25);
+}
+.popover.left > .arrow:after {
+  right: 1px;
+  bottom: -10px;
+  content: " ";
+  border-right-width: 0;
+  border-left-color: #fff;
+}
+
+/*** popover in software highlights block ***/
+
+.highlights-popover {
+  max-width: 280px;
+  margin: 0 0 0 -75px;
+  background: #172638;
+  color: #FFFFFF;
+}
+
+.highlights-popover .popover-content {
+  padding: 0;
+}
+
+.highlights-popover p {
+  padding: 13px 13px 15px;
+  margin: 0px;
+  font-size: 14px;
+  line-height: 20px;
+}
+    
+.highlights-popover span {
+  font-weight: bold;
+  border-bottom: 1px dotted #FFFFFF;
+}
+
+#content .highlights-popover a,
+#content .highlights-popover a:visited,
+#content .highlights-popover a:hover,
+#content .highlights-popover a:link {
+  font-weight: bold;
+  color: #FFFFFF;
+  display: block;
+  padding: 8px 15px;
+  border-top: 1px dotted rgba(255,255,255,0.1);
+}
+
+.highlights-popover a:before {
+  font-family: "FontAwesome";
+  content: "\f067";
+  vertical-align: middle;
+  color: #ff0066;
+  padding: 0 5px 0 0;
+}
+
+.highlights-popover.top > .arrow,
+.highlights-popover.right > .arrow,
+.highlights-popover.bottom > .arrow,
+.highlights-popover.left > .arrow {
+  margin-left: 64px;
+}
+
+.highlights-popover.top > .arrow:after,
+.highlights-popover.right > .arrow:after,
+.highlights-popover.bottom > .arrow:after,
+.highlights-popover.left > .arrow:after {
+  border-top-color: #172638;
+}
@@ -0,0 +1,115 @@
+/*** Search Community ***/
+
+.action-search-index #content form #search-header,
+.action-search-people #content form #search-header,
+.action-search-communities #content form #search-header{
+  margin-top: 5px;
+  float: right;
+  border: none;
+}
+
+.action-search-people #content form #search-header #search-filters .sod_select,
+.action-search-communities #content form #search-header #search-filters .sod_select{
+  color: #3E67B1;
+  border: 1px solid #3E67B1;
+  border-radius: 4px;
+  font-family: Arial;
+  font-variant: normal;
+  font-weight: 300;
+  box-shadow: none;
+}
+
+.action-search-people #content form #search-header #search-filters .sod_select .sod_list,
+.action-search-communities #content form #search-header #search-filters .sod_select .sod_list{
+  margin: -2px 0 0 -1px;
+  color: #3E67B1;
+  border: 1px solid #3E67B1;
+  border-top: none;
+  border-radius: 0px 0px 4px 4px;
+  font-family: Arial;
+  font-variant: normal;
+  font-weight: 300;
+}
+
+.action-search-people #content form #search-header #search-filters .sod_select .sod_list .active,
+.action-search-communities #content form #search-header #search-filters .sod_select .sod_list .active{
+  border-radius: 0px 0px 4px 4px;
+}
+
+.action-search-people #content form #search-header #search-filters .sod_select .sod_list .selected,
+.action-search-communities #content form #search-header #search-filters .sod_select .sod_list .selected{
+  padding-right: 21px;
+}
+
+.action-search-people #content form #search-subheader .sod_select,
+.action-search-communities #content form #search-subheader .sod_select{
+  line-height: 15px;
+}
+
+.action-search-index #content form .search-field,
+.action-search-people #content form .search-field,
+.action-search-communities #content form .search-field{
+  margin-bottom: 30px;
+}
+
+.action-search-index #content form .search-field .formfield,
+.action-search-people #content form .search-field .formfield,
+.action-search-communities #content form .search-field .formfield{
+  float: left;
+  width: 99%;
+}
+.action-search-index #content form .search-field .formfield input,
+.action-search-people #content form .search-field .formfield input,
+.action-search-communities #content form .search-field .formfield input{
+  margin-top: 0px;
+  padding: 6px;
+  height: 19px;
+  max-height: 19px;
+  max-width: 98%;
+  background: none;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+}
+
+.action-search-index #content form input.button.submit,
+.action-search-people #content form input.button.submit,
+.action-search-communities #content form input.button.submit{
+  height: 32px;
+  margin-top: 8px;
+  padding: 5px 15px;
+  background: #3E67B1 none;
+  color: #FFF;
+  border-radius: 4px;
+  border: 1px solid #3E67B1;
+  font-size: 14px;
+  line-height: 14px;
+  text-transform: uppercase;
+}
+
+.action-search-index #content form input.button.submit:hover,
+.action-search-people #content form input.button.submit:hover,
+.action-search-communities #content form input.button.submit:hover{
+  background: #5E82C6;
+}
+
+.action-search-people #search-results .search-results-type-people,
+.action-search-communities #search-results .search-results-type-community{
+  background: none;
+  border: 1px solid #ccc;
+  border-radius: 10px;
+}
+
+.action-search-index #search-results h3{
+  margin: 20px 0 10px 0;
+  color: #172738;
+  font-size:18px;
+  line-height: 21px;
+  font-family: Arial;
+  font-weight: 700;
+  font-variant: normal;
+}
+
+.action-search-index #search-results .search-results-innerbox{
+  background: none;
+  border: 1px solid #ccc;
+}
@@ -11,14 +11,16 @@
 }
 .action-search-software_infos #content .main-content h2{
-  color: #ff0066;
+  color: #FF0366;
   font-size: 16px;
   font-family: "open_sansregular",Arial, Helvetica,sans-serif;
+  font-weight: 300;
   text-transform: uppercase;
 }
 .action-search-software_infos #content .main-content h1{
   padding: 5px 0 10px 0;
+  border-bottom: 1px solid #D3D6DE;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 35px;
   font-variant: normal;
@@ -32,16 +34,57 @@
   padding: 0;
   background: #ecedf1;
   border-radius: 4px;
-  border: 1px solid #d7d7d7;
+  border: 1px solid #D3D6DE;
+  background-image:url("catalogo.png");
 }
 .action-search-software_infos #software-search-container .search-form h3{
-  margin: 0;
-  padding: 16px 0 10px 14px;
+  margin: 0px 0px 3px 0px;
+  padding: 16px 0 20px 14px;
+  color: #2C4B6B;
   font-family:"open_sansregular", Arial, Helvetica, sans-serif;
+  color: #2B51A8;
   font-weight: bold;
   font-size: 15px;
+  text-transform: uppercase;
+}
+
+/*.action-search-software_infos #content .search-form .project-software {
+    margin: 0 0 0 15px;
+}
+
+ It's TEMPORARY 
+.action-search-software_infos #content .search-form .doubts-catalog-software {
+    display: none;
+}*/
+
+/**Radio Buttons***/
+.action-search-software_infos #public_software_radio_button,
+.action-search-software_infos #all_radio_button {
+  margin:5px 4px 15px 15px;
+  line-height: 20px;
+  position:absolute;
+}
+.action-search-software_infos .search-form label, 
+.action-search-software_infos .search-form label{
+  margin:0px 3px 4px 32px;
+  line-height: 22px;
+  font-size: 15px;
+  font-family: Arial;
+}
+
+.action-search-software_infos #software-search-container .search-form .doubts-catalog-software{
+  border:1px solid #3E67B1;
+  border-radius:50%;
+  padding:0px 3px;
+  font-size: 14px;
+  font-weight: 900;
+  background:#3E67B1;
+  color:#fff;
+  font-family: Arial;
+
 }
+/******/
 .action-search-software_infos #content .search-form .search-field .formfield {
   width: 100%;
@@ -51,115 +94,151 @@
 .action-search-software_infos #content .search-form .search-field #search-input {
   width: 96%;
-  margin: 4px 0px 0px 13px;
-  padding: 6px;
+  margin: 13px 0px 4px 13px;
+  padding: 7px;
+  background: #FFF;
   border-radius: 4px;
-  border: 1px solid #d7d7d7;
+  border: 1px solid #D3D6DE;
   font-size: 14px;
 }
 .action-search-software_infos #content .search-form .search-field input.button{
   padding: 0px;
-  background-color: #2B65cd;
-  color: #ffffff; 
-  border: 1px solid #2B65cd;
+  background-color: #3E67B1;
+  color: #FFF;
+  border: 1px solid #3E67B1;
   font-family: "open_sansbold",Arial,sans-serif;
   border-radius: 4px;
 }
-.controller-search #content .search-form .search-field input.button.submit {
+.action-search-software_infos #content .search-form .search-field input.button.submit {
   width: auto;
   height: 30px;
   max-height: 30px;
   margin: 14px;
   padding: 0 14px 0 14px;
-  background-color: #4562b1; 
+  background: #3E67B1;
+  line-height: 14px;
+  border-radius: 4px;
+  color: #ffffff;
   text-transform: uppercase;
+  font-family: "open_sansbold",Arial,sans-serif;
+  font-size: 14px;
 }
 /* Filter options */
 .action-search-software_infos #filter-catalog-software {
-  background-color: #d7d7d7;
+  background-color: #D3D6DE;
 }
 .action-search-software_infos #filter-option-catalog-software {
   padding: 14px;
-  background-color: #d7d7d7;
-  border:none; 
+  background-color: #D3D6DE;
+  border: none;
+  border-bottom-left-radius: 4px;
+  border-bottom-right-radius: 4px;
   font-size: 11px;
+  text-align: right;
+  text-transform: uppercase;
 }
+.action-search-software_infos #filter-option-catalog-close {
+  padding: 7px 7px 17px 10px;
+  display: none;
+}
 .action-search-software_infos #filter-option-catalog-software:hover {
   background-color: #c7c7c7;
 }
 .action-search-software_infos #filter-option-catalog-software:after {
   content: "";
-  margin-left:5px;
+  margin-left: 5px;
   padding: 3px 10.5px;
-  background:url("../images/bottom-arrow.png") no-repeat center;
-  background-color:#4562b1;
+  background: url("../images/bottom-arrow.png") no-repeat center;
+  background-color: #3E67B1;
   border-radius: 4px;
 }
 .action-search-software_infos #filter-catalog-software #filter-categories-option {
-  border:none;
+  border: none;
+  height: 0;
+  max-height: 620px;
+  position: relative;
+  overflow: hidden;
+  padding: 0 15px;
 }
 .action-search-software_infos #filter-catalog-software #filter-categories-catalog h4 {
-  margin: 5px 0 10px 5px;
+  margin: 20px 0 10px 5px;
   background: transparent;
   color: black;
 }
 .action-search-software_infos #filter-catalog-software  input[type="checkbox"]{
-  vertical-align:sub;
+  vertical-align: middle;
+  margin: 0 3px 2px 8px;
 }
-.action-search-software_infos #group-categories #group-catalog-01 {
-  float: left;
-  width: 50%;
-}
-
-.action-search-software_infos #group-categories label {
-  font-family:Arial;
+.action-search-software_infos #group-categories ul {
+  font-family: Arial;
   font-size: 14px;
+  line-height: 31px;
+  columns: 2;
+  -webkit-columns: 2;
+  -moz-columns: 2;
 }
-.action-search-software_infos #group-categories label span {
-  font-family:Arial;
+.action-search-software_infos #group-categories li span {
+  font-family: Arial;
   font-size: 14px;
 }
 .action-search-software_infos #filter-catalog-software .project-software{
-  margin: 0 0 30px;
+  margin: 20px 0 30px;
   border-top: 1px dotted;
   border-bottom: 1px dotted;
   font-weight: bold;
   font-size: 15px;
   font-family: Arial;
+  padding: 10px;
 }
+.action-search-software_infos #filter-catalog-software .project-software label {
+  font-weight: normal;
+}
-.action-search-software_infos #filter-catalog-software .project-software span {  
+.action-search-software_infos #filter-catalog-software .project-software span {
   padding: 2px 6px;
-  background: #fff;
-  color: #3867b7;
+  background: #FFF;
+  color: #3E67B1;
   border-radius: 50%;
   font-size: 16px;
 }
 .action-search-software_infos button#cleanup-filter-catalg {
   cursor: pointer;
-  background-color: #4562b1;
+  background-color: #3E67B1;
   font-size: 14px;
-  font-family:Arial;
+  font-family: Arial;
+  color: #ffffff;
+  border: 1px solid #2B65CD;
+  border-radius: 4px;
+  margin: 5px 0 0 5px;
+  padding: 5px 10px;
 }
 .action-search-software_infos button#close-filter-catalog {
   cursor:pointer;
+  float: right;
+  border: none;
+  background: none;
+  font-size: 12px;
+  margin-top: 5px;
+  color: #000;
+  text-transform: uppercase;
+  padding: 5px;
 }
 .action-search-software_infos button#close-filter-catalog:after {
@@ -167,7 +246,7 @@
   margin-left: 5px;
   padding: 2.5px 10.5px;
   background: url("../images/top-arrow.png") no-repeat center;
-  background-color: #4562b1;
+  background-color: #3E67B1;
   border-radius: 4px;
 }
@@ -177,16 +256,27 @@
 .action-search-software_infos #catalog-display-options {
   font-size: 14px;
-  font-family: Arial; 
+  font-family: Arial;
 }
 .action-search-software_infos #catalog-display-options  #catalog-display-options-count{
   padding: 45px 0 4px 0;
+  float: left;
+  width: 50%;
 }
 .action-search-software_infos #catalog-display-options  #catalog-display-options-show-and-sort{
   padding: 38px 0 5px 0;
   font-weight: bold;
+  float: left;
+  width: 50%;
+}
+.action-search-software_infos #catalog-display-options  #catalog-display-options-sort,
+.action-search-software_infos #catalog-display-options  #catalog-display-options-show{
+  position: relative;
+  float: left;
+  width: 50%;
+  text-align: right;
 }
 /*** Search Results ***/
@@ -234,11 +324,11 @@
 }
 .action-search-software_infos #search-results .search-software-item-column-left .vcard a:hover{
-  color:#2C66CE;
+  color: #3E67B1;
 }
 .action-search-software_infos #search-results .search-software-item-column-left .vcard a.profile_link{
-  float:left; 
+  float:left;
 }
 .action-search-software_infos #search-results .search-software-item-column-left .vcard:hover .menu-submenu-trigger {
@@ -248,7 +338,7 @@
 .action-search-software_infos #search-results .search-software-item-column-left .profile-image{
   width: 130px;
   height: 130px;
-  margin-left: 130px; 
+  margin-left: 130px;
   margin-top: 35px;
 }
@@ -268,7 +358,7 @@
   padding-right: 20px;
   top: 0px;
   position: absolute;
-  color: #21376c;
+  color: #2C4B6B;
   font-size: 13px;
   font-family: Arial;
   text-align: left;
@@ -298,7 +388,7 @@
 }
 .action-search-software_infos #search-results .search-software-item-column-right .search-software-content-block h4 a {
-  color: #172938;
+  color: #172738;
   font-size: 19px;
 }
@@ -324,12 +414,12 @@
   width: auto !important; /* force overwritting from base */
   margin-left: 7px !important; /* force overwritting from base */
   float: left;
-  color: #2B65cd;
+  color: #3E67B1;
   font-size: 13px;
   line-height: 18px;
   text-decoration: underline;
 }
 .action-search-software_infos #search-results .search-software-content-block #categories-list li a{
-  color: #2B65cd;
+  color: #3E67B1;
 }
 /*** Software Header ***/
-#content .software-information-block{
-	margin-bottom: 60px;
+#content .software-information-block {
+  margin: 0px 0px 60px 0px;
 }
-#content #software-information-block-table{
-  width: auto;
+#content #software-information-block-table {
   margin: 0px 15px;
+  width: auto;
 }
-#content #software-information-block-table td{
+#content #software-information-block-table td {
 	display: table-cell;
 }
 #content #software-information-block-table #col-software-name {
-  font-style: normal;
   vertical-align: top;
+  font-style: normal;
 }
-#content #software-information-block-table #col-software-name h1{
-  line-height: 37px;
-  font-size: 34px;
-  font-family: Arial, open_sansbold, Helvetica, sans-serif;
-  font-weight: 700;
+#content #software-information-block-table #col-software-name h1 {
+  font: 700 34px/37px arial, open_sansbold, helvetica, sans-serif;
   text-align: left;
 }
-#content #software-information-block-table #col-software-name b{
-  line-height: 21px;
-  font-weight: normal;
-  font-family: Arial, open_sansregular, Helvetica, sans-serif;
-  font-size: 15px;
+#content #software-information-block-table #col-software-name b {
+  font: normal normal normal 15px/21px arial, 'open_sansregular', helvetica, sans-serif;
 }
 /*** end of Software Header ***/
@@ -38,158 +32,143 @@
 /* Software Download Block*/
-#content .download-block #download-block-2{
+#content .download-block {
   margin: 0px 15px;
-  border:1px solid #D3D6DE;
+  border: 1px solid #D3D6DE;
   border-radius: 10px;
 }
-#content .download-block #download-block-2 #download_spb-2{
-  padding: 5px 10px;
+#content .download-block .block-title {
+  padding: 11px 10px 7px 20px;
   background-color: #D3D6DE;
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
-  font-family: Arial;
-}
-
-#content .download-block #download-block-2 #download_spb-2 h3{
-  margin: 6px 0px 2px 10px;
+  font-family: "open_sansbold", Arial, Helvetica, sans-serif;
+  margin: 0;
+  color: #172738;
   font-size: 18px;
 }
-#content .download-block #download-block-2 #download-info-1,
-#content .download-block #download-block-2 #download-info-2,
-#content .download-block #download-block-2 #download-info-3{
-  padding: 30px 10px 30px 10px;
-  clear: both;
+#content .download-block .download-list li {
+  padding: 30px 10px 25px 10px;
   border-top: 1px solid #D3D6DE;
+  clear: both;
 }
-#content .download-block #download-block-2 #download-info-2{
+#content .download-block .download-list li:nth-child(even) {
   background: #ECEDF1;
 }
-#content .download-block #download-block-2 #version01{
+#content .download-block .download-button {
   width: 80px;
   float: left;
-  margin-right: 20px;
-  margin-left: 15px;
   clear: both;
 }
-#content .download-block #download-block-2 #version01 #image-download{
-  display: block;
-  height: 18px; /*fix when display file size*/
+#content .download-block .download-button .download-image {
   padding: 50px 0px 8px 0px;
-  background-color: #2c66ce;
-  background-image: url("../images/download-icon.png");
-  background-repeat: no-repeat;
-  background-position: center;
   border: 1px solid #2c66ce;
-  border-radius: 8px; /*fix when display file size*/
+  border-radius: 8px;
+  height: 18px;
+  background: #2C66CE url("../images/download-icon.png") center no-repeat;
+  display: block;
 }
-#content .download-block #download-block-2 #version01 #size-download{
-  display: none; /*fix when display file size*/
-  color: #ffffff;
-  background-color: #1a397d;
+#content .download-block .download-button #download-size {
   border: 1px solid #1a397d;
-  border-bottom-right-radius: 8px;
-  border-bottom-left-radius: 8px;
+  border-radius: 0px 0px 8px 8px;
+  background-color: #1a397d;
+  color: #ffffff;
   font-size: 12px;
   text-align: center;
+  display: none;
 }
-#content .download-block #download-block-2 #info-software-download{
-  position: relative;
+#content .download-block .download-info {
   margin: 5px 0px 0px 100px;
+  position: relative;
   font-size: 16px;
 }
-#content .download-block #download-block-2 #info-software-download .download-name{
+#content .download-block .download-info .download-name {
   display: block;
   font-weight: bold;
 }
-#content .download-block #download-block-2 #info-software-download .download-system{
+#content .download-block .download-info .download-platform {
   display: block;
   font-size: 14px;
 }
-#content .download-block #download-block-2 #info-software-download .req_min_spb{
+#content .download-block .download-info .min-requirements {
   font-size: 12px;
 }
-#content .download-block #download-block-2 #info-software-download .req_min_spb a{
-  color: #3E67B1;
+#content .download-block .download-info .min-requirements a {
   line-height: 40px;
+  color: #3E67B1;
   text-decoration: underline;
 }
-#content .download-block #download-block-2 #licensed-software{
+#content .download-block #licensed-software {
   padding:14px;
-  background-color: #D3D6DE;
   border-top: 1px solid #D3D6DE;
-  border-bottom-right-radius: 8px;
-  border-bottom-left-radius: 8px;
+  border-radius: 0px 0px 8px 8px;
+  background-color: #D3D6DE;
   font-size: 12px;
   text-align: right;
 }
-#content .download-block #download-block-2 #licensed-software a{
+#content .download-block #licensed-software a {
   color: #3e67b1;
   text-decoration: underline;
 }
 /* About Software - Article on homepage */
-.profile-homepage #article h1{
-  padding: 0;
-  margin: 0 0 10px;
+.profile-homepage #article #article-toolbar #article-header h1 {
+  margin: 0px 0px 10px 0px;
+  padding: 0px;
   color: #172738;
-  font-family: Arial, open_sansbold, Helvetica, sans-serif;
-  font-variant: normal;
-  font-weight: bold;
-  font-size: 22px;
-  line-height: 1.3em;
+  font: normal normal bold 22px/1.3em arial, 'open_sansbold', helvetica, sans-serif;
 }
-.profile-homepage #article #article-header h1.title{
-  border: none;  
+.profile-homepage #article #article-toolbar #article-header h1.title {
+  border: none;
 }
-.profile-homepage #article #article-header .publishing-info{
+.profile-homepage #article #article-header .publishing-info {
   display: none;
 }
-.profile-homepage #article .article-body h1{
-  padding-top: 25px;
+.profile-homepage #article .article-body h1 {
   border-top: 1px solid #ECEDF1;
   border-bottom: none;
+  padding-top: 25px;
 }
-.profile-homepage #article .article-body p{
-	text-align: left;
-	font-size: 15px;
-	line-height: 21px;
-	margin-bottom: 20px;
+.profile-homepage #article .article-body p {
+  margin: 0px 0px 20px 0px;
+  line-height: 21px;
+  text-align: left;
+  font-size: 15px;
 }
-.profile-homepage #article .article-body hr{
+.profile-homepage #article .article-body hr {
   display: none;
 }
 .profile-homepage #article .article-body ul {
+  background-repeat: no-repeat;
   list-style-position: inside;
   list-style-type: disc;
-  background-repeat: no-repeat;
 }
-.profile-homepage #article .article-body ul li{
-  list-style: inherit;
+.profile-homepage #article .article-body ul li {
+  line-height: 21px;
   text-align: left;
-	font-size: 15px;
-	line-height: 21px;
+  font-size: 15px;
+  list-style: inherit;
 }
 /*** end of Software Homepage ***/ 
@@ -197,40 +176,41 @@
 /*** Categories and Tags block ***/
 #content .box-1  .categories-and-tags-block {
-  border-top: 4px solid #4562b1; 
+  border-top: 4px solid #2C4B6B; 
 }
 #content .box-1 .categories-and-tags-block .block-title {
+  margin: 13px 10px 10px 0;
+  padding: 3px 0px;
   background: none;
-  margin-top: 14px;
+  color: #5E82C6;
+  font-family: Arial;
+  font-size: 12px;
+  font-weight: 300;
   float: left;
-  font-size: 11px;
-}
-
-#content .box-1 .categories-and-tags-block .block-title:last-child {
-  border-top: 1px solid #8b949b;
-  border-bottom: 1px solid #8b949b;
 }
 #content .box-1 .categories-and-tags-block .category_cloud {
-  margin: 12px auto 10px 0px;
+  margin: 13px 0 10px 0;
   float: left;
+  max-width: 87%;
 }
 #content .box-1 .categories-and-tags-block .category_cloud a {
-  padding: 3px 6px;
-  margin: 10px 3px;
-  line-height: 28px;
-  background-color: #e9e8ed;
-  border: 1px solid #e9e8ed;
-  border-radius: 8px;
-  font-size: 11px;
+  padding: 3px 10px;
+  margin: 5px;
+  float: left;
+  color: #3E67B1;
+  background-color: #ECEDF1;
+  border: 1px solid #D3D6DE;
+  border-radius: 3px;
+  font-size: 12px;
 }
 #content .box-1 .categories-and-tags-block .category_cloud a:hover {
+  border-color: #3a70d1;
   background: #3a70d1;
   color: white;
-  border-color: #3a70d1;
 }
 #content .box-1 .categories-and-tags-block .category_cloud a:link {
@@ -241,93 +221,198 @@
 /*** Right bar ***/
+/*** WARNING - WHITOUT BOX-4 ***/
+
 /* Link-list block */
-#content .box-3 .block-title {
-	background: #eee;
-	color: #4562b1;
-	border-top: 4px solid #4562b1;
-	line-height: 15px;
+.template-default #content .box-3 .block-title {
+  border-top: 4px solid #4562b1;
+  line-height: 15px;
+  background: #eee;
+  color: #4562b1;
 }
-#content .box-3 .link-list-block li {
-  margin: 0;
-  padding: 0;
+.template-default #content .box-3 .link-list-block li {
+  margin: 0px;
+  padding: 0px;
   border-bottom: 1px solid #ddd;
   border-top: none;
 }
-#content .box-3 .link-list-block li a {
-  width: auto;
+.template-default #content .box-3 .link-list-block li a {
+  border-right: none;
+  border-top: 0px solid #64946E;
+  border-radius: 0px 0px 0px 0px;
   padding: 6px 5px 8px 18px;
+  width: auto;
+  line-height: 17px;
   background-color: #fff;
   background-position: 0px 50%;
   color: #2C66CE;
+  font-weight: normal;
+  font-size: 14px;
+}
+
+.template-default #content .box-3 .link-list-block h3.empty + ul {
+  border-top: 1px solid #ddd;
+}
+
+.template-default #content .box-3 .link-list-block li a.link-this-page,
+.template-default #content .box-3 .link-list-block li a.link-this-page:hover {
+  border-right: none;
+}
+
+.template-default #content .box-3 .link-list-block li a:hover {
+  background-color: #FFFFFF;
+  color: #000;
+}
+
+.template-default #content .box-3 .link-list-block li a.link-this-page {
+  margin-left: 0px;
+  width: auto;
+  background-color: #ffffff;
+  font-weight: bold;
+}
+
+/* Repository block */
+.template-default .box-3 #bt_repositorio,
+.template-default .box-3 #bt_repositorio:active,
+.template-default .box-3 #bt_repositorio:visited {
+  border-radius: 4px;
+  padding: 12px 10px;
+  background: #EAEBEE;
+  font: normal normal bold 12px 'open_sansbold', arial, helvetica, sans-serif;
+  text-transform: uppercase;
+  display: block;
+  position: relative;
+}
+
+.template-default .box-3 #bt_repositorio::after {
+  margin-top: -2px;
+  padding: 4px 0px 4px 2px;
+  border-radius: 4px;
+  width: 18px;
+  right: 10px;
+  line-height: 20px;
+  position: absolute;
+  background: #2C66CE;
+  color: #FFF;
+  font-size: 16px;
+  text-align: center;
+  content: url('../images/right-arrow.png');
+}
+
+.template-default .box-3 #content #bt_repositorio:hover {
+  color: #FFF;
+  background: #2C66CE;
+  text-decoration: none;
+}
+/*** END - WARNING - WHITOUT BOX-4 ***/
+
+/*** end of right bar ***/
+
+/************ DUPLICATE ************/
+
+/*
+    This part of the code is duplicated because, if there is
+    a change of layout from template-default to lefttopright
+    the CSS fit without many complication.
+ */
+
+/*** Right bar ***/
+
+/*** WARNING - WITH BOX-4 ***/
+
+/* Link-list block */
+.template-lefttopright #content .box-2 .block-title {
+  border-top: 4px solid #4562b1;
+  line-height: 15px;
+  background: #eee;
+  color: #4562b1;
+}
+
+.template-lefttopright #content .box-2 .link-list-block li {
+  margin: 0px;
+  padding: 0px;
+  border-bottom: 1px solid #ddd;
+  border-top: none;
+}
+
+.template-lefttopright #content .box-2 .link-list-block li a {
   border-right: none;
   border-top: 0px solid #64946E;
-  border-radius: 0 0 0 0;
+  border-radius: 0px 0px 0px 0px;
+  padding: 6px 5px 8px 18px;
+  width: auto;
+  line-height: 17px;
+  background-color: #fff;
+  background-position: 0px 50%;
+  color: #2C66CE;
   font-weight: normal;
   font-size: 14px;
-  line-height: 17px;
 }
-#content .box-3 .link-list-block h3.empty + ul {
+.template-lefttopright #content .box-2 .link-list-block h3.empty + ul {
   border-top: 1px solid #ddd;
 }
-#content .box-3 .link-list-block li a.link-this-page,
-#content .box-3 .link-list-block li a.link-this-page:hover {
+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page,
+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page:hover {
   border-right: none;
 }
-#content .box-3 .link-list-block li a:hover {
+.template-lefttopright #content .box-2 .link-list-block li a:hover {
   background-color: #FFFFFF;
   color: #000;
 }
-#content .box-3 .link-list-block li a.link-this-page {
-  width: auto;
+.template-lefttopright #content .box-2 .link-list-block li a.link-this-page {
   margin-left: 0px;
+  width: auto;
   background-color: #ffffff;
   font-weight: bold;
 }
 /* Repository block */
-.box-3 #bt_repositorio, 
-.box-3 #bt_repositorio:active, 
-.box-3 #bt_repositorio:visited{
-	display: block;
-	position: relative;
-	padding: 12px 10px;
-	background: #EAEBEE;
-	border-radius: 4px;
-	font-size: 12px;
-	font-family: open_sansbold, Arial, Helvetica, sans-serif;
-	font-weight: bold;
-	text-transform: uppercase;
-}
-
-.box-3 #bt_repositorio::after{
-	content: url('../images/right-arrow.png');
-  position: absolute;
+.template-lefttopright .box-2 #bt_repositorio,
+.template-lefttopright .box-2 #bt_repositorio:active,
+.template-lefttopright .box-2 #bt_repositorio:visited {
+  border-radius: 4px;
+  padding: 12px 10px;
+  background: #EAEBEE;
+  font: normal normal bold 12px 'open_sansbold', arial, helvetica, sans-serif;
+  text-transform: uppercase;
+  display: block;
+  position: relative;
+}
+
+.template-lefttopright .box-2 #bt_repositorio::after {
+  margin-top: -2px;
+  padding: 4px 0px 4px 2px;
+  border-radius: 4px;
   width: 18px;
   right: 10px;
-  padding: 4px 0px 4px 2px;
-  margin-top: -2px;
-	background: #2C66CE;
-	color: #FFF;
-	border-radius: 4px;
-	font-size: 16px;
-	line-height: 20px;
-	text-align: center;
+  line-height: 20px;
+  position: absolute;
+  background: #2C66CE;
+  color: #FFF;
+  font-size: 16px;
+  text-align: center;
+  content: url('../images/right-arrow.png');
 }
-.box-3 #content #bt_repositorio:hover{
-	color: #FFF;
-	background: #2C66CE;
-	text-decoration: none;
+.template-lefttopright .box-2 #content #bt_repositorio:hover {
+  color: #FFF;
+  background: #2C66CE;
+  text-decoration: none;
 }
+
+/*** WARNING - WITH BOX-4 ***/
+
 /*** end of right bar ***/
+/************ END DUPLICATE ************/
+
+
 /*** Software internal pages ***/
 /* FAQ page */
@@ -343,15 +428,15 @@
 }
 #content .main-block .article-body ul.etapas-publicacao li strong {
-  padding: 2px 8px;
   margin-right: 6px;
+  border-radius: 50%;
+  padding: 2px 8px;
   background: #333;
   color: #fff;
   float: left;
-  border-radius: 50%;
 }
-#content .main-block .article-body .etapas-publicacao-2{
+#content .main-block .article-body .etapas-publicacao-2 {
   font-weight: bold;
 }
@@ -364,44 +449,44 @@
 /* Manual page */
 #content .main-block #article .folder-content .item-info {
-  padding: 30px 20px 32px 0px;
   border-top: 1px solid #ccc;
+  padding: 30px 20px 32px 0px;
 }
-#content .main-block #article .folder-content .folder-item:last-child .item-info{
+#content .main-block #article .folder-content .folder-item:last-child .item-info {
   border-bottom: 1px solid #ccc;
 }
 #content .main-block #article .folder-content .item-icon {
-  display: block;
-  float: left;
   margin: 2px 0px auto auto;
   padding: 45px 40px 4px 10px;
-  background: #2C66CE url("../images/download-mini_icon.png") center center no-repeat;
   border: 1px solid #2C66CE;
   border-radius: 4px;
+  background: #2C66CE url("../images/download-mini_icon.png") center center no-repeat;
+  display: block;
+  float: left;
 }
-#content .main-block #article .folder-content .item-icon a{
+#content .main-block #article .folder-content .item-icon a {
   display: none;
 }
-#content .main-block #article .folder-content .item-description{
-  padding-left: 0px;
+#content .main-block #article .folder-content .item-description {
   margin-left: 65px;
+  padding-left: 0px;
 }
-#content .main-block #article .folder-content .item-description a{
+#content .main-block #article .folder-content .item-description a {
   color: #172938;
   font-size: 18px;
   font-family: Arial;
   font-weight: 700;
 }
-#content .main-block #article .folder-content .item-date{
-  padding-left: 0px;
+#content .main-block #article .folder-content .item-date {
   margin-left: 65px;
+  padding-left: 0px;
 }
 /*** end fo software internal pages ***/
@@ -0,0 +1,40 @@
+.ui-tooltip {
+  position: relative;
+  width: -moz-fit-content;
+  width: -webkit-fit-content;
+  width: fit-content;
+  max-width:280px;
+  padding: 15px 10px 15px 20px;
+  background: #172638;
+  color: white;
+  font-family: Arial, sans-serif;
+  font-size: 13px;
+  border: 0px !important;
+  z-index: 1070;
+}
+
+.ui-tooltip-bottom:after {
+  content: " ";
+  height: 0;
+  width: 0;
+  margin-left: -6px;
+  position: absolute;
+  bottom: 100%;
+  left: 50%;
+  border: solid transparent;
+  border-bottom-color: #172638;
+  border-width: 6px;
+}
+
+.ui-tooltip-top:after {
+  content: " ";
+  height: 0;
+  width: 0;
+  margin-left: -6px;
+  position: absolute;
+  top: 100%;
+  left: 50%;
+  border: solid transparent;
+  border-top-color: #172638;
+  border-width: 6px;
+}
@@ -0,0 +1,56 @@
+/*** Profile homepage ***/
+
+/* Ratings Header */
+.profile-homepage #content .community-average-rating-container{
+  margin-top: 21px;
+  overflow: auto;
+}
+
+.profile-homepage #content .community-average-rating-container .star-rate-text{
+  font-size: 14px;
+  letter-spacing: 0.2px;
+  margin-right: 5px;
+  padding: 4px 0px 0px 3px;
+}
+
+.profile-homepage #content .community-average-rating-container .star-container{
+  margin-top: 2px;
+}
+
+.profile-homepage #content .community-average-rating-container .rate-this-community{
+  font-size: 14px;
+  text-decoration: underline;
+  margin: 4px 0px 0px 6px;
+  padding: 0px 0px 0px 15px;
+}
+
+.profile-homepage #content .community-average-rating-container .rate-this-community a{
+  color: #2c66ce;
+}
+
+.profile-homepage #content .community-average-rating-container .star-container .medium-star-negative,
+.profile-homepage #content .community-average-rating-container .star-container .medium-star-positive{
+  margin-right: 3px;
+}
+
+/* Use report list */
+
+.profile-homepage #content .communities-ratings-block .ratings-title .block-title {
+  background: none;
+  border-bottom: 1px solid #D3D6DE;
+  border-top: none;
+  color: #172738;
+  font-size: 20px;
+  font-weight: 700;
+  letter-spacing: 1.8px;
+  margin-bottom: 0px;
+  padding: 0px 0px 12px 4px;
+}
+
+.profile-homepage #content .communities-ratings-block .ratings-list .make-report-block {
+  background-repeat: no-repeat;
+  border-bottom: 1px solid #D3D6DE;
+  border-top: none;
+  margin-top: 0px;
+  padding-top: 32px;
+}
@@ -120,4 +120,4 @@
  <!-- Script do portal Brasil deve ficar preferencialmente no rodape para nao atrasar o carregamento da pagina principal -->
    <script src="http://barra.brasil.gov.br/barra.js?cor=verde" type="text/javascript"></script><noscript>&nbsp;<!-- item para fins de acessibilidade --></noscript>
-
+   <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
 <!-- barra do governo -->
-   <div id="barra-brasil">
-      <a href="http://brasil.gov.br" title="Acesse para conhecer todos os serviços e informações do Governo Brasileiro na Internet.">Portal do Governo Brasileiro</a>
-    </div>
+<div id="barra-brasil">
+  <a href="http://brasil.gov.br" title="Acesse para conhecer todos os serviços e informações do Governo Brasileiro na Internet.">Portal do Governo Brasileiro</a>
+</div>
 <!--fim barra do governo -->
-
 <div class="header-content">
   <div role="banner" id="header">
     <div>
@@ -34,8 +33,6 @@
           </a>
         </li>
       </ul>
-
-
       <ul id="portal-siteactions">
         <li id="siteaction-accessibility">
           <a href="/software-publico-brasileiro/acessibilidade">Acessibilidade</a>
@@ -46,29 +43,24 @@
         <li id="siteaction-mapadosite">
           <a href="/search">Mapa do Site</a>
         </li>
-        
-                <li id="siteaction-languages-pt">
-           <a href="?lang=pt" title="Português">Português</a>
-        </li>        
-                <li id="siteaction-languages-en">
+        <li id="siteaction-languages-pt">
+          <a href="?lang=pt" title="Português">Português</a>
+        </li>
+        <li id="siteaction-languages-en">
           <a href="?lang=en" title="English">English</a>
         </li>
       </ul>
-	
-
       <div id="logo">
- 
-	<a title="Software Público" href="/">
+        <a title="Software Público" href="/">
           <span id="portal-title"></span>
         </a>
       </div>
-
       <div role="search" id="portal-searchbox">
         <form action="/search">
           <input type="text" autocomplete="off" name="query" size="18" title="Buscar no Site" placeholder="Buscar no Site" accesskey="3" class="searchField" id="searchGadget">
-          <input type="submit" class="searchButton" value="Buscar"></form>
+          <input type="submit" class="searchButton" value="Buscar">
+        </form>
       </div>
-
       <div id="social-icons">
         <ul>
           <li>
@@ -85,56 +77,21 @@
           </li>
         </ul>
       </div>
+    </div>
+      <div id="sobre">
+        <ul id="links-rapidos">
+          <li id="link-faq">
+            <a href="/ajuda/ajuda/duvidas-frequentes">Perguntas frequentes</a>
+          </li>
+          <li id="link-contact">
+            <a href="/contact/portal/new">Contato</a>
+          </li>
+        </ul>
+      </div>
   </div>
-
-  <div id="sobre"> 
-  <ul id="links-rapidos">
-        <li id="link-faq">
-          <a href="/ajuda/ajuda/duvidas-frequentes">Perguntas frequentes</a>
-        </li>
-        <li id="link-contact">
-          <a href="/contact/portal/new">Contato</a>
-        </li>
-      </ul>
+  <div id="menucontainer">
   </div>
-
-</div>
-
-
-<div id="menucontainer">
-    <!--<ul id="hmenu">
-        <li class="parent_menu"><a href="/">Software Público</a>
-
-        </li>
-        <li class="parent_menu"><a href="/">Mercado Público</a>
-
-        </li>
-        <li class="parent_menu"><a href="/search/communities">Comunidades</a>
-
-           <!-- <ul>
-                <li class="child_menu"><a href="#">Comunidades de Software</a>
-
-                </li>
-              <li class="child_menu"><a href="#">Universidades</a>
-                </li>
-            </ul>
-        </li>-->
-       <!-- <li class="parent_menu"><a href="#">Software</a>
-
-        </li> -->
-       <!-- <li class="parent_menu"><a href="/search/people">Usuário</a>
-
-        </li>
-    </ul> -->
-
-</div>
-
-   <div id="categories_menu">
+  <div id="categories_menu">
     <%= theme_include 'categories' %>
   </div>
-
-  <!--
-<div id="barra-psocial">
-
-</div>-->
-
+</div>
+/*** Noosfero Base Theme ***/
 @import url(../profile-base/style.css);
+
+/*** Icon and animation resources***/
 @import url(../../icons/tango/style.css);
+@import url(css/animate.css);
+@import url(font-awesome.min.css);
+
+/*** SPB Theme section styles ***/
 @import url(css/overwriting-base-theme.css);
 @import url(css/header.css);
 @import url(css/footer.css);
 @import url(css/left-bar.css);
 @import url(css/home-page.css);
-@import url(css/software-pages.css);
-@import url(css/software-catalog-page.css);
 @import url(css/main-content.css);
+@import url(css/edition-pages.css);
+@import url(css/administration-panel.css);
 @import url(css/article-page.css);
-@import url(css/news-page.css);
+@import url(css/software-pages.css);
 @import url(css/community-pages.css);
-@import url(css/edition-pages.css);
+@import url(css/news-page.css);
+@import url(css/search-pages.css);
+@import url(css/software-catalog-page.css);
+@import url(css/tooltip.css);
+@import url(css/popover.css);
 @import url(css/tabs.css);
-/*
-@import url(css/use-report.css);
-@import url(css/tooltips.css);
-*/
-@import url(font-awesome.min.css);
-/*@import url(http://fonts.googleapis.com/css?family=Open+Sans);*/
-
-
-@font-face {
-font-weight: normal;
-font-style: normal;
-font-family: "open_sanslight";
-src: url("fonts/opensans-300-webfont.eot");
-src: url("fonts/opensans-300-webfont.eot?#iefix") format("embedded-opentype"),
-url("fonts/opensans-300-webfont.woff") format("woff"),
-url("fonts/opensans-300-webfont.ttf") format("truetype"),
-url("fonts/opensans-300-webfont.svg#open_sanslight") format("svg");
-}
-
-@font-face {
-font-weight: normal;
-font-style: normal;
-font-family: "open_sansregular";
-src: url("fonts/opensans-400-webfont.eot");
-src: url("fonts/opensans-400-webfont.eot?#iefix") format("embedded-opentype"),
-url("fonts/opensans-400-webfont.woff") format("woff"),
-url("fonts/opensans-400-webfont.ttf") format("truetype"),
-url("fonts/opensans-400-webfont.svg#open_sansregular") format("svg");
-}
-
-@font-face {
-font-weight: normal;
-font-style: normal;
-font-family: "open_sanssemibold";
-src: url("fonts/opensans-600-webfont.eot");
-src: url("fonts/opensans-600-webfont.eot?#iefix") format("embedded-opentype"),
-url("fonts/opensans-600-webfont.woff") format("woff"),
-url("fonts/opensans-600-webfont.ttf") format("truetype"),
-url("fonts/opensans-600-webfont.svg#open_sanssemibold") format("svg");
-}
-@font-face {
-font-weight: normal;
-font-style: normal;
-font-family: "open_sansbold";
-src: url("fonts/opensans-700-webfont.eot");
-src: url("fonts/opensans-700-webfont.eot?#iefix") format("embedded-opentype"),
-url("fonts/opensans-700-webfont.woff") format("woff"),
-url("fonts/opensans-700-webfont.ttf") format("truetype"),
-url("fonts/opensans-700-webfont.svg#open_sansbold") format("svg");
-}
-
-@font-face {
-font-weight: normal;
-font-style: normal;
-font-family: "open_sansextrabold";
-src: url("fonts/opensans-800-webfont.eot");
-src: url("fonts/opensans-800-webfont.eot?#iefix") format("embedded-opentype"),
-url("fonts/opensans-800-webfont.woff") format("woff"),
-url("fonts/opensans-800-webfont.ttf") format("truetype"),
-url("fonts/opensans-800-webfont.svg#open_sansextrabold") format("svg");
-}
-
-/***********Regras Gerais ************/
+
+@font-face{
+  font-weight: normal;
+  font-style: normal;
+  font-family: "open_sanslight";
+  src: url("fonts/opensans-300-webfont.eot");
+  src: url("fonts/opensans-300-webfont.eot?#iefix") format("embedded-opentype"),
+       url("fonts/opensans-300-webfont.woff") format("woff"),
+       url("fonts/opensans-300-webfont.ttf") format("truetype"),
+       url("fonts/opensans-300-webfont.svg#open_sanslight") format("svg");
+}
+
+@font-face{
+  font-weight: normal;
+  font-style: normal;
+  font-family: "open_sansregular";
+  src: url("fonts/opensans-400-webfont.eot");
+  src: url("fonts/opensans-400-webfont.eot?#iefix") format("embedded-opentype"),
+       url("fonts/opensans-400-webfont.woff") format("woff"),
+       url("fonts/opensans-400-webfont.ttf") format("truetype"),
+       url("fonts/opensans-400-webfont.svg#open_sansregular") format("svg");
+}
+
+@font-face{
+  font-weight: normal;
+  font-style: normal;
+  font-family: "open_sanssemibold";
+  src: url("fonts/opensans-600-webfont.eot");
+  src: url("fonts/opensans-600-webfont.eot?#iefix") format("embedded-opentype"),
+       url("fonts/opensans-600-webfont.woff") format("woff"),
+       url("fonts/opensans-600-webfont.ttf") format("truetype"),
+       url("fonts/opensans-600-webfont.svg#open_sanssemibold") format("svg");
+}
+
+@font-face{
+  font-weight: normal;
+  font-style: normal;
+  font-family: "open_sansbold";
+  src: url("fonts/opensans-700-webfont.eot");
+  src: url("fonts/opensans-700-webfont.eot?#iefix") format("embedded-opentype"),
+       url("fonts/opensans-700-webfont.woff") format("woff"),
+       url("fonts/opensans-700-webfont.ttf") format("truetype"),
+       url("fonts/opensans-700-webfont.svg#open_sansbold") format("svg");
+}
+
+@font-face{
+  font-weight: normal;
+  font-style: normal;
+  font-family: "open_sansextrabold";
+  src: url("fonts/opensans-800-webfont.eot");
+  src: url("fonts/opensans-800-webfont.eot?#iefix") format("embedded-opentype"),
+       url("fonts/opensans-800-webfont.woff") format("woff"),
+       url("fonts/opensans-800-webfont.ttf") format("truetype"),
+       url("fonts/opensans-800-webfont.svg#open_sansextrabold") format("svg");
+}
+
+/*********** General Rules ************/
 * {
-margin: 0;
-padding: 0;
-list-style: none;
-vertical-align: baseline;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  vertical-align: baseline;
 }
 body {
-    background-color: #fff;
-    color: #172738;
-    font-size: 12px;
-    font-family: "open_sansregular", Arial, Helvetica, sans-serif;
+  background-color: #fff;
+  color: #172738;
+  font-size: 12px;
+  font-family: "open_sansregular", Arial, Helvetica, sans-serif;
 }
 * :link,:visited {
-    text-decoration:none;
+  text-decoration: none;
 }
 * ul,ol {
-    list-style:none;
+  list-style: none;
 }
 * h1,h2,h3,h4,h5,h6 {
-    color:inherit;
-    font-family: arial;
-    font-weight: 700;
-    margin-top:20px;
-    margin-bottom:10px;
+  color: inherit;
+  font-family: Arial;
+  font-weight: 700;
+  margin-top: 20px;
+  margin-bottom: 10px;
 }
 * h1{
-    font-size: 34px;
-    line-height: 37px;
+  font-size: 34px;
+  line-height: 37px;
 }
 * h2{
-    font-size:22px;
-    line-height: 21px;
+  font-size: 22px;
+  line-height: 21px;
 }
 * h3{
-    font-size:18px;
-    line-height: 21px;
+  font-size: 18px;
+  line-height: 21px;
 }
 * h4,h5,h6 {
-    font-size: 16px;
-    line-height: 21px;
+  font-size: 16px;
+  line-height: 21px;
 }
 #content h1, #content h2, #content h3, #content h4, #content h5, #content h6{
   margin-top: 20px;
-  margin-bottom:10px
+  margin-bottom: 10px;
   color: inherit;
   font-family: Arial;
   font-weight: 700;
@@ -153,54 +158,56 @@ body {
   font-weight: 700;
 }
-#content h4, content h5, #content h6 {
+#content h4, content h5, #content h6{
   font-size: 16px;
   line-height: 21px;
 }
-p {
+p{
   margin: 0px 0px 10px 0px;
   line-height: 21px;
   font-size: 15px;
 }
-* a img,:link img,:visited img {
-    border:none
+* a img,:link img,:visited img{
+  border: none
 }
-a {
-    outline: none;
+a{
+  outline: none;
 }
-a:link, #content a:link, dl.portlet a:link {
-    color: #172738;
-    /*border-bottom: none;*/
+a:link, #content a:link, dl.portlet a:link{
+  color: #172738;
 }
-a:visited, #content a:visited, dl.portlet a:visited {
-    color:#2c66ce; /*#2c67cd;*/
+a:visited, #content a:visited, dl.portlet a:visited{
+  color:#2c66ce;
 }
-a:focus {
-    outline: 2px solid #f1ca7f;
+a:focus{
+  outline: 2px solid #f1ca7f;
 }
 /* Remove in all td gray backgroung hover */
-tr:hover td {
-    background-color: transparent;
+tr:hover td{
+  background-color: transparent;
 }
-#content a:hover, dl.portlet a:hover {
-    color: #000;
+#content a:hover, dl.portlet a:hover{
+  color: #000;
 }
-table {
- border-spacing: 0;
+
+table{
+  border-spacing: 0;
 }
-img {
-    vertical-align: text-bottom;
+img{
+  vertical-align: text-bottom;
 }
-iframe {
-    border-width: 0; border-style:none;
+iframe{
+  border-width: 0; border-style:none;
 }
+
+
@@ -83,16 +83,6 @@ $(&#39;#link-buscar&#39;).click(function(e) {
     //finality.stop().animate({"top" : "100%"}, TRANSITION_TIME);
   }
-  function set_events() {
-    // Fade css
-    $('.software-block-finality').css('opacity', 0);
-    $('.software-block-finality').css('top', 0);
-    // End Fade CSS
-
-    $(".software-block").mouseover(show_finality);
-    $(".software-block").mouseout(hide_finality);
-  }
-
   function move_article_buttons(){
     var article_actions = $('#article-actions').clone();
     var report = $('.report-abuse-action').remove();
@@ -131,7 +121,48 @@ $(&#39;#link-buscar&#39;).click(function(e) {
       //$('<div class="notice-item"></div>').wrap($(this).find( '.image', '.title', '.lead', '.read_more'));
     });
+  }
+  //toggle filter options in catalog page
+  function setFilterCategoriesOptionClass() {
+    var filterOptions = $("#filter-categories-option");
+    filterOptions.addClass("animated slideInDown");
+  }
+
+  function toggleFilterOptions(){
+    var filterOptions = $("#filter-categories-option");
+    var showOptions = $("#filter-option-catalog-software");
+    var hideOptions = $("#filter-option-catalog-close");
+    if(hideOptions.is(":visible")){
+      //filterOptions.slideUp(function() {
+        showOptions.show();
+        hideOptions.hide();
+      //});
+      filterOptions.animate({
+        height: 0
+      },500);
+    }
+    else {
+      showOptions.hide();
+      hideOptions.show();
+      filterOptions.animate({
+        height: 565
+      },500);
+    }
+  }
+
+  function setEvents(){
+    // Fade css
+    $('.software-block-finality').css('opacity', 0);
+    $('.software-block-finality').css('top', 0);
+    // End Fade CSS
+    $(".software-block").mouseover(show_finality);
+    $(".software-block").mouseout(hide_finality);
+
+    var showOptions = $("#filter-option-catalog-software");
+    var hideOptions = $("#filter-option-catalog-close");
+    showOptions.click(toggleFilterOptions);
+    hideOptions.click(toggleFilterOptions);
   }
   /* Finds all uploaded files from manuals page and sets its names on the right format */
@@ -190,6 +221,9 @@ $(&#39;#link-buscar&#39;).click(function(e) {
     $('.star-rate-form .star-comment-container .comments-software-extra-fields #input_institution_comments label').html('Nome do órgão ou empresa');
     $('.star-rate-form .star-comment-container .comments-software-extra-fields .comments-software-people-benefited label').html('Número de beneficiados');
     $('.star-rate-form .star-comment-container .comments-software-extra-fields .comments-software-saved-values label').html('Recursos economizados');
+    $('.star-rate-form .star-comment-container .comments-software-extra-fields #input_institution_comments').addClass("animated slideInDown");
+    $('.star-rate-form .star-comment-container .comments-software-extra-fields .comments-software-people-benefited').addClass("animated slideInDown");
+    $('.star-rate-form .star-comment-container .comments-software-extra-fields .comments-software-saved-values').addClass("animated slideInDown");
   }
   function add_top_tooltips(){
@@ -216,15 +250,36 @@ $(&#39;#link-buscar&#39;).click(function(e) {
     });
   }
+  function add_popovers() {
+    var span = $('span[data-toggle="popover"]');
+    var place = span.attr("data-placement");
+    var elementClass = span.attr("data-class");
+    var popover =  span.popover({
+      html:true,
+      placement: place,
+      content: function() {
+        return $(this).next().html();
+      }
+    })
+    .data('bs.popover');
+    if(popover) {
+      popover.tip()
+      .addClass(elementClass);
+      $('a.toggle-popover').on("click",function() {
+        span.trigger("click");
+      });
+    }
+  }
+
   $(document).ready(function(){
+    add_popovers();
     add_top_tooltips();
-    set_events();
     move_article_buttons();
-    add_link_to_article_div();
     insert_notice_div();
     set_uploaded_files_names();
     set_tooltip_content();
     set_arrow_direction();
     set_use_report_content();
+    setEvents();
     });
 })(jQuery);
 name: "Software Público"
 layout: "application-ng"
-icon_theme: [participabr]
@@ -0,0 +1,142 @@		@@ -0,0 +1,142 @@
	1	+/* Environment Admin Pages - General Rules */
	2	+.action-admin_panel-index #content .main-block h2,
	3	+.controller-features #content .main-block h2{
	4	+ font-family: Arial;
	5	+ font-size: 22px;
	6	+ font-weight: 700;
	7	+ line-height: 21px;
	8	+}
	9	+
	10	+/* Environment Settings */
	11	+
	12	+/* Profile tab */
	13	+
	14	+.action-admin_panel-site_info .main-content .ui-tabs{
	15	+ border: none;
	16	+}
	17	+
	18	+.action-admin_panel-site_info .main-content .ui-tabs .ui-tabs-nav{
	19	+ margin: 0 0 0 1em;
	20	+ padding: 0;
	21	+ background: none;
	22	+ color: #172738;
	23	+ border: 0px solid #aaaaaa;
	24	+ border-radius: 4px;
	25	+ font-weight: bold;
	26	+}
	27	+
	28	+.action-admin_panel-site_info .main-content .ui-widget-content .ui-state-default,
	29	+.action-admin_panel-site_info .main-content .ui-widget-header .ui-state-default{
	30	+ background: #d5d5d5 none;
	31	+ color: #555555;
	32	+ font-weight: normal;
	33	+}
	34	+
	35	+.action-admin_panel-site_info .main-content .ui-widget-content .ui-state-active,
	36	+.action-admin_panel-site_info .main-content .ui-widget-header .ui-state-active{
	37	+ background: #eeeff1;
	38	+ color: #212121;
	39	+ font-weight: normal;
	40	+}
	41	+
	42	+.action-admin_panel-site_info .main-content .ui-tabs .ui-tabs-panel{
	43	+ display: block;
	44	+ padding: 1em 1.4em;
	45	+ background-color: #eeeff1;
	46	+ color: #777;
	47	+ border-width: 1px;
	48	+ font-size: 13px;
	49	+ text-decoration: none;
	50	+}
	51	+
	52	+/* Organizations Settings */
	53	+
	54	+.action-organizations-index .main-block form#manage-profiles,
	55	+.action-organizations-index .main-block form#manage-profiles form{
	56	+ background-color: transparent;
	57	+}
	58	+
	59	+.action-organizations-index .main-block form#manage-profiles .search-field{
	60	+ margin-bottom: 30px;
	61	+}
	62	+
	63	+.action-organizations-index .main-block form#manage-profiles .search-field .formfield {
	64	+ width: 100%;
	65	+ margin-right: 0.5em;
	66	+ float: left;
	67	+}
	68	+
	69	+.action-organizations-index .main-block form#manage-profiles .search-field .formfield input {
	70	+ margin-top: 0px;
	71	+ margin-right: 0.5em;
	72	+ padding: 6px;
	73	+ min-width: 97%;
	74	+ height: 19px;
	75	+ max-height: 19px;
	76	+ background: none;
	77	+ border: 1px solid #ccc;
	78	+ border-radius: 4px;
	79	+}
	80	+
	81	+.action-organizations-index .main-block form#manage-profiles input.button.submit{
	82	+ height: 32px;
	83	+ margin-top: 8px;
	84	+ padding: 5px 15px;
	85	+ background: #3E67B1 none;
	86	+ color: #FFF;
	87	+ border-radius: 4px;
	88	+ border: 1px solid #3E67B1;
	89	+ font-size: 14px;
	90	+ text-transform: uppercase;
	91	+}
	92	+
	93	+.action-organizations-index .main-block form#manage-profiles input.button.submit:hover{
	94	+ background: #5E82C6;
	95	+}
	96	+
	97	+.action-organizations-index .main-block #environment-profiles-filter-title,
	98	+.action-organizations-index .main-block #environment-profiles-filter-filter{
	99	+ line-height: 35px;
	100	+ font-size: 12px;
	101	+}
	102	+
	103	+.action-organizations-index .main-block table#organizations-list th{
	104	+ text-align: left;
	105	+ vertical-align: middle;
	106	+ padding: 2px 8px;
	107	+}
	108	+
	109	+/* Features Settings */
	110	+
	111	+.controller-features #content form *{
	112	+ font-size: 15px;
	113	+}
	114	+
	115	+.controller-features #content th{
	116	+ text-align: left;
	117	+}
	118	+
	119	+.controller-features #content h3{
	120	+ min-height: 0;
	121	+ margin: 20px auto 10px auto;
	122	+}
	123	+
	124	+.controller-features #content hr{
	125	+ display: none;
	126	+}
	127	+
	128	+.controller-features #content ul.token-input-list{
	129	+ padding: 6px;
	130	+ background: none;
	131	+ border: 1px solid #ccc;
	132	+ border-radius: 4px;
	133	+ font-family: Arial, helvetica;
	134	+ font-size: 15px;
	135	+}
	136	+
	137	+/* Community Admin pages */
	138	+
	139	+/* Index */
	140	+.action-cms-index .cms-articles th{
	141	+ text-align: left;
	142	+}
@@ -0,0 +1,68 @@		@@ -0,0 +1,68 @@
	1	+.animated {
	2	+ -webkit-animation-duration: .7s;
	3	+ animation-duration: .7s;
	4	+ -webkit-animation-fill-mode: both;
	5	+ animation-fill-mode: both;
	6	+}
	7	+
	8	+@-webkit-keyframes slideInDown {
	9	+ from {
	10	+ -webkit-transform: translate3d(0, -100%, 0);
	11	+ transform: translate3d(0, -100%, 0);
	12	+ visibility: visible;
	13	+ }
	14	+
	15	+ 100% {
	16	+ -webkit-transform: translate3d(0, 0, 0);
	17	+ transform: translate3d(0, 0, 0);
	18	+ }
	19	+}
	20	+
	21	+@keyframes slideInDown {
	22	+ from {
	23	+ -webkit-transform: translate3d(0, -100%, 0);
	24	+ transform: translate3d(0, -100%, 0);
	25	+ visibility: visible;
	26	+ }
	27	+
	28	+ 100% {
	29	+ -webkit-transform: translate3d(0, 0, 0);
	30	+ transform: translate3d(0, 0, 0);
	31	+ }
	32	+}
	33	+
	34	+.slideInDown {
	35	+ -webkit-animation-name: slideInDown;
	36	+ animation-name: slideInDown;
	37	+}
	38	+
	39	+@-webkit-keyframes slideOutUp {
	40	+ from {
	41	+ -webkit-transform: translate3d(0, 0, 0);
	42	+ transform: translate3d(0, 0, 0);
	43	+ }
	44	+
	45	+ 100% {
	46	+ visibility: hidden;
	47	+ -webkit-transform: translate3d(0, -100%, 0);
	48	+ transform: translate3d(0, -100%, 0);
	49	+ }
	50	+}
	51	+
	52	+@keyframes slideOutUp {
	53	+ from {
	54	+ -webkit-transform: translate3d(0, 0, 0);
	55	+ transform: translate3d(0, 0, 0);
	56	+ }
	57	+
	58	+ 100% {
	59	+ visibility: hidden;
	60	+ -webkit-transform: translate3d(0, -100%, 0);
	61	+ transform: translate3d(0, -100%, 0);
	62	+ }
	63	+}
	64	+
	65	+.slideOutUp {
	66	+ -webkit-animation-name: slideOutUp;
	67	+ animation-name: slideOutUp;
	68	+}
	@@ -28,6 +28,15 @@		@@ -28,6 +28,15 @@
28	line-height: 21px;	28	line-height: 21px;
29	}	29	}
30		30
		31	+#content #article-parent a.button.with-text{
		32	+ background-color: #3E67B1;
		33	+ color: #FFF;
		34	+}
		35	+
		36	+#content #article-parent a.button.with-text:hover{
		37	+ background-color: #5E82C6;
		38	+}
		39	+
31	/* Need a dev solution - blog internal pages*/	40	/* Need a dev solution - blog internal pages*/
32		41
33	#article-header .preview{	42	#article-header .preview{
	@@ -76,27 +85,34 @@		@@ -76,27 +85,34 @@
76	}	85	}
77		86
78	#content .main-block .article-body #article-actions:last-child{	87	#content .main-block .article-body #article-actions:last-child{
79	- padding-top: 10px;
80	- border-top: 4px solid #2C4B6B;	88	+ margin: 0;
		89	+ padding: 10px 0;
		90	+ border-top: 1px solid #D3D6DE;
81	}	91	}
82		92
83	/* Categories */	93	/* Categories */
84		94
		95	+#content .main-block #article-cat{
		96	+ border-top: 4px solid #2C4B6B;
		97	+ border-bottom: 1px solid #D3D6DE;
		98	+}
		99	+
85	#content .main-block #article-cat h4 {	100	#content .main-block #article-cat h4 {
86	float: left;	101	float: left;
87	- margin: 13px 10px 10px 0;	102	+ margin: 12px 10px 10px 0;
88	min-height: 0px;	103	min-height: 0px;
		104	+ color: #5E82C6;
89	font-family: Arial;	105	font-family: Arial;
90	- font-size: 1.3em;	106	+ font-size: 12px;
91	font-weight: 300;	107	font-weight: 300;
92	text-decoration: initial;	108	text-decoration: initial;
93	}	109	}
94		110
95	#content .main-block #article-cat a{	111	#content .main-block #article-cat a{
96	- float: left;	112	+ display: inline-block;
97	margin: 10px 10px 10px 0;	113	margin: 10px 10px 10px 0;
98	padding: 3px 10px;	114	padding: 3px 10px;
99	- color: #3E67B1;	115	+ color: #5E82C6;
100	background-color: #ECEDF1;	116	background-color: #ECEDF1;
101	border: 1px solid #D3D6DE;	117	border: 1px solid #D3D6DE;
102	border-radius: 3px;	118	border-radius: 3px;
	@@ -104,7 +120,29 @@		@@ -104,7 +120,29 @@
104	text-decoration: initial;	120	text-decoration: initial;
105	}	121	}
106		122
107	-/* end of categories */	123	+/* Tags */
		124	+
		125	+#content .main-block #article-tags{
		126	+ width: 100%;
		127	+ color: #5E82C6;
		128	+ border-bottom: 1px solid #D3D6DE;
		129	+ font-family: Arial;
		130	+ font-size: 12px;
		131	+ font-weight: 300;
		132	+ text-align: left;
		133	+}
		134	+
		135	+#content .main-block #article-tags a{
		136	+ display: inline-block;
		137	+ margin: 10px 10px 10px 0;
		138	+ padding: 3px 10px;
		139	+ color: #5E82C6;
		140	+ background-color: #ECEDF1;
		141	+ border: 1px solid #D3D6DE;
		142	+ border-radius: 3px;
		143	+ font-size: 12px;
		144	+ text-decoration: initial;
		145	+}
108		146
109	/* Site Map page */	147	/* Site Map page */
110		148
1	/****************** Box-2 ******************/	1	/****************** Box-2 ******************/
2		2
3	-.box-2{	3	+/* WARNING - WITHOUT BOX-4 */
		4	+
		5	+.template-default .box-2 {
4	width:150px;	6	width:150px;
5	}	7	}
6		8
7	-#content .box-2 .block-outer .block-title {	9	+.template-default #content .box-2 .block-outer .block-title {
8	background: #eee;	10	background: #eee;
9	color: #4562b1;	11	color: #4562b1;
10	border-top: 4px solid #4562b1;	12	border-top: 4px solid #4562b1;
	@@ -13,14 +15,86 @@		@@ -13,14 +15,86 @@
13		15
14	/* Menus - Link list block */	16	/* Menus - Link list block */
15		17
16	-#content .box-2 .link-list-block li {	18	+.template-default #content .box-2 .link-list-block li {
		19	+ margin: 0;
		20	+ padding: 0;
		21	+ border-bottom: 1px solid #ddd;
		22	+ border-top: none;
		23	+}
		24	+
		25	+.template-default #content .box-2 .link-list-block li a {
		26	+ width: auto;
		27	+ padding: 6px 5px 8px 18px;
		28	+ background-color: #fff;
		29	+ background-position: 0px 50%;
		30	+ color: #2C66CE;
		31	+ border-right: none;
		32	+ border-top: 0px solid #64946E;
		33	+ border-radius: 0 0 0 0;
		34	+ font-weight: normal;
		35	+ font-size: 14px;
		36	+ line-height: 17px;
		37	+}
		38	+
		39	+.template-default #content .box-2 .link-list-block h3.empty + ul {
		40	+ border-top: 1px solid #ddd;
		41	+}
		42	+
		43	+.template-default #content .box-2 .link-list-block h3.empty + ul li a {
		44	+ padding-left: 0px;
		45	+ padding-right: 0px;
		46	+ background-image: none;
		47	+}
		48	+
		49	+.template-default #content .box-2 .link-list-block li a.link-this-page,
		50	+.template-default #content .box-2 .link-list-block li a.link-this-page:hover {
		51	+ border-right: none;
		52	+}
		53	+
		54	+.template-default #content .box-2 .link-list-block li a:hover {
		55	+ background-color: #FFFFFF;
		56	+ color: #000;
		57	+}
		58	+.template-default #content .box-2 .link-list-block li a.link-this-page {
		59	+ width: auto;
		60	+ margin-left: 0px;
		61	+ background-color: #ffffff;
		62	+ font-weight: bold;
		63	+}
		64	+
		65	+/* END OF WARNING - WITHOUT BOX-4 */
		66	+
		67	+/* WARNING - WITH BOX-4 */
		68	+
		69	+/********** DUPLICATE **********
		70	+
		71	+ This part of the code is duplicated because, if there is
		72	+ a change of layout from template-default to lefttopright
		73	+ the CSS fit without many complication.
		74	+
		75	+ */
		76	+
		77	+.template-lefttopright .box-3 {
		78	+ width:150px;
		79	+}
		80	+
		81	+.template-lefttopright #content .box-3 .block-outer .block-title {
		82	+ background: #eee;
		83	+ color: #4562b1;
		84	+ border-top: 4px solid #4562b1;
		85	+ line-height: 15px;
		86	+}
		87	+
		88	+/* Menus - Link list block */
		89	+
		90	+.template-lefttopright #content .box-3 .link-list-block li {
17	margin: 0;	91	margin: 0;
18	padding: 0;	92	padding: 0;
19	border-bottom: 1px solid #ddd;	93	border-bottom: 1px solid #ddd;
20	border-top: none;	94	border-top: none;
21	}	95	}
22		96
23	-#content .box-2 .link-list-block li a {	97	+.template-lefttopright #content .box-3 .link-list-block li a {
24	width: auto;	98	width: auto;
25	padding: 6px 5px 8px 18px;	99	padding: 6px 5px 8px 18px;
26	background-color: #fff;	100	background-color: #fff;
	@@ -34,33 +108,41 @@		@@ -34,33 +108,41 @@
34	line-height: 17px;	108	line-height: 17px;
35	}	109	}
36		110
37	-#content .box-2 .link-list-block h3.empty + ul {	111	+.template-lefttopright #content .box-3 .link-list-block h3.empty + ul {
38	border-top: 1px solid #ddd;	112	border-top: 1px solid #ddd;
39	}	113	}
40		114
41	-#content .box-2 .link-list-block h3.empty + ul li a {	115	+.template-lefttopright #content .box-3 .link-list-block h3.empty + ul li a {
42	padding-left: 0px;	116	padding-left: 0px;
43	padding-right: 0px;	117	padding-right: 0px;
44	background-image: none;	118	background-image: none;
45	}	119	}
46		120
47	-#content .box-2 .link-list-block li a.link-this-page,
48	-#content .box-2 .link-list-block li a.link-this-page:hover {	121	+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page,
		122	+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page:hover {
49	border-right: none;	123	border-right: none;
50	}	124	}
51		125
52	-#content .box-2 .link-list-block li a:hover {	126	+.template-lefttopright #content .box-3 .link-list-block li a:hover {
53	background-color: #FFFFFF;	127	background-color: #FFFFFF;
54	color: #000;	128	color: #000;
55	}	129	}
56	-#content .box-2 .link-list-block li a.link-this-page {	130	+.template-lefttopright #content .box-3 .link-list-block li a.link-this-page {
57	width: auto;	131	width: auto;
58	margin-left: 0px;	132	margin-left: 0px;
59	background-color: #ffffff;	133	background-color: #ffffff;
60	font-weight: bold;	134	font-weight: bold;
61	}	135	}
62		136
		137	+/********** END OF DUPLICATE **********
		138	+
		139	+/* END OF WARNING - WITH BOX-4 */
		140	+
63	/* Statistics block /	141	/* Statistics block /
		142	+.template-default #content .box-2 .statistics-block {
		143	+ padding: 10px 0px 10px 10px
		144	+}
		145	+
64	.statistics-block-data ul {	146	.statistics-block-data ul {
65	margin-top: 10px;	147	margin-top: 10px;
66	}	148	}
	@@ -83,6 +165,9 @@ span.amount {		@@ -83,6 +165,9 @@ span.amount {
83	span.label {	165	span.label {
84	font-size: 14px;	166	font-size: 14px;
85	}	167	}
		168	+
86	/* end of statistics block /	169	/* end of statistics block /
87		170
		171	+/* WARNING - WITH BOX-4 */
		172	+
88	/****************** end Box-2 ******************/	173	/****************** end Box-2 ******************/
1	/* Box */	1	/* Box */
2	.box-1 .block,	2	.box-1 .block,
3	.no-boxes .block {	3	.no-boxes .block {
4	- margin-top: 50px;	4	+ margin-top: 50px;
5	}	5	}
6		6
7	-.block-outer {
8	- margin-bottom: 45px;
9	- clear: both;	7	+.box-2 .block-outer,
		8	+.box-3 .block-outer{
		9	+ margin-bottom: 45px;
		10	+ clear: both;
10	}	11	}
11		12
12	/* Block Title */	13	/* Block Title */
	@@ -41,13 +42,13 @@		@@ -41,13 +42,13 @@
41	#content .pagination a,	42	#content .pagination a,
42	#content .pagination em,	43	#content .pagination em,
43	#content .pagination span{	44	#content .pagination span{
44	- padding: 7px 11px 7px 11px;	45	+ padding: 5px 9px;
45	margin-right: 4px;	46	margin-right: 4px;
46	color: #172738;	47	color: #172738;
47	border: 1px solid #D3D6DE;	48	border: 1px solid #D3D6DE;
48	border-radius: 4px;	49	border-radius: 4px;
49	letter-spacing: 0.6px;	50	letter-spacing: 0.6px;
50	- font-size: 15px;	51	+ font-size: 12px;
51	font-weight: 700;	52	font-weight: 700;
52	text-decoration: none;	53	text-decoration: none;
53	display: inline-table;	54	display: inline-table;
	@@ -59,13 +60,11 @@		@@ -59,13 +60,11 @@
59	}	60	}
60		61
61	#content .pagination .previous_page{	62	#content .pagination .previous_page{
62	- padding: 7px 11px 10px 11px;
63	float: left;	63	float: left;
64	}	64	}
65		65
66	#content .pagination .next_page{	66	#content .pagination .next_page{
67	float: right;	67	float: right;
68	- padding: 7px 11px 10px 11px;
69	}	68	}
70		69
71	#content .pagination .previous_page,	70	#content .pagination .previous_page,
	@@ -80,5 +79,50 @@		@@ -80,5 +79,50 @@
80	opacity: 0.5;	79	opacity: 0.5;
81	}	80	}
82		81
		82	+/* Button */
83		83
		84	+#content a.button.with-text,
		85	+#content #article-actions a.button.with-text{
		86	+ height: 32px;
		87	+ padding: 5px 15px;
		88	+ background: #FFF none;
		89	+ color: #3E67B1;
		90	+ border-radius: 4px;
		91	+ border: 1px solid #3E67B1;
		92	+ font-size: 14px;
		93	+ line-height: 32px;
		94	+ text-transform: uppercase;
		95	+}
84		96
		97	+#content form input.button.with-text{
		98	+ height: 42px;
		99	+ max-height: 42px;
		100	+ padding: 5px 15px;
		101	+ background: #FFF none;
		102	+ color: #3E67B1;
		103	+ border-radius: 4px;
		104	+ border: 1px solid #3E67B1;
		105	+ font-size: 14px;
		106	+ line-height: 32px;
		107	+ text-transform: uppercase;
		108	+}
		109	+
		110	+#content a.button:hover,
		111	+#content #article-actions a.button.with-text:hover,
		112	+#content input.button.with-text:hover{
		113	+ background-color: #3E67B1;
		114	+ color: #FFF;
		115	+}
		116	+
		117	+/* This is a temporary solution until noosfero deals with logged-out comments in a better manner. */
		118	+.comment-replies .comment-logged-out .comment-text,
		119	+.comment-logged-out .comment-picture,
		120	+.comment-logged-out h4 {
		121	+ opacity: 1.0;
		122	+}
		123	+
		124	+.comment-logged-out .comment-text,
		125	+.comment-info {
		126	+ color: black;
		127	+}
		128	+/**/
@@ -0,0 +1,191 @@		@@ -0,0 +1,191 @@
	1	+.popover {
	2	+ position: absolute;
	3	+ top: 0;
	4	+ left: 0;
	5	+ z-index: 1060;
	6	+ display: none;
	7	+ max-width: 276px;
	8	+ padding: 1px;
	9	+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	10	+ font-size: 14px;
	11	+ font-style: normal;
	12	+ font-weight: normal;
	13	+ line-height: 1.42857143;
	14	+ text-align: left;
	15	+ text-align: start;
	16	+ text-decoration: none;
	17	+ text-shadow: none;
	18	+ text-transform: none;
	19	+ letter-spacing: normal;
	20	+ word-break: normal;
	21	+ word-spacing: normal;
	22	+ word-wrap: normal;
	23	+ white-space: normal;
	24	+ background-color: #fff;
	25	+ -webkit-background-clip: padding-box;
	26	+ background-clip: padding-box;
	27	+ border: 1px solid #ccc;
	28	+ border: 1px solid rgba(0, 0, 0, .2);
	29	+ border-radius: 6px;
	30	+ -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	31	+ box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	32	+
	33	+ line-break: auto;
	34	+}
	35	+.popover.top {
	36	+ margin-top: -12px;
	37	+}
	38	+.popover.right {
	39	+ margin-left: 10px;
	40	+}
	41	+.popover.bottom {
	42	+ margin-top: 10px;
	43	+}
	44	+.popover.left {
	45	+ margin-left: -10px;
	46	+}
	47	+.popover-title {
	48	+ padding: 8px 14px;
	49	+ margin: 0;
	50	+ font-size: 14px;
	51	+ background-color: #f7f7f7;
	52	+ border-bottom: 1px solid #ebebeb;
	53	+ border-radius: 5px 5px 0 0;
	54	+}
	55	+.popover-content {
	56	+ padding: 9px 14px;
	57	+}
	58	+.popover > .arrow,
	59	+.popover > .arrow:after {
	60	+ position: absolute;
	61	+ display: block;
	62	+ width: 0;
	63	+ height: 0;
	64	+ border-color: transparent;
	65	+ border-style: solid;
	66	+}
	67	+.popover > .arrow {
	68	+ border-width: 11px;
	69	+}
	70	+.popover > .arrow:after {
	71	+ content: "";
	72	+ border-width: 10px;
	73	+}
	74	+.popover.top > .arrow {
	75	+ bottom: -11px;
	76	+ left: 50%;
	77	+ margin-left: -11px;
	78	+ border-top-color: #999;
	79	+ border-top-color: rgba(0, 0, 0, .25);
	80	+ border-bottom-width: 0;
	81	+}
	82	+.popover.top > .arrow:after {
	83	+ bottom: 1px;
	84	+ margin-left: -10px;
	85	+ content: " ";
	86	+ border-top-color: #fff;
	87	+ border-bottom-width: 0;
	88	+}
	89	+.popover.right > .arrow {
	90	+ top: 50%;
	91	+ left: -11px;
	92	+ margin-top: -11px;
	93	+ border-right-color: #999;
	94	+ border-right-color: rgba(0, 0, 0, .25);
	95	+ border-left-width: 0;
	96	+}
	97	+.popover.right > .arrow:after {
	98	+ bottom: -10px;
	99	+ left: 1px;
	100	+ content: " ";
	101	+ border-right-color: #fff;
	102	+ border-left-width: 0;
	103	+}
	104	+.popover.bottom > .arrow {
	105	+ top: -11px;
	106	+ left: 50%;
	107	+ margin-left: -11px;
	108	+ border-top-width: 0;
	109	+ border-bottom-color: #999;
	110	+ border-bottom-color: rgba(0, 0, 0, .25);
	111	+}
	112	+.popover.bottom > .arrow:after {
	113	+ top: 1px;
	114	+ margin-left: -10px;
	115	+ content: " ";
	116	+ border-top-width: 0;
	117	+ border-bottom-color: #fff;
	118	+}
	119	+.popover.left > .arrow {
	120	+ top: 50%;
	121	+ right: -11px;
	122	+ margin-top: -11px;
	123	+ border-right-width: 0;
	124	+ border-left-color: #999;
	125	+ border-left-color: rgba(0, 0, 0, .25);
	126	+}
	127	+.popover.left > .arrow:after {
	128	+ right: 1px;
	129	+ bottom: -10px;
	130	+ content: " ";
	131	+ border-right-width: 0;
	132	+ border-left-color: #fff;
	133	+}
	134	+
	135	+/* popover in software highlights block */
	136	+
	137	+.highlights-popover {
	138	+ max-width: 280px;
	139	+ margin: 0 0 0 -75px;
	140	+ background: #172638;
	141	+ color: #FFFFFF;
	142	+}
	143	+
	144	+.highlights-popover .popover-content {
	145	+ padding: 0;
	146	+}
	147	+
	148	+.highlights-popover p {
	149	+ padding: 13px 13px 15px;
	150	+ margin: 0px;
	151	+ font-size: 14px;
	152	+ line-height: 20px;
	153	+}
	154	+
	155	+.highlights-popover span {
	156	+ font-weight: bold;
	157	+ border-bottom: 1px dotted #FFFFFF;
	158	+}
	159	+
	160	+#content .highlights-popover a,
	161	+#content .highlights-popover a:visited,
	162	+#content .highlights-popover a:hover,
	163	+#content .highlights-popover a:link {
	164	+ font-weight: bold;
	165	+ color: #FFFFFF;
	166	+ display: block;
	167	+ padding: 8px 15px;
	168	+ border-top: 1px dotted rgba(255,255,255,0.1);
	169	+}
	170	+
	171	+.highlights-popover a:before {
	172	+ font-family: "FontAwesome";
	173	+ content: "\f067";
	174	+ vertical-align: middle;
	175	+ color: #ff0066;
	176	+ padding: 0 5px 0 0;
	177	+}
	178	+
	179	+.highlights-popover.top > .arrow,
	180	+.highlights-popover.right > .arrow,
	181	+.highlights-popover.bottom > .arrow,
	182	+.highlights-popover.left > .arrow {
	183	+ margin-left: 64px;
	184	+}
	185	+
	186	+.highlights-popover.top > .arrow:after,
	187	+.highlights-popover.right > .arrow:after,
	188	+.highlights-popover.bottom > .arrow:after,
	189	+.highlights-popover.left > .arrow:after {
	190	+ border-top-color: #172638;
	191	+}
@@ -0,0 +1,115 @@		@@ -0,0 +1,115 @@
	1	+/* Search Community */
	2	+
	3	+.action-search-index #content form #search-header,
	4	+.action-search-people #content form #search-header,
	5	+.action-search-communities #content form #search-header{
	6	+ margin-top: 5px;
	7	+ float: right;
	8	+ border: none;
	9	+}
	10	+
	11	+.action-search-people #content form #search-header #search-filters .sod_select,
	12	+.action-search-communities #content form #search-header #search-filters .sod_select{
	13	+ color: #3E67B1;
	14	+ border: 1px solid #3E67B1;
	15	+ border-radius: 4px;
	16	+ font-family: Arial;
	17	+ font-variant: normal;
	18	+ font-weight: 300;
	19	+ box-shadow: none;
	20	+}
	21	+
	22	+.action-search-people #content form #search-header #search-filters .sod_select .sod_list,
	23	+.action-search-communities #content form #search-header #search-filters .sod_select .sod_list{
	24	+ margin: -2px 0 0 -1px;
	25	+ color: #3E67B1;
	26	+ border: 1px solid #3E67B1;
	27	+ border-top: none;
	28	+ border-radius: 0px 0px 4px 4px;
	29	+ font-family: Arial;
	30	+ font-variant: normal;
	31	+ font-weight: 300;
	32	+}
	33	+
	34	+.action-search-people #content form #search-header #search-filters .sod_select .sod_list .active,
	35	+.action-search-communities #content form #search-header #search-filters .sod_select .sod_list .active{
	36	+ border-radius: 0px 0px 4px 4px;
	37	+}
	38	+
	39	+.action-search-people #content form #search-header #search-filters .sod_select .sod_list .selected,
	40	+.action-search-communities #content form #search-header #search-filters .sod_select .sod_list .selected{
	41	+ padding-right: 21px;
	42	+}
	43	+
	44	+.action-search-people #content form #search-subheader .sod_select,
	45	+.action-search-communities #content form #search-subheader .sod_select{
	46	+ line-height: 15px;
	47	+}
	48	+
	49	+.action-search-index #content form .search-field,
	50	+.action-search-people #content form .search-field,
	51	+.action-search-communities #content form .search-field{
	52	+ margin-bottom: 30px;
	53	+}
	54	+
	55	+.action-search-index #content form .search-field .formfield,
	56	+.action-search-people #content form .search-field .formfield,
	57	+.action-search-communities #content form .search-field .formfield{
	58	+ float: left;
	59	+ width: 99%;
	60	+}
	61	+.action-search-index #content form .search-field .formfield input,
	62	+.action-search-people #content form .search-field .formfield input,
	63	+.action-search-communities #content form .search-field .formfield input{
	64	+ margin-top: 0px;
	65	+ padding: 6px;
	66	+ height: 19px;
	67	+ max-height: 19px;
	68	+ max-width: 98%;
	69	+ background: none;
	70	+ border: 1px solid #ccc;
	71	+ border-radius: 4px;
	72	+}
	73	+
	74	+.action-search-index #content form input.button.submit,
	75	+.action-search-people #content form input.button.submit,
	76	+.action-search-communities #content form input.button.submit{
	77	+ height: 32px;
	78	+ margin-top: 8px;
	79	+ padding: 5px 15px;
	80	+ background: #3E67B1 none;
	81	+ color: #FFF;
	82	+ border-radius: 4px;
	83	+ border: 1px solid #3E67B1;
	84	+ font-size: 14px;
	85	+ line-height: 14px;
	86	+ text-transform: uppercase;
	87	+}
	88	+
	89	+.action-search-index #content form input.button.submit:hover,
	90	+.action-search-people #content form input.button.submit:hover,
	91	+.action-search-communities #content form input.button.submit:hover{
	92	+ background: #5E82C6;
	93	+}
	94	+
	95	+.action-search-people #search-results .search-results-type-people,
	96	+.action-search-communities #search-results .search-results-type-community{
	97	+ background: none;
	98	+ border: 1px solid #ccc;
	99	+ border-radius: 10px;
	100	+}
	101	+
	102	+.action-search-index #search-results h3{
	103	+ margin: 20px 0 10px 0;
	104	+ color: #172738;
	105	+ font-size:18px;
	106	+ line-height: 21px;
	107	+ font-family: Arial;
	108	+ font-weight: 700;
	109	+ font-variant: normal;
	110	+}
	111	+
	112	+.action-search-index #search-results .search-results-innerbox{
	113	+ background: none;
	114	+ border: 1px solid #ccc;
	115	+}
@@ -0,0 +1,40 @@		@@ -0,0 +1,40 @@
	1	+.ui-tooltip {
	2	+ position: relative;
	3	+ width: -moz-fit-content;
	4	+ width: -webkit-fit-content;
	5	+ width: fit-content;
	6	+ max-width:280px;
	7	+ padding: 15px 10px 15px 20px;
	8	+ background: #172638;
	9	+ color: white;
	10	+ font-family: Arial, sans-serif;
	11	+ font-size: 13px;
	12	+ border: 0px !important;
	13	+ z-index: 1070;
	14	+}
	15	+
	16	+.ui-tooltip-bottom:after {
	17	+ content: " ";
	18	+ height: 0;
	19	+ width: 0;
	20	+ margin-left: -6px;
	21	+ position: absolute;
	22	+ bottom: 100%;
	23	+ left: 50%;
	24	+ border: solid transparent;
	25	+ border-bottom-color: #172638;
	26	+ border-width: 6px;
	27	+}
	28	+
	29	+.ui-tooltip-top:after {
	30	+ content: " ";
	31	+ height: 0;
	32	+ width: 0;
	33	+ margin-left: -6px;
	34	+ position: absolute;
	35	+ top: 100%;
	36	+ left: 50%;
	37	+ border: solid transparent;
	38	+ border-top-color: #172638;
	39	+ border-width: 6px;
	40	+}
@@ -0,0 +1,56 @@		@@ -0,0 +1,56 @@
	1	+/* Profile homepage */
	2	+
	3	+/* Ratings Header */
	4	+.profile-homepage #content .community-average-rating-container{
	5	+ margin-top: 21px;
	6	+ overflow: auto;
	7	+}
	8	+
	9	+.profile-homepage #content .community-average-rating-container .star-rate-text{
	10	+ font-size: 14px;
	11	+ letter-spacing: 0.2px;
	12	+ margin-right: 5px;
	13	+ padding: 4px 0px 0px 3px;
	14	+}
	15	+
	16	+.profile-homepage #content .community-average-rating-container .star-container{
	17	+ margin-top: 2px;
	18	+}
	19	+
	20	+.profile-homepage #content .community-average-rating-container .rate-this-community{
	21	+ font-size: 14px;
	22	+ text-decoration: underline;
	23	+ margin: 4px 0px 0px 6px;
	24	+ padding: 0px 0px 0px 15px;
	25	+}
	26	+
	27	+.profile-homepage #content .community-average-rating-container .rate-this-community a{
	28	+ color: #2c66ce;
	29	+}
	30	+
	31	+.profile-homepage #content .community-average-rating-container .star-container .medium-star-negative,
	32	+.profile-homepage #content .community-average-rating-container .star-container .medium-star-positive{
	33	+ margin-right: 3px;
	34	+}
	35	+
	36	+/* Use report list */
	37	+
	38	+.profile-homepage #content .communities-ratings-block .ratings-title .block-title {
	39	+ background: none;
	40	+ border-bottom: 1px solid #D3D6DE;
	41	+ border-top: none;
	42	+ color: #172738;
	43	+ font-size: 20px;
	44	+ font-weight: 700;
	45	+ letter-spacing: 1.8px;
	46	+ margin-bottom: 0px;
	47	+ padding: 0px 0px 12px 4px;
	48	+}
	49	+
	50	+.profile-homepage #content .communities-ratings-block .ratings-list .make-report-block {
	51	+ background-repeat: no-repeat;
	52	+ border-bottom: 1px solid #D3D6DE;
	53	+ border-top: none;
	54	+ margin-top: 0px;
	55	+ padding-top: 32px;
	56	+}
	@@ -120,4 +120,4 @@		@@ -120,4 +120,4 @@
120		120
121	<!-- Script do portal Brasil deve ficar preferencialmente no rodape para nao atrasar o carregamento da pagina principal -->	121	<!-- Script do portal Brasil deve ficar preferencialmente no rodape para nao atrasar o carregamento da pagina principal -->
122	<script src="http://barra.brasil.gov.br/barra.js?cor=verde" type="text/javascript"></script><noscript> <!-- item para fins de acessibilidade --></noscript>	122	<script src="http://barra.brasil.gov.br/barra.js?cor=verde" type="text/javascript"></script><noscript> <!-- item para fins de acessibilidade --></noscript>
123	-	123	+ <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>