diff --git a/src/app/components/network-legend/network-legend.component.scss b/src/app/components/network-legend/network-legend.component.scss
index eb49be2ba991695249608dafc912fd99e272d16b..931851e3aa7821c4dfcc3343f9e649502f0f2ea2 100644
--- a/src/app/components/network-legend/network-legend.component.scss
+++ b/src/app/components/network-legend/network-legend.component.scss
@@ -3,7 +3,7 @@
 
 div.legend {
   position: absolute;
-  bottom: $network-footer-height;
+  bottom: 0;
   &.right {
     right: 0;
   }
diff --git a/src/app/pages/explorer-page/explorer-page.component.html b/src/app/pages/explorer-page/explorer-page.component.html
index cb401dbd97eb6099b23c2bb35c73316b834d63f5..e1d315852cf1dcf468871b5917612ca4602a137e 100644
--- a/src/app/pages/explorer-page/explorer-page.component.html
+++ b/src/app/pages/explorer-page/explorer-page.component.html
@@ -103,11 +103,6 @@
 
       <div class="card network">
 
-        <div *ngIf="myConfig.showLegend">
-          <app-network-legend [config]="myConfig"></app-network-legend>
-        </div>
-
-
         <header class="card-header">
           <p class="card-header-title">
             Protein-Protein Interaction Network
@@ -115,6 +110,9 @@
         </header>
         <div class="card-content fullheight">
           <div class="card-image" id="canvas-content">
+            <div *ngIf="myConfig.showLegend">
+              <app-network-legend [config]="myConfig"></app-network-legend>
+            </div>
             <div class="parent fullheight">
               <div class="center image1 fullheight" #network>
                 <button class="button is-loading center" alt="loading...">Loading</button>