diff --git a/modules/backend/assets/css/october.css b/modules/backend/assets/css/october.css
index 238b77d4e..fc228c49a 100644
--- a/modules/backend/assets/css/october.css
+++ b/modules/backend/assets/css/october.css
@@ -818,7 +818,7 @@
   color: #666666;
   font-size: 12px;
   text-align: center;
-  font-weight: 400;
+  font-weight: normal;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
@@ -828,7 +828,7 @@
   margin: 0;
 }
 .control-filelist ul li {
-  font-weight: 300;
+  font-weight: normal;
   line-height: 150%;
   position: relative;
   list-style: none;
@@ -852,7 +852,7 @@
 }
 .control-filelist ul li a {
   display: block;
-  padding: 10px 40px 10px 20px;
+  padding: 10px 45px 10px 20px;
   outline: none;
 }
 .control-filelist ul li a:hover,
@@ -864,26 +864,29 @@
   display: block;
 }
 .control-filelist ul li a span.title {
-  font-weight: 500;
+  font-weight: normal;
   color: #405261;
-  font-size: 12px;
+  font-size: 14px;
 }
 .control-filelist ul li a span.description {
   color: #8f8f8f;
-  font-size: 12px;
-  font-weight: 500;
+  font-size: 13px;
+  white-space: nowrap;
+  font-weight: normal;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 .control-filelist ul li a span.description strong {
   color: #405261;
-  font-weight: 500;
+  font-weight: normal;
 }
 .control-filelist ul li.group > h4,
 .control-filelist ul li.group > div.group > h4 {
-  font-weight: 500;
-  font-size: 12px;
+  font-weight: normal;
+  font-size: 14px;
   margin-top: 0;
   margin-bottom: 0;
-  display: relative;
+  position: relative;
 }
 .control-filelist ul li.group > h4 a,
 .control-filelist ul li.group > div.group > h4 a {
@@ -908,7 +911,8 @@
 }
 .control-filelist ul li.group > h4 a:after,
 .control-filelist ul li.group > div.group > h4 a:after {
-  left: 34px;
+  left: 33px;
+  top: 9px;
   font-family: FontAwesome;
   font-weight: normal;
   font-style: normal;
@@ -917,8 +921,7 @@
   *margin-right: .3em;
   content: "\f07b";
   color: #a1aab1;
-  font-size: 14px;
-  top: 9px;
+  font-size: 16px;
 }
 .control-filelist ul li.group > h4 a:before,
 .control-filelist ul li.group > div.group > h4 a:before {
@@ -1043,8 +1046,8 @@
 }
 .control-filelist ul li .checkbox {
   position: absolute;
-  top: 13px;
-  right: 17px;
+  top: -3px;
+  right: 3px;
 }
 .control-filelist ul li .checkbox label {
   margin-right: 0;
@@ -1067,8 +1070,8 @@
   border-bottom: 1px solid #ecf0f1;
 }
 .control-filelist.hero ul li > a span.title {
-  font-size: 13px;
-  font-weight: 600;
+  font-size: 15px;
+  font-weight: normal;
   color: #2b3e50;
 }
 .control-filelist.hero ul li > a .list-icon {
@@ -1179,7 +1182,7 @@
   color: #2b3e50;
   font-size: 15px;
   margin: 0;
-  font-weight: 600;
+  font-weight: bold;
   padding: 0;
 }
 .control-filelist.hero ul > li.group > ul > li > a {
@@ -2864,6 +2867,9 @@ body {
 .layout > .layout-row > .layout-cell.width-300 {
   width: 300px;
 }
+.layout > .layout-row > .layout-cell.width-350 {
+  width: 350px;
+}
 .layout > .layout-row > .layout-cell.layout-container,
 .layout > .layout-row > .layout-cell .layout-container,
 .layout > .layout-row > .layout-cell.padded-container,
@@ -2912,6 +2918,9 @@ body {
 .layout > .layout-row > .layout-cell.width-300 {
   width: 300px;
 }
+.layout > .layout-row > .layout-cell.width-350 {
+  width: 350px;
+}
 .layout > .layout-row > .layout-cell.layout-container,
 .layout > .layout-row > .layout-cell .layout-container,
 .layout > .layout-row > .layout-cell.padded-container,
@@ -2968,6 +2977,9 @@ body {
 .layout > .layout-cell.width-300 {
   width: 300px;
 }
+.layout > .layout-cell.width-350 {
+  width: 350px;
+}
 .layout > .layout-cell.layout-container,
 .layout > .layout-cell .layout-container,
 .layout > .layout-cell.padded-container,
@@ -3707,7 +3719,7 @@ body.display-side-panel #layout-side-panel {
   display: block;
   position: absolute;
   z-index: 500;
-  width: 300px;
+  width: 350px;
   -webkit-box-shadow: 2px 0px 2px 0 rgba(0, 0, 0, 0.3);
   box-shadow: 2px 0px 2px 0 rgba(0, 0, 0, 0.3);
 }
@@ -4472,6 +4484,7 @@ html.csstransitions body.outer.preload .outer-form-container {
   display: none;
 }
 .fancy-layout .form-tabless-fields.collapsed .form-buttons {
+  margin-left: 10px;
   padding-bottom: 0;
 }
 .fancy-layout .form-tabless-fields .loading-indicator-container .loading-indicator {
@@ -4490,16 +4503,17 @@ html.csstransitions body.outer.preload .outer-form-container {
 .fancy-layout .form-buttons {
   -webkit-transition: all 0.5s;
   transition: all 0.5s;
-  padding-top: 2px;
+  padding-top: 11px;
   padding-bottom: 5px;
+}
+.fancy-layout .form-buttons .btn {
+  padding: 0;
+  margin-right: 5px;
   margin-top: -6px;
-}
-.fancy-layout .form-buttons .btn {
-  margin-left: -11px;
+  margin-right: 30px;
   background-color: transparent;
-}
-.fancy-layout .form-buttons .btn {
   color: #ffffff;
+  font-weight: normal;
   opacity: 0.5;
   filter: alpha(opacity=50);
   -webkit-transition: all 0.3s ease;
@@ -4509,6 +4523,9 @@ html.csstransitions body.outer.preload .outer-form-container {
   opacity: 1;
   filter: alpha(opacity=100);
 }
+.fancy-layout .form-buttons .btn:last-child {
+  margin-right: 0;
+}
 .fancy-layout form.oc-data-changed .btn.save {
   opacity: 1;
   filter: alpha(opacity=100);
diff --git a/modules/backend/assets/less/controls/filelist.less b/modules/backend/assets/less/controls/filelist.less
index 824748caa..f19527210 100644
--- a/modules/backend/assets/less/controls/filelist.less
+++ b/modules/backend/assets/less/controls/filelist.less
@@ -23,7 +23,7 @@
         color: @color-filelist-norecords-text;
         font-size: 12px;
         text-align: center;
-        font-weight: 400;
+        font-weight: normal;
         .border-radius(@border-radius-base);
     }
 
@@ -32,7 +32,7 @@
         margin: 0;
 
         li {
-            font-weight: 300;
+            font-weight: normal;
             line-height: 150%;
             position: relative;
             list-style: none;
@@ -58,7 +58,7 @@
 
             a {
                 display: block;
-                padding: 10px 40px 10px 20px;
+                padding: 10px 45px 10px 20px;
                 outline: none;
 
                 &:hover, &:focus, &:active {text-decoration: none;}
@@ -67,19 +67,22 @@
                     display: block;
 
                     &.title {
-                        font-weight: 500;
+                        font-weight: normal;
                         color: @color-text-title;
-                        font-size: 12px;
+                        font-size: 14px;
                     }
 
                     &.description {
                         color: @color-text-description;
-                        font-size: 12px;
-                        font-weight: 500;
+                        font-size: 13px;
+                        white-space: nowrap;
+                        font-weight: normal;
+                        overflow: hidden;
+                        text-overflow: ellipsis;
 
                         strong {
                             color: @color-text-title;
-                            font-weight: 500;
+                            font-weight: normal;
                         }
                     }
                 }
@@ -87,11 +90,11 @@
 
             &.group {
                 > h4, > div.group > h4 {
-                    font-weight: 500;
-                    font-size: 12px;
+                    font-weight: normal;
+                    font-size: 14px;
                     margin-top: 0;
                     margin-bottom: 0;
-                    display: relative;
+                    position: relative;
 
                     a {
                         padding: 10px 20px 10px 53px;
@@ -110,11 +113,11 @@
                         }
 
                         &:after {
-                            left: 34px;
+                            left: 33px;
+                            top: 9px;
                             .icon(@folder);
                             color: @color-list-icon;
-                            font-size: 14px;
-                            top: 9px;
+                            font-size: 16px;
                         }
 
                         &:before {
@@ -205,8 +208,8 @@
 
             .checkbox {
                 position: absolute;
-                top: 13px;
-                right: 17px;
+                top: -3px;
+                right: 3px;
 
                 label {
                     margin-right: 0;
@@ -253,8 +256,8 @@
                     border-bottom: 1px solid @color-panel-light;
 
                     span.title {
-                        font-size: 13px;
-                        font-weight: 600;
+                        font-size: 15px;
+                        font-weight: normal;
                         color: @color-filelist-title-hero;
                     }
 
@@ -362,7 +365,7 @@
                         color: #2b3e50;
                         font-size: 15px;
                         margin: 0;
-                        font-weight: 600;
+                        font-weight: bold;
                         padding: 0;
                     }
                 }
diff --git a/modules/backend/assets/less/layout/fancylayout.less b/modules/backend/assets/less/layout/fancylayout.less
index 98a49abe2..209bf16fa 100644
--- a/modules/backend/assets/less/layout/fancylayout.less
+++ b/modules/backend/assets/less/layout/fancylayout.less
@@ -482,6 +482,7 @@
             }
 
             .form-buttons {
+                margin-left: 10px;
                 padding-bottom: 0;
             }
         }
@@ -505,25 +506,28 @@
 
     .form-buttons {
         .transition(all 0.5s);
-        padding-top: 2px;
+        padding-top: 11px;
         padding-bottom: 5px;
-        margin-top: -6px;
 
         .btn {
-            margin-left: -11px;
+            padding: 0;
+            margin-right: 5px;
+            margin-top: -6px;
+            margin-right: 30px;
             background-color: transparent;
-        }
-    }
-
-    .form-buttons {
-        .btn {
             color: @color-fancy-master-tabs-active-text;
+            font-weight: normal;
+
             .opacity(0.5);
             .transition(all 0.3s ease);
 
             &:hover {
                 .opacity(1);
             }
+
+            &:last-child {
+                margin-right: 0;
+            }
         }
     }
 
diff --git a/modules/backend/assets/less/layout/layout.less b/modules/backend/assets/less/layout/layout.less
index 365ed27cb..e214193ca 100644
--- a/modules/backend/assets/less/layout/layout.less
+++ b/modules/backend/assets/less/layout/layout.less
@@ -77,6 +77,7 @@ body {
         &.width-140 { width: 140px; }
         &.width-200 { width: 200px; }
         &.width-300 { width: 300px; }
+        &.width-350 { width: 350px; }
 
         &.layout-container, .layout-container, &.padded-container, .padded-container {
             padding: @padding-standard @padding-standard 0 @padding-standard;
diff --git a/modules/backend/assets/less/layout/sidepanel.less b/modules/backend/assets/less/layout/sidepanel.less
index f0fe8a8d4..b95be99c1 100644
--- a/modules/backend/assets/less/layout/sidepanel.less
+++ b/modules/backend/assets/less/layout/sidepanel.less
@@ -65,7 +65,7 @@ body.display-side-panel {
         display: block;
         position: absolute;
         z-index: 500;
-        width: 300px;
+        width: 350px;
         .box-shadow(2px 0px 2px 0 rgba(0, 0, 0, 0.3));
     }
 }
diff --git a/modules/backend/controllers/index/index.htm b/modules/backend/controllers/index/index.htm
index 59fc4d19f..41d1b0433 100644
--- a/modules/backend/controllers/index/index.htm
+++ b/modules/backend/controllers/index/index.htm
@@ -1,13 +1,12 @@
 <?= $this->makePartial('warnings') ?>
 
-<?= Form::open() ?>
-    <div id="dashReportContainer">
+<?= Form::open(['class'=>'layout-relative dashboard-container']) ?>
+    <div id="dashReportContainer" class="report-container loading">
 
         <!-- Loading -->
         <div class="loading-indicator-container">
             <div class="loading-indicator">
                 <span></span>
-                <div>Loading dashboard...</div>
             </div>
         </div>
 
@@ -16,6 +15,8 @@
 
 <script>
     $(document).ready(function() {
-        $.request('onInitReportContainer')
+        $.request('onInitReportContainer').done(function(){
+            $('#dashReportContainer').removeClass('loading')
+        })
     })
 </script>
\ No newline at end of file
diff --git a/modules/backend/layouts/default.htm b/modules/backend/layouts/default.htm
index 8c58d9eea..ae9aa3926 100644
--- a/modules/backend/layouts/default.htm
+++ b/modules/backend/layouts/default.htm
@@ -31,7 +31,7 @@
 
                         <!-- Side panel -->
                         <?php if ($sidePanelContent = Block::placeholder('sidepanel')): ?>
-                            <div class="layout-cell width-300 hide-on-small" id="layout-side-panel" data-control="layout-sidepanel">
+                            <div class="layout-cell width-350 hide-on-small" id="layout-side-panel" data-control="layout-sidepanel">
                                 <?= $sidePanelContent ?>
                             </div>
                         <?php endif ?>
diff --git a/modules/system/assets/ui/images/dashboard-loading-indicator.svg b/modules/system/assets/ui/images/dashboard-loading-indicator.svg
new file mode 100644
index 000000000..0a1715647
--- /dev/null
+++ b/modules/system/assets/ui/images/dashboard-loading-indicator.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="240px" height="240px" viewBox="0 0 240 240" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+    <title>dashboard-loading-indicator</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="Dashboard" sketch:type="MSLayerGroup">
+            <rect id="Rectangle-1" opacity="0.00874533582" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="240" height="240"></rect>
+            <path d="M39.4136706,179.221343 C57.6187466,203.95263 86.9353412,220 120,220 C175.228475,220 220,175.228475 220,120 C220,64.771525 175.228475,20 120,20 C79.2272481,20 44.1537628,44.4014613 28.5865512,79.3973768" id="Oval-2" stroke="#E8ECED" stroke-width="12" stroke-linecap="round" sketch:type="MSShapeGroup"></path>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/modules/system/assets/ui/images/october-leaf.svg b/modules/system/assets/ui/images/october-leaf.svg
new file mode 100644
index 000000000..6f4cfdbc3
--- /dev/null
+++ b/modules/system/assets/ui/images/october-leaf.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="49px" height="65px" viewBox="0 0 49 65" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+    <title>october-leaf</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <path id="path-1" d="M0,0.658 L48.736,0.658 L48.736,65 L0,65"></path>
+    </defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="logo" sketch:type="MSLayerGroup">
+            <mask id="mask-2" sketch:name="Clip 2" fill="white">
+                <use xlink:href="#path-1"></use>
+            </mask>
+            <g id="Clip-2"></g>
+            <path d="M48.6875,31.4795 C47.6665,15.0415 29.5165,0.8175 22.0395,0.6595 C14.5595,0.5005 0.5805,17.9095 0.0145,35.5975 C-0.5155,52.1825 13.8335,63.5555 20.0105,65.0005 C20.1825,57.1965 20.8155,28.4665 20.9215,25.1165 C21.1445,18.2705 21.4855,7.6195 22.6445,7.2645 C23.3095,7.0615 24.2155,13.0495 24.1045,16.5885 C24.0815,17.2635 24.0735,19.4515 24.0735,22.5545 C25.3245,21.2995 26.6305,19.9975 27.4245,19.2265 C29.6015,17.1175 30.5645,17.3685 29.5205,19.2505 C28.8775,20.4075 26.1125,24.2575 24.0795,27.0475 C24.0905,32.6745 24.1165,39.7565 24.1435,46.3565 C27.0145,43.0425 30.5295,39.0675 32.3755,37.2995 C36.2485,33.5965 36.6605,34.0645 34.8315,37.9515 C33.7085,40.3335 28.2165,46.6875 24.1635,51.6985 C24.1885,57.5535 24.2085,62.4765 24.2125,64.8275 C35.0855,62.4675 49.6865,47.6185 48.6875,31.4795" id="Fill-1" fill="#DB6A26" sketch:type="MSShapeGroup" mask="url(#mask-2)"></path>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/modules/system/assets/ui/less/dashboard.less b/modules/system/assets/ui/less/dashboard.less
new file mode 100644
index 000000000..711dbfb4e
--- /dev/null
+++ b/modules/system/assets/ui/less/dashboard.less
@@ -0,0 +1,46 @@
+.dashboard-container > .report-container {
+    &.loading {
+        position: absolute;
+        width: 100%;
+        height: 100%;
+
+        .loading-indicator-container {
+            position: absolute;
+            left: 0;
+            top: 0;
+            height: 100%;
+            width: 100%;
+
+            .loading-indicator {
+                padding: 0;
+                height: 150px;
+                top: 50%;
+                margin-top: -90px;
+
+                &:before {
+                    content: '';
+                    background: transparent url('images/october-leaf.svg') no-repeat;
+                    background-size: 49px 65px;
+                    width: 49px;
+                    height: 65px;
+                    left: 50%;
+                    top: 50%;
+                    margin-top: -33px;
+                    margin-left: -24px;
+                    position: absolute;
+                    .opacity(0.2);
+                }
+
+                > span {
+                    left: 50%;
+                    width: 200px;
+                    height: 200px;
+                    margin-left: -100px;
+                    margin-top: -100px;
+                    background-size: 200px 200px;
+                    background-image: url('images/dashboard-loading-indicator.svg');
+                }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/modules/system/assets/ui/storm.css b/modules/system/assets/ui/storm.css
index cd4fef412..a6fe881a0 100644
--- a/modules/system/assets/ui/storm.css
+++ b/modules/system/assets/ui/storm.css
@@ -1572,6 +1572,11 @@ div.scoreboard .control-chart ul li > i{margin-left:-18px}
 div.scoreboard .control-chart .canvas + ul{margin-left:0}
 div.scoreboard .scoreboard-offset{padding-left:20px}
 body.slim-container div.scoreboard{padding:0 25px}
+.dashboard-container > .report-container.loading{position:absolute;width:100%;height:100%}
+.dashboard-container > .report-container.loading .loading-indicator-container{position:absolute;left:0;top:0;height:100%;width:100%}
+.dashboard-container > .report-container.loading .loading-indicator-container .loading-indicator{padding:0;height:150px;top:50%;margin-top:-90px}
+.dashboard-container > .report-container.loading .loading-indicator-container .loading-indicator:before{content:'';background:transparent url('images/october-leaf.svg') no-repeat;background-size:49px 65px;width:49px;height:65px;left:50%;top:50%;margin-top:-33px;margin-left:-24px;position:absolute;opacity:0.2;filter:alpha(opacity=20)}
+.dashboard-container > .report-container.loading .loading-indicator-container .loading-indicator > span{left:50%;width:200px;height:200px;margin-left:-100px;margin-top:-100px;background-size:200px 200px;background-image:url('images/dashboard-loading-indicator.svg')}
 #layout-canvas .flash-message{display:none}
 .flash-message{position:fixed;width:500px;left:50%;top:13px;margin-left:-250px;color:#ffffff;font-size:13px;padding:10px 30px 10px 15px;z-index:10000;word-wrap:break-word;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}
 .flash-message.fade{opacity:0;filter:alpha(opacity=0);-webkit-transition:all 0.5s,width 0s;transition:all 0.5s,width 0s;-webkit-transform:scale(0.9);-ms-transform:scale(0.9);transform:scale(0.9)}
diff --git a/modules/system/assets/ui/storm.less b/modules/system/assets/ui/storm.less
index e897f0e51..e89316120 100644
--- a/modules/system/assets/ui/storm.less
+++ b/modules/system/assets/ui/storm.less
@@ -16,6 +16,7 @@
 @import "less/tab.less";
 @import "less/chart.less";
 @import "less/scoreboard.less";
+@import "less/dashboard.less";
 @import "less/flashmessage.less";
 @import "less/icon.less";
 @import "less/flag.less";