diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/animations/animations.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/animations/animations.ts
index c65851e63..4542d8b4a 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/animations/animations.ts
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/animations/animations.ts
@@ -78,6 +78,13 @@ export const GENERAL_ANIMATIONS = [
     trigger('action-btn',[
         transition(":enter", [style({opacity:0, transform:'scale(0)'}), animate('400ms ease', style({'opacity':1, transform:'scale(1)'}))]),
         transition(":leave", [style({opacity:1,transform:'scale(1)'}), animate('400ms ease', style({'opacity':0, transform:'scale(0)'}))])
-    ])
+    ]),
+    trigger('fade-in',[
+        transition(":enter", [style({opacity:0}), animate('1000ms 800ms ease', style({'opacity':1}))]),
+    ]),
+    trigger('fade-in-fast',[
+        transition(":enter", [style({opacity:0}), animate('1000ms 200ms ease', style({'opacity':1}))]),
+    ]),
+
     
 ]
\ No newline at end of file
diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html
index 4c63edc38..9ddfe63e7 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html
@@ -76,7 +76,7 @@
 			</mat-form-field>
 		</div>
 	</div>
-	<div style="position: relative;" class="col-12" *ngIf="hasFocus">
+	<div style="position: relative;" class="col-12" *ngIf="hasFocus" [@fade-in]>
 		<div class="row" *ngIf="showDescription">
 			<mat-form-field class="col p-0 underline-line-field" appearance="legacy">
 				<input matInput type="text" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.DESCRIPTION' | translate}}"
@@ -117,7 +117,7 @@
 	<div class="row">
 
 		<!-- FIELDS -->
-		<div class="col-12" *ngIf="hasFocus">
+		<div class="col-12" *ngIf="hasFocus" [@fade-in] >
 
 			<ng-container *ngFor="let field of form.get('fields')['controls']; let i=index" >
 				<div class="row bg-white" style="position: relative;" (click)="setTargetField(field)"
@@ -173,7 +173,7 @@
 
 		<div class="col-12 previewer">
 			<div *ngIf="hasFocus" class="d-flex mb-3" style="justify-content: space-between;">
-				<span style="font-weight: bold; font-style: italic;">{{'DATASET-PROFILE-EDITOR.ACTIONS.FIELD.PREVIEW' | translate}}</span>
+				<span class="previewer-text">{{'DATASET-PROFILE-EDITOR.ACTIONS.FIELD.PREVIEW' | translate}}</span>
 				<span [@fadeElement]="updatedClass" *ngIf="firstField?.get('viewStyle').get('renderStyle').value">
 					<ng-container *ngIf="!previewDirty">
 						{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.STATUS.PREVIEW-UPDATED' | translate}}
@@ -184,7 +184,7 @@
 				</span>
 			</div>
 			<div  [id]="'preview_container'+ form.get('id').value" class="w-100" style="margin-right: -15px; margin-left: -15px;" >
-				<div *ngIf="previewForm && showPreview && firstField?.get('viewStyle').get('renderStyle').value">
+				<div *ngIf="previewForm && showPreview && firstField?.get('viewStyle').get('renderStyle').value" [@fade-in-fast]>
 					<app-form-section-inner  [form]="previewForm">
 					</app-form-section-inner>
 				</div>
diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.scss b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.scss
index bae52298c..9b73377a3 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.scss
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.scss
@@ -129,6 +129,11 @@ $blue-color-light: #5cf7f2;
     padding-bottom: 0px;
 }
 
+.previewer-text{
+    font-weight: bold;
+    font-style: italic;
+}
+
 // ::ng-deep .underline-line-field .mat-form-field-appearance-legacy .mat-form-field-wapper{
 //     padding-bottom: 1.25em !important;
 // }
\ No newline at end of file
diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.html
index 4f8382bc4..38426a3d6 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.html
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.html
@@ -1,5 +1,5 @@
 <div id="topofcontainer"></div>
-<div class="row" [id]="idprefix+form.get('id').value" *ngIf="form">
+<div class="row" [id]="idprefix+form.get('id').value" *ngIf="form" [@fade-in-fast]>
 
 
     <div class="col-12" >
diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts
index 8fc445bec..0fd24684a 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts
@@ -9,11 +9,13 @@ import { debounceTime, delay, tap } from 'rxjs/operators';
 import { FieldEditorModel } from '../../../admin/field-editor-model';
 import { FieldSetEditorModel } from '../../../admin/field-set-editor-model';
 import { ToCEntry, ToCEntryType } from '../../../table-of-contents/table-of-contents-entry';
+import { GENERAL_ANIMATIONS } from '../../animations/animations';
 
 @Component({
 	selector: 'app-dataset-profile-editor-section-fieldset-component',
 	templateUrl: './dataset-profile-editor-section-fieldset.component.html',
-	styleUrls: ['./dataset-profile-editor-section-fieldset.component.scss']
+	styleUrls: ['./dataset-profile-editor-section-fieldset.component.scss'],
+	animations:[GENERAL_ANIMATIONS]
 })
 
 export class DatasetProfileEditorSectionFieldSetComponent implements OnInit, OnChanges, OnDestroy {
@@ -144,7 +146,8 @@ export class DatasetProfileEditorSectionFieldSetComponent implements OnInit, OnC
 			this.numbering = this.tocentry.numbering;
 			this._selectedFieldSetId = null;
 
-			this.scroller.next(null);
+			// this.scroller.next(null);
+			this._scrollOnTop(true);
 		}else if(this.tocentry.type === ToCEntryType.FieldSet){
 			this.form = this.tocentry.form.parent.parent;
 			const numberingArray = this.tocentry.numbering.split('.');
@@ -170,10 +173,14 @@ export class DatasetProfileEditorSectionFieldSetComponent implements OnInit, OnC
 			el.scrollIntoView({behavior: "smooth", block:'start'});
 		}
 	}
-	private _scrollOnTop(){
+	private _scrollOnTop(instant?: boolean){
 		const el = this.myElement.nativeElement.querySelector('#topofcontainer');
 		if(el){
-			el.scrollIntoView({behavior:'smooth', block:'end'});
+			if(instant){
+				el.scrollIntoView({ block:'end'});
+			}else{
+				el.scrollIntoView({behavior:'smooth', block:'end'});
+			}
 		}
 	}
 	ngOnInit() {
diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html
index f752d8b63..efba00df8 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html
@@ -276,7 +276,7 @@
 							<div class="row" *ngIf="selectedTocEntry">
 
 								<!-- PAGE INFO -->
-								<div class="col-12 content-displayer" *ngIf="selectedTocEntry.type === tocEntryEnumValues.Page">
+								<div class="col-12 content-displayer" *ngIf="selectedTocEntry.type === tocEntryEnumValues.Page" [@fade-in-fast]>
 									<form [formGroup]="selectedTocEntry.form" class="page-infos">
 										<div class="row">
 											<!-- PAGE NAME -->
@@ -388,11 +388,10 @@
 		</mat-horizontal-stepper>
 
 
-
+<!-- 
 		<ng-container *ngIf="false">
 
 			<div class="d-flex">
-				<!-- SAVE BUTTON -->
 				<div class="col-6 d-flex" *ngIf="!viewOnly">
 					<div class="row mt-4">
 						<ng-container *ngIf="false">
@@ -411,7 +410,6 @@
 							translate}}</button>
 					</div>
 				</div>
-				<!-- SAVE BUTTON  WHEN FINALIZED-->
 				<div class="col-6 d-flex" *ngIf="showUpdateButton()">
 					<div class="row mt-4">
 						<ng-container *ngIf="false">
@@ -424,7 +422,6 @@
 							translate}}</button>
 					</div>
 				</div>
-				<!-- DELETE BUTTON -->
 				<div class="col-6 d-flex justify-content-end" *ngIf="!isNew">
 					<div class="row mt-4">
 						<button mat-raised-button color="primary" (click)="delete()">
@@ -434,7 +431,7 @@
 				</div>
 			</div>
 
-		</ng-container>
+		</ng-container> -->
 
 		<div class="scroll-on-top">
 			<button mat-fab (click)="scrollOnTop()" *ngIf="showScrollOnTopButton" [@scroll-on-top-btn] [matTooltip]="'DATASET-PROFILE-EDITOR.ACTIONS.BACK-TO-TOP'| translate">