Integration nouveau design (en partie, 50%)

src/Muzich/CoreBundle/Controller/ElementController.php

@@ -489,7 +489,7 @@ class ElementController extends Controller
           ))
         ),
         'img' => array(
-          'src'  => $this->getAssetUrl('bundles/muzichcore/img/up_b.png')
+          'src'  => $this->getAssetUrl('/img/icon_thumb_red.png')
         ),
         'element' => array(
           'points' => $element->getPoints()
@@ -548,7 +548,7 @@ class ElementController extends Controller
           ))
         ),
         'img' => array(
-          'src'  => $this->getAssetUrl('bundles/muzichcore/img/up_bw.png')
+          'src'  => $this->getAssetUrl('/img/icon_thumb.png')
         ),
         'element' => array(
           'points' => $element->getPoints()

src/Muzich/CoreBundle/Resources/views/Menu/containerMenu.html.twig

@@ -1,4 +1,4 @@
-
+<!--
 {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
 
   <ul id="top-tabs">
@@ -47,4 +47,5 @@
     </li>
   </ul>
 
-{% endif %}
+{% endif %}
+-->

src/Muzich/CoreBundle/Resources/views/SearchElement/element.html.twig

@@ -42,6 +42,42 @@
         </a>
       {% endif %}
       
+      <ul class="element_thumb_actions">
+        <li class="score">
+          {{ element.points }}
+        </li>
+          {% if element.owner.id != app.user.id %}
+            <li class="vote thumb">
+              {% if element.hasVoteGood(app.user.id) %}
+                <a class="vote" href="{{ path('ajax_element_remove_vote_good', {
+                  'element_id' : element.id,
+                  'token'      : app.user.getPersonalHash
+                }) }}" title="{{ 'element.vote.good'|trans({}, 'elements') }}">
+                  <img src="{{ asset('img/icon_thumb_red.png') }}" alt="vote" />
+                </a>
+              {% else %}
+                <a class="vote" href="{{ path('ajax_element_add_vote_good', {
+                  'element_id' : element.id,
+                  'token'      : app.user.getPersonalHash
+                }) }}" title="{{ 'element.vote.good'|trans({}, 'elements') }}">
+                  <img src="{{ asset('img/icon_thumb.png') }}" alt="vote" />
+                </a>
+              {% endif %}
+            </li>
+        {% endif %}
+        <li class="star">
+          {% if element.hasFavoriteUser(app.user.id) %}
+            <a class="favorite_link" href="{{ path('favorite_remove', { 'id': element.id, 'token': app.user.personalHash }) }}" >
+              <img id="favorite_{{ element.id }}_is" src="{{ asset('img/icon_star_2_red.png') }}" title="{{ 'element.favorite.remove'|trans({}, 'elements') }}" alt="{{ 'element.favorite.remove'|trans({}, 'elements') }}"/>
+            </a>
+          {% else %}
+            <a class="favorite_link" href="{{ path('favorite_add', { 'id': element.id, 'token': app.user.personalHash }) }}" >
+              <img id="favorite_{{ element.id }}_isnot" src="{{ asset('img/icon_star_2.png') }}" title="{{ 'element.favorite.add'|trans({}, 'elements') }}" alt="{{ 'element.favorite.add'|trans({}, 'elements') }}" />
+            </a>
+          {% endif %}
+        </li>
+      </ul>
+      
     </td>
     <td class="element_content">
       
@@ -57,62 +93,82 @@
         {% endif %}
       </span> 
       
-      <a title="{{ 'element.link'|trans({}, 'elements') }}" class="element_link" href="{{ element.url }}" target="_blank">
-        <img src="{{ asset('bundles/muzichcore/img/1324917097_link.png') }}" alt="link" />
-      </a>
-      
-      {% if app.user.id != element.owner.id %}
-      
-      {% if display_edit_actions %}
-      
-          <a title="{{ 'element.proposition_tags.link_title'|trans({}, 'userui') }}" 
-            class="element_propose_tags" 
-            href="{{ path('ajax_element_propose_tags_open', {'element_id' : element.id}) }}">
-            <img src="{{ asset('bundles/muzichcore/img/1333484018_rss-tag.png') }}" alt="tags_proposition" />
+      <ul class="element_links_actions" class="gradient">
+        <li class="element_link">
+          <a title="{{ 'element.link'|trans({}, 'elements') }}" class="element_link" href="{{ element.url }}" target="_blank">
+            <img src="{{ asset('/img/icon_link.png') }}" alt="link" />
           </a>
+        </li>
+        
+        {% if app.user.id != element.owner.id %}
+      
+          {% if display_edit_actions %}
+            <li class="element_propose_tags">
+              <a title="{{ 'element.proposition_tags.link_title'|trans({}, 'userui') }}" 
+                class="element_propose_tags" 
+                href="{{ path('ajax_element_propose_tags_open', {'element_id' : element.id}) }}">
+                <img src="{{ asset('bundles/muzichcore/img/1333484018_rss-tag.png') }}" alt="tags_proposition" />
+              </a>
+            </li>
 
-          <a title="{{ 'element.reshare.link_title'|trans({}, 'userui') }}" 
-            class="element_reshare" 
-            href="{{ path('ajax_reshare_element', {'element_id':element.id, 'token':app.user.getPersonalHash('reshare_'~element.id)}) }}">
-            <img src="{{ asset('bundles/muzichcore/img/1349338086_adept_update.png') }}" alt="re" />
-          </a>
+            <li class="element_reshare">
+              <a title="{{ 'element.reshare.link_title'|trans({}, 'userui') }}" 
+                class="element_reshare" 
+                href="{{ path('ajax_reshare_element', {'element_id':element.id, 'token':app.user.getPersonalHash('reshare_'~element.id)}) }}">
+                <img src="{{ asset('/img/icon_reload.png') }}" alt="re" />
+              </a>
+            </li>
+            
+            <li class="element_report">
+              <a title="{{ 'element.report.link_title'|trans({}, 'userui') }}" 
+                class="element_report" 
+                href="{{ path('ajax_report_element', {'element_id':element.id, 'token':app.user.getPersonalHash}) }}">
+                <img src="{{ asset('/img/icon_alert.png') }}" alt="report" />
+              </a>
+            </li>
 
-          <a title="{{ 'element.report.link_title'|trans({}, 'userui') }}" 
-            class="element_report" 
-            href="{{ path('ajax_report_element', {'element_id':element.id, 'token':app.user.getPersonalHash}) }}">
-            <img src="{{ asset('bundles/muzichcore/img/1331832708_comment_alert.png') }}" alt="report" />
-          </a>
-      
-      {% endif %}
-      
-      {% endif %}
-      
-      {% if app.user.id == element.owner.id %}
-      
-        {% if display_edit_actions %}
-      
-          {% if element.hasTagProposition %}
-            <a title="{{ 'element.view_propositions.link'|trans({}, 'elements') }}" class="element_view_propositions_link" 
-              href="{{ path('ajax_element_proposed_tags_view', {'element_id' : element.id})  }}"
-            >
-              <img src="{{ asset('bundles/muzichcore/img/1333493527_tag_add.png') }}" alt="tags proposition" />
-            </a>
           {% endif %}
 
-          <a title="{{ 'element.edit.link'|trans({}, 'elements') }}" class="element_edit_link" 
-            href="{{ path('element_edit', {'element_id' : element.id})  }}" style="display: none;"
-          >
-            <img src="{{ asset('bundles/muzichcore/img/1327151338_desktop.png') }}" alt="edit" />
-          </a>
+        {% endif %}
+
+        {% if app.user.id == element.owner.id %}
+
+          {% if display_edit_actions %}
+
+            {% if element.hasTagProposition %}
+              <li class="element_view_propositions_link">
+                <a title="{{ 'element.view_propositions.link'|trans({}, 'elements') }}" class="element_view_propositions_link" 
+                  href="{{ path('ajax_element_proposed_tags_view', {'element_id' : element.id})  }}"
+                >
+                  <img src="{{ asset('bundles/muzichcore/img/1333493527_tag_add.png') }}" alt="tags proposition" />
+                </a>
+              </li>
+            {% endif %}
+
+            <li class="element_edit_link">
+              <a title="{{ 'element.edit.link'|trans({}, 'elements') }}" class="element_edit_link" 
+                href="{{ path('element_edit', {'element_id' : element.id})  }}"
+              >
+                <img src="{{ asset('/img/icon_pen.png') }}" alt="edit" />
+              </a>
+            </li>
+
+            <li class="element_remove_link">
+              <a title="{{ 'element.remove.link'|trans({}, 'elements') }}" class="element_remove_link" 
+                href="{{ path('element_remove', {'element_id' : element.id})  }}"
+              >
+                <img src="{{ asset('/img/icon_close_2.png') }}" alt="delete" />
+              </a>
+            </li>
+          {% endif %}
 
-          <a title="{{ 'element.remove.link'|trans({}, 'elements') }}" class="element_remove_link" 
-            href="{{ path('element_remove', {'element_id' : element.id})  }}" style="display: none;"
-          >
-            <img src="{{ asset('bundles/muzichcore/img/1327168960_fileclose.png') }}" alt="delete" />
-          </a>
         {% endif %}
+        
+      </ul>
+      
+      
+      
       
-      {% endif %}
       
       <br />
       {% autoescape false %}
@@ -154,7 +210,7 @@
               {{ tag.name }}
             </a>
             {% if app.user.haveTagsFavorite(tag.id) %}
-              <img class="tag_to_favorites" src="{{ asset('/bundles/muzichcore/img/1331734087_emblem-favorite.png') }}" 
+              <img class="tag_to_favorites" src="{{ asset('/img/icon_heart.png') }}" 
                 alt="add-to-favorites"
                 title="{{ 'element.tag.isfav.title'|trans({'%tagname%':tag.name}, 'elements') }}"
               />
@@ -168,7 +224,7 @@
                 style="display: none;"
                 title="{{ 'element.tag.addtofav.title'|trans({}, 'elements') }}"   
               >
-                <img src="{{ asset('/bundles/muzichcore/img/1331734087_emblem-favorite.png') }}" alt="add-to-favorites"/>
+                <img class="tag_add_to_favorites"  src="{{ asset('/img/icon_heart.png') }}" alt="add-to-favorites"/>
               </a>
             {% endif %}
           </li>
@@ -208,50 +264,6 @@
       
       
     </td>
-    <td class="right">
-      
-      <ul>
-        {% if element.owner.id != app.user.id %}
-          <li class="vote">
-            {% if element.hasVoteGood(app.user.id) %}
-              <a class="vote" href="{{ path('ajax_element_remove_vote_good', {
-                'element_id' : element.id,
-                'token'      : app.user.getPersonalHash
-              }) }}" title="{{ 'element.vote.good'|trans({}, 'elements') }}">
-                <img src="{{ asset('/bundles/muzichcore/img/up_b.png') }}" alt="vote" />
-              </a>
-            {% else %}
-              <a class="vote" href="{{ path('ajax_element_add_vote_good', {
-                'element_id' : element.id,
-                'token'      : app.user.getPersonalHash
-              }) }}" title="{{ 'element.vote.good'|trans({}, 'elements') }}">
-                <img src="{{ asset('/bundles/muzichcore/img/up_bw.png') }}" alt="vote" />
-              </a>
-            {% endif %}
-          </li>
-      {% endif %}
-      <li class="score">
-
-        <span class="score">
-          {{ element.points }}
-        </span>
-
-      </li>
-      <li>
-
-      {% if element.hasFavoriteUser(app.user.id) %}
-        <a class="favorite_link" href="{{ path('favorite_remove', { 'id': element.id, 'token': app.user.personalHash }) }}" >
-          <img id="favorite_{{ element.id }}_is" src="{{ asset('bundles/muzichcore/img/favorite.png') }}" title="{{ 'element.favorite.remove'|trans({}, 'elements') }}" alt="{{ 'element.favorite.remove'|trans({}, 'elements') }}"/>
-        </a>
-      {% else %}
-        <a class="favorite_link" href="{{ path('favorite_add', { 'id': element.id, 'token': app.user.personalHash }) }}" >
-          <img id="favorite_{{ element.id }}_isnot" src="{{ asset('bundles/muzichcore/img/favorite_bw.png') }}" title="{{ 'element.favorite.add'|trans({}, 'elements') }}" alt="{{ 'element.favorite.add'|trans({}, 'elements') }}" />
-        </a>
-      {% endif %}
-
-        </li>
-      </ul>
-    </td>
   </tr>
 </table>
 

src/Muzich/CoreBundle/Resources/views/Tag/tagsPrompt.html.twig

@@ -2,15 +2,6 @@
 
 <div class="tags_prompt" id="tags_prompt_{{ form_name }}">
     
-  {% if display_specials_buttons is defined %}
-    {% if display_specials_buttons == true %}
-      <input class="clear button" type="button" value="{{ 'filter.clear'|trans({}, 'userui') }}" />
-      <input type="hidden" class="filter_clear_url" value="{{ path('filter_clear') }}" />
-      <input class="mytags button" type="button" value="{{ 'filter.mytags'|trans({}, 'userui') }}" />
-      <input type="hidden" class="filter_mytags_url" value="{{ path('filter_mytags') }}" />
-    {% endif %}
-  {% endif %}
-  
    <input class="tags_prompt_list" name="tags" value="" /> 
    <input id="tags_selected_tag_{{ form_name }}" type="hidden" value="" />
    

src/Muzich/CoreBundle/Resources/views/layout.html.twig

@@ -1,212 +1,290 @@
-<!-- XHTML 1.0 - Transitional -->
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!doctype html>
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
-<head>
-  <title>Muzi.ch - {% block title %}{% endblock %}</title>
-  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
-	<meta http-equiv="Content-Style-Type" content="text/css" />
-	<meta name="description" content="" />
-	<meta name="keywords" content="" />
-	<meta name="author" content="" />
-  <link href="apple-touch-icon.png" rel="apple-touch-icon" />
-  
-	<link href="{{ asset('favicon.ico') }}" rel="icon" type="image/x-icon" />
-	<link href="{{ asset('bundles/muzichcore/css/base.css') }}" rel="stylesheet" media="screen" type="text/css" />
-	<link href="{{ asset('bundles/muzichcore/css/main.css') }}" rel="stylesheet" media="screen" type="text/css" />
-  {% block css %}{% endblock %}
-  {% if  app.environment != 'prod' %}  
-	<script src="{{ asset('js/jquery-1.8.2.dev.js') }}" type="text/javascript"></script>
-  {% else %}
-	<script src="{{ asset('js/jquery-1.8.2.prod.js') }}" type="text/javascript"></script>
-  {% endif %}
-  <script src="{{ asset('js/jquery-ui-1.8.7.min.js') }}" type="text/javascript"></script>
-  <script src="{{ asset('bundles/muzichcore/js/muzich.js') }}" type="text/javascript"></script>
-	
-  <script type="text/javascript" src="{{ asset('js/swfobject.js') }}"></script> 
-  {# TODO: On peux piquer les js ?  #}
-  <script src="http://connect.soundcloud.com/sdk.js"></script>
-  <script src="http://w.soundcloud.com/player/api.js"></script>
-       
-  <script src="{{ asset('bundles/muzichcore/js/autoplay.js') }}" type="text/javascript"></script>
-  
-  {# jPlayer #}
-  <link href="{{ asset('jplayer/skin/blue.monday/jplayer.blue.monday.css') }}" rel="stylesheet" type="text/css" />
-  <script type="text/javascript" src="{{ asset('jplayer/js/jquery.jplayer.min.js') }}"></script>
-  <script type="text/javascript" src="{{ asset('jplayer/js/jplayer.playlist.min.js') }}"></script>
-  
-  <script src="{{ asset('js/tags/jquery.autoGrowInput.js') }}" type="text/javascript"></script>
-  <script src="{{ asset('js/tags/jquery.tagBox.js') }}" type="text/javascript"></script>
-  <script src="{{ asset('js/formdefault/jquery.formdefaults.js') }}" type="text/javascript"></script>
-  <script src="{{ asset('js/jquery.form-2.14.js') }}" type="text/javascript"></script>
-  <script src="{{ asset('js/jConfirmAction/jconfirmaction.jquery.js') }}" type="text/javascript"></script>
-  <script type="text/javascript">
-    string_follow_stop = "{{ 'user.stop_follow'|trans({}, 'users') }}";
-    string_follow_following = "{{ 'user.following'|trans({}, 'users') }}";
-    string_follow_follow = "{{ 'user.follow'|trans({}, 'users') }}";
-    string_tag_add_title = "{{ 'tags.add.title'|trans({}, 'userui') }}";
-    string_tag_add_text = "{{ 'tags.add.text'|trans({}, 'userui') }}";
-    string_tag_add_argument = "{{ 'tags.add.argument'|trans({}, 'userui') }}";
-    string_tag_add_inputs_cancel = "{{ 'tags.add.inputs.cancel'|trans({}, 'userui') }}";
-    string_tag_add_inputs_submit = "{{ 'tags.add.inputs.submit'|trans({}, 'userui') }}";
-    string_element_delete_confirm_sentence = "{{ 'element.remove.confirm.sentence'|trans({}, 'elements') }}";
-    string_element_delete_confirm_yes = "{{ 'element.remove.confirm.yes'|trans({}, 'elements') }}";
-    string_element_delete_confirm_no = "{{ 'element.remove.confirm.no'|trans({}, 'elements') }}";
-    string_comment_delete_confirm_sentence = "{{ 'comment.remove.confirm.sentence'|trans({}, 'elements') }}";
-    string_comment_delete_confirm_yes = "{{ 'comment.remove.confirm.yes'|trans({}, 'elements') }}";
-    string_comment_delete_confirm_no = "{{ 'comment.remove.confirm.no'|trans({}, 'elements') }}";
-    string_tag_addtofav_confirm_sentence = "{{ 'element.tag.addtofav.confirm.sentence'|trans({}, 'elements') }}";
-    string_tag_addtofav_confirm_yes = "{{ 'element.tag.addtofav.confirm.yes'|trans({}, 'elements') }}";
-    string_tag_addtofav_confirm_no = "{{ 'element.tag.addtofav.confirm.no'|trans({}, 'elements') }}";
-    string_elementreport_confirm_sentence = "{{ 'element.report.confirm.sentence'|trans({}, 'userui') }}";
-    string_elementreport_confirm_yes = "{{ 'element.report.confirm.yes'|trans({}, 'userui') }}";
-    string_elementreport_confirm_no = "{{ 'element.report.confirm.no'|trans({}, 'userui') }}";
-    string_commentreport_confirm_sentence = "{{ 'comment.report.confirm.sentence'|trans({}, 'userui') }}";
-    string_commentreport_confirm_yes = "{{ 'comment.report.confirm.yes'|trans({}, 'userui') }}";
-    string_commentreport_confirm_no = "{{ 'comment.report.confirm.no'|trans({}, 'userui') }}";
-    string_elementreshare_confirm_sentence = "{{ 'element.reshare.confirm.sentence'|trans({}, 'userui') }}";
-    string_elementreshare_confirm_yes = "{{ 'element.reshare.confirm.yes'|trans({}, 'userui') }}";
-    string_elementreshare_confirm_no = "{{ 'element.reshare.confirm.no'|trans({}, 'userui') }}";
-    {% autoescape false %}
-    string_search_tag_title = "{{ 'search_tag.title'|trans({}, 'userui') }}";
-    {% endautoescape %}
+  <head>
+    <title>Muzi.ch - {% block title %}{% endblock %}</title>
+    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
+    <meta http-equiv="Content-Style-Type" content="text/css" />
+    <meta name="description" content="" />
+    <meta name="keywords" content="" />
+    <meta name="author" content="" />
+    <link href="apple-touch-icon.png" rel="apple-touch-icon" />
+
+    <link href="{{ asset('favicon.ico') }}" rel="icon" type="image/x-icon" />
+    <link href="{{ asset('bundles/muzichcore/css/base.css') }}" rel="stylesheet" media="screen" type="text/css" />
+    <link href="{{ asset('bundles/muzichcore/css/old.css') }}" rel="stylesheet" media="screen" type="text/css" />
+    <link href="{{ asset('css/main.css') }}" rel="stylesheet" media="screen" type="text/css" />
     
-    url_index = "{{ path('index') }}";
-    url_search_tag = "{{ path('search_tag') }}";
-    url_get_favorites_tags = "{{ path('ajax_get_favorites_tags') }}";
-    url_add_tag = "{{ path('ajax_add_tag') }}";
-    url_element_new_count = "{{ path('element_new_count') }}";
-    url_element_new_get = "{{ path('element_new_get') }}";
-    url_global_search = "{{ path('global_search') }}";
-    url_datas_api = "{{ path('element_retrieve_api_datas') }}";
-    url_element_add = "{{ path('element_add') }}";
-    url_element_dom_get_one_autoplay = "{{ path('element_dom_get_one', {'type':'autoplay'}) }}";
-    url_element_get_stream_data = "{{ path('element_get_stream_data') }}";
+    <!--[if gte IE 9]>
+      <style type="text/css">
+        .gradient, .button {
+           filter: none;
+        }
+      </style>
+    <![endif]-->
     
-    url_img_ajax_loader = "{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}";
-  </script>
-  {% block js %}{% endblock %}
-  
-</head>
-<body>
+    {% block css %}{% endblock %}
+    {% if  app.environment != 'prod' %}  
+    <script src="{{ asset('js/jquery-1.8.2.dev.js') }}" type="text/javascript"></script>
+    {% else %}
+    <script src="{{ asset('js/jquery-1.8.2.prod.js') }}" type="text/javascript"></script>
+    {% endif %}
+    <script src="{{ asset('js/jquery-ui-1.8.7.min.js') }}" type="text/javascript"></script>
+    <script src="{{ asset('bundles/muzichcore/js/muzich.js') }}" type="text/javascript"></script>
+
+    <script type="text/javascript" src="{{ asset('js/swfobject.js') }}"></script> 
+    {# TODO: On peux piquer les js ?  #}
+    <script src="http://connect.soundcloud.com/sdk.js"></script>
+    <script src="http://w.soundcloud.com/player/api.js"></script>
+
+    <script src="{{ asset('bundles/muzichcore/js/autoplay.js') }}" type="text/javascript"></script>
+
+    {# jPlayer #}
+    <link href="{{ asset('jplayer/skin/blue.monday/jplayer.blue.monday.css') }}" rel="stylesheet" type="text/css" />
+    <script type="text/javascript" src="{{ asset('jplayer/js/jquery.jplayer.min.js') }}"></script>
+    <script type="text/javascript" src="{{ asset('jplayer/js/jplayer.playlist.min.js') }}"></script>
+
+    <script src="{{ asset('js/tags/jquery.autoGrowInput.js') }}" type="text/javascript"></script>
+    <script src="{{ asset('js/tags/jquery.tagBox.js') }}" type="text/javascript"></script>
+    <script src="{{ asset('js/formdefault/jquery.formdefaults.js') }}" type="text/javascript"></script>
+    <script src="{{ asset('js/jquery.form-2.14.js') }}" type="text/javascript"></script>
+    <script src="{{ asset('js/jConfirmAction/jconfirmaction.jquery.js') }}" type="text/javascript"></script>
+    <script type="text/javascript">
+      string_follow_stop = "{{ 'user.stop_follow'|trans({}, 'users') }}";
+      string_follow_following = "{{ 'user.following'|trans({}, 'users') }}";
+      string_follow_follow = "{{ 'user.follow'|trans({}, 'users') }}";
+      string_tag_add_title = "{{ 'tags.add.title'|trans({}, 'userui') }}";
+      string_tag_add_text = "{{ 'tags.add.text'|trans({}, 'userui') }}";
+      string_tag_add_argument = "{{ 'tags.add.argument'|trans({}, 'userui') }}";
+      string_tag_add_inputs_cancel = "{{ 'tags.add.inputs.cancel'|trans({}, 'userui') }}";
+      string_tag_add_inputs_submit = "{{ 'tags.add.inputs.submit'|trans({}, 'userui') }}";
+      string_element_delete_confirm_sentence = "{{ 'element.remove.confirm.sentence'|trans({}, 'elements') }}";
+      string_element_delete_confirm_yes = "{{ 'element.remove.confirm.yes'|trans({}, 'elements') }}";
+      string_element_delete_confirm_no = "{{ 'element.remove.confirm.no'|trans({}, 'elements') }}";
+      string_comment_delete_confirm_sentence = "{{ 'comment.remove.confirm.sentence'|trans({}, 'elements') }}";
+      string_comment_delete_confirm_yes = "{{ 'comment.remove.confirm.yes'|trans({}, 'elements') }}";
+      string_comment_delete_confirm_no = "{{ 'comment.remove.confirm.no'|trans({}, 'elements') }}";
+      string_tag_addtofav_confirm_sentence = "{{ 'element.tag.addtofav.confirm.sentence'|trans({}, 'elements') }}";
+      string_tag_addtofav_confirm_yes = "{{ 'element.tag.addtofav.confirm.yes'|trans({}, 'elements') }}";
+      string_tag_addtofav_confirm_no = "{{ 'element.tag.addtofav.confirm.no'|trans({}, 'elements') }}";
+      string_elementreport_confirm_sentence = "{{ 'element.report.confirm.sentence'|trans({}, 'userui') }}";
+      string_elementreport_confirm_yes = "{{ 'element.report.confirm.yes'|trans({}, 'userui') }}";
+      string_elementreport_confirm_no = "{{ 'element.report.confirm.no'|trans({}, 'userui') }}";
+      string_commentreport_confirm_sentence = "{{ 'comment.report.confirm.sentence'|trans({}, 'userui') }}";
+      string_commentreport_confirm_yes = "{{ 'comment.report.confirm.yes'|trans({}, 'userui') }}";
+      string_commentreport_confirm_no = "{{ 'comment.report.confirm.no'|trans({}, 'userui') }}";
+      string_elementreshare_confirm_sentence = "{{ 'element.reshare.confirm.sentence'|trans({}, 'userui') }}";
+      string_elementreshare_confirm_yes = "{{ 'element.reshare.confirm.yes'|trans({}, 'userui') }}";
+      string_elementreshare_confirm_no = "{{ 'element.reshare.confirm.no'|trans({}, 'userui') }}";
+      {% autoescape false %}
+      string_search_tag_title = "{{ 'search_tag.title'|trans({}, 'userui') }}";
+      {% endautoescape %}
+
+      url_index = "{{ path('index') }}";
+      url_search_tag = "{{ path('search_tag') }}";
+      url_get_favorites_tags = "{{ path('ajax_get_favorites_tags') }}";
+      url_add_tag = "{{ path('ajax_add_tag') }}";
+      url_element_new_count = "{{ path('element_new_count') }}";
+      url_element_new_get = "{{ path('element_new_get') }}";
+      url_global_search = "{{ path('global_search') }}";
+      url_datas_api = "{{ path('element_retrieve_api_datas') }}";
+      url_element_add = "{{ path('element_add') }}";
+      url_element_dom_get_one_autoplay = "{{ path('element_dom_get_one', {'type':'autoplay'}) }}";
+      url_element_get_stream_data = "{{ path('element_get_stream_data') }}";
+
+      url_img_ajax_loader = "{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}";
+    </script>
+    {% block js %}{% endblock %}
+
+  </head>
+  <body>
   
-  <div id="autoplay" class="popin_block" style="display: none;">
-      
-      <a href="javascript:void(0);" id="autoplay_previous">
-        <img src="{{ asset('/bundles/muzichcore/img/autoplay_previous.png') }}" alt="previous" />
-      </a>
-      
-	<a href="javascript:void(0);" id="autoplay_close" >
-	  <img src="{{ asset('/bundles/muzichcore/img/1317386146_cancel.png') }}" alt="close" />
-	</a>
-      
-      <a href="javascript:void(0);" id="autoplay_next">
-        <img src="{{ asset('/bundles/muzichcore/img/autoplay_next.png') }}" alt="next" />
-      </a>
+    <header id="header">
+      <hgroup>
+        <ul id="parameters">
+          <li>
+            <a href="" class="languages">
+              FR
+            </a>
+          </li>
+          <li>
+            <a href="">
+              <img src="{{ asset('img/header_icon_params.png') }}" alt="parameters" />
+            </a>
+          </li>
+        </ul>
+        <a id="header_logo" href="{{ path('index') }}" title="">
+          <img src="{{ asset('img/header_logo.png') }}" alt="logo" />
+        </a>
+        <ul id="register_and_login">
+          <li>
+            <a href="" class="left">
+              Devenir membre
+            </a>
+          </li>
+          <li>
+            <a href="" class="right">
+              Connexion
+            </a>
+          </li>
+        </ul>
+        <ul id="header_menu">
+          <li class="selected">
+            <a href="">
+              Réseau global
+            </a>
+          </li>
+          <li class="separator"></li>
+          <li>
+            <a href="" >
+              Mon réseau
+            </a>
+          </li>
+          <li class="separator"></li>
+          <li>
+            <a href="" >
+              Mes diffusions
+            </a>
+          </li>
+          <li class="separator"></li>
+          <li>
+            <a href="" >
+              Mes groupes
+            </a>
+          </li>
+          <li class="separator"></li>
+          <li>
+            <a href="" >
+              Mes favoris
+            </a>
+          </li>
+          <li class="separator"></li>
+        </ul>
+      </hgroup>
+    </header>
+    
+    <div id="content">
       
-    <img id="autoplay_element_loader" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loader" />
-    <ul id="autoplay_element"><li class="element" id="autoplay_element_container"></li></ul>
-    <div id="autoplay_player_container">
-      <div id="autoplay_player"></div>
-    </div>
-    <div id="autoplay_player_soundcloud"></div>
-    <div id="autoplay_player_generic" style="display: none;">
-      <div id="jquery_jplayer_1" class="jp-jplayer"></div>
-      <div id="jp_container_1" class="jp-audio">
-        <div class="jp-type-playlist">
-          <div class="jp-gui jp-interface">
-            <ul class="jp-controls">
-              <li><a href="javascript:;" class="jp-previous" tabindex="1">previous</a></li>
-              <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
-              <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
-              <li><a href="javascript:;" class="jp-next" tabindex="1">next</a></li>
-              <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
-              <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
-              <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
-              <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
-            </ul>
-            <div class="jp-progress">
-              <div class="jp-seek-bar">
-                <div class="jp-play-bar"></div>
-              </div>
-            </div>
-            <div class="jp-volume-bar">
-              <div class="jp-volume-bar-value"></div>
-            </div>
-            <div class="jp-time-holder">
-              <div class="jp-current-time"></div>
-              <div class="jp-duration"></div>
-            </div>
-            <ul class="jp-toggles" style="display: none;">
-              <li><a href="javascript:;" class="jp-shuffle" tabindex="1" title="shuffle">shuffle</a></li>
-              <li><a href="javascript:;" class="jp-shuffle-off" tabindex="1" title="shuffle off">shuffle off</a></li>
-              <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
-              <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
-            </ul>
-          </div>
-          <div class="jp-playlist">
-            <ul>
-              <li></li>
-            </ul>
-          </div>
-          <div class="jp-no-solution">
-            <span>Update Required</span>
-            To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
-          </div>
+      <div id="main">
+        
+        <div id="mainbox" class="nicebox">
+          {% block main_content %}{% endblock %}
+          {% block fos_user_content %}{% endblock %}
         </div>
+        
       </div>
-    </div>
-    <img id="autoplay_loader" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loader" />
-    <p id="autoplay_noelements_text" style="display: none;">{{ 'elements.autoplay.noelements.text'|trans({}, 'elements') }}</p>
         
-    <p><span class="sinfo">{{ 'autoplay.limitations_players'|trans({}, 'userui') }}</span></p>
+      <aside id="sidebar">
+        
+        <div id="user_statusbox" class="nicebox">
+          {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
+            {% render "MuzichUserBundle:Event:infoBar" %}
+          {% endif %}
+        </div>
+        
+        <div id="searchbox" class="nicebox">
+          <div class="seachboxcontainer">
+            <form>
+              <input type="text" />
+              <a href="">
+                <img src="{{ asset('/img/icon_search.png') }}" alt="search" />
+              </a>
+            </form>
+          </div>
+        </div>
+        
+        <div id="social" class="nicebox">
+          <ul class="social_links">
+            <li>
+              <a href="" >
+                <img src="{{ asset('/img/icon_facebook.png') }}" alt="facebook" />
+              </a>
+            </li>
+            <li>
+              <a href="" >
+                <img src="{{ asset('/img/icon_twitter.png') }}" alt="twitter" />
+              </a>
+            </li>
+            <li>
+              <a href="" >
+                <img src="{{ asset('/img/icon_googleplus.png') }}" alt="google plus" />
+              </a>
+            </li>
+          </ul>
+        </div>
+        
+        <div id="secondarymenu" class="nicebox">
+          
+          <ul class="secondarymenu">
+            <li class="top_menu_element open">
+              
+              <a href="" class="top_menu_link">
+                <div class="blackgradiant">
+                    Menu element
+                    <div class="dart"></div>
+                </div>
+              </a>
+              
+              <ul class="submenu">
+                <li class="sub_menu_element">
+                  <a href="" >
+                    sub menu element
+                  </a>
+                </li>
+                <li class="sub_menu_element">
+                  <a href="" >
+                    sub menu element
+                  </a>
+                </li>
+                <li class="sub_menu_element">
+                  <a href="" >
+                    sub menu element
+                  </a>
+                </li>
+              </ul>
+            </li>
+              
+          </ul>
+          
+          <ul class="secondarymenu">
+            <li class="top_menu_element close">
+              
+              <a href="" class="top_menu_link">
+                <div class="blackgradiant">
+                    Menu element
+                    <div class="dart"></div>
+                </div>
+              </a>
+              
+              <ul class="submenu">
+                <li class="sub_menu_element">
+                  <a href="" >
+                    sub menu element
+                  </a>
+                </li>
+                <li class="sub_menu_element">
+                  <a href="" >
+                    sub menu element
+                  </a>
+                </li>
+                <li class="sub_menu_element">
+                  <a href="" >
+                    sub menu element
+                  </a>
+                </li>
+              </ul>
+            </li>
+              
+          </ul>
+          
+        </div>
+                
+      </aside>
+        
+    </div>
     
-  </div>
     
-  {% include "MuzichCoreBundle:Language:languages.html.twig" %}
-  
-  {% include "MuzichUserBundle:Account:topBar.html.twig" %}
-  
-  <noscript>
-    <div id="noscript_warning">
-      <p>
-        {{ 'noscript.message'|trans({}, 'messages') }}
-        <a href="{{ 'noscript.link_search'|trans({}, 'messages') }}" target="_blank">
-          {{ 'noscript.link_text'|trans({}, 'messages') }}
-        </a>
-      </p>
-    </div>
-  </noscript>
-      
-  <div id="container">
     
-    {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
-      {% render "MuzichUserBundle:Event:infoBar" %}
-    {% endif %}
     
-    {% block main_content %}{% endblock %}
-    {% block fos_user_content %}{% endblock %}
-  </div>
     
-  {% for key, flash in app.session.getFlashes() %}
-    <div class="{{ key }} message">
-      <a class="message-close" href="javascript:void(0);" title="fermer"><img alt="close" src="{{ asset('bundles/muzichcore/img/1317386146_cancel.png') }}" /></a>
-      <h3>{{ flash|trans({}, 'flash') }}</h3>
-    </div>
-  
-    {% if key == 'success' %}
-    <script type="text/javascript" >
-      $(document).ready(function(){
-        window.setTimeout(function(){
-          $('div.success').slideUp();
-        }, 3000);
-      });
-    </script>
-    {% endif %}
-  {% endfor %}
-  
-  {% include "MuzichCoreBundle:Info:container.html.twig" %}
-  
-</body>
+  </body>
 </html>
-

src/Muzich/CoreBundle/Resources/views/layout_old.html.twig

@@ -0,0 +1,212 @@
+<!-- XHTML 1.0 - Transitional -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<head>
+  <title>Muzi.ch - {% block title %}{% endblock %}</title>
+  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
+	<meta http-equiv="Content-Style-Type" content="text/css" />
+	<meta name="description" content="" />
+	<meta name="keywords" content="" />
+	<meta name="author" content="" />
+  <link href="apple-touch-icon.png" rel="apple-touch-icon" />
+  
+	<link href="{{ asset('favicon.ico') }}" rel="icon" type="image/x-icon" />
+	<link href="{{ asset('bundles/muzichcore/css/base.css') }}" rel="stylesheet" media="screen" type="text/css" />
+	<link href="{{ asset('bundles/muzichcore/css/main.css') }}" rel="stylesheet" media="screen" type="text/css" />
+  {% block css %}{% endblock %}
+  {% if  app.environment != 'prod' %}  
+	<script src="{{ asset('js/jquery-1.8.2.dev.js') }}" type="text/javascript"></script>
+  {% else %}
+	<script src="{{ asset('js/jquery-1.8.2.prod.js') }}" type="text/javascript"></script>
+  {% endif %}
+  <script src="{{ asset('js/jquery-ui-1.8.7.min.js') }}" type="text/javascript"></script>
+  <script src="{{ asset('bundles/muzichcore/js/muzich.js') }}" type="text/javascript"></script>
+	
+  <script type="text/javascript" src="{{ asset('js/swfobject.js') }}"></script> 
+  {# TODO: On peux piquer les js ?  #}
+  <script src="http://connect.soundcloud.com/sdk.js"></script>
+  <script src="http://w.soundcloud.com/player/api.js"></script>
+       
+  <script src="{{ asset('bundles/muzichcore/js/autoplay.js') }}" type="text/javascript"></script>
+  
+  {# jPlayer #}
+  <link href="{{ asset('jplayer/skin/blue.monday/jplayer.blue.monday.css') }}" rel="stylesheet" type="text/css" />
+  <script type="text/javascript" src="{{ asset('jplayer/js/jquery.jplayer.min.js') }}"></script>
+  <script type="text/javascript" src="{{ asset('jplayer/js/jplayer.playlist.min.js') }}"></script>
+  
+  <script src="{{ asset('js/tags/jquery.autoGrowInput.js') }}" type="text/javascript"></script>
+  <script src="{{ asset('js/tags/jquery.tagBox.js') }}" type="text/javascript"></script>
+  <script src="{{ asset('js/formdefault/jquery.formdefaults.js') }}" type="text/javascript"></script>
+  <script src="{{ asset('js/jquery.form-2.14.js') }}" type="text/javascript"></script>
+  <script src="{{ asset('js/jConfirmAction/jconfirmaction.jquery.js') }}" type="text/javascript"></script>
+  <script type="text/javascript">
+    string_follow_stop = "{{ 'user.stop_follow'|trans({}, 'users') }}";
+    string_follow_following = "{{ 'user.following'|trans({}, 'users') }}";
+    string_follow_follow = "{{ 'user.follow'|trans({}, 'users') }}";
+    string_tag_add_title = "{{ 'tags.add.title'|trans({}, 'userui') }}";
+    string_tag_add_text = "{{ 'tags.add.text'|trans({}, 'userui') }}";
+    string_tag_add_argument = "{{ 'tags.add.argument'|trans({}, 'userui') }}";
+    string_tag_add_inputs_cancel = "{{ 'tags.add.inputs.cancel'|trans({}, 'userui') }}";
+    string_tag_add_inputs_submit = "{{ 'tags.add.inputs.submit'|trans({}, 'userui') }}";
+    string_element_delete_confirm_sentence = "{{ 'element.remove.confirm.sentence'|trans({}, 'elements') }}";
+    string_element_delete_confirm_yes = "{{ 'element.remove.confirm.yes'|trans({}, 'elements') }}";
+    string_element_delete_confirm_no = "{{ 'element.remove.confirm.no'|trans({}, 'elements') }}";
+    string_comment_delete_confirm_sentence = "{{ 'comment.remove.confirm.sentence'|trans({}, 'elements') }}";
+    string_comment_delete_confirm_yes = "{{ 'comment.remove.confirm.yes'|trans({}, 'elements') }}";
+    string_comment_delete_confirm_no = "{{ 'comment.remove.confirm.no'|trans({}, 'elements') }}";
+    string_tag_addtofav_confirm_sentence = "{{ 'element.tag.addtofav.confirm.sentence'|trans({}, 'elements') }}";
+    string_tag_addtofav_confirm_yes = "{{ 'element.tag.addtofav.confirm.yes'|trans({}, 'elements') }}";
+    string_tag_addtofav_confirm_no = "{{ 'element.tag.addtofav.confirm.no'|trans({}, 'elements') }}";
+    string_elementreport_confirm_sentence = "{{ 'element.report.confirm.sentence'|trans({}, 'userui') }}";
+    string_elementreport_confirm_yes = "{{ 'element.report.confirm.yes'|trans({}, 'userui') }}";
+    string_elementreport_confirm_no = "{{ 'element.report.confirm.no'|trans({}, 'userui') }}";
+    string_commentreport_confirm_sentence = "{{ 'comment.report.confirm.sentence'|trans({}, 'userui') }}";
+    string_commentreport_confirm_yes = "{{ 'comment.report.confirm.yes'|trans({}, 'userui') }}";
+    string_commentreport_confirm_no = "{{ 'comment.report.confirm.no'|trans({}, 'userui') }}";
+    string_elementreshare_confirm_sentence = "{{ 'element.reshare.confirm.sentence'|trans({}, 'userui') }}";
+    string_elementreshare_confirm_yes = "{{ 'element.reshare.confirm.yes'|trans({}, 'userui') }}";
+    string_elementreshare_confirm_no = "{{ 'element.reshare.confirm.no'|trans({}, 'userui') }}";
+    {% autoescape false %}
+    string_search_tag_title = "{{ 'search_tag.title'|trans({}, 'userui') }}";
+    {% endautoescape %}
+    
+    url_index = "{{ path('index') }}";
+    url_search_tag = "{{ path('search_tag') }}";
+    url_get_favorites_tags = "{{ path('ajax_get_favorites_tags') }}";
+    url_add_tag = "{{ path('ajax_add_tag') }}";
+    url_element_new_count = "{{ path('element_new_count') }}";
+    url_element_new_get = "{{ path('element_new_get') }}";
+    url_global_search = "{{ path('global_search') }}";
+    url_datas_api = "{{ path('element_retrieve_api_datas') }}";
+    url_element_add = "{{ path('element_add') }}";
+    url_element_dom_get_one_autoplay = "{{ path('element_dom_get_one', {'type':'autoplay'}) }}";
+    url_element_get_stream_data = "{{ path('element_get_stream_data') }}";
+    
+    url_img_ajax_loader = "{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}";
+  </script>
+  {% block js %}{% endblock %}
+  
+</head>
+<body>
+  
+  <div id="autoplay" class="popin_block" style="display: none;">
+      
+      <a href="javascript:void(0);" id="autoplay_previous">
+        <img src="{{ asset('/bundles/muzichcore/img/autoplay_previous.png') }}" alt="previous" />
+      </a>
+      
+	<a href="javascript:void(0);" id="autoplay_close" >
+	  <img src="{{ asset('/bundles/muzichcore/img/1317386146_cancel.png') }}" alt="close" />
+	</a>
+      
+      <a href="javascript:void(0);" id="autoplay_next">
+        <img src="{{ asset('/bundles/muzichcore/img/autoplay_next.png') }}" alt="next" />
+      </a>
+      
+    <img id="autoplay_element_loader" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loader" />
+    <ul id="autoplay_element"><li class="element" id="autoplay_element_container"></li></ul>
+    <div id="autoplay_player_container">
+      <div id="autoplay_player"></div>
+    </div>
+    <div id="autoplay_player_soundcloud"></div>
+    <div id="autoplay_player_generic" style="display: none;">
+      <div id="jquery_jplayer_1" class="jp-jplayer"></div>
+      <div id="jp_container_1" class="jp-audio">
+        <div class="jp-type-playlist">
+          <div class="jp-gui jp-interface">
+            <ul class="jp-controls">
+              <li><a href="javascript:;" class="jp-previous" tabindex="1">previous</a></li>
+              <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
+              <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
+              <li><a href="javascript:;" class="jp-next" tabindex="1">next</a></li>
+              <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
+              <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
+              <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
+              <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
+            </ul>
+            <div class="jp-progress">
+              <div class="jp-seek-bar">
+                <div class="jp-play-bar"></div>
+              </div>
+            </div>
+            <div class="jp-volume-bar">
+              <div class="jp-volume-bar-value"></div>
+            </div>
+            <div class="jp-time-holder">
+              <div class="jp-current-time"></div>
+              <div class="jp-duration"></div>
+            </div>
+            <ul class="jp-toggles" style="display: none;">
+              <li><a href="javascript:;" class="jp-shuffle" tabindex="1" title="shuffle">shuffle</a></li>
+              <li><a href="javascript:;" class="jp-shuffle-off" tabindex="1" title="shuffle off">shuffle off</a></li>
+              <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
+              <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
+            </ul>
+          </div>
+          <div class="jp-playlist">
+            <ul>
+              <li></li>
+            </ul>
+          </div>
+          <div class="jp-no-solution">
+            <span>Update Required</span>
+            To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
+          </div>
+        </div>
+      </div>
+    </div>
+    <img id="autoplay_loader" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loader" />
+    <p id="autoplay_noelements_text" style="display: none;">{{ 'elements.autoplay.noelements.text'|trans({}, 'elements') }}</p>
+        
+    <p><span class="sinfo">{{ 'autoplay.limitations_players'|trans({}, 'userui') }}</span></p>
+    
+  </div>
+    
+  {% include "MuzichCoreBundle:Language:languages.html.twig" %}
+  
+  {% include "MuzichUserBundle:Account:topBar.html.twig" %}
+  
+  <noscript>
+    <div id="noscript_warning">
+      <p>
+        {{ 'noscript.message'|trans({}, 'messages') }}
+        <a href="{{ 'noscript.link_search'|trans({}, 'messages') }}" target="_blank">
+          {{ 'noscript.link_text'|trans({}, 'messages') }}
+        </a>
+      </p>
+    </div>
+  </noscript>
+      
+  <div id="container">
+    
+    {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
+      {% render "MuzichUserBundle:Event:infoBar" %}
+    {% endif %}
+    
+    {% block main_content %}{% endblock %}
+    {% block fos_user_content %}{% endblock %}
+  </div>
+    
+  {% for key, flash in app.session.getFlashes() %}
+    <div class="{{ key }} message">
+      <a class="message-close" href="javascript:void(0);" title="fermer"><img alt="close" src="{{ asset('bundles/muzichcore/img/1317386146_cancel.png') }}" /></a>
+      <h3>{{ flash|trans({}, 'flash') }}</h3>
+    </div>
+  
+    {% if key == 'success' %}
+    <script type="text/javascript" >
+      $(document).ready(function(){
+        window.setTimeout(function(){
+          $('div.success').slideUp();
+        }, 3000);
+      });
+    </script>
+    {% endif %}
+  {% endfor %}
+  
+  {% include "MuzichCoreBundle:Info:container.html.twig" %}
+  
+</body>
+</html>
+

src/Muzich/FavoriteBundle/Controller/FavoriteController.php

@@ -90,7 +90,7 @@ class FavoriteController extends Controller
             'id'    => $id,
             'token' => $token
         )),
-        'img_new_src'   => $this->getAssetUrl('bundles/muzichcore/img/favorite.png'),
+        'img_new_src'   => $this->getAssetUrl('img/icon_star_2_red.png'),
         'img_new_title' => $this->trans('element.favorite.remove', array(), 'elements')
       ));
     }
@@ -153,7 +153,7 @@ class FavoriteController extends Controller
             'id'    => $id,
             'token' => $token
         )),
-        'img_new_src'   => $this->getAssetUrl('bundles/muzichcore/img/favorite_bw.png'),
+        'img_new_src'   => $this->getAssetUrl('img/icon_star_2.png'),
         'img_new_title' => $this->trans('element.favorite.add', array(), 'elements')
       ));
     }

src/Muzich/HomeBundle/Resources/views/Home/index.html.twig

@@ -4,27 +4,23 @@
 
 {% block content %}
 
-  {#
-  <div id="element_add_box" style="display: none;">
-    
-    <a href="#" id="element_add_close_link" class="button">
-      &lt;&lt; {{ 'home.add_element_box.close'|trans({}, 'navigationui') }}
-    </a>
-    
-    <form novalidate name="{{ add_form_name }}" action="{{ path('element_add') }}" method="post" {{ form_enctype(add_form) }}>
-
-      {% include "MuzichCoreBundle:Element:form.add.html.twig" with { 
-        'form'          : add_form, 
-        'form_name'     : add_form_name
-      } %}
-
-      <input type="submit" class="button" />
-      <img class="tag_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading" />
-    </form>
-  </div>
-  #}
-
+  <ul id="tabs_tag_search_buttons">
+    <li class="selected gradient">
+      <a id="tabs_tag_search_no_tags" href="#" >
+        {{ 'filter.clear'|trans({}, 'userui') }}
+      </a>
+      <div class="dart"></div>
+    </li>
+    <li class="gradient">
+      <a id="tabs_tag_search_with_tags" href="#" >
+        {{ 'filter.mytags'|trans({}, 'userui') }}
+      </a>
+      <div class="dart"></div>
+    </li>
+  </ul>
 
+  <input type="hidden" class="filter_clear_url" value="{{ path('filter_clear') }}" />
+  <input type="hidden" class="filter_mytags_url" value="{{ path('filter_mytags') }}" />
 
   <div id="element_add_box" style="display: none;">    
     
@@ -85,8 +81,7 @@
 
     {% include "MuzichCoreBundle:SearchElement:form.html.twig" with { 
       'form_name'               : search_form_name,
-      'search_tags'             : search_tags_id,
-      'display_specials_buttons': true
+      'search_tags'             : search_tags_id
     } %}
     
     <input class="main button" type="submit" value="{{ 'filter.submit'|trans({}, 'userui') }}"/>

src/Muzich/UserBundle/Resources/views/Info/bar.html.twig

@@ -1,87 +1,81 @@
 
-<div id="events_container">
-<div id="events_container_contained">
-<div id="events">
-    
-  <div class="score">
-    <img title="{{ 'reputation.bar.title'|trans({}, 'users') }}"
-      src="{{ asset('bundles/muzichcore/img/1332286466_stock_scores.png') }}" alt="score" />
-    <span>{{ app.user.reputation }}</span>
+<div class="user_score">
+  <div class="user_avatar">
+    <img src="{{ asset('/img/avatar_test.png') }}" />
   </div>
-
-  <div class="comments">
-
-      {% if events[event_const('TYPE_COMMENT_ADDED_ELEMENT')] is defined %}
-        <a 
-          href="{{ path('event_view_elements', {'event_id':events[event_const('TYPE_COMMENT_ADDED_ELEMENT')].id}) }}" 
-          title="{%if events[event_const('TYPE_COMMENT_ADDED_ELEMENT')].count == 1 %}{{ 'events.new_comments.one'|trans({'%count%':1}, 'users') }}{% else %}{{ 'events.new_comments.yes'|trans({'%count%':events[event_const('TYPE_COMMENT_ADDED_ELEMENT')].count}, 'users') }}{% endif %}"
-          class="view_elements_event"
-        >
-          <img src="{{ asset('bundles/muzichcore/img/1332286007_comments_reply.png') }}" alt="comments" />
-          <span class="new_comments">{{ events[event_const('TYPE_COMMENT_ADDED_ELEMENT')].count }}</span>
-        </a>
-      {% else %}
-        <img title="{{ 'events.new_comments.no'|trans({}, 'users') }}" src="{{ asset('bundles/muzichcore/img/1332286007_comments_reply.png') }}" alt="comments" />
-        <span class="new_comments">0</span>
-      {% endif %}
-
-  </div>
-
-  <div class="favorites">
-
-      {% if events[event_const('TYPE_FAV_ADDED_ELEMENT')] is defined %}
-        <a 
-          href="{{ path('event_view_elements', {'event_id':events[event_const('TYPE_FAV_ADDED_ELEMENT')].id}) }}" 
-          title="{%if events[event_const('TYPE_FAV_ADDED_ELEMENT')].count == 1 %}{{ 'events.new_favoriteds.one'|trans({'%count%':1}, 'users') }}{% else %}{{ 'events.new_favoriteds.yes'|trans({'%count%':events[event_const('TYPE_FAV_ADDED_ELEMENT')].count}, 'users') }}{% endif %}"
-          class="view_elements_event"
-        >
-          <img src="{{ asset('bundles/muzichcore/img/favorite.png') }}" alt="favoriteds" />
-          <span class="new_comments">{{ events[event_const('TYPE_FAV_ADDED_ELEMENT')].count }}</span>
-        </a>
-      {% else %}
-        <img title="{{ 'events.new_favoriteds.no'|trans({}, 'users') }}" src="{{ asset('bundles/muzichcore/img/favorite_bw.png') }}" alt="favoriteds" />
-        <span class="new_comments">0</span>
-      {% endif %}
-
+  <div class="score blackgradiant">
+    {{ app.user.reputation }}
   </div>
+</div>
 
-  <div class="follows">
-
-      {% if events[event_const('TYPE_USER_FOLLOW')] is defined %}
-        <a 
-          href="{{ path('mynetwork_index', {'event_id':events[event_const('TYPE_USER_FOLLOW')].id}) }}" 
-          title="{%if events[event_const('TYPE_USER_FOLLOW')].count == 1 %}{{ 'events.new_follows.one'|trans({'%count%':1}, 'users') }}{% else %}{{ 'events.new_follows.yes'|trans({'%count%':events[event_const('TYPE_USER_FOLLOW')].count}, 'users') }}{% endif %}"
-          class="view_follows_event"
-        >
-          <img src="{{ asset('bundles/muzichcore/img/1333474994_people.png') }}" alt="favoriteds" />
-          <span class="new_follows">{{ events[event_const('TYPE_USER_FOLLOW')].count }}</span>
-        </a>
-      {% else %}
-        <img title="{{ 'events.new_follows.no'|trans({}, 'users') }}" src="{{ asset('bundles/muzichcore/img/1333474994_people.png') }}" alt="favoriteds" />
-        <span class="new_follows">0</span>
-      {% endif %}
+<ul class="user_events_infos">
 
-  </div>
+  <li class="user_name">
+    {{ app.user.name }}
+  </li>
 
-  <div class="tags">
+  <li class="user_messages">
+    {% if events[event_const('TYPE_COMMENT_ADDED_ELEMENT')] is defined %}
+      <a 
+        href="{{ path('event_view_elements', {'event_id':events[event_const('TYPE_COMMENT_ADDED_ELEMENT')].id}) }}" 
+        title="{%if events[event_const('TYPE_COMMENT_ADDED_ELEMENT')].count == 1 %}{{ 'events.new_comments.one'|trans({'%count%':1}, 'users') }}{% else %}{{ 'events.new_comments.yes'|trans({'%count%':events[event_const('TYPE_COMMENT_ADDED_ELEMENT')].count}, 'users') }}{% endif %}"
+        class="view_elements_event"
+      >
+        <img src="{{ asset('/img/icon_messages.png') }}" alt="comments" />
+        <span class="new_comments">{{ events[event_const('TYPE_COMMENT_ADDED_ELEMENT')].count }}</span>
+      </a>
+    {% else %}
+      <img title="{{ 'events.new_comments.no'|trans({}, 'users') }}" src="{{ asset('/img/icon_messages.png') }}" alt="comments" />
+      <span class="new_comments">0</span>
+    {% endif %}
+  </li>
 
-      {% if events[event_const('TYPE_TAGS_PROPOSED')] is defined %}
-        <a 
-          href="{{ path('event_view_elements', {'event_id':events[event_const('TYPE_TAGS_PROPOSED')].id}) }}" 
-          title="{%if events[event_const('TYPE_TAGS_PROPOSED')].count == 1 %}{{ 'events.new_tags.one'|trans({'%count%':1}, 'users') }}{% else %}{{ 'events.new_tags.yes'|trans({'%count%':events[event_const('TYPE_TAGS_PROPOSED')].count}, 'users') }}{% endif %}"
-          class="view_follows_event"
-        >
-          <img src="{{ asset('bundles/muzichcore/img/1333484018_rss-tag.png') }}" alt="tags" />
-          <span class="new_follows">{{ events[event_const('TYPE_TAGS_PROPOSED')].count }}</span>
-        </a>
-      {% else %}
-        <img title="{{ 'events.new_tags.no'|trans({}, 'users') }}" src="{{ asset('bundles/muzichcore/img/1333484018_rss-tag.png') }}" alt="tags" />
-        <span class="new_follows">0</span>
-      {% endif %}
+  <li class="user_starreds">
+    {% if events[event_const('TYPE_FAV_ADDED_ELEMENT')] is defined %}
+      <a 
+        href="{{ path('event_view_elements', {'event_id':events[event_const('TYPE_FAV_ADDED_ELEMENT')].id}) }}" 
+        title="{%if events[event_const('TYPE_FAV_ADDED_ELEMENT')].count == 1 %}{{ 'events.new_favoriteds.one'|trans({'%count%':1}, 'users') }}{% else %}{{ 'events.new_favoriteds.yes'|trans({'%count%':events[event_const('TYPE_FAV_ADDED_ELEMENT')].count}, 'users') }}{% endif %}"
+        class="view_elements_event"
+      >
+        <img src="{{ asset('/img/icon_star.png') }}" alt="favoriteds" />
+        <span class="new_comments">{{ events[event_const('TYPE_FAV_ADDED_ELEMENT')].count }}</span>
+      </a>
+    {% else %}
+      <img title="{{ 'events.new_favoriteds.no'|trans({}, 'users') }}" src="{{ asset('/img/icon_star.png') }}" alt="favoriteds" />
+      <span class="new_comments">0</span>
+    {% endif %}
+  </li>
 
-  </div>
+  <li class="user_friends">
+    {% if events[event_const('TYPE_USER_FOLLOW')] is defined %}
+      <a 
+        href="{{ path('mynetwork_index', {'event_id':events[event_const('TYPE_USER_FOLLOW')].id}) }}" 
+        title="{%if events[event_const('TYPE_USER_FOLLOW')].count == 1 %}{{ 'events.new_follows.one'|trans({'%count%':1}, 'users') }}{% else %}{{ 'events.new_follows.yes'|trans({'%count%':events[event_const('TYPE_USER_FOLLOW')].count}, 'users') }}{% endif %}"
+        class="view_follows_event"
+      >
+        <img src="{{ asset('/img/icon_friends.png') }}" alt="favoriteds" />
+        <span class="new_follows">{{ events[event_const('TYPE_USER_FOLLOW')].count }}</span>
+      </a>
+    {% else %}
+      <img title="{{ 'events.new_follows.no'|trans({}, 'users') }}" src="{{ asset('/img/icon_friends.png') }}" alt="favoriteds" />
+      <span class="new_follows">0</span>
+    {% endif %}
+  </li>
 
+  <li class="user_tagprops">
+    {% if events[event_const('TYPE_TAGS_PROPOSED')] is defined %}
+      <a 
+        href="{{ path('event_view_elements', {'event_id':events[event_const('TYPE_TAGS_PROPOSED')].id}) }}" 
+        title="{%if events[event_const('TYPE_TAGS_PROPOSED')].count == 1 %}{{ 'events.new_tags.one'|trans({'%count%':1}, 'users') }}{% else %}{{ 'events.new_tags.yes'|trans({'%count%':events[event_const('TYPE_TAGS_PROPOSED')].count}, 'users') }}{% endif %}"
+        class="view_follows_event"
+      >
+        <img src="{{ asset('/img/icon_tag.png') }}" alt="tags" />
+        <span class="new_follows">{{ events[event_const('TYPE_TAGS_PROPOSED')].count }}</span>
+      </a>
+    {% else %}
+      <img title="{{ 'events.new_tags.no'|trans({}, 'users') }}" src="{{ asset('/img/icon_tag.png') }}" alt="tags" />
+      <span class="new_follows">0</span>
+    {% endif %}
+  </li>
 
-</div>
-</div>
-</div>
+</ul>

web/bundles/muzichcore/css/base.css

@@ -11,7 +11,7 @@ body {
   font-family: Arial, Helvetica, FreeSans, sans-serif; */
   /*font-size: .8em;*/ /* À adapter pour la police choisie. (3) */
   color: black;
-  background-color: #9AE4E8;
+  /*background-color: #9AE4E8;*/
   font: 13.34px helvetica,arial,freesans,clean,sans-serif;
   line-height: 1.4;
 }
@@ -56,7 +56,7 @@ a {
   text-decoration: underline;
 }
 a:link {
-  color: #11C;
+  /*color: #11C;*/
 }
 a:visited {
   color: #339;

web/bundles/muzichcore/css/main.css → web/bundles/muzichcore/css/old.css

@@ -1,8 +1,8 @@
 
-body
+/*body
 {
   text-align: center;  
-}
+}*/
 
 
 #container
@@ -57,7 +57,7 @@ div.clearboth
   clear: both;
 }
 
-.button {
+/*.button {
 	display: inline-block;
 	line-height: 1;
 	padding: 4px 7px;
@@ -82,7 +82,7 @@ input.button, button.button {
 .button.active
 {
   background-color: #39C9CC;
-}
+}*/
 
 #container a, #autoplay a
 {
@@ -511,7 +511,7 @@ line-height:1.2;
 padding: 3px 0;
 font-size: 105%;
 }
-ul.tagbox a.close {
+/*ul.tagbox a.close {
 position: absolute;
 right: 4px; top: 5px;
 display: block;
@@ -522,23 +522,23 @@ font-size: 1px;
 background: url('/bundles/muzichcore/img/tag_close.gif');
 background-position: 0px 100%;
 margin-top: 2px;
-}
-ul.tagbox a.close:hover {
+}*/
+/*ul.tagbox a.close:hover {
 background-position: 7px;
-} 
+} */
 
 
 /* Fin CSS pour tags */
 
 /* Debut CSS pour elements */
 
-li.element
+/*li.element
 {
   list-style: none outside none;
   margin-top: 5px;
   margin-bottom: 10px;
   padding: 5px;
-}
+}*/
 
 /*li.element a.favorite_link
 {
@@ -563,26 +563,26 @@ li.element div.element_embed
   text-align: center;
 }
 
-li.element td.element_content
+/*li.element td.element_content
 {
   vertical-align: top;
   padding-left: 5px;
   width: 468px;
-}
+}*/
 
-li.element span.element_name
+/*li.element span.element_name
 {
   
-}
+}*/
 
-li.element td.element_thumbnail
+/*li.element td.element_thumbnail
 {
   background-image: url(/bundles/muzichcore/img/nothumb.png);
   background-repeat: no-repeat;
   width: 120px;
   height: 90px;
   vertical-align: top;
-}
+}*/
 
 li.element img.element_thumbnail
 {
@@ -606,12 +606,12 @@ ul.elements, ul#autoplay_element
   margin-left: 0px;
 }
 
-ul.elements li.even
+/*ul.elements li.even
 {
   background-color: #d9f7ff;
-}
+}*/
 
-.elements ul.element_tags
+/*.elements ul.element_tags
 {
   margin-top: 3px;
   margin-left: 0px;
@@ -627,7 +627,7 @@ ul.element_tags .button
 {
   padding: 2px 4px 2px 4px;
   font-size: 95%;
-}
+}*/
 
 
 /* FIN CSS pour elements */
@@ -727,10 +727,10 @@ div.tag_loader_div, div.loader
   marin-right: auto;
 }
 
-.element_name
+/*.element_name
 {
   font-weight: bold;
-}
+}*/
 
 div.no_elements
 {
@@ -1059,12 +1059,12 @@ li.comment span.datesince
 {
   color: #868686;
 }
-
+/*
 div.comments form.add_comment textarea, div.comments form.edit_comment textarea
 {
   width: 80%;
   height: 48px;
-}
+}*/
 
 div.comments form.add_comment div.buttons, div.comments form.edit_comment div.buttons
 {
@@ -1072,11 +1072,11 @@ div.comments form.add_comment div.buttons, div.comments form.edit_comment div.bu
   text-align: center;
 }
 
-div.comments form.add_comment div.buttons input, div.comments form.edit_comment div.buttons input
+/*div.comments form.add_comment div.buttons input, div.comments form.edit_comment div.buttons input
 {
   margin-top: 1px;
   margin-bottom: 1px;
-}
+}*/
 
 div.comments_loader
 {
@@ -1087,21 +1087,21 @@ div.comments_loader
 
 /* Ajouter tag d'élément a ses tags favoris */
 
-li.element a.tag_to_favorites, li.element img.tag_to_favorites
+/*li.element a.tag_to_favorites, li.element img.tag_to_favorites
 {
   margin-left: -15px;
   margin-right: 4px;
-}
+}*/
 
 li.element a.element_tag_large_for_fav
 {
   padding-right: 15px;
 }
 
-li.element a.element_tag_large_for_fav_still
+/*li.element a.element_tag_large_for_fav_still
 {
   padding-right: 15px;
-}
+}*/
 
 /* END Ajouter tag d'élément a ses tags favoris */
 
@@ -1182,13 +1182,13 @@ div#events_container_contained
   margin-right: auto;
 }
 
-div#events
+/*div#events
 {
   width: 62px;
   position: absolute;
   margin-top: 50px;
   margin-left: 650px;
-  _margin-left: 640px;/* pour >=ie6 */
+  _margin-left: 640px; pour >=ie6 
   background-color: white;
   padding: 4px;
   
@@ -1203,8 +1203,8 @@ div#events
   -webkit-box-shadow: 2px 2px 2px #666;
   -moz-box-shadow: 2px 2px 2px #666 ;
   box-shadow: 2px 2px 2px #666;
-}
-
+}*/
+/*
 div#events div.score img
 {
   margin-bottom: -5px;
@@ -1262,7 +1262,7 @@ div#events div.tags span
 {
   font-weight: bold;
   margin-left: 5px;
-}
+}*/
 
 /*
 * css mynetwork

web/bundles/muzichcore/js/muzich.js

@@ -257,7 +257,7 @@ $(document).ready(function(){
   
   // Bouton de personalisation du filtre
   // Aucun tags
-  $('.tags_prompt input.clear, a.filter_clear_url').live("click", function(){
+  $('#tabs_tag_search_no_tags, a.filter_clear_url').live("click", function(){
     $('img.elements_more_loader').show();
     $('ul.elements').html('');
     // On initialise la liste de tags déjà ajouté
@@ -268,14 +268,14 @@ $(document).ready(function(){
   });
   
   // tags préférés
-  $('.tags_prompt input.mytags').live("click", function(){
+  $('#tabs_tag_search_with_tags').live("click", function(){
     
     $('img.elements_more_loader').show();
     $('ul.elements').html('');
     // On initialise la liste de tags déjà ajouté
     tagsAddeds['search'] = new Array;
     
-    var form = $(this).parents('form[name="search"]');
+    var form = $('form[name="search"]');
     
     $.getJSON(url_get_favorites_tags, function(response) {
       if (response.status == 'mustbeconnected')
@@ -419,13 +419,13 @@ $(document).ready(function(){
     var img = link.find('img');
     if (!link.hasClass('loading'))
     {
-      if (img.attr('src') == '/bundles/muzichcore/img/favorite_bw.png')
+      if (img.attr('src') == '/img/icon_star_2.png')
       {
-        img.attr('src', '/bundles/muzichcore/img/favorite.png');
+        img.attr('src', '/img/icon_star_2_red.png');
       }
       else
       {
-        img.attr('src', '/bundles/muzichcore/img/favorite_bw.png');
+        img.attr('src', '/img/icon_star_2.png');
       }
     }
     
@@ -446,28 +446,28 @@ $(document).ready(function(){
     return false;
   });
     
-  // Affichage du bouton Modifier et Supprimer
-  $('ul.elements li.element').live({
-    mouseenter:
-      function()
-      {
-        $(this).find('a.element_edit_link').show();
-        $(this).find('a.element_remove_link').show();
-      },
-    mouseleave:
-      function()
-      {
-        if (!$(this).find('a.element_edit_link').hasClass('mustBeDisplayed'))
-        {
-          $(this).find('a.element_edit_link').hide();
-        }
-        if (!$(this).find('a.element_remove_link').hasClass('mustBeDisplayed'))
-        {
-          $(this).find('a.element_remove_link').hide();
-        }
-      }
-    }
-  );
+//  // Affichage du bouton Modifier et Supprimer
+//  $('ul.elements li.element').live({
+//    mouseenter:
+//      function()
+//      {
+//        $(this).find('a.element_edit_link').show();
+//        $(this).find('a.element_remove_link').show();
+//      },
+//    mouseleave:
+//      function()
+//      {
+//        if (!$(this).find('a.element_edit_link').hasClass('mustBeDisplayed'))
+//        {
+//          $(this).find('a.element_edit_link').hide();
+//        }
+//        if (!$(this).find('a.element_remove_link').hasClass('mustBeDisplayed'))
+//        {
+//          $(this).find('a.element_remove_link').hide();
+//        }
+//      }
+//    }
+//  );
     
    // Plus d'éléments
    var last_id = null;

web/css/main.css

@@ -0,0 +1,806 @@
+body
+{
+  background-color: #f4f4f4;
+}
+
+body a
+{
+  text-decoration: none;
+  color: #B80C1A;
+}
+
+body a:visited
+{
+  text-decoration: none;
+  color: #B80C1A;
+}
+
+body a img
+{
+  text-decoration: none;
+}
+
+header#header
+{
+  height: 80px;
+  background-image: url("/img/header_background.png");
+  background-repeat: repeat-x;
+  border-bottom: 3px solid #e51936;
+}
+
+header#header hgroup
+{
+  width: 980px;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: left;
+}
+
+#header_logo
+{
+  float: left;
+  margin-top: 20px;
+}
+
+#header_menu
+{
+  color: #ffffff;
+  margin: 0px;
+  padding: 0px;
+  height: 80px;
+  margin-left: 210px;
+  width: 560px;
+}
+
+#header_menu li a, #register_and_login li a, #parameters li a
+{
+  color: #ffffff;
+  text-decoration: none;
+}
+
+#header_menu li a
+{
+  display: block;
+  text-decoration: none;
+  font-weight: bold;
+  padding-top: 45px;
+}
+
+#header_menu li
+{
+  float: left;
+  display: inline;
+  padding-left: 13px;
+  padding-right: 13px;
+  height: 80px;
+}
+
+#header_menu li.selected, #header_menu li:hover
+{
+  background-color: #e51936;
+}
+
+#header_menu li.separator
+{
+  background-image: url("/img/header_menu_separator.png");
+  background-repeat: no-repeat;
+  width: 3px;
+  padding-left: 1px;
+  padding-right: 1px;
+}
+
+#register_and_login
+{
+  float: right;
+  margin: 0px;
+  margin-top: 42px;
+  margin-right: 15px;
+  padding: 0px;
+}
+
+#register_and_login li
+{
+  float: left;
+  display: inline;
+}
+
+#register_and_login li a
+{
+  background-color: #585454;
+  padding: 8px 8px 6px 6px;
+  border: 1px solid black;
+  text-transform : uppercase;
+  font-size: 70%;
+  font-weight: bold;
+  
+  background-color: #555;
+  box-shadow: 0 1px 1px 0 #696465 inset;
+}
+
+#register_and_login li a.left
+{
+  -webkit-border-top-left-radius: 5px;
+  -webkit-border-bottom-left-radius: 5px;
+  -moz-border-radius-topleft: 5px;
+  -moz-border-radius-bottomleft: 5px;
+  border-top-left-radius: 5px;
+  border-bottom-left-radius: 5px;
+}
+
+#register_and_login li a.right
+{
+  -webkit-border-top-right-radius: 5px;
+  -webkit-border-bottom-right-radius: 5px;
+  -moz-border-radius-topright: 5px;
+  -moz-border-radius-bottomright: 5px;
+  border-top-right-radius: 5px;
+  border-bottom-right-radius: 5px;
+}
+
+#parameters
+{
+  float: right;
+  border-right-width: 0;
+  margin-bottom: 0;
+  margin-left: -58px;
+  margin-right: 10px;
+  margin-top: 5px;
+  padding: 0px
+}
+
+#parameters li
+{
+  float: left;
+  display: inline;
+}
+
+#parameters li a
+{
+  float: left;
+  display: inline;
+  font-size: 80%;
+  font-weight: bold;
+}
+
+#parameters li a.languages
+{
+  padding-right: 3px;
+  padding-top: 4px;
+}
+
+#content
+{
+  display: table;
+  width: 980px;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+#main
+{
+  display: table-cell;
+  width: 650px;
+  padding-right: 30px;
+}
+
+#mainbox
+{
+  margin-top: 80px;
+}
+
+.nicebox
+{
+  -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
+  -moz-box-shadow:    0px 0px 2px rgba(0, 0, 0, 0.3);
+  box-shadow:         0px 0px 2px rgba(0, 0, 0, 0.3);
+  border: 1px solid #d3d3d3;
+}
+
+aside#sidebar
+{
+  display: table-cell;
+	width: 300px;
+  vertical-align: top;
+}
+
+
+ul.elements li.element
+{
+  background-color: #f8f8f8;
+  border-top: 1px solid #c8c8c8;
+  list-style-type: none;
+  padding: 10px;
+}
+
+td.element_thumbnail
+{
+  background-color: #d5d5d5;
+  padding: 4px;
+  text-align: center;
+  width: 140px;
+}
+
+li.element img.element_thumbnail
+{
+  border: 3px solid white;
+}
+
+.element_thumb_actions_container
+{
+  
+}
+
+ul.element_thumb_actions
+{
+  margin-top: 0;
+  margin-bottom: 0;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: center;
+  float: right;
+}
+
+ul.element_thumb_actions li
+{
+  list-style-type: none;
+  color: #787777;
+  font-weight: bold;
+  height: 20px;
+  display: inline;
+  float: left;
+  padding-left: 9px;
+  padding-right: 9px;
+}
+
+ul.element_thumb_actions li.score
+{
+  padding-top: 2px; 
+  margin-top: 0px; 
+  border-right: 1px solid #bfbfbf;
+}
+
+ul.element_thumb_actions li.thumb
+{
+  border-left: 1px solid #eeeeee;
+  border-right: 1px solid #bfbfbf;
+}
+
+ul.element_thumb_actions li.star
+{
+  padding-top: 2px;
+  border-left: 1px solid #eeeeee;
+}
+
+ul.element_thumb_actions li.star a img
+{
+  
+}
+
+ul.element_thumb_actions li.separator
+{
+  
+}
+
+td.element_content
+{
+  vertical-align: top;
+  padding-top: 5px;
+  padding-left: 15px;
+  padding-bottom: 5px;
+  padding-right: 0px;
+  color: #404040;
+}
+
+td.element_content a
+{
+  color: #b80c1a;
+}
+
+td.element_content .element_name a
+{
+  color: #171717;
+  font-weight: bold;
+  font-size: 15px;
+}
+
+ul.element_links_actions
+{
+  float: right;
+  margin: 0px;
+  padding: 0px;
+  border: 1px solid #c7c7c7;
+  
+  height: 18px;
+  padding: 0px 1px 1px;
+  
+  background: #f8f8f8; /* Old browsers */
+  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
+  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y4ZjhmOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZjhmOGY4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q3ZDdkNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkN2Q3ZDciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
+  background: -moz-linear-gradient(top,  #f8f8f8 0%, #f8f8f8 0%, #d7d7d7 100%, #d7d7d7 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(0%,#f8f8f8), color-stop(100%,#d7d7d7), color-stop(100%,#d7d7d7)); /* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(top,  #f8f8f8 0%,#f8f8f8 0%,#d7d7d7 100%,#d7d7d7 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(top,  #f8f8f8 0%,#f8f8f8 0%,#d7d7d7 100%,#d7d7d7 100%); /* Opera 11.10+ */
+  background: -ms-linear-gradient(top,  #f8f8f8 0%,#f8f8f8 0%,#d7d7d7 100%,#d7d7d7 100%); /* IE10+ */
+  background: linear-gradient(to bottom,  #f8f8f8 0%,#f8f8f8 0%,#d7d7d7 100%,#d7d7d7 100%); /* W3C */
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#d7d7d7',GradientType=0 ); /* IE6-8 */
+
+  -webkit-border-top-left-radius: 3px;
+  -webkit-border-bottom-left-radius: 3px;
+  -moz-border-radius-topleft: 3px;
+  -moz-border-radius-bottomleft: 3px;
+  border-top-left-radius: 3px;
+  border-bottom-left-radius: 3px;
+  -webkit-border-top-right-radius: 3px;
+  -webkit-border-bottom-right-radius: 3px;
+  -moz-border-radius-topright: 3px;
+  -moz-border-radius-bottomright: 3px;
+  border-top-right-radius: 3px;
+  border-bottom-right-radius: 3px;
+}
+
+ul.element_links_actions li
+{
+  list-style-type: none;
+  display: inline;
+  float: left;
+  height: 18px;
+  border-right: 1px solid #c7c7c7;
+  border-left: 1px solid #ffffff;
+}
+
+ul.element_links_actions li:first-child
+{
+  border-left: none;
+}
+
+ul.element_links_actions li:last-child
+{
+  border-right: none;
+}
+
+.elements ul.element_tags
+{
+  margin-top: 3px;
+  margin-left: 0px;
+}
+  
+.elements ul.element_tags li, ul#autoplay_element ul.element_tags li
+{
+  display: inline;
+  font-size: 90%;
+}
+
+ul.element_tags .button
+{
+  padding: 2px 4px 2px 4px;
+  font-size: 95%;
+}
+
+.button {
+	display: inline-block;
+	line-height: 1;
+	padding: 4px 7px;
+	font-weight: bold;
+	-moz-border-radius: 3px;
+	-webkit-border-radius: 3px;
+	-khtml-border-radius: 3px;
+	border-radius: 3px;
+  border: 1px solid #2b82ad;
+  text-transform : uppercase;
+  border: 1px solid #b0b0b0;
+  
+  background: #f3f3f3; /* Old browsers */
+  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
+  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YzZjNmMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZjNmM2YzIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q1ZDVkNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNWQ1ZDUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
+  background: -moz-linear-gradient(top,  #f3f3f3 0%, #f3f3f3 0%, #d5d5d5 100%, #d5d5d5 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3f3f3), color-stop(0%,#f3f3f3), color-stop(100%,#d5d5d5), color-stop(100%,#d5d5d5)); /* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(top,  #f3f3f3 0%,#f3f3f3 0%,#d5d5d5 100%,#d5d5d5 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(top,  #f3f3f3 0%,#f3f3f3 0%,#d5d5d5 100%,#d5d5d5 100%); /* Opera 11.10+ */
+  background: -ms-linear-gradient(top,  #f3f3f3 0%,#f3f3f3 0%,#d5d5d5 100%,#d5d5d5 100%); /* IE10+ */
+  background: linear-gradient(to bottom,  #f3f3f3 0%,#f3f3f3 0%,#d5d5d5 100%,#d5d5d5 100%); /* W3C */
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f3f3', endColorstr='#d5d5d5',GradientType=0 ); /* IE6-8 */
+
+}
+
+a.button.element_tag, ul.tagbox li.tag
+{
+  padding: 6px;
+  border: none;
+  background: #474747; /* Old browsers */
+  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
+  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ3NDc0NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjNDc0NzQ3IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzIxMjEyMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyMTIxMjEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
+  background: -moz-linear-gradient(top,  #474747 0%, #474747 0%, #212121 100%, #212121 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#474747), color-stop(0%,#474747), color-stop(100%,#212121), color-stop(100%,#212121)); /* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(top,  #474747 0%,#474747 0%,#212121 100%,#212121 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(top,  #474747 0%,#474747 0%,#212121 100%,#212121 100%); /* Opera 11.10+ */
+  background: -ms-linear-gradient(top,  #474747 0%,#474747 0%,#212121 100%,#212121 100%); /* IE10+ */
+  background: linear-gradient(to bottom,  #474747 0%,#474747 0%,#212121 100%,#212121 100%); /* W3C */
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#474747', endColorstr='#212121',GradientType=0 ); /* IE6-8 */
+}
+
+td.element_content li.element_tag a.button, ul.tagbox li.tag
+{
+  color: #fff;
+  text-decoration: none;
+  text-transform : uppercase;
+}
+
+.button:active {
+  background-color: #39c9cc;
+}
+
+.button.active
+{
+  background-color: #39C9CC;
+}
+
+li.element a.element_tag_large_for_fav_still
+{
+  padding-right: 17px;
+}
+
+li.element a.tag_to_favorites, li.element img.tag_to_favorites
+{
+  margin-left: -17px;
+  margin-right: 4px;
+}
+
+img.tag_to_favorites
+{
+  margin-bottom: -1px;
+}
+
+img.tag_add_to_favorites
+{
+  margin-bottom: -1px;
+  margin-left: 1px;
+}
+
+td.element_content a.display_comments, td.element_content a.add_comment, td.element_content a.hide_comments, div.comments a.add_comment
+{
+  color: #404040;
+}
+
+div.comments form.add_comment textarea, div.comments form.edit_comment textarea
+{
+  width: 75%;
+  height: 48px;
+}
+
+div.comments form.add_comment div.buttons input, div.comments form.edit_comment div.buttons input
+{
+  margin-top: 1px;
+  margin-bottom: 1px;
+}
+
+aside#sidebar div.nicebox
+{
+  background-color: #f5f6f6;
+  margin-bottom: 18px;
+  padding: 12px;
+}
+
+div#user_statusbox
+{
+  margin-top: 25px;
+}
+
+div.user_score
+{
+  float: left;
+  padding-top: 4px;
+  border: 1px solid #D3D3D3;
+  background-color: white;
+  text-align: center;
+  width: 138px;
+}
+
+.blackgradiant
+{
+  background: #474747; /* Old browsers */
+  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
+  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ3NDc0NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjNDc0NzQ3IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzIxMjEyMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyMTIxMjEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
+  background: -moz-linear-gradient(top,  #474747 0%, #474747 0%, #212121 100%, #212121 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#474747), color-stop(0%,#474747), color-stop(100%,#212121), color-stop(100%,#212121)); /* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(top,  #474747 0%,#474747 0%,#212121 100%,#212121 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(top,  #474747 0%,#474747 0%,#212121 100%,#212121 100%); /* Opera 11.10+ */
+  background: -ms-linear-gradient(top,  #474747 0%,#474747 0%,#212121 100%,#212121 100%); /* IE10+ */
+  background: linear-gradient(to bottom,  #474747 0%,#474747 0%,#212121 100%,#212121 100%); /* W3C */
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#474747', endColorstr='#212121',GradientType=0 ); /* IE6-8 */
+}
+
+div.user_avatar
+{
+  height: 137px;
+  padding-right: 1px;
+}
+
+div.user_score div.score
+{
+  color: #f5f6f6;
+  height: 29px;
+  font-weight: bold;
+  font-size: 18px;
+  padding-top: 5px;
+  margin-bottom: 4px;
+  margin-left: 4px;
+  margin-right: 4px;
+}
+
+ul.user_events_infos
+{
+  margin: 0;
+  padding: 0;
+  margin-left: 150px;
+  margin-top: 10px;
+  width: 126px;
+}
+
+ul.user_events_infos li
+{
+  list-style-type: none;
+  height: 29px;
+  font-weight: bold;
+  border-bottom: 1px solid #c0c1c1;
+  padding-top: 6px;
+  vertical-align: middle;
+}
+
+
+ul.user_events_infos li img, ul.user_events_infos li span
+{
+  float: left;
+}
+
+ul.user_events_infos li img
+{
+  padding-right: 8px;
+}
+
+ul.user_events_infos li span
+{
+  margin-top: 2px;
+}
+
+ul.user_events_infos li:first-child
+{
+  padding-top: 0px;
+  height: 25px;
+}
+
+ul.user_events_infos li:last-child
+{
+  border-bottom: none;
+}
+
+ul.user_events_infos li.user_name
+{
+  text-transform : uppercase;
+}
+
+div.seachboxcontainer
+{
+  -webkit-box-shadow: inset 0px 0px 2px 3px #c8c8c8;
+  box-shadow: inset 0px 0px 2px 3px #c8c8c8; 
+  height: 34px;
+}
+
+div.seachboxcontainer input
+{
+  background: none;
+  border: none;
+  height: 34px;
+  margin: 0;
+  padding: 0;
+  padding-left: 6px;
+  width: 222px;
+}
+div.seachboxcontainer img
+{
+  border-left: 1px solid #C4C0C0;
+  float: right;
+  margin-right: 8px;
+  margin-top: 3px;
+  padding-left: 5px;
+}
+
+ul.social_links
+{
+  margin: 0px;
+  padding: 0px;
+  height: 35px;
+  margin-left: 22px;
+}
+
+ul.social_links li
+{
+  list-style-type: none;
+  display: inline;
+  float: left;
+  padding-left: 10px;
+  padding-right: 10px;
+  border-left: 1px solid #E2E2E2;
+  border-right: 1px solid #E2E2E2;
+}
+
+ul.social_links li:first-child, ul.social_links li:last-child
+{
+  border: none;
+}
+
+aside#sidebar div#secondarymenu, aside#sidebar div#secondarymenu ul.secondarymenu, aside#sidebar div#secondarymenu ul.submenu
+{
+  padding: 0;
+  margin: 0;
+}
+
+div#secondarymenu ul.secondarymenu li
+{
+  list-style-type: none;
+}
+
+div#secondarymenu ul.secondarymenu li.top_menu_element div
+{
+  padding: 10px;
+}
+
+div#secondarymenu ul.secondarymenu li.top_menu_element a
+{
+  color: white;
+  text-transform : uppercase;
+  font-weight: bold;
+}
+
+div#secondarymenu ul.submenu li.sub_menu_element
+{
+  padding: 10px;
+  padding-left: 20px;
+  background-color: #f5f6f6;
+  border-top: 1px solid #dadbdb;
+  border-bottom: 1px solid #dadbdb;
+  
+  background: url("/img/icon_list_chip.png") no-repeat scroll 2% 50% transparent;
+}
+
+div#secondarymenu ul.submenu li.sub_menu_element:first-child
+{
+  border-top: none;
+}
+
+div#secondarymenu ul.submenu li.sub_menu_element:last-child
+{
+  border-bottom: none;
+}
+
+div#secondarymenu ul.submenu li.sub_menu_element a
+{
+  color: black;
+  text-transform : capitalize;
+  font-weight: inherit;
+}
+
+div#secondarymenu ul.secondarymenu li.top_menu_element.close div.dart
+{
+  background: url("/img/icon_dart_top.png") no-repeat;
+  width: 15px;
+  height: 15px;
+  float: right;
+  margin-top: 2px;
+  padding: 0;
+}
+
+div#secondarymenu ul.secondarymenu li.top_menu_element.close ul.submenu
+{
+  display: none;
+}
+
+div#secondarymenu ul.secondarymenu li.top_menu_element.open div.dart
+{
+  background: url("/img/icon_dart_bottom.png") no-repeat scroll 95% 50% transparent;
+  width: 15px;
+  height: 15px;
+  float: right;
+  margin-top: 2px;
+  padding: 0;
+}
+
+div#secondarymenu ul.secondarymenu li.top_menu_element.open ul.submenu
+{
+  display: block;
+}
+
+#tabs_tag_search_buttons
+{
+  margin: 0;
+  padding: 0;
+  border-left: 1px solid #d3d3d3;
+  border-top: 1px solid #d3d3d3;
+  border-right: 1px solid #d3d3d3;
+  float: left;
+  margin-top: -60px;
+  font-weight: bold;
+  
+  -webkit-border-top-left-radius: 3px;
+  -webkit-border-bottom-left-radius: 3px;
+  -moz-border-radius-topleft: 3px;
+  -moz-border-radius-bottomleft: 3px;
+  border-top-left-radius: 3px;
+  border-bottom-left-radius: 3px;
+  -webkit-border-top-right-radius: 3px;
+  -webkit-border-bottom-right-radius: 3px;
+  -moz-border-radius-topright: 3px;
+  -moz-border-radius-bottomright: 3px;
+  border-top-right-radius: 3px;
+  border-bottom-right-radius: 3px;
+}
+
+#tabs_tag_search_buttons a
+{
+  color: black;
+}
+
+#tabs_tag_search_buttons li
+{
+  list-style-type: none;
+  display: inline;
+  float: left;
+  padding: 20px;
+  
+  background: #dddddd; /* Old browsers */
+  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
+  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RkZGRkZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZGRkZGRkIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2NhY2FjYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjYWNhY2EiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
+  background: -moz-linear-gradient(top,  #dddddd 0%, #dddddd 0%, #cacaca 100%, #cacaca 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dddddd), color-stop(0%,#dddddd), color-stop(100%,#cacaca), color-stop(100%,#cacaca)); /* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(top,  #dddddd 0%,#dddddd 0%,#cacaca 100%,#cacaca 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(top,  #dddddd 0%,#dddddd 0%,#cacaca 100%,#cacaca 100%); /* Opera 11.10+ */
+  background: -ms-linear-gradient(top,  #dddddd 0%,#dddddd 0%,#cacaca 100%,#cacaca 100%); /* IE10+ */
+  background: linear-gradient(to bottom,  #dddddd 0%,#dddddd 0%,#cacaca 100%,#cacaca 100%); /* W3C */
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#cacaca',GradientType=0 ); /* IE6-8 */
+}
+
+#tabs_tag_search_buttons li.selected
+{
+  list-style-type: none;
+  padding: 20px;
+  
+  background: #f3f3f3; /* Old browsers */
+  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
+  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YzZjNmMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZjNmM2YzIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2UyZTJlMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMmUyZTIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
+  background: -moz-linear-gradient(top,  #f3f3f3 0%, #f3f3f3 0%, #e2e2e2 100%, #e2e2e2 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3f3f3), color-stop(0%,#f3f3f3), color-stop(100%,#e2e2e2), color-stop(100%,#e2e2e2)); /* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(top,  #f3f3f3 0%,#f3f3f3 0%,#e2e2e2 100%,#e2e2e2 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(top,  #f3f3f3 0%,#f3f3f3 0%,#e2e2e2 100%,#e2e2e2 100%); /* Opera 11.10+ */
+  background: -ms-linear-gradient(top,  #f3f3f3 0%,#f3f3f3 0%,#e2e2e2 100%,#e2e2e2 100%); /* IE10+ */
+  background: linear-gradient(to bottom,  #f3f3f3 0%,#f3f3f3 0%,#e2e2e2 100%,#e2e2e2 100%); /* W3C */
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f3f3', endColorstr='#e2e2e2',GradientType=0 ); /* IE6-8 */
+}
+
+#tabs_tag_search_buttons li div.dart
+{
+  display: none;
+  height: 16px;
+  margin-left: 18px;
+  margin-top: 5px;
+  width: 30px;
+  background: url("/img/icon_bigtag_choosed.png") no-repeat scroll 0 0 transparent;
+  position: absolute;
+}
+
+#tabs_tag_search_buttons li.selected div.dart
+{
+  display: block;
+}
+
+ul.tagbox a.close
+{
+  background: url("/img/icon_close_red.png") repeat scroll 0 100% transparent;
+  position: absolute;
+  width: 11px;
+  text-indent: -9999px;
+  margin-left: 2px;
+}
+
+ul.tagbox li.tag
+{
+  padding-right: 18px;
+}