diff --git a/.gitignore b/.gitignore
index 6d9a540c..4168fb3d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -145,4 +145,4 @@ dmypy.json
 
 #custom file everyone has
 Miniconda3*.sh
-Miniconda3*.exe
+Miniconda3*.exe
\ No newline at end of file
diff --git a/ui/runs/static/runs/runs.js b/ui/runs/static/runs/runs.js
index 4944769e..51d0df34 100644
--- a/ui/runs/static/runs/runs.js
+++ b/ui/runs/static/runs/runs.js
@@ -34,6 +34,14 @@ $(document).ready(function () {
     });
 
 
+    // control calculate buttons in footer
+    $('#calculate_parameters_submit_form_plot').click(function() {
+        $("#calc_form_plot").submit();
+    });
+    $('#calculate_parameters_submit_form').click(function() {
+        $("#calc_form_method").submit();
+    });
+
     // calculate button spinner
     $('.calculateSpinner').on('click', function() {        
         // Change button content to show 'Calculating...' with a spinner
diff --git a/ui/runs/static/runs/style.css b/ui/runs/static/runs/style.css
index 63d66a0b..ff1335d8 100644
--- a/ui/runs/static/runs/style.css
+++ b/ui/runs/static/runs/style.css
@@ -16,6 +16,7 @@ html, body {
 #content {
     order: 1;
     padding: 20px;
+    padding-bottom: 0px;
     flex-grow: 1;
 }
 
@@ -28,7 +29,7 @@ html, body {
     order: 2;
     flex-basis: 300px;
     max-width: 400px;
-    min-height: 100vh;
+    min-height: calc(100vh - 60px);
     flex-grow: 1;
     transition: 100ms;
 }
@@ -75,3 +76,16 @@ html, body {
 #gsea_enrichment_plot_img {
     width: 800px;
 }
+
+.header {
+    position: sticky;
+    top: 80px;
+}
+
+.footer {
+    position: sticky;
+    bottom: 0;
+    padding: 10px 8%;
+    margin-top: 10px;
+    background-color: rgb(255, 255, 255);
+}
\ No newline at end of file
diff --git a/ui/runs/templates/runs/details.html b/ui/runs/templates/runs/details.html
index 70b76bf6..3f945952 100644
--- a/ui/runs/templates/runs/details.html
+++ b/ui/runs/templates/runs/details.html
@@ -40,8 +40,6 @@
             </div>
 
             <div id="main-content">
-                
-                
                 {# show history #}
                 {% if displayed_history %}
                     <div class="row d-flex justify-content-between align-items-center">
@@ -126,7 +124,7 @@ <h3>{{ display_name }}</h3>
                         {# if there are plot parameters, display method and plot parameters next to each other #}
                         {% if plot_form %}
                             <div class="col">
-                                <form action="{% url 'runs:detail' run_name %}" id="calc_form" method="post"
+                                <form action="{% url 'runs:detail' run_name %}" id="calc_form_plot" method="post"
                                       enctype="multipart/form-data">
                                     {% csrf_token %}
                                     <div class="mb-1">
@@ -140,10 +138,6 @@ <h3>{{ display_name }}</h3>
                                             </div>
                                         {% endfor %}
                                     </div>
-                                    <button type="submit" id="calculate_parameters_submit"
-                                           class="btn btn-red calculateSpinner">
-                                           Calculate
-                                    </button>
                                 </form>
                             </div>
                             <div class="col">
@@ -161,7 +155,7 @@ <h3>{{ display_name }}</h3>
                         {% else %}
                             <div class="col-7">
                                 {% if step != "plot" %}
-                                    <form action="{% url 'runs:detail' run_name %}" method="post"
+                                    <form action="{% url 'runs:detail' run_name %}" id="calc_form_method" method="post"
                                           enctype="multipart/form-data">
                                         {% csrf_token %}
                                         <div class="mb-2">
@@ -176,10 +170,6 @@ <h3>{{ display_name }}</h3>
                                             {% endfor %}
                                         </div>
                                         <div class="form-group">
-                                            <button type="submit" id="calculate_parameters_submit"
-                                                   class="btn btn-red mr-auto calculateSpinner">
-                                                Calculate
-                                            </button>
                                             {% if section == "data_preprocessing" %}
                                                 <a href="{% url 'runs:plot' run_name %}" id="plot_parameters_submit" class="btn btn-grey {% if not show_plot_button %} disabled {% endif %}">Plot</a>
                                             {% endif %}
@@ -247,45 +237,68 @@ <h3>{{ display_name }}</h3>
                             </form>
                         {% endif %}
                     </div>
-                    <div class="col">
-                        {# navigation between steps #}
+                    
+                </div>
+            </div>
+
+            <div class="footer border-top pt-3">
+                <div class="row align-items-center">
+                    <div class="d-flex col-auto flex-column justify-content-end">
+            
+                        {% if plot_form %}
+                            <button type="submit" id="calculate_parameters_submit_form_plot"
+                                class="btn btn-red calculateSpinner mr-auto">
+                                Calculate
+                            </button>
+                        {% else %}
+                            <button type="submit" id="calculate_parameters_submit_form"
+                                class="btn btn-red mr-auto calculateSpinner">
+                                Calculate
+                            </button>
+                        {% endif %}
+                    </div>
+
+                    <div class="justify-content-end d-flex col flex-column">
                         <div class="justify-content-end d-flex">
-                            {% if results_exist %}
-                                <div class="col-5 mb-2">
-                                    <div class="form-group mb-0">
-                                        {{ name_field }}
-                                    </div>
+                        {% if results_exist %}
+                            <div class="col-5 mb-2">
+                                <div class="form-group mb-0">
+                                    {{ name_field }}
                                 </div>
-                            {% endif %}
+                            </div>
+                        {% endif %}
                         </div>
-                        <div class="justify-content-end d-flex">
-                            <form action="{% url 'runs:next' run_name %}" method="post" id="runs_next">
-                                {% csrf_token %}
-                                <div class="form-group">
-                                    {% if show_back %}
-                                        <a href="{% url 'runs:back' run_name %}" id = "backButton" class="btn btn-grey mr-auto">Back</a>
-                                        <div class="modal fade" id="calculationInProgressModal" tabindex="-1" role="dialog" aria-labelledby="calculationInProgressModalLabel" aria-hidden="true" style="display: none;" >
-                                            <div class="modal-dialog" role="document">
-                                                <div class="modal-content">
-                                                    <div class="modal-header">
-                                                        <h5 class="modal-title" id="calculationInProgressModalLabel">Do you want back?</h5>
+                        <div class="col">
+                            {# navigation between steps #}
+                            <div class="justify-content-end d-flex">
+                                <form action="{% url 'runs:next' run_name %}" method="post" id="runs_next">
+                                    {% csrf_token %}
+                                    <div class="form-group">
+                                        {% if show_back %}
+                                            <a href="{% url 'runs:back' run_name %}" id = "backButton" class="btn btn-grey mr-auto">Back</a>
+                                            <div class="modal fade" id="calculationInProgressModal" tabindex="-1" role="dialog" aria-labelledby="calculationInProgressModalLabel" aria-hidden="true" style="display: none;" >
+                                                <div class="modal-dialog" role="document">
+                                                    <div class="modal-content">
+                                                        <div class="modal-header">
+                                                            <h5 class="modal-title" id="calculationInProgressModalLabel">Do you want back?</h5>
+                                                        </div>
+                                                        <div class="modal-body">
+                                                            Going a step back during calculation may lead to unforseen behavior and loss in data.
+                                                            Do you want to proceed?
+                                                            <hr>
+                                                            <a href="{% url 'runs:back' run_name %}" id = "backButton" class="btn btn-red mr-auto">Back</a>
+                                                            <button id= "cancel" type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                                                     </div>
-                                                    <div class="modal-body">
-                                                        Going a step back during calculation may lead to unforseen behavior and loss in data.
-                                                        Do you want to proceed?
-                                                        <hr>
-                                                        <a href="{% url 'runs:back' run_name %}" id = "backButton" class="btn btn-red mr-auto">Back</a>
-                                                        <button id= "cancel" type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                                                 </div>
                                             </div>
                                         </div>
+                                        {% endif %}
+                                        {% if not last_step %}
+                                          <button class="btn btn-red" {% if not results_exist %} disabled {% endif %} >Next</button>
+                                        {% endif %}
                                     </div>
-                                    {% endif %}
-                                    {% if not last_step %}
-                                        <button class="btn btn-red" {% if not results_exist %} disabled {% endif %} >Next</button>
-                                    {% endif %}
-                                </div>
-                            </form>
+                                </form>
+                            </div>
                         </div>
                     </div>
                 </div>