diff --git a/addons/hr/__openerp__.py b/addons/hr/__openerp__.py
index 900c689dfbf..436ee1b6094 100644
--- a/addons/hr/__openerp__.py
+++ b/addons/hr/__openerp__.py
@@ -58,5 +58,6 @@ You can manage:
     'installable': True,
     'active': False,
     'certificate': '0086710558965',
+    "css": [ 'static/src/css/hr.css' ],
 }
 # vim:expandtab:smartindent:tabstop=4:softtabstop=4:shiftwidth=4:
diff --git a/addons/hr/hr_view.xml b/addons/hr/hr_view.xml
index f51280f4465..996967d18d9 100644
--- a/addons/hr/hr_view.xml
+++ b/addons/hr/hr_view.xml
@@ -131,52 +131,27 @@
         <field name="model">hr.employee</field>
         <field name="type">kanban</field>
         <field name="arch" type="xml">
-            <kanban>
-                <field name="color"/>
-                <templates>
-                    <t t-name="employee_details">
-                        <ul class="oe_kanban_tooltip" t-if="record.job_id.raw_value">
-                            <li><b>Job:</b> <field name="job_id"/></li>
-                        </ul>
-                    </t>
-                    <t t-name="kanban-box">
-                        <div t-attf-class="#{kanban_color(record.color.raw_value)}">
-                            <div class="oe_kanban_box oe_kanban_color_border">
-                                <div class="oe_kanban_box_header oe_kanban_color_bgdark oe_kanban_color_border oe_kanban_draghandle oe_kanban_title" tooltip="employee_details">
-                                    <field name="name"/>
-                                </div>
-                                <div class="oe_kanban_box_content oe_kanban_color_bglight oe_kanban_box_show_onclick_trigger oe_kanban_color_border">
-                                    <img t-att-src="kanban_image('hr.employee', 'photo', record.id.value)" width="48" style="float: left;"/>
-                                    <span t-if="record.parent_id.raw_value" class="oe_kanban_highlight">
-                                        ❖ <field name="parent_id"/>
-                                    </span>
-                                    <span t-if="record.work_location.raw_value" class="oe_kanban_highlight">
-                                        ✜ <field name="work_location"/>
-                                    </span>
-                                    <span t-if="record.work_email.raw_value" class="oe_kanban_highlight">
-                                        ✉ <a t-attf-href="mailto:#{record.work_email.value}"><field name="work_email"/></a>
-                                    </span>
-                                    <span t-if="record.mobile_phone.raw_value" class="oe_kanban_highlight">
-                                        ☎ <field name="mobile_phone"/>
-                                    </span>
-                                    <span t-if="record.work_phone.raw_value" class="oe_kanban_highlight">
-                                        ☏ <field name="work_phone"/>
-                                    </span>
-                                    <div class="oe_kanban_clear"/>
-                                </div>
-                                <div class="oe_kanban_buttons_set oe_kanban_color_border oe_kanban_color_bglight oe_kanban_box_show_onclick">
-                                    <div class="oe_kanban_left">
-                                        <a string="Edit" icon="gtk-edit" type="edit"/>
-                                        <a string="Change Color" icon="color-picker" type="color" name="color"/>
-                                        <a string="Send New Email" name="%(mail.action_email_compose_message_wizard)d" icon="terp-mail-message-new" type="action"/>
-                                    </div>
-                                    <div class="oe_kanban_clear"/>
-                                </div>
-                            </div>
-                        </div>
-                    </t>
-                </templates>
-            </kanban>
+
+          <kanban>
+              <templates>
+                <t t-name="kanban-box">
+                  <div class="oe_employee_image">
+                    <a type="edit"><img t-att-src="kanban_image('hr.employee', 'photo', record.id.value)" class="oe_employee_picture"/></a>
+                  </div>
+                  <div class="oe_employee_details">
+                    <h4><a type="edit"><field name="name"/></a></h4>
+                    <ul>
+                      <li t-if="record.department_id.raw_value"><field name="department_id"/></li>
+                      <li t-if="record.job_id.raw_value"><field name="job_id"/></li>
+                      <li t-if="record.work_email.raw_value"><a t-attf-href="mailto:#{record.work_email.value}"><field name="work_email"/></a></li>
+                      <li t-if="record.work_phone.raw_value"><field name="work_phone"/></li>
+                      <li t-if="record.mobile_phone.raw_value"><field name="mobile_phone"/></li>
+                    </ul>
+                  </div>
+                </t>
+              </templates>
+          </kanban>
+
         </field>
     </record>
         <record id="open_view_employee_tree" model="ir.actions.act_window">
diff --git a/addons/hr/static/src/css/hr.css b/addons/hr/static/src/css/hr.css
new file mode 100644
index 00000000000..303f8ac11c3
--- /dev/null
+++ b/addons/hr/static/src/css/hr.css
@@ -0,0 +1,56 @@
+.oe_employee_image, .oe_employee_details {
+  display: inline-block;
+  vertical-align: top;
+}
+
+.oe_employee_image {
+  width: 100px;
+  height: 100px;
+  text-align: center;
+  overflow: hidden;
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  -o-border-radius: 3px;
+  -ms-border-radius: 3px;
+  border-radius: 3px;
+  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
+  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
+  -o-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
+  -box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
+}
+
+.oe_employee_picture {
+  width: 100px;
+  height: auto;
+  clip: rect(10px, 110px, 100px, 0px);
+}
+
+.oe_employee_details {
+  width: 200px;
+  font-size: 13px;
+  padding: 2px 5px;
+  color: #4c4c4c;
+}
+
+.oe_employee_details h4 {
+  margin: 0;
+  font-size: 13px;
+}
+
+.oe_employee_details h4 a {
+  color: #4c4c4c;
+}
+
+.oe_employee_details h4 a:hover {
+  text-decoration: underline;
+}
+
+.oe_employee_details ul {
+  margin: 3px 0 5px;
+  padding: 0;
+  list-style: none;
+}
+
+.oe_employee_details li {
+  margin: 2px 0;
+}