diff --git a/dmp-admin/src/app/dataset-profile-form/section-form/section-form.component.ts b/dmp-admin/src/app/dataset-profile-form/section-form/section-form.component.ts
index efe3357dc..ffa4723ac 100644
--- a/dmp-admin/src/app/dataset-profile-form/section-form/section-form.component.ts
+++ b/dmp-admin/src/app/dataset-profile-form/section-form/section-form.component.ts
@@ -67,7 +67,7 @@ export class SectionFormComponent {
 
   DeleteFieldSet(index){
     this.dataModel.fieldSets.splice(index, 1);
-    (<FormArray>this.form.get("compositeFields")).removeAt(index);
+    (<FormArray>this.form.get("fieldSets")).removeAt(index);
   }
 
   keepPageSelectionValid(pagesJson: Array<any>) {
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.css b/dmp-frontend/src/app/form/dynamic-form.component.css
index c72073e18..b4fb96bb9 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.css
+++ b/dmp-frontend/src/app/form/dynamic-form.component.css
@@ -18,8 +18,13 @@
     min-width: 10%;
 }
 
-ng-sidebar-container {
+.ng-sidebar-container {
     overflow: inherit !important; 
+    position: fixed !important;
+    height: 100%;
+    min-height: 100%;
+    width: 100%;
+    min-width: 100%;
 }
 
 /* .ng-sidebar__content {
@@ -42,4 +47,13 @@ ng-sidebar-container {
   
     margin: 20px 0;
 
-  }
\ No newline at end of file
+  }
+
+  .full-width{
+      width:100%;
+  } 
+  
+  .full-height{
+      height:100%;
+  }
+
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.html b/dmp-frontend/src/app/form/dynamic-form.component.html
index 1b2a80ab0..f19765878 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.html
+++ b/dmp-frontend/src/app/form/dynamic-form.component.html
@@ -1,31 +1,46 @@
-<div class="ui-g dynamic-formc full-width full-height">
-	<mat-sidenav-container contentClass="scrollableContent">
-		<mat-sidenav mode="push" position="right" [(opened)]="visibleSidebar">
+<div class="full-width full-height">
+	<mat-sidenav-container class="ng-sidebar-container">
+		<!-- <mat-sidenav mode="push" position="right" [(opened)]="visibleSidebar">
 			<table-of-content class="toc-container full-height" [model]="datasetProfileDefinitionModel"></table-of-content>
-		</mat-sidenav>
+		</mat-sidenav> -->
 
-		<mat-sidenav-content class="ui-g">
-			<button mat-raised-button color="primary" style="margin: 15px;" (click)="toggleSidebar()" icon="fa-arrow-left">Table Of Contents</button>
+		<mat-sidenav-content>
+			<!-- <button mat-raised-button color="primary" style="margin: 15px;" (click)="toggleSidebar()" icon="fa-arrow-left">Table Of Contents</button> -->
 			<button mat-raised-button color="primary" *ngIf="datasetProfileDefinitionModel&&datasetProfileDefinitionModel.status != 1"
-			 style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;" (click)="save();">Save</button>
+			 style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;" type="submit">Save</button>
 			<button mat-raised-button color="primary" *ngIf="datasetProfileDefinitionModel&&datasetProfileDefinitionModel?.status != 1"
 			 style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;" (click)="submit();">Save and Finalize</button>
-			<div class="ui-g-12">
+			<div>
 				<div class="alignment-center">
 					<!-- <ngb-pagination *ngIf="pages" [collectionSize]="pages.length*10" [page]="currentPageIndex" (pageChange)="changePageIndex($event)" aria-label="Default pagination"></ngb-pagination> -->
 					<progress-bar *ngIf="form" [formGroup]="form"></progress-bar>
 				</div>
 			</div>
-			<div class="ui-g-12">
+			<div>
 				<!-- <progress-bar *ngIf="form" [formGroup]="form"></progress-bar> -->
 			</div>
 
-			<div class="col-md-12 form-body-container" id="form-container">
+			<div class="col-md-12" id="form-container">
 				<form *ngIf="form" novalidate [formGroup]="form" (ngSubmit)="onSubmit()">
-					<div *ngFor="let section of datasetProfileDefinitionModel.sections; let i = index;">
+					<mat-vertical-stepper [linear]="false">
+						<div *ngFor="let page of pages let z=index;">
+							<div *ngFor="let section of datasetProfileDefinitionModel.sections; let i = index;">
+								<div *ngIf="section.page == z">
+									<mat-step [stepControl]="section">
+										<df-section [section]="section" [form]="form.get('sections').get(''+i)" [path]="i+1" [pathName]="'sections.'+i"></df-section>
+										<ng-template matStepLabel>{{section.title}}</ng-template>
+										<div>
+											<button mat-button matStepperNext>Next</button>
+										</div>
+									</mat-step>
+								</div>
+							</div>
+						</div>
+					</mat-vertical-stepper>
+					<!-- <div *ngFor="let section of datasetProfileDefinitionModel.sections; let i = index;">
 						<df-section *ngIf='this.shouldDisplaySection(section)' [section]="section" [form]="form.get('sections').get(''+i)" [path]="i+1"
 						 [pathName]="'sections.'+i"></df-section>
-					</div>
+					</div> -->
 				</form>
 			</div>
 		</mat-sidenav-content>
diff --git a/dmp-frontend/src/app/form/dynamic-form.component.ts b/dmp-frontend/src/app/form/dynamic-form.component.ts
index 992491df3..2bc2340d7 100644
--- a/dmp-frontend/src/app/form/dynamic-form.component.ts
+++ b/dmp-frontend/src/app/form/dynamic-form.component.ts
@@ -93,7 +93,7 @@ export class DynamicFormComponent implements OnInit {
   submit() {
   }
   
-  save(){    
+  onSubmit(){    
     this.datasetWizardService.saveDataset(this.datasetId, this.form.value).subscribe(data => {
       this.router.navigateByUrl("/datasets");
     });