diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index 6ce93bc76bd..3b9002b0d1c 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -2932,46 +2932,75 @@ div.ui-widget-overlay {
   border-radius: 3px;
 }
 
-.openerp .oe_fileuploader {
+.openerp .oe_fileupload {
     display: inline-block;
     clear: both;
+    width: 100%;
 }
-.openerp .oe_fileuploader .oe_add {
+.openerp .oe_fileupload .oe_add {
     float: left;
-    width: 24px;
-    height: 24px;
     position: relative;
+    width: 100%;
     left: +2px;
     top: +7px;
-    overflow: hidden;
 }
-.openerp .oe_fileuploader .oe_add button {
-    position: absolute;
-    bottom: +0px;
-    left: +0px;
+.openerp .oe_fileupload .oe_add button{
+    display: inline;
     height: 24px;
+    font-size: 12px;
+    line-height: 12px;
+    vertical-align: middle;
+}
+.openerp .oe_fileupload .oe_add button.oe_attach {
     width: 24px;
-    margin: 0px;
-    padding: 0px;
+    overflow: hidden;
+    background: transparent; 
+    color: #7C7BAD;
+    box-shadow: none;
+    border: none;
+    text-shadow: none;
 }
-.openerp .oe_fileuploader .oe_add .oe_hidden_input_file input.oe_form_binary_file {
-    width: 300px;
-    left: -100px;
-    top: 1px;
-    height: 24px;
-    width: 300px;
-    background: transparent;
-    border: 0;
-    margin: 0px;
-    padding: 0px;
-    color: transparent;
+.openerp .oe_fileupload .oe_add .oe_attach_label{
+    color: #7C7BAD;
+    margin-left: -3px;
 }
-.openerp .oe_fileuploader .oe_add button span {
+.openerp .oe_fileupload .oe_add button.oe_attach .oe_e{
     position: relative;
-    bottom: +4px;
-    font-size: 30px;
+    top: -1px;
+    left: -9px;
+}
+.openerp .oe_fileupload .oe_add input.oe_form_binary_file{
+    display: inline-block;
+    margin-left: -5px;
+    height: 28px;
+    width: 52px;
+    margin-top: -26px;
+}
+.openerp .oe_fileupload .oe_attachments {
+    margin-bottom: 4px;
+    margin-right: 0px;
+    font-size: 12px;
+    border-radius: 2px;
+    border: solid 1px rgba(124,123,173,0.14);
+}
+.openerp .oe_fileupload .oe_attachments .oe_attachment{
+    padding: 2px;
+    padding-left: 4px;
+    padding-right: 4px;
+}
+.openerp .oe_fileupload .oe_attachments .oe_attachment .oe_e{
+    font-size: 23px;
+    margin-top: -5px;
+}
+.openerp .oe_fileupload .oe_attachments .oe_attachment .oe_e:hover{
+    text-decoration: none;
+}
+.openerp .oe_fileupload .oe_attachments .oe_attachment:nth-child(odd){
+    background:white;
+}
+.openerp .oe_fileupload .oe_attachments .oe_attachment:nth-child(even){
+    background: #F4F5FA;
 }
-
 
 @media print {
   .openerp {
diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass
index 733bd9c0845..3d7e129689e 100644
--- a/addons/web/static/src/css/base.sass
+++ b/addons/web/static/src/css/base.sass
@@ -314,7 +314,7 @@ $sheet-max-width: 860px
                     text-decoration: none
         .oe_about
             background-color: white
-            background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
+            background-image: url(data:image/pngbase64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
             @include radius(0 0 2px 2px)
             a
                 color: $link-color
@@ -679,7 +679,7 @@ $sheet-max-width: 860px
     // }}}
     // Login {{{
     .oe_login
-        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
+        background-image: url(data:image/pngbase64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
         text-align: center
         font-size: 14px
         height: 100%
@@ -1026,7 +1026,7 @@ $sheet-max-width: 860px
     // About openerp {{{
     .oe_about
         background-color: white
-        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
+        background-image: url(data:image/pngbase64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
         @include radius(0 0 2px 2px)
         a
             color: $link-color
@@ -2277,63 +2277,65 @@ $sheet-max-width: 860px
         color: #333
     // }}}
 
-.openerp .oe_fileuploader .oe_add .oe_hidden_input_file input.oe_form_binary_file {
-    width: 300px;
-    left: -100px;
-    top: 1px;
-    height: 24px;
-    width: 300px;
-    background: transparent;
-    border: 0;
-    margin: 0px;
-    padding: 0px;
-    color: transparent;
-}
-.openerp .oe_fileuploader .oe_add button span {
-    position: relative;
-    bottom: +4px;
-    font-size: 30px;
-}
-
-.openerp .oe_fileuploader {
-    clear: both;
-}
-
-    .oe_fileuploader
+.openerp
+    .oe_fileupload
         display: inline-block
         clear: both
+        width: 100%
         .oe_add
             float: left
-            width: 24px
-            height: 24px
             position: relative
-            z-index: 10
+            width: 100%
             left: +2px
             top: +7px
-            overflow: hidden
             button
-                position: absolute
-                bottom: +0px
-                left: +0px
+                display: inline
                 height: 24px
+                font-size: 12px
+                line-height: 12px
+                vertical-align: middle
+            button.oe_attach
                 width: 24px
-                margin: 0px
-                padding: 0px
+                overflow: hidden
+                width: 24px
+                overflow: hidden
+                background: transparent 
+                color: #7C7BAD
+                box-shadow: none
+                border: none
+                text-shadow: none
+                .oe_e
+                    position: relative
+                    top: -1px
+                    left: -9px
             input.oe_form_binary_file
-                width: 300px
-                left: -100px
-                top: 1px
-                height: 24px
-                width: 300px
-                background: transparent
-                border: 0
-                margin: 0px
-                padding: 0px
-                color: transparent
-        button span
-            position: relative
-            bottom: +4px
-            font-size: 30px
+                display: inline-block
+                margin-left: -5px
+                height: 28px
+                width: 52px
+                margin-top: -26px
+            .oe_attach_label
+                color: #7C7BAD
+                margin-left: -3px
+        .oe_attachments
+            margin-bottom: 4px
+            margin-right: 0px
+            font-size: 12px
+            border-radius: 2px
+            border: solid 1px rgba(124,123,173,0.14)
+            .oe_attachment
+                padding: 2px
+                padding-left: 4px
+                padding-right: 4px
+                .oe_e
+                    font-size: 23px
+                    margin-top: -5px
+                .oe_e:hover
+                    text-decoration: none
+            .oe_attachment:nth-child(odd)
+                background:white
+            .oe_attachment:nth-child(even)
+                background: #F4F5FA
 
 // Kitten Mode {{{
 .kitten-mode-activated
diff --git a/addons/web/static/src/js/view_form.js b/addons/web/static/src/js/view_form.js
index 7b63fe13b67..7385f2bc2c0 100644
--- a/addons/web/static/src/js/view_form.js
+++ b/addons/web/static/src/js/view_form.js
@@ -4674,7 +4674,7 @@ instance.web.form.FieldBinary = instance.web.form.AbstractField.extend(instance.
         this.binary_value = false;
         this.useFileAPI = !!window.FileReader;
         if (!this.useFileAPI) {
-            this.fileupload_id = _.uniqueId('oe_fileupload');
+            this.fileupload_id = _.uniqueId('oe_attachmentupload');
             $(window).on(this.fileupload_id, function() {
                 var args = [].slice.call(arguments).slice(1);
                 self.on_file_uploaded.apply(self, args);
@@ -4906,12 +4906,12 @@ instance.web.form.FieldOne2ManyBinaryMultiFiles = instance.web.form.AbstractFiel
     render_value: function () {
         var render = $(instance.web.qweb.render('FieldBinaryFileUploader.files', {'widget': this}));
         render.on('click', '.oe_delete', _.bind(this.on_file_delete, this));
-        this.$('.oe_placeholder_files, .oe_files').replaceWith( render );
+        this.$('.oe_placeholder_files, .oe_attachments').replaceWith( render );
 
         // reinit input type file
         var $input = this.$('input.oe_form_binary_file');
         $input.after($input.clone(true)).remove();
-        this.$(".oe_fileuploader").show();
+        this.$(".oe_fileupload").show();
     },
     on_file_change: function (event) {
         event.stopPropagation();
@@ -4945,7 +4945,7 @@ instance.web.form.FieldOne2ManyBinaryMultiFiles = instance.web.form.AbstractFiel
 
             // submit file
             this.$('form.oe_form_binary_form').submit();
-            this.$(".oe_fileuploader").hide();
+            this.$(".oe_fileupload").hide();
 
             // add file on result
             files.push({
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index 31d7d2afd21..3eb8ff1acc7 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -1175,9 +1175,9 @@
     </div>
 </t>
 <t t-name="FieldBinaryFileUploader.files">
-    <div class="oe_files">
+    <div class="oe_attachments">
         <t t-if="!widget.get('effective_readonly')" t-foreach="widget.get('value')" t-as="file">
-            <div>
+            <div class="oe_attachment">
                 <span t-if="(file.upload or file.percent_loaded&lt;100)" t-attf-title="{(file.name || file.filename) + (file.date?' \n('+file.date+')':'' )}" t-attf-name="{file.name || file.filename}">
                     <span class="oe_fileuploader_in_process">...Upload in progress...</span>
                     <t t-raw="file.name || file.filename"/>
@@ -1186,7 +1186,7 @@
                     <t t-raw="file.name || file.filename"/>
                 </a>
                 <t t-if="(!file.upload or file.percent_loaded&gt;=100)">
-                    <a class="oe_delete" title="Delete this file" t-attf-data-id="{file.id}">x</a>
+                    <a class="oe_right oe_delete oe_e" title="Delete this file" t-attf-data-id="{file.id}">[</a>
                 </t>
             </div>
         </t>
@@ -1200,11 +1200,12 @@
     </div>
 </t>
 <t t-name="FieldBinaryFileUploader">
-    <div t-att-style="widget.node.attrs.style" t-attf-class="oe_fileuploader #{widget.node.attrs.class ? widget.node.attrs.class :''}">
+    <div t-att-style="widget.node.attrs.style" t-attf-class="oe_fileupload #{widget.node.attrs.class ? widget.node.attrs.class :''}">
         <div class="oe_placeholder_files"/>
         <div class="oe_add" t-if="!widget.get('effective_readonly')">
             <!-- uploader of file -->
-            <button><span class="oe_e">p</span></button>
+            <button class="oe_attach"><span class="oe_e">'</span></button> 
+            <span class='oe_attach_label'>File</span>
             <t t-call="HiddenInputFile">
                 <t t-set="fileupload_id" t-value="widget.fileupload_id"/>
                 <t t-set="fileupload_action">/web/binary/upload_attachment</t>