diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index 1f58be4bdf20800e020f586ce43fc0834a3b8354..1d3c71932a852b8e88a34d3084e94fb39e9a7440 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -14,6 +14,7 @@
 .prepend-left-10 { margin-left:10px }
 .prepend-left-default { margin-left:$gl-padding }
 .prepend-left-20 { margin-left:20px }
+.append-right-5 { margin-right: 5px }
 .append-right-10 { margin-right:10px }
 .append-right-20 { margin-right:20px }
 .append-bottom-10 { margin-bottom:10px }
diff --git a/app/helpers/icons_helper.rb b/app/helpers/icons_helper.rb
index 84c6d0883b0f5dc621dd413ec5e0f4caf4cb56e4..ab3ef454e1c26a0bfbb911487203140b511cec81 100644
--- a/app/helpers/icons_helper.rb
+++ b/app/helpers/icons_helper.rb
@@ -10,6 +10,15 @@ module IconsHelper
     options.include?(:base) ? fa_stacked_icon(names, options) : fa_icon(names, options)
   end
 
+  def audit_icon(names, options = {})
+    case names
+    when "standard"
+      names = "key"
+    end
+
+    options.include?(:base) ? fa_stacked_icon(names, options) : fa_icon(names, options)
+  end
+
   def spinner(text = nil, visible = false)
     css_class = 'loading'
     css_class << ' hide' unless visible
@@ -37,7 +46,7 @@ module IconsHelper
       else # Gitlab::VisibilityLevel::PUBLIC
         'globe'
       end
-      
+
     name << " fw" if fw
 
     icon(name)
diff --git a/app/views/profiles/_event_table.html.haml b/app/views/profiles/_event_table.html.haml
index 58af79716a75d4b1e014930a0a4165eeb48c58c1..879fc170f9232fa030f2f640dfd061e8b3738c3f 100644
--- a/app/views/profiles/_event_table.html.haml
+++ b/app/views/profiles/_event_table.html.haml
@@ -1,17 +1,15 @@
-.table-holder
-  %table.table#audits
-    %thead
-      %tr
-        %th Action
-        %th When
+%h5.prepend-top-0
+  History of authentications
+
+%ul.well-list
+  - events.each do |event|
+    %li
+      %span.description
+        = audit_icon(event.details[:with], class: "append-right-5")
+        Signed in with
+        = event.details[:with]
+        authentication
+      %span.pull-right
+        #{time_ago_in_words event.created_at} ago
 
-    %tbody
-      - events.each do |event|
-        %tr
-          %td
-            %span
-              Signed in with 
-              %b= event.details[:with]
-              authentication
-          %td #{time_ago_in_words event.created_at} ago
 = paginate events, theme: "gitlab"
diff --git a/app/views/profiles/audit_log.html.haml b/app/views/profiles/audit_log.html.haml
index 8f45f41cfe3c9b2204479dab917f020430966ddb..f630c03e5f6fb144801ac70d4274332f65642cd0 100644
--- a/app/views/profiles/audit_log.html.haml
+++ b/app/views/profiles/audit_log.html.haml
@@ -1,8 +1,11 @@
 - page_title "Audit Log"
 - header_title page_title, audit_log_profile_path
 
-.alert.alert-help.prepend-top-default
-  History of authentications
-
-.prepend-top-default
-= render 'event_table', events: @events
+.row.prepend-top-default
+  .col-lg-3.profile-settings-sidebar
+    %h3.prepend-top-0
+      = page_title
+    %p
+      This is a security log of important events involving your account.
+  .col-lg-9
+    = render 'event_table', events: @events