diff --git a/gui/index.html b/gui/index.html
index a7a547cb6..5cfbe1397 100644
--- a/gui/index.html
+++ b/gui/index.html
@@ -790,32 +790,34 @@
   <!-- Needed files modal -->
 
   <modal id="needed" large="yes" status="info" icon="cloud-download" close="yes" title="Out of Sync Items">
+    <div class="progress">
+      <div class="progress-bar progress-bar-success" style="width: 20%"><span translate class="show">Reused</span></div>
+      <div class="progress-bar" style="width: 20%"><span translate class="show">Copied from original</span></div>
+      <div class="progress-bar progress-bar-info" style="width: 20%"><span translate class="show">Copied from elsewhere</span></div>
+      <div class="progress-bar progress-bar-warning" style="width: 20%"><span translate class="show">Downloaded</span></div>
+      <div class="progress-bar progress-bar-danger progress-bar-striped active" style="width: 20%"><span translate class="show">Downloading</span></div>
+    </div>
+
+    <hr/>
+
     <table class="table table-striped table-condensed">
       <tr ng-repeat="f in needed" ng-init="a = needAction(f)">
         <td class="small-data"><span class="glyphicon glyphicon-{{needIcons[a]}}"></span> {{needActions[a]}}</td>
         <td title="{{f.Name}}">{{f.Name | basename}}</td>
         <td>
           <span ng-if="a == 'sync' && progress[neededFolder] && progress[neededFolder][f.Name]">
-            <div class="progress progress-striped active">
+            <div class="progress">
               <div class="progress-bar progress-bar-success" style="width: {{progress[neededFolder][f.Name].Reused}}%"></div>
               <div class="progress-bar" style="width: {{progress[neededFolder][f.Name].CopiedFromOrigin}}%"></div>
               <div class="progress-bar progress-bar-info" style="width: {{progress[neededFolder][f.Name].CopiedFromElsewhere}}%"></div>
               <div class="progress-bar progress-bar-warning" style="width: {{progress[neededFolder][f.Name].Pulled}}%"></div>
-              <div class="progress-bar progress-bar-danger" style="width: {{progress[neededFolder][f.Name].Pulling}}%"></div>
+              <div class="progress-bar progress-bar-danger progress-bar-striped active" style="width: {{progress[neededFolder][f.Name].Pulling}}%"></div>
               <span class="show frontal">{{progress[neededFolder][f.Name].BytesDone | binary}}B / {{progress[neededFolder][f.Name].BytesTotal | binary}}B</span>
             </div>
           </span>
         </td>
       </tr>
     </table>
-    <span translate>Legend:</span>
-    <div class="progress progress-striped active">
-      <div class="progress-bar progress-bar-success" style="width: 20%"><span translate class="show">Reused</span></div>
-      <div class="progress-bar" style="width: 20%"><span translate class="show">Copied from original</span></div>
-      <div class="progress-bar progress-bar-info" style="width: 20%"><span translate class="show">Copied from elsewhere</span></div>
-      <div class="progress-bar progress-bar-warning" style="width: 20%"><span translate class="show">Downloaded</span></div>
-      <div class="progress-bar progress-bar-danger" style="width: 20%"><span translate class="show">Downloading</span></div>
-    </div>
 
   </modal>