diff --git a/modoboa/core/templates/core/settings_header.html b/modoboa/core/templates/core/settings_header.html
index c2d164a3c..743dfce69 100644
--- a/modoboa/core/templates/core/settings_header.html
+++ b/modoboa/core/templates/core/settings_header.html
@@ -19,5 +19,5 @@ $(document).ready(function() {
 });
 </script>
 {% endblock %}
-{% block leftcol %}<div class="well">{% admin_menu left_selection user %}</div>{% endblock %}
+{% block leftcol %}{% admin_menu left_selection user %}{% endblock %}
 {% block apparea %}<div id="settings_content"></div>{% endblock %}
diff --git a/modoboa/core/templates/core/user_index.html b/modoboa/core/templates/core/user_index.html
index 7cfcf632a..72ec059d4 100644
--- a/modoboa/core/templates/core/user_index.html
+++ b/modoboa/core/templates/core/user_index.html
@@ -17,5 +17,5 @@ $(document).ready(function() {
 });
 </script>
 {% endblock %}
-{% block leftcol %}<div class="well">{% uprefs_menu left_selection user %}</div>{% endblock %}
+{% block leftcol %}{% uprefs_menu left_selection user %}{% endblock %}
 {% block apparea %}<div id="uprefs_content"></div>{% endblock %}
diff --git a/modoboa/core/templatetags/core_tags.py b/modoboa/core/templatetags/core_tags.py
index 4e4e033d9..b8ede2953 100644
--- a/modoboa/core/templatetags/core_tags.py
+++ b/modoboa/core/templatetags/core_tags.py
@@ -63,7 +63,7 @@ def admin_menu(selection, user):
     ]
     return render_to_string('common/menu.html', {
         "entries": entries,
-        "css": "nav nav-pills nav-stacked",
+        "css": "nav nav-sidebar",
         "selection": selection,
         "user": user
     })
@@ -111,7 +111,7 @@ def uprefs_menu(selection, user):
     entries = sorted(entries, key=lambda e: e["label"])
     return render_to_string('common/menu.html', {
         "entries": entries,
-        "css": "nav nav-pills nav-stacked",
+        "css": "nav nav-sidebar",
         "selection": selection,
         "user": user
     })
diff --git a/modoboa/extensions/admin/app_settings.py b/modoboa/extensions/admin/app_settings.py
index 8f3eb8ccb..eb133dccd 100644
--- a/modoboa/extensions/admin/app_settings.py
+++ b/modoboa/extensions/admin/app_settings.py
@@ -15,14 +15,18 @@ class AdminParametersForm(parameters.AdminParametersForm):
     handle_mailboxes = YesNoField(
         label=ugettext_lazy("Handle mailboxes on filesystem"),
         initial="no",
-        help_text=ugettext_lazy("Rename or remove mailboxes on the filesystem when they get renamed or removed within Modoboa")
+        help_text=ugettext_lazy(
+            "Rename or remove mailboxes on the filesystem when they get"
+            "renamed or removed within Modoboa"
+        )
     )
 
     mailboxes_owner = forms.CharField(
         label=ugettext_lazy("Mailboxes owner"),
         initial="vmail",
-        help_text=ugettext_lazy("The UNIX account who owns mailboxes on the filesystem"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=ugettext_lazy(
+            "The UNIX account who owns mailboxes on the filesystem"
+        )
     )
 
     default_domain_quota = forms.IntegerField(
@@ -31,14 +35,14 @@ class AdminParametersForm(parameters.AdminParametersForm):
         help_text=ugettext_lazy(
             "Default quota (in MB) applied to freshly created domains with no "
             "value specified. A value of 0 means no quota."
-        ),
-        widget=forms.TextInput(attrs={'class': 'col-md-2 form-control'})
+        )
     )
 
     auto_account_removal = YesNoField(
         label=ugettext_lazy("Automatic account removal"),
         initial="no",
-        help_text=ugettext_lazy("When a mailbox is removed, also remove the associated account")
+        help_text=ugettext_lazy(
+            "When a mailbox is removed, also remove the associated account")
     )
 
     # Visibility rules
@@ -48,6 +52,9 @@ class AdminParametersForm(parameters.AdminParametersForm):
 
     def __init__(self, *args, **kwargs):
         super(AdminParametersForm, self).__init__(*args, **kwargs)
+        self.field_widths = {
+            "default_domain_quota": 2
+        }
         hide_fields = False
         dpath = None
         code, output = exec_cmd("which dovecot")
diff --git a/modoboa/extensions/admin/templates/admin/listing.html b/modoboa/extensions/admin/templates/admin/listing.html
index 73a65d8b4..7fda5c330 100644
--- a/modoboa/extensions/admin/templates/admin/listing.html
+++ b/modoboa/extensions/admin/templates/admin/listing.html
@@ -9,16 +9,22 @@
 var admin;
 </script>
 {% endblock %}
-{% block leftcol %}<div class="well">
-  <ul class="nav nav-pills nav-stacked">
-    <li class="nav-header">{% trans "Filter" %}</li>
-    <li>{% include "admin/searchform.html" %}</li>
-    <li id="taglist"></li>
-    <li class="nav-header">{% trans "Actions" %}</li>
-    {% block actions %}{% endblock %}
-  </ul>
-</div>
+{% block leftcol %}
+<ul class="nav nav-sidebar">
+  {% block actions %}{% endblock %}
+</ul>
+
 {% get_extra_admin_content user "leftcol" selection %}
 {% endblock %}
-{% block apparea %}<div id="listing"></div>{% endblock %}
+{% block apparea %}
+<div class="row">
+  <div class="col-sm-5">
+    {% include "admin/searchform.html" %}
+  </div>
+  <div id="taglist" class="col-sm-5 col-md-5">
+    
+  </div>
+</div>
+<div id="listing"></div>
+{% endblock %}
 {% block footerright %}{% endblock %}
diff --git a/modoboa/extensions/admin/templates/admin/searchform.html b/modoboa/extensions/admin/templates/admin/searchform.html
index 8d39b6e52..2d681aef4 100644
--- a/modoboa/extensions/admin/templates/admin/searchform.html
+++ b/modoboa/extensions/admin/templates/admin/searchform.html
@@ -1,9 +1,11 @@
 {% load i18n %}
-<form id="searchform">
-  <div class="input-group input-group-sm">
-    <span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span>
-    <input class="form-control" type="text"
-           value={% if squery %}"{{ squery }}"{% else %}"{% trans 'Search' %}"{% endif %}
-           id="searchquery" name="searchquery" />
+<form id="searchform" class="form-horizontal" role="form">
+  <div class="form-group has-feedback">
+    <div class="col-sm-12">
+      <input class="form-control" type="text"
+             value={% if squery %}"{{ squery }}"{% else %}"{% trans 'Search' %}"{% endif %}
+             id="searchquery" name="searchquery" />
+      <span class="glyphicon glyphicon-search form-control-feedback"></span>
+    </div>
   </div>
 </form>
diff --git a/modoboa/extensions/postfix_relay_domains/forms.py b/modoboa/extensions/postfix_relay_domains/forms.py
index 2f0102f7c..9d01ad379 100644
--- a/modoboa/extensions/postfix_relay_domains/forms.py
+++ b/modoboa/extensions/postfix_relay_domains/forms.py
@@ -30,6 +30,9 @@ class RelayDomainFormGeneral(forms.ModelForm, DynamicForm):
         }
 
     def __init__(self, *args, **kwargs):
+        self.oldname = None
+        if "instance" in kwargs:
+            self.oldname = kwargs["instance"].name
         super(RelayDomainFormGeneral, self).__init__(*args, **kwargs)
         self.field_widths = {
             "service": 3
@@ -100,6 +103,7 @@ class RelayDomainFormGeneral(forms.ModelForm, DynamicForm):
         """
         rd = super(RelayDomainFormGeneral, self).save(commit=False)
         if commit:
+            rd.oldname = self.oldname
             rd.save()
             aliases = []
             for k, v in self.cleaned_data.iteritems():
diff --git a/modoboa/extensions/radicale/templates/radicale/calendars.html b/modoboa/extensions/radicale/templates/radicale/calendars.html
index adf3a49cb..629048450 100644
--- a/modoboa/extensions/radicale/templates/radicale/calendars.html
+++ b/modoboa/extensions/radicale/templates/radicale/calendars.html
@@ -17,13 +17,19 @@ $(document).ready(function() {
 });
 </script>
 {% endblock %}
-{% block leftcol %}<div class="well sidebar-nav">
-  <ul class="nav nav-list">
-    <li class="nav-header">{% trans "Filter" %}</li>
-    <li>{% include "admin/searchform.html" %}</li>
-    <li class="nav-header">{% trans "Actions" %}</li>
-    {% radicale_left_menu user %}
-  </ul>
-</div>
+{% block leftcol %}
+<ul class="nav nav-sidebar">
+  {% radicale_left_menu user %}
+</ul>
+{% endblock %}
+{% block apparea %}
+<div class="row">
+  <div class="col-sm-5">
+    {% include "admin/searchform.html" %}
+  </div>
+  <div id="taglist" class="col-sm-5 col-md-5">
+    
+  </div>
+</div>
+<div id="listing"></div>
 {% endblock %}
-{% block apparea %}<div id="listing"></div>{% endblock %}
diff --git a/modoboa/extensions/sievefilters/forms.py b/modoboa/extensions/sievefilters/forms.py
index 6f95e0856..3db5cf368 100644
--- a/modoboa/extensions/sievefilters/forms.py
+++ b/modoboa/extensions/sievefilters/forms.py
@@ -33,7 +33,7 @@ class CustomRadioInput(RadioInput):
             label_for = ''
         choice_label = conditional_escape(force_unicode(self.choice_label))
         return mark_safe(
-            u'<label%s">%s %s</label>'
+            u'<label%s class="radio-inline">%s %s</label>'
             % (label_for, self.tag(), choice_label)
         )
 
@@ -59,13 +59,17 @@ class FilterForm(forms.Form):
     def __init__(self, conditions, actions, request, *args, **kwargs):
         super(FilterForm, self).__init__(*args, **kwargs)
 
-        self.fields["name"] = forms.CharField(label=_("Name"), widget=forms.TextInput(attrs={"class": "form-control"}))
+        self.field_widths = {
+            "match_type": 8
+        }
+
+        self.fields["name"] = forms.CharField(label=_("Name"))
         self.fields["match_type"] = forms.ChoiceField(
             choices=[("allof", _("All of the following")),
                      ("anyof", _("Any of the following")),
                      ("all", _("All messages"))],
             initial="anyof",
-            widget=CustomRadioSelect(attrs={"class": "checkbox-inline", "type": "checkbox"})
+            widget=CustomRadioSelect()
         )
 
         self.header_operators = [
@@ -119,12 +123,12 @@ class FilterForm(forms.Form):
                 if op != opdef[0]:
                     continue
                 if opdef[2] in ["string", "number"]:
-                    vfield = forms.CharField(max_length=255, initial=value, widget=forms.TextInput(attrs={"class": "form-control"}))
+                    vfield = forms.CharField(max_length=255, initial=value)
 
         self.fields["cond_target_%d" % self.conds_cnt] = \
-            forms.ChoiceField(initial=name, choices=targets, widget=forms.Select(attrs={"class": "form-control"}))
+            forms.ChoiceField(initial=name, choices=targets)
         self.fields["cond_operator_%d" % self.conds_cnt] = \
-            forms.ChoiceField(initial=op, choices=ops, widget=forms.Select(attrs={"class": "form-control"}))
+            forms.ChoiceField(initial=op, choices=ops)
         self.fields["cond_value_%d" % self.conds_cnt] = vfield
         self.conds_cnt += 1
 
@@ -151,15 +155,15 @@ class FilterForm(forms.Form):
             if name == tpl["name"]:
                 args = tpl["args"]
         self.fields["action_name_%d" % self.actions_cnt] = \
-            forms.ChoiceField(initial=name, choices=actions, widget=forms.Select(attrs={"class": "form-control"}))
+            forms.ChoiceField(initial=name, choices=actions)
         for cnt in xrange(0, len(args)):
             arg = args[cnt]
             aname = "action_arg_%d_%d" % (self.actions_cnt, cnt)
             if arg["type"] == "string":
-                self.fields[aname] = forms.CharField(max_length=255, initial=value, widget=forms.TextInput(attrs={"class": "form-control"}))
+                self.fields[aname] = forms.CharField(max_length=255, initial=value)
             elif arg["type"] == "list":
                 choices = getattr(self, arg["vloader"])(request)
-                self.fields[aname] = forms.ChoiceField(initial=value, choices=choices, widget=forms.Select(attrs={"class": "form-control"}))
+                self.fields[aname] = forms.ChoiceField(initial=value, choices=choices)
         self.actions_cnt += 1
 
     def _build_redirect_field(self, request, value):
diff --git a/modoboa/extensions/sievefilters/templates/sievefilters/index.html b/modoboa/extensions/sievefilters/templates/sievefilters/index.html
index a2b7bb3d8..2fa6cc2be 100644
--- a/modoboa/extensions/sievefilters/templates/sievefilters/index.html
+++ b/modoboa/extensions/sievefilters/templates/sievefilters/index.html
@@ -71,24 +71,25 @@ $(document).ready(function() {
 </script>
 {% endblock %}
 {% block leftcol %}
-<div class="well">
-  <ul id="menu" class="nav nav-pills nav-stacked">
-    <li class="nav-header">{% trans "Filter sets" %}</li>
-    <li class="form-group">
-      <select id="curfset" class="form-control">
-        {% if active_script %}
-        <option value="{{ active_script }}">{{ active_script }} ({% trans "active" %})</option>
-        {% endif %}
-        {% for script in scripts %}
-        <option value="{{ script }}">{{ script }}</option>
-        {% endfor %}
-      </select>
-    </li>
-    {# It will add a li item : #}
-    {% sfilters_menu user %}
-
-  </ul>
-</div>
+<ul id="menu" class="nav nav-sidebar">
+  <li class="nav-header">{% trans "Filter sets" %}</li>
+  <li class="">
+    <div class="row">
+      <div class="col-md-offset-1 col-md-10">
+    <select id="curfset" class="form-control">
+      {% if active_script %}
+      <option value="{{ active_script }}">{{ active_script }} ({% trans "active" %})</option>
+      {% endif %}
+      {% for script in scripts %}
+      <option value="{{ script }}">{{ script }}</option>
+      {% endfor %}
+    </select>
+      </div>
+    </div>
+  </li>
+  {# It will add a li item : #}
+  {% sfilters_menu user %}
+</ul>
 {% endblock %}
 {% block apparea %}
 <div id="set_content">
diff --git a/modoboa/extensions/sievefilters/templatetags/sfilters_tags.py b/modoboa/extensions/sievefilters/templatetags/sfilters_tags.py
index f015b3249..32ced48c8 100644
--- a/modoboa/extensions/sievefilters/templatetags/sfilters_tags.py
+++ b/modoboa/extensions/sievefilters/templatetags/sfilters_tags.py
@@ -1,8 +1,10 @@
 from django import template
+from django.core.urlresolvers import reverse
 from django.template.loader import render_to_string
 from django.utils.translation import ugettext as _
-from django.core.urlresolvers import reverse
+
 from modoboa.lib.webutils import render_actions
+from modoboa.lib.templatetags.form_tags import configure_field_classes
 
 register = template.Library()
 
@@ -123,8 +125,11 @@ def display_errors(errors):
 @register.simple_tag
 def display_condition(form, cnt):
     target = form["cond_target_%d" % cnt]
+    configure_field_classes(target)
     operator = form["cond_operator_%d" % cnt]
+    configure_field_classes(operator)
     value = form["cond_value_%d" % cnt]
+    configure_field_classes(value)
     t = template.Template("""
 <div id="condition_{{ idx }}" class="item">
   <div class="col-lg-3 col-md-3 col-sm-3">{{ tfield }}</div>
@@ -145,14 +150,17 @@ def display_condition(form, cnt):
 @register.simple_tag
 def display_action(form, cnt):
     action = form["action_name_%d" % cnt]
+    configure_field_classes(action)
     values = []
     acnt = 0
     verrors = []
     while True:
         try:
-            values += [form["action_arg_%d_%d" % (cnt, acnt)]]
-            if len(form["action_arg_%d_%d" % (cnt, acnt)].errors):
-                verrors += form["action_arg_%d_%d" % (cnt, acnt)].errors
+            field = form["action_arg_%d_%d" % (cnt, acnt)]
+            configure_field_classes(field)
+            values += [field]
+            if field.errors:
+                verrors += field.errors
             acnt += 1
         except KeyError:
             break
diff --git a/modoboa/extensions/sievefilters/views.py b/modoboa/extensions/sievefilters/views.py
index 962f32217..8886a530a 100644
--- a/modoboa/extensions/sievefilters/views.py
+++ b/modoboa/extensions/sievefilters/views.py
@@ -91,7 +91,7 @@ def getfs(request, name):
             fs=content
         ))
 
-    menu = '<ul id="fsetmenu" class="nav nav-pills nav-stacked"><li class="nav-header">%s</li>%s</ul>' % \
+    menu = '<ul id="fsetmenu" class="nav nav-sidebar"><li class="nav-header">%s</li>%s</ul>' % \
         (_("Actions"), fset_menu(editormode, name))
     resp = dict(menu=menu, content=htmlcontent)
     return render_to_json_response(resp)
diff --git a/modoboa/extensions/stats/templates/stats/index.html b/modoboa/extensions/stats/templates/stats/index.html
index 140edafd1..633083d5e 100644
--- a/modoboa/extensions/stats/templates/stats/index.html
+++ b/modoboa/extensions/stats/templates/stats/index.html
@@ -25,53 +25,55 @@ $(document).ready(function() {
 </script>
 {% endblock %}
 {% block leftcol %}
-<div id="periods" class="well">
-  <ul class="nav nav-pills nav-stacked">
-        <li class="nav-header">
-          {% trans "Filter" %}
-        </li>
-        <li>
+<div id="periods">
+  <ul class="nav nav-sidebar">
+    <li class="nav-header">
+      {% trans "Filter" %}
+    </li>
+    <li>
+      <div class="input-group input-group-sm">
+        <span class="input-group-addon">
+          <span class="glyphicon glyphicon-search"></span>
+        </span>
+        <input class="form-control" id="searchquery" type="text" value="{% trans 'Search a domain' %}">
+      </div>
+    </li>
+    <li class="nav-header">
+      {% trans "Predefined time ranges" %}
+    </li>
+    {% for p in periods %}<li class="period">
+      <a href="#" class="period_selector" data-period="{{ p.name }}">{% trans p.label %}</a>
+    </li>
+    {% endfor %}
+    <li class="nav-header">
+      {% trans "Custom time range" %}
+    </li>
+  </ul>
+  <div class="row">
+    <div class="col-md-12">
+      <form class="form-horizontal">
+        <span id="custom-period">
           <div class="input-group input-group-sm">
-            <span class="input-group-addon">
-              <span class="glyphicon glyphicon-search"></span>
-            </span>
-            <input class="form-control" id="searchquery" type="text" value="{% trans 'Search a domain' %}">
+            <div class="input-group-addon"><span class="glyphicon glyphicon-indent-left"></span></div>
+            <input id="id_from" class="col-lg-10 form-control" name="date_from" value="{{ start }}" type="text" readonly="readonly" />
           </div>
-        </li>
-        <li class="nav-header">
-          {% trans "Predefined time ranges" %}
-        </li>
-        {% for p in periods %}<li class="period">
-          <a href="#" class="period_selector" data-period="{{ p.name }}">{% trans p.label %}</a>
-        </li>
-        {% endfor %}
-        <li class="nav-header">
-                {% trans "Custom time range" %}
-        </li>
-        <li>
-          <form class="form-horizontal">
-            <span id="custom-period">
-              <div class="input-group input-group-sm">
-                <div class="input-group-addon"><span class="glyphicon glyphicon-indent-left"></span></div>
-                <input id="id_from" class="col-lg-10 form-control" name="date_from" value="{{ start }}" type="text" readonly="readonly" />
-              </div>
-              <div class="input-group input-group-sm">
-                <div class="input-group-addon"><span class="glyphicon glyphicon-indent-right"></span></div>
-                <input id="id_to" class="col-lg-10 form-control" name="date_to" value="{{ end }}" type="text" readonly="readonly" />
-              </div>
-              <button class="btn btn-primary pull-right" id="customsend">{% trans "Apply" %}</button>
-            </span>
-          </form>
-        </li>
-      </ul>
+          <div class="input-group input-group-sm">
+            <div class="input-group-addon"><span class="glyphicon glyphicon-indent-right"></span></div>
+            <input id="id_to" class="col-lg-10 form-control" name="date_to" value="{{ end }}" type="text" readonly="readonly" />
+          </div>
+          <button class="btn btn-primary pull-right" id="customsend">{% trans "Apply" %}</button>
+        </span>
+      </form>
     </div>
-    {% endblock %}
-    {% block apparea %}
-    <div id="graphs" class="tabbable">
-      <ul class="nav nav-tabs">{% for id, gset in graph_sets.items %}
-        <li {% if forloop.first %}class="active"{% endif %}>
-          <a href="#graphs_{{ gset.html_id }}" data-toggle="tab">{{ gset.title }}</a>
-        </li>
+  </div>
+</div>
+{% endblock %}
+{% block apparea %}
+<div id="graphs" class="tabbable">
+  <ul class="nav nav-tabs">{% for id, gset in graph_sets.items %}
+    <li {% if forloop.first %}class="active"{% endif %}>
+      <a href="#graphs_{{ gset.html_id }}" data-toggle="tab">{{ gset.title }}</a>
+    </li>
   </ul>{% endfor %}
   <div class="tab-content">{% for id, gset in graph_sets.items %}
     <div class="tab-pane {% if forloop.first %}active{% endif %}" id="graphs_{{ gset.html_id }}">
diff --git a/modoboa/extensions/webmail/app_settings.py b/modoboa/extensions/webmail/app_settings.py
index 6271f48dc..eca4f4570 100644
--- a/modoboa/extensions/webmail/app_settings.py
+++ b/modoboa/extensions/webmail/app_settings.py
@@ -13,8 +13,7 @@ class ParametersForm(AdminParametersForm):
     max_attachment_size = forms.CharField(
         label=_("Maximum attachment size"),
         initial="2048",
-        help_text=_("Maximum attachment size in bytes (or KB, MB, GB if specified)"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Maximum attachment size in bytes (or KB, MB, GB if specified)")
     )
 
     sep1 = SeparatorField(label=_("IMAP settings"))
@@ -22,8 +21,7 @@ class ParametersForm(AdminParametersForm):
     imap_server = forms.CharField(
         label=_("Server address"),
         initial="127.0.0.1",
-        help_text=_("Address of your IMAP server"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Address of your IMAP server")
     )
 
     imap_secured = YesNoField(
@@ -35,8 +33,7 @@ class ParametersForm(AdminParametersForm):
     imap_port = forms.IntegerField(
         label=_("Server port"),
         initial=143,
-        help_text=_("Listening port of your IMAP server"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Listening port of your IMAP server")
     )
 
     sep2 = SeparatorField(label=_("SMTP settings"))
@@ -44,8 +41,7 @@ class ParametersForm(AdminParametersForm):
     smtp_server = forms.CharField(
         label=_("Server address"),
         initial="127.0.0.1",
-        help_text=_("Address of your SMTP server"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Address of your SMTP server")
     )
 
     smtp_secured_mode = forms.ChoiceField(
@@ -61,8 +57,7 @@ class ParametersForm(AdminParametersForm):
     smtp_port = forms.IntegerField(
         label=_("Server port"),
         initial=25,
-        help_text=_("Listening port of your SMTP server"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Listening port of your SMTP server")
     )
 
     smtp_authentication = YesNoField(
@@ -82,7 +77,7 @@ class UserSettings(UserParametersForm):
         label=_("Default message display mode"),
         choices=[("html", "html"), ("plain", "text")],
         help_text=_("The default mode used when displaying a message"),
-        widget=InlineRadioSelect(attrs={"type": "checkbox"})
+        widget=InlineRadioSelect()
     )
 
     enable_links = YesNoField(
@@ -94,22 +89,19 @@ class UserSettings(UserParametersForm):
     messages_per_page = forms.IntegerField(
         initial=40,
         label=_("Number of displayed emails per page"),
-        help_text=_("Sets the maximum number of messages displayed in a page"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Sets the maximum number of messages displayed in a page")
     )
 
     refresh_interval = forms.IntegerField(
         initial=300,
         label=_("Listing refresh rate"),
-        help_text=_("Automatic folder refresh rate (in seconds)"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Automatic folder refresh rate (in seconds)")
     )
 
     mboxes_col_width = forms.IntegerField(
         initial=200,
         label=_("Mailboxes container's width"),
-        help_text=_("The width of the mailbox list container"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("The width of the mailbox list container")
     )
 
     sep2 = SeparatorField(label=_("Mailboxes"))
@@ -117,22 +109,19 @@ class UserSettings(UserParametersForm):
     trash_folder = forms.CharField(
         initial="Trash",
         label=_("Trash folder"),
-        help_text=_("Folder where deleted messages go"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Folder where deleted messages go")
     )
 
     sent_folder = forms.CharField(
         initial="Sent",
         label=_("Sent folder"),
-        help_text=_("Folder where copies of sent messages go"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Folder where copies of sent messages go")
     )
 
     drafts_folder = forms.CharField(
         initial="Drafts",
         label=_("Drafts folder"),
-        help_text=_("Folder where drafts go"),
-        widget=forms.TextInput(attrs={"class": "form-control"})
+        help_text=_("Folder where drafts go")
     )
 
     sep3 = SeparatorField(label=_("Composing messages"))
@@ -142,14 +131,13 @@ class UserSettings(UserParametersForm):
         label=_("Default editor"),
         choices=[("html", "html"), ("plain", "text")],
         help_text=_("The default editor to use when composing a message"),
-        widget=InlineRadioSelect(attrs={"type": "checkbox"})
+        widget=InlineRadioSelect()
     )
 
     signature = forms.CharField(
         initial="",
         label=_("Signature text"),
         help_text=_("User defined email signature"),
-        widget=forms.widgets.Textarea(attrs={"class": "form-control"}),
         required=False
     )
 
diff --git a/modoboa/extensions/webmail/forms.py b/modoboa/extensions/webmail/forms.py
index 51ceb1557..cb329c9f4 100644
--- a/modoboa/extensions/webmail/forms.py
+++ b/modoboa/extensions/webmail/forms.py
@@ -80,31 +80,16 @@ class ComposeMailForm(forms.Form):
 
     """Compose mail form."""
 
-    to = forms.CharField(
-        label=_("To"), widget=forms.TextInput(attrs={"class": "form-control"})
-    )
-    cc = forms.CharField(
-        label=_("Cc"), required=False,
-        widget=forms.TextInput(attrs={"class": "form-control"})
-    )
-    cci = forms.CharField(
-        label=_("Cci"), required=False,
-        widget=forms.TextInput(attrs={"class": "form-control"})
-    )
+    to = forms.CharField(label=_("To"))
+    cc = forms.CharField(label=_("Cc"), required=False)
+    cci = forms.CharField(label=_("Cci"), required=False)
     subject = forms.CharField(
         label=_("Subject"),
         max_length=255,
-        required=False,
-        widget=forms.TextInput(attrs={"class": "form-control"})
-    )
-    origmsgid = forms.CharField(
-        label="",
-        widget=forms.HiddenInput(attrs={"class": "form-control"}),
         required=False
     )
-    body = forms.CharField(
-        widget=forms.widgets.Textarea(attrs={"class": "form-control"})
-    )
+    origmsgid = forms.CharField(label="", required=False)
+    body = forms.CharField()
 
     def _html_msg(self):
         """Create a multipart message.
diff --git a/modoboa/extensions/webmail/static/webmail/css/webmail.css b/modoboa/extensions/webmail/static/webmail/css/webmail.css
index 0614b8552..41a3cf352 100644
--- a/modoboa/extensions/webmail/static/webmail/css/webmail.css
+++ b/modoboa/extensions/webmail/static/webmail/css/webmail.css
@@ -189,7 +189,7 @@ div.expanded {
 }
 
 div#leftcol #mboxes_container .nav .droppable div.clickbox{
-    z-index:800;
+    z-index: 800;
 }
 
 li.droppable li{
diff --git a/modoboa/extensions/webmail/static/webmail/js/webmail.js b/modoboa/extensions/webmail/static/webmail/js/webmail.js
index f546a2fcc..1fe5651ae 100644
--- a/modoboa/extensions/webmail/static/webmail/js/webmail.js
+++ b/modoboa/extensions/webmail/static/webmail/js/webmail.js
@@ -40,7 +40,7 @@ Webmail.prototype = {
 
 
         $("#mboxactions").css({
-            bottom: $("#bottom-bar").outerHeight(true) + 30
+            bottom: $("#bottom-bar").outerHeight(true) + "px"
         });
 
 
@@ -48,9 +48,7 @@ Webmail.prototype = {
         /* Responsive */
 
         /* Responsive -> init */
-
-
-        if ($( window ).width()<1198){
+        if ($(window).width() < 1198) {
             $("#leftcol").addClass(
                 "leftcol-display-none"
             );
@@ -62,11 +60,12 @@ Webmail.prototype = {
             });
         }
 
-        if ($( window ).width()>1198){
+        if ($(window).width() > 1198) {
             $("#folders").css({
                 bottom: $("#bottom-bar").outerHeight(true) + 10,
                 width: this.options.mboxes_col_width + 'px'
             });
+              
             $("#listing").addClass(
                 "listing-up-1198"
             );
@@ -83,20 +82,20 @@ Webmail.prototype = {
 
         /* Responsive -> on resizing window */
         var that = this;
-        $(window).resize(function(){
+        $(window).resize(function() {
 
-            if ($( window ).width()<767){
+            if ($(window).width() < 767) {
                 $("tr td[name='from']").css({
                     width: 35 + '%'
                 });
             }
-            if ($( window ).width()>767){
+            if ($(window).width() > 767) {
                 $("tr td[name='from']").css({
                     width: 20 + '%'
                 });
             }
 
-            if ($( window ).width()<1198){
+            if ($(window).width() < 1198) {
                 $("#leftcol").addClass(
                     "leftcol-display-none"
                 );
@@ -115,7 +114,7 @@ Webmail.prototype = {
                 });
             }
 
-            if ($( window ).width()>1198){
+            if ($(window).width() > 1198) {
                 $("#folders").css({
                     bottom: $("#bottom-bar").outerHeight(true) + 10,
                     width: that.options.mboxes_col_width + 'px'
@@ -147,9 +146,9 @@ Webmail.prototype = {
             }
         });
 
-        $( "#folders" ).resizable({
+        $("#folders").resizable({
             resize: function(event, ui) {
-                if ($( window ).width()>1198){
+                if ($(window).width() > 1198) {
                     var width = ui.size.width;
                     $("#rightcol").css({
                         marginLeft: width + 'px'
@@ -160,7 +159,7 @@ Webmail.prototype = {
                     $("#rightcol").css({
                         paddingRight: width - 110 + 'px'
                     });
-                    if ($( window ).width()<1800){
+                    if ($(window).width() < 1800) {
                         $("#rightcol").css({
                             paddingRight: width - 110 + 'px'
                         });
@@ -232,7 +231,8 @@ Webmail.prototype = {
     },
 
     resize: function() {
-        $("#mboxes_container").height($("#folders").height() - $("#mboxactions").height());
+        $("#mboxes_container").height(
+            $("#folders").height() - $("#mboxactions").height());
     },
 
     /*
@@ -298,7 +298,6 @@ Webmail.prototype = {
     page_update: function(response) {
         var curmb = this.get_current_mailbox();
 
-//       $(window).unbind("resize");
         if (!$('li[name="' + curmb + '"]').hasClass("active")) {
             this.load_and_select_mailbox(curmb);
         }
@@ -318,8 +317,6 @@ Webmail.prototype = {
             $("#pagination-responsive").html(response.navbar);
         }
         $("#listing").html(response.listing);
-        $("#listing").css({
-        });
     },
 
     /*
@@ -955,7 +952,7 @@ Webmail.prototype = {
         var top = $mailheader.outerHeight(true);
 
         $("#body_container").css({
-            height: $(window).height()*0.58 + "px"
+            height: $(window).height() * 0.58 + "px"
         });
     },
 
diff --git a/modoboa/extensions/webmail/templates/webmail/compose.html b/modoboa/extensions/webmail/templates/webmail/compose.html
index 1ccea4a29..01d4ad244 100644
--- a/modoboa/extensions/webmail/templates/webmail/compose.html
+++ b/modoboa/extensions/webmail/templates/webmail/compose.html
@@ -4,7 +4,7 @@
     <div id="mailheader" class="well">
       {% render_field form.to %}
       <div class="options col-lg-offset-4 col-lg-7 col-md-offset-4 col-md-7 col-sm-offset-4 col-sm-7">
-        {% if not form.cc.value %}<a id="add_cc" href="#" class="btn btn-xs btn-default glyphicon glyphicon-plus">{% trans "Cc" %}</a>{% endif %} <a id="add_cci" href="#" class="btn btn-xs btn-default glyphicon glyphicon-plus">{% trans "Cci" %}</a>
+        {% if not form.cc.value %}<a id="add_cc" href="#" class="glyphicon glyphicon-plus">{% trans "Cc" %}</a>{% endif %} <a id="add_cci" href="#" class="glyphicon glyphicon-plus">{% trans "Cci" %}</a>
       </div>
       {% if form.cc.value %}{% render_field form.cc %}{% else %}{% render_and_hide_field form.cc %}{% endif %}
       {% render_and_hide_field form.cci %}
diff --git a/modoboa/extensions/webmail/templates/webmail/folders.html b/modoboa/extensions/webmail/templates/webmail/folders.html
index c37f3d088..e961ac02f 100644
--- a/modoboa/extensions/webmail/templates/webmail/folders.html
+++ b/modoboa/extensions/webmail/templates/webmail/folders.html
@@ -1,6 +1,6 @@
 {% load i18n webmail_tags %}
 <div id="mboxes_container">
-  <ul class="nav nav-pills nav-stacked">
+  <ul class="nav nav-sidebar">
     <li class="nav-header">{% trans "Mailboxes" %}</li>
     {% print_mailboxes mboxes selected withunseen %}
   </ul>
diff --git a/modoboa/extensions/webmail/templates/webmail/index.html b/modoboa/extensions/webmail/templates/webmail/index.html
index deecb692b..849b2f725 100644
--- a/modoboa/extensions/webmail/templates/webmail/index.html
+++ b/modoboa/extensions/webmail/templates/webmail/index.html
@@ -32,13 +32,13 @@ $(document).ready(function() {
 
 {% block fixed_content %}
 <div class="row">
-    <div id="leftcol" class="col-lg-2 col-md-3 col-ms-3 col-xs-0">
-      <div id="folders" class="well">{{ mboxes }}</div>
-    </div>
-    <div id="rightcol" class="col-lg-11 col-md-12 col-ms-12 col-xs-12">
-        <div id="menubar" class="col-lg-12 col-md-12 col-ms-12 col-xs-12"></div>
-        <div id="listing" class=""></div>
-    </div>
+  <div id="leftcol" class="col-lg-2 col-md-3 col-ms-3 col-xs-0 sidebar">
+    <div id="folders">{{ mboxes }}</div>
+  </div>
+  <div id="rightcol" class="col-lg-11 col-md-12 col-ms-12 col-xs-12">
+    <div id="menubar" class="col-lg-12 col-md-12 col-ms-12 col-xs-12"></div>
+    <div id="listing" class=""></div>
+  </div>
 </div>
 {% endblock %}
 {% block footerleft %}
diff --git a/modoboa/extensions/webmail/templatetags/webmail_tags.py b/modoboa/extensions/webmail/templatetags/webmail_tags.py
index 1e4565975..6f0599dfc 100644
--- a/modoboa/extensions/webmail/templatetags/webmail_tags.py
+++ b/modoboa/extensions/webmail/templatetags/webmail_tags.py
@@ -181,17 +181,17 @@ def mboxes_menu():
          "modal": True,
          "modalcb": "webmail.mboxform_cb",
          "closecb": "webmail.mboxform_close",
-         "class": "btn-default btn-sm"},
+         "class": "btn-default btn-xs"},
         {"name": "editmbox",
          "url": reverse(webmail.views.editfolder),
          "img": "glyphicon glyphicon-edit",
          "title": _("Edit the selected mailbox"),
-         "class": "btn-default btn-sm"},
+         "class": "btn-default btn-xs"},
         {"name": "removembox",
          "url": reverse(webmail.views.delfolder),
          "img": "glyphicon glyphicon-remove",
          "title": _("Remove the selected mailbox"),
-         "class": "btn-default btn-sm"}
+         "class": "btn-default btn-xs"}
     ]
 
     return render_to_string('common/buttons_list.html', dict(
diff --git a/modoboa/static/css/custom.css b/modoboa/static/css/custom.css
index 854fc2a3e..363a360ed 100644
--- a/modoboa/static/css/custom.css
+++ b/modoboa/static/css/custom.css
@@ -1,14 +1,17 @@
- /* ------- Media ------- */
+/* ------- Media ------- */
+
+.sidebar { 
+    display: none;
+}
 
 @media (max-width: 440px) {
 
-
-    .navbar .col-xs-8{
-        padding-right:0;
+    .navbar .col-xs-8 {
+        padding-right: 0;
     }
 }
 
- @media (max-width: 768px) {
+@media (max-width: 768px) {
 
      .navbar .navbar-header,
      .navbar #pagination-responsive{
@@ -27,9 +30,11 @@
          margin-left: 0;
          margin-right: 0;
      }
- }
 
- @media (max-width: 1198px) {
+}
+
+@media (max-width: 1198px) {
+
      #pagination-responsive .display-less-1198{
          display: inherit;
      }
@@ -44,43 +49,61 @@
      }
 }
 
+@media (min-width: 768px) {
+
+    .sidebar {
+        position: fixed;
+        top: 52px;
+        bottom: 0;
+        left: 0;
+        z-index: 1000;
+        display: block;
+        padding: 20px;
+        overflow-x: hidden;
+        overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
+        background-color: #f5f5f5;
+        border-right: 1px solid #ddd;
+    }
+
+}
+
  /* --------- general --------- */
 
- /* Form */
+/* Form */
 
- #uprefs_content input[type="checkbox"],
- .modal input[type="checkbox"]{
-     margin-top: 10px;
- }
- /* Buttons */
+#uprefs_content input[type="checkbox"],
+.modal input[type="checkbox"]{
+    margin-top: 10px;
+}
+/* Buttons */
 
- .navbar .btn-link:hover,
- .navbar .btn-link:focus{
-     text-decoration: none;
- }
+.navbar .btn-link:hover,
+.navbar .btn-link:focus{
+    text-decoration: none;
+}
 
- .well .nav > li > a {
-     padding: 2px 5px;
- }
+.well .nav > li > a {
+    padding: 2px 5px;
+}
 
- /* Colapse Nav */
+/* Colapse Nav */
 
- .navbar-inverse .navbar-toggle {
-     border-color: #999999;
- }
+.navbar-inverse .navbar-toggle {
+    border-color: #999999;
+}
 
- .navbar-inverse .navbar-toggle span{
-     color: white;
- }
+.navbar-inverse .navbar-toggle span{
+    color: white;
+}
 
- .navbar-toggle{
-     background-color: #000;
-     margin-bottom: 4px;
-     margin-top: 2px;
- }
+.navbar-toggle{
+    background-color: #000;
+    margin-bottom: 4px;
+    margin-top: 2px;
+}
 
 
- /* Global */
+/* Global */
 
 h5{
     font-size:15px;
@@ -154,48 +177,56 @@ label{
 /* --------- main page --------- */
 
 
- /* Top navbar section */
+/* Top navbar section */
 
- .top-navbar{
-     border-radius: 0;
- }
-
- .display-less-1198{
-     display: none;
- }
-
- div#navigate-navbar-collapse.navbar-collapse{
-     z-index: 9999;
- }
- html body div.navbar div.container-fluid div#navigate-navbar-collapse.collapse ul.nav li.dropdown a.dropdown-toggle{
-     color: white;
- }
-
- #pagination-responsive #pagination_bar{
-     display: none;
- }
-
- /*left navSideBar */
-
-.well{
-    padding: 11px;
+.top-navbar{
+    border-radius: 0;
 }
 
-.nav-header {
+.display-less-1198{
+    display: none;
+}
+
+div#navigate-navbar-collapse.navbar-collapse{
+    z-index: 9999;
+}
+html body div.navbar div.container-fluid div#navigate-navbar-collapse.collapse ul.nav li.dropdown a.dropdown-toggle{
+    color: white;
+}
+
+#pagination-responsive #pagination_bar{
+    display: none;
+}
+
+/* left sidebar */
+
+/* Sidebar navigation */
+.nav-sidebar {
+    margin-right: -21px; /* 20px padding + 1px border */
+    margin-bottom: 20px;
+    margin-left: -20px;
+}
+.nav-sidebar > li > a {
+    padding-right: 20px;
+    padding-left: 20px;
+}
+.nav-sidebar > .active > a,
+.nav-sidebar > .active > a:hover,
+.nav-sidebar > .active > a:focus {
+    color: #fff;
+    background-color: #428bca;
+}
+
+.nav-sidebar > .nav-header {
     color: #959595;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 1px;
     text-transform: uppercase;
+    padding-left: 20px;
+    margin-bottom: 5px;
 }
 
-.well ul.nav li i.glyphicon{
-    color:black;
-}
- .well ul.nav li.active i.glyphicon{
-     color:white;
- }
-
  /* Action buttons */
 
  .action-buttons {
diff --git a/modoboa/static/js/confirmation.js b/modoboa/static/js/confirmation.js
index 285f6e0f8..59c3f1047 100644
--- a/modoboa/static/js/confirmation.js
+++ b/modoboa/static/js/confirmation.js
@@ -51,7 +51,6 @@
              var title_patten = '<div class="{0}"><h3 class="modal-title">{1}</h3></div>';
 
              if (body !== "") {
-                 console.log(body);
                  content += title_patten.format("modal-header", question);
                  content += '<div class="modal-body">{0}</div>'.format(body);
              } else {
diff --git a/modoboa/static/js/global.js b/modoboa/static/js/global.js
index fa0f0d8f4..8faabc6d8 100644
--- a/modoboa/static/js/global.js
+++ b/modoboa/static/js/global.js
@@ -31,6 +31,9 @@ function modalbox(e, css, defhref, defcb, defclosecb) {
         $(href).modal('open');
         return;
     }
+    if ($("#modalbox").length) {
+        return;
+    }
     $.ajax({
         type: "GET",
         url: href
diff --git a/modoboa/static/js/listing.js b/modoboa/static/js/listing.js
index d77009480..2c44a6bb9 100644
--- a/modoboa/static/js/listing.js
+++ b/modoboa/static/js/listing.js
@@ -116,7 +116,7 @@ Listing.prototype = {
         this.tag_handlers[name] = handler;
         if (this.navobj.getparam(name + "filter") !== undefined) {
             var text = this.navobj.getparam(name + "filter");
-            $("#searchform").parent().after(this.make_tag(text, name));
+            $("#taglist").append(this.make_tag(text, name));
         }
     },
 
@@ -124,16 +124,19 @@ Listing.prototype = {
         if (this.navobj.getparam(tag + "filter") === undefined && $link.hasClass(tag)) {
             var text = $link.attr("name");
             this.navobj.setparam(tag + "filter", text).update();
-            $("#searchform").parent().after(this.make_tag(text, tag));
+            $("#taglist").append(this.make_tag(text, tag));
             return true;
         }
         return false;
     },
 
     make_tag: function(text, type) {
-        var $tag = $("<a />", {"name": type, "class" : "btn btn-xs", "html": text});
-        var $i = $("<i />", {"class" : "glyphicon glyphicon-remove"}).prependTo($tag);
-
+        var $tag = $("<a />", {
+            "name": type, "class" : "btn btn-default btn-xs",
+            "html": text
+        });
+        
+        $("<span />", {"class" : "glyphicon glyphicon-remove"}).prependTo($tag);
         $tag.click($.proxy(this.remove_tag, this));
         return $tag;
     },
diff --git a/modoboa/templates/common/buttons_list.html b/modoboa/templates/common/buttons_list.html
index e589074cf..485c86b81 100644
--- a/modoboa/templates/common/buttons_list.html
+++ b/modoboa/templates/common/buttons_list.html
@@ -1,17 +1,18 @@
 {% load lib_tags %}
 
-        <!-- Brand and toggle get grouped for better mobile display -->
-            <div class="btn-toolbar {{ extraclasses }}">{% for entry in entries %}
-                <ul class="nav navbar-nav action-buttons btn-group">{% if entry.menu %}
-                    <a class="btn btn-default dropdown-toggle {{ entry.label }}" data-toggle="dropdown">{% if entry.img %}<i class="{{ entry.img}}"></i>{% endif %}{{ entry.label }} <span class="caret"></span></a>
-                    <ul class="dropdown-menu">{% for sentry in entry.menu %}
-                      <li>{% render_link sentry %}</li>
-                      {% endfor %}</ul>
-                    {% else %}{% render_link entry "btn" %}{% endif %}
-                </ul>
-                {% endfor %}
-                <ul class="nav navbar-nav action-buttons navbar-right">
-                    {% block extracontent %}{% endblock %}
-                </ul>
-            </div>
+<!-- Brand and toggle get grouped for better mobile display -->
+<div class="btn-toolbar {{ extraclasses }}">
+  {% for entry in entries %}
+  <ul class="nav navbar-nav action-buttons btn-group">{% if entry.menu %}
+    <a class="btn btn-default dropdown-toggle {{ entry.label }}" data-toggle="dropdown">{% if entry.img %}<i class="{{ entry.img}}"></i>{% endif %}{{ entry.label }} <span class="caret"></span></a>
+    <ul class="dropdown-menu">{% for sentry in entry.menu %}
+      <li>{% render_link sentry %}</li>
+      {% endfor %}</ul>
+    {% else %}{% render_link entry "btn" %}{% endif %}
+  </ul>
+  {% endfor %}
+  <ul class="nav navbar-nav action-buttons navbar-right">
+    {% block extracontent %}{% endblock %}
+  </ul>
+</div>
 
diff --git a/modoboa/templates/common/generic_modal_form.html b/modoboa/templates/common/generic_modal_form.html
index f124df76c..8f3294cf6 100644
--- a/modoboa/templates/common/generic_modal_form.html
+++ b/modoboa/templates/common/generic_modal_form.html
@@ -5,7 +5,7 @@
 {% block modalbody %}
   {% if error %}<div class="alert alert-danger">{{ error }}</div>{% endif %}
 <form class="form-horizontal" action="{{ action }}" enctype="{{ enctype }}" 
-      method="POST" id="{{ formid }}" name="{{ formid }}"
+      method="POST" id="{{ formid }}" name="{{ formid }}" role="form"
       target="{{ target }}">
   {% csrf_token %}
   {% block formbody %}
diff --git a/modoboa/templates/twocols.html b/modoboa/templates/twocols.html
index ce98b9989..5d3b408d1 100644
--- a/modoboa/templates/twocols.html
+++ b/modoboa/templates/twocols.html
@@ -1,8 +1,10 @@
 {% extends "fluid.html" %}
 {% load core_tags %}
 {% block rowcontent %}
-<div class="col-lg-2 col-md-3 col-sm-4 col-xs-12">{% block leftcol %}{% endblock %}</div>
-<div class="col-lg-10 col-md-9 col-sm-8 col-xs-12">
+<div class="col-lg-2 col-md-3 col-sm-4 col-xs-12 sidebar">
+  {% block leftcol %}{% endblock %}
+</div>
+<div class="col-lg-offset-2 col-lg-10 col-md-offset-3 col-md-9 col-sm-offset-4 col-sm-8 col-xs-12">
   {% if messages %}{% display_messages messages %}{% endif %}
   {% block apparea %}{% endblock %}
 </div>