diff --git a/survey-frontend/src/SurveyNavigationComponent.tsx b/survey-frontend/src/SurveyNavigationComponent.tsx
index 13da45cf82680acf32c787dcc1a08c3ebe4c46b9..1bb5ec824bb0810c4b930d704610c6cb6a5bbe2c 100644
--- a/survey-frontend/src/SurveyNavigationComponent.tsx
+++ b/survey-frontend/src/SurveyNavigationComponent.tsx
@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from "react";
 import ProgressBar from './ProgressBar';
+import { Container, Row } from "react-bootstrap";
 
 
 function SurveyNavigationComponent({ surveyModel, endSurvey, saveSurvey, validatePage, children }) {
@@ -30,11 +31,11 @@ function SurveyNavigationComponent({ surveyModel, endSurvey, saveSurvey, validat
             <div className="navigation-block">
                 <div className="navigation-progress-container">
                     <div className="navigation-buttons-container">
-                        {(pageNo === surveyModel.visiblePages.length - 1) && renderButton('Complete', endSurvey)}
-                        {renderButton('Save', saveSurvey)}
-                        {(pageNo !== surveyModel.visiblePages.length - 1) && renderButton('Next Page', incrementPageNo)}
-                        {renderButton('Validate Page', validatePage)}
-                        {pageNo !== 0 && renderButton('Previous Page', decrementPageNo)}
+                        {(pageNo === surveyModel.visiblePages.length - 1) && renderButton('Complete Survey', endSurvey)}
+                        {renderButton('Save progress', saveSurvey)}
+                        {/* {(pageNo !== surveyModel.visiblePages.length - 1) && renderButton('Next Page', incrementPageNo)} */}
+                        {/* {renderButton('Validate Page', validatePage)} */}
+                        {/* {pageNo !== 0 && renderButton('Previous Page', decrementPageNo)} */}
                     </div>
                 </div>
             </div>
@@ -42,12 +43,19 @@ function SurveyNavigationComponent({ surveyModel, endSurvey, saveSurvey, validat
     };
 
     return (
-        <div>
-            <ProgressBar surveyModel={surveyModel} pageNoSetter={pageNoSetter} />
-            {renderExternalNavigation()}
-            {children}
-            {renderExternalNavigation()}
-        </div>
+        <Container>
+            <Row>
+                {renderExternalNavigation()}
+            </Row>
+            <Row>
+                <ProgressBar surveyModel={surveyModel} pageNoSetter={pageNoSetter} />
+                {children}
+            </Row>
+            <Row>
+                {renderExternalNavigation()}
+            </Row>
+
+        </Container>
     );
 }