diff --git a/app/views/box_organizer/index.html.erb b/app/views/box_organizer/index.html.erb
index a7637cc..394ffa1 100644
--- a/app/views/box_organizer/index.html.erb
+++ b/app/views/box_organizer/index.html.erb
@@ -51,12 +51,8 @@
 
 <section id="block-types-navigation">
   <nav class="nav-circlepop">
-    <a class="previous" href="javascript:void(0);">
-      <span class="icon-wrap"></span>
-    </a>
-    <a class="next" href="javascript:void(0);">
-      <span class="icon-wrap"></span>
-    </a>
+    <a class="previous" href="javascript:void(0);"><span class="icon-wrap"></span></a>
+    <a class="next" href="javascript:void(0);"><span class="icon-wrap"></span></a>
   </nav>
 </section>
 
diff --git a/public/designs/themes/noosfero/block_store.css b/public/designs/themes/noosfero/block_store.css
index d0f21ed..3d37b00 100644
--- a/public/designs/themes/noosfero/block_store.css
+++ b/public/designs/themes/noosfero/block_store.css
@@ -1,13 +1,15 @@
+#block-types {
+  height: 100px;
+}
+
 #block-types-container {
   margin: 0 60px;
 }
 
 .block-types-group {
   display: none;
-}
-
-.block-types-group.active {
-  display: block;
+  position: absolute;
+  min-width: 800px;
 }
 
 #block-types-navigation a#next {
diff --git a/public/designs/themes/noosfero/circlepop.css b/public/designs/themes/noosfero/circlepop.css
index dd40d8c..4c6fea3 100644
--- a/public/designs/themes/noosfero/circlepop.css
+++ b/public/designs/themes/noosfero/circlepop.css
@@ -1,6 +1,6 @@
 nav a {
 	position: absolute;
-	top: 30%;
+	top: 215px;
 	display: block;
 	outline: none;
 	text-align: left;
diff --git a/public/javascripts/block_store.js b/public/javascripts/block_store.js
index f57a0be..170b45b 100644
--- a/public/javascripts/block_store.js
+++ b/public/javascripts/block_store.js
@@ -1,37 +1,25 @@
 jQuery(document).ready(function () {
-
-  // navigation - click action
   jQuery('#block-types-navigation a.previous').click(PreviousSlide);
   jQuery('#block-types-navigation a.next').click(NextSlide);
-
-  // set first block types group active
   jQuery('.block-types-group').first().addClass('active');
   jQuery(".block-types-group.active + .block-types-group").addClass('next');
-
   firstBlockTypesGroup = jQuery(".block-types-group").first();
   lastBlockTypesGroup = jQuery(".block-types-group").last();
+  jQuery('.block-types-group').first().show( 'slide', { direction : 'down' }, 1000 );
   jQuery("#block-types-navigation a.previous").hide();
 });
 
 function NextSlide() {
-    // get active block-types-group
     activeBlockTypesGroup = jQuery(".block-types-group.active");
-
-    // get next block-types-group
     nextBlockTypesGroup = jQuery(".block-types-group.next").first();
-
-    // switch active group
     activeBlockTypesGroup.removeClass('active');
     activeBlockTypesGroup.addClass('prev');
-    activeBlockTypesGroup.css({"display":"none"});
+    activeBlockTypesGroup.hide( 'slide', { direction : 'left' }, 1000 );
     nextBlockTypesGroup.removeClass('next');
     nextBlockTypesGroup.addClass('active');
-    nextBlockTypesGroup.css({"display": "block"});
-
     jQuery(".block-types-group.active + .block-types-group").addClass('next');
-
+    nextBlockTypesGroup.show( 'slide', { direction : 'right' }, 1000 );
     activeBlockTypesGroup = jQuery(".block-types-group.active");
-
     jQuery("#block-types-navigation a.previous").show();
 
     if ( activeBlockTypesGroup.is( lastBlockTypesGroup ) ) {
@@ -40,26 +28,18 @@ function NextSlide() {
 }
 
 function PreviousSlide() {
-    // get active block-types-group
     activeBlockTypesGroup = jQuery(".block-types-group.active");
-
-    // get previous block-types-group
     previousBlockTypesGroup = jQuery(".block-types-group.prev").last();
-
-    // switch active group
     activeBlockTypesGroup.removeClass('active');
     activeBlockTypesGroup.addClass('next');
-    activeBlockTypesGroup.css({"display":"none"});
+    activeBlockTypesGroup.hide( 'slide', { direction : 'right' }, 1000 );
     previousBlockTypesGroup.removeClass('prev');
     previousBlockTypesGroup.addClass('active');
-    previousBlockTypesGroup.css({"display": "block"});
-
+    previousBlockTypesGroup.show( 'slide', { direction : 'left' }, 1000 );
     activeBlockTypesGroup = jQuery(".block-types-group.active");
-
     jQuery("#block-types-navigation a.next").show();
 
     if ( activeBlockTypesGroup.is( firstBlockTypesGroup ) ) {
       jQuery("#block-types-navigation a.previous").hide();
     }
 }
-
--
libgit2 0.21.2