diff --git a/src/app/carto/carto.component.html b/src/app/carto/carto.component.html
index 928ead9f467ba5f818a419d0903b9ad85487091d..7b598ceaf7fce42eda4932ed701158db3aaacc73 100644
--- a/src/app/carto/carto.component.html
+++ b/src/app/carto/carto.component.html
@@ -1,4 +1,4 @@
-<div class="content-container no-pt" [ngClass]="{ 'height-100': isOrientationForm }">
+<div class="content-container no-pt" [ngClass]="{ orientationHeight: isOrientationForm }">
   <h1 class="visually-hidden">Cartographie</h1>
   <div class="hide-on-print">
     <app-structure-list-search [filters]="filters" (searchEvent)="getStructures($event)" />
diff --git a/src/app/carto/carto.component.scss b/src/app/carto/carto.component.scss
index c913fccf283f872dd641f43d896d201fa64c16e1..d7f9e46b674a17fff0317fe1a1f52c33cdac9351 100644
--- a/src/app/carto/carto.component.scss
+++ b/src/app/carto/carto.component.scss
@@ -16,8 +16,8 @@
   flex-direction: column;
 }
 
-.height-100 {
-  height: calc(100vh - #{$header-height} - #{$orientation-progressBarAndButtons});
+.orientationHeight {
+  height: calc(100vh - #{$header-height} - #{$progress-bar-height} - #{$orientation-progressBarAndButtons});
 }
 
 .panes-container {
diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 97760202c3f369e2ac17e2bf9309d2b8f137d55c..98def4124206708a93385f830cb589dddaed7107 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -1,8 +1,8 @@
-<div class="footerForm" [ngClass]="{ column: hasFinishButton() }">
+<div class="footerForm">
   <app-v3-button
     *ngIf="!isLastFormStep && !isNextFormTransition && !isStructureLastPage() && !isPersonalOfferFirstPage()"
     [variant]="buttonTypeEnumV3.Secondary"
-    [label]="!isEditMode ? btnName[0] : 'Annuler'"
+    [label]="!isEditMode ? 'Précédent' : 'Annuler'"
     [iconName]="!isEditMode && 'arrowBackV3'"
     (action)="prevPage()"
   />
@@ -10,14 +10,14 @@
   <app-v3-button
     *ngIf="!isLastFormStep && !isNextFormTransition && !isEditMode"
     [variant]="buttonTypeEnumV3.Primary"
-    [label]="btnName[1]"
+    [label]="'Suivant'"
     [iconPosition]="'right'"
-    [iconName]="btnName[1] === 'Imprimer' ? 'print' : 'arrowForwardV3'"
+    [iconName]="'arrowForwardV3'"
     [disabled]="!isValid"
+    [style]="buttonTypeEnumV3.Primary"
     (action)="nextPage()"
   />
 
-  <!-- Untested, not sure when it activates -->
   <app-v3-button
     *ngIf="isEditMode"
     [variant]="buttonTypeEnumV3.Primary"
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index eb5e3fe1db7149c22e3b078af7e68d99d583988f..69c593dbe31ca40118f4cef2888d28c146789a58 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -32,28 +32,6 @@
   }
 }
 
-.column {
-  @media #{$phone} {
-    flex-direction: column !important;
-    button {
-      margin-bottom: 10px !important;
-      margin-right: 0 !important;
-    }
-  }
-}
-
-.chevronLeft {
-  height: 24px;
-  width: 24px;
-  stroke: $black;
-  margin-right: 10px;
-}
-.chevronRight {
-  height: 24px;
-  width: 24px;
-  margin-left: 10px;
-}
-
 .print {
   stroke: $white;
   width: 20px;
diff --git a/src/app/form/footer-form/footer-form.component.ts b/src/app/form/footer-form/footer-form.component.ts
index bcb5973a90de13a9a9d46bac9e0dd55d9ef5bbcf..92855b3fdcd6ced8e400aeda914b3c373e74643b 100644
--- a/src/app/form/footer-form/footer-form.component.ts
+++ b/src/app/form/footer-form/footer-form.component.ts
@@ -23,7 +23,6 @@ import { stepType } from '../step.type';
 export class FooterFormComponent implements OnChanges {
   @Input() currentForm: formType;
   @Input() isValid: boolean;
-  @Input() btnName: string[];
   @Input() nbPagesForm: number;
   @Input() form: UntypedFormGroup;
   @Input() linkedStructureId: string[] = null;
@@ -81,10 +80,6 @@ export class FooterFormComponent implements OnChanges {
     this.endPage.emit();
   }
 
-  public hasFinishButton(): boolean {
-    return this.btnName.length === 3;
-  }
-
   public goToHome(): void {
     this.router.navigateByUrl('news');
   }
diff --git a/src/app/form/form-view/form-view.component.html b/src/app/form/form-view/form-view.component.html
index 4ded7b60fc80410f39332e3c5a4e720cac4800e7..24b0e342e3f32a9d8443a0734fe97f1739fc4094 100644
--- a/src/app/form/form-view/form-view.component.html
+++ b/src/app/form/form-view/form-view.component.html
@@ -66,7 +66,6 @@
     [currentForm]="currentFormType"
     [form]="currentForm"
     [linkedStructureId]="linkedStructureId"
-    [btnName]="['Précédent', 'Suivant']"
     [isValid]="isPageValid"
     [acceptNewsletter]="userAcceptNewsletter"
     [hasOtherPersonalOffer]="hasOtherPersonalOffer"
diff --git a/src/app/form/form-view/form-view.component.scss b/src/app/form/form-view/form-view.component.scss
index 097756c82b10775ffff8f45bad9edfaa30d4d644..df9690e8f17f1d68f795ac2c7c10036c6f59119a 100644
--- a/src/app/form/form-view/form-view.component.scss
+++ b/src/app/form/form-view/form-view.component.scss
@@ -25,6 +25,7 @@
   padding: 32px 48px;
   display: flex;
   justify-content: center;
+  min-width: 600px;
 
   @media #{$tablet} {
     margin: 0px 0.5rem;
@@ -79,7 +80,6 @@
 
   h4 {
     @include font-bold-18;
-    margin-bottom: 0;
   }
   p {
     @include font-regular-18;
@@ -88,6 +88,7 @@
   .info {
     @include font-regular-14;
   }
+  // V3REMOVE
   .backArrow {
     cursor: pointer;
   }
diff --git a/src/app/form/orientation-form-view/base-skills/base-skills-choice/base-skills-choice.component.html b/src/app/form/orientation-form-view/base-skills/base-skills-choice/base-skills-choice.component.html
index 430b66a768f65704a9e5b46a548295c19cc993a0..75856f34c1caec70f62d90c70731ba35f9debcac 100644
--- a/src/app/form/orientation-form-view/base-skills/base-skills-choice/base-skills-choice.component.html
+++ b/src/app/form/orientation-form-view/base-skills/base-skills-choice/base-skills-choice.component.html
@@ -1,6 +1,6 @@
-<h2>Quel est le besoin numérique de la personne ?</h2>
+<div class="orientationForm">
+  <h2>Quel est le besoin numérique de la personne ?</h2>
 
-<div fxLayout="column" fxLayoutGap="32px">
   <div class="btn-grid">
     <span *ngFor="let module of baseSkills">
       <app-button
diff --git a/src/app/form/orientation-form-view/base-skills/base-skills.component.ts b/src/app/form/orientation-form-view/base-skills/base-skills.component.ts
index db2f7fbe296c06ff06094288ca7803465916db81..e01cf9f33e64dc91348f573584d31f801987e940 100644
--- a/src/app/form/orientation-form-view/base-skills/base-skills.component.ts
+++ b/src/app/form/orientation-form-view/base-skills/base-skills.component.ts
@@ -1,14 +1,9 @@
 import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { FormGroup } from '@angular/forms';
-
 import { OrientationUtils } from '../../../utils/orientationUtils';
-import { FiltersSteps } from '../enums/filtersSteps.enum';
-import { GenericOrientationSteps } from '../enums/genericOrientationSteps.enum';
-import { RecapsType } from '../enums/recapsType.enum';
-import { StructuresListSteps } from '../enums/structuresListSteps.enum';
+import { FiltersSteps, GenericOrientationSteps, RecapsType, StructuresListSteps } from '../enums/orientation.enums';
 import { FiltersForm } from '../interfaces/filtersForm.interface';
-import { MediationType } from '../types/mediation.type';
-import { MediationStepType } from '../types/mediationStep.type';
+import { MediationStepType, MediationType } from '../types/orientation.types';
 
 @Component({
   selector: 'app-base-skills',
@@ -24,9 +19,9 @@ export class BaseSkillsComponent {
   public pagesValidation: any[] = [];
 
   // Enums
-  public structuresListStepsEnum = StructuresListSteps;
+  public StructuresListSteps = StructuresListSteps;
   public FiltersSteps = FiltersSteps;
-  public recapsType = RecapsType;
+  public RecapsType = RecapsType;
   public GenericOrientationSteps = GenericOrientationSteps;
 
   public checkValidation(): void {
diff --git a/src/app/form/orientation-form-view/enums/AppointmentSteps.enum.ts b/src/app/form/orientation-form-view/enums/AppointmentSteps.enum.ts
deleted file mode 100644
index 1769cc2ddd835e443e8b8badca8eaeb0b082b63a..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/AppointmentSteps.enum.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-export enum AppointmentSteps {
-  infoScreen,
-  structureOrientator,
-  pmrAccess,
-  location,
-  carto,
-  makeAppointment,
-  mediationBeneficiaryInfo,
-  rdvEnd,
-}
diff --git a/src/app/form/orientation-form-view/enums/filtersSteps.enum.ts b/src/app/form/orientation-form-view/enums/filtersSteps.enum.ts
deleted file mode 100644
index 3c07ac3f28fc7d782fe1d2946a72e42ea986a034..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/filtersSteps.enum.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum FiltersSteps {
-  filterChoice,
-}
diff --git a/src/app/form/orientation-form-view/enums/genericOrientationSteps.enum.ts b/src/app/form/orientation-form-view/enums/genericOrientationSteps.enum.ts
deleted file mode 100644
index 188d135796b66ff8be0003ea11810b129606afac..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/genericOrientationSteps.enum.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export enum GenericOrientationSteps {
-  common = 'Common',
-  structureList = 'Trouver une structure',
-}
diff --git a/src/app/form/orientation-form-view/enums/hotlineMediationSteps.enum.ts b/src/app/form/orientation-form-view/enums/hotlineMediationSteps.enum.ts
deleted file mode 100644
index f3e6c54ca41dc164639ecc82a1ca30166aa3165b..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/hotlineMediationSteps.enum.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export enum HotlineMediationSteps {
-  infoScreen,
-  mediationBeneficiaryInfo,
-  mediationHoursSelection,
-  mediationLanguageSelection,
-  orientationRecap,
-}
diff --git a/src/app/form/orientation-form-view/enums/needs.enum.ts b/src/app/form/orientation-form-view/enums/needs.enum.ts
deleted file mode 100644
index d1e38eee4b08e8e764fd20f2b6d0bca8fd7df48a..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/needs.enum.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export enum NeedsType {
-  equipmentAccess,
-  equipmentBuy,
-  onlineDemarch,
-  learnSkills,
-}
diff --git a/src/app/form/orientation-form-view/enums/onlineDemarche.enum.ts b/src/app/form/orientation-form-view/enums/onlineDemarche.enum.ts
deleted file mode 100644
index 791d5d81b7a2d38ebb1ffe3675fd330167434f63..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/onlineDemarche.enum.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export enum OnlineDemarche {
-  common = 'Common',
-  structureList = 'Trouver une structure',
-  appointment = 'RDV Conseiller Numérique',
-  onlineMediation = 'Médiation Numérique à distance',
-}
diff --git a/src/app/form/orientation-form-view/enums/onlineDemarchesCommonSteps.enum.ts b/src/app/form/orientation-form-view/enums/onlineDemarchesCommonSteps.enum.ts
deleted file mode 100644
index 9a0065fd84d64a6900783b8b10a66bce5d3f4444..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/onlineDemarchesCommonSteps.enum.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export enum OnlineDemarchesCommonSteps {
-  onlineDemarche,
-  accompanimentType,
-}
diff --git a/src/app/form/orientation-form-view/enums/orientation.enums.ts b/src/app/form/orientation-form-view/enums/orientation.enums.ts
new file mode 100644
index 0000000000000000000000000000000000000000..84c3b9ee735f96da242792bb6212e0e9006f6baf
--- /dev/null
+++ b/src/app/form/orientation-form-view/enums/orientation.enums.ts
@@ -0,0 +1,65 @@
+export enum AppointmentSteps {
+  infoScreen,
+  structureOrientator,
+  pmrAccess,
+  location,
+  carto,
+  makeAppointment,
+  mediationBeneficiaryInfo,
+  rdvEnd,
+}
+
+export enum FiltersSteps {
+  filterChoice,
+}
+
+export enum GenericOrientationSteps {
+  common = 'Common',
+  structureList = 'Trouver une structure',
+}
+
+export enum HotlineMediationSteps {
+  infoScreen,
+  mediationBeneficiaryInfo,
+  mediationHoursSelection,
+  mediationLanguageSelection,
+  orientationRecap,
+}
+
+export enum OnlineDemarche {
+  structureList = 'Trouver une structure',
+  appointment = 'RDV Conseiller Numérique',
+  onlineMediation = 'Médiation Numérique à distance',
+  common = 'Common',
+}
+
+export enum OnlineDemarchesCommonSteps {
+  onlineDemarche,
+  accompanimentType,
+}
+
+export enum NeedsType {
+  equipmentAccess = 'equipmentAccess',
+  equipmentBuy = 'equipmentBuy',
+  onlineDemarch = 'onlineDemarch',
+  learnSkills = 'learnSkills',
+}
+export enum PreferredLanguages {
+  french = 'Français',
+  english = 'Anglais',
+  arabic = 'Arabe',
+}
+export enum RecapsType {
+  onlineMediation,
+  structure,
+}
+
+export enum StructuresListSteps {
+  pmrAccess,
+  address,
+  structureChoice,
+  structureOrientator,
+  mediationBeneficiaryInfo,
+  comments,
+  orientationRecap,
+}
diff --git a/src/app/form/orientation-form-view/enums/preferredLanguages.enum.ts b/src/app/form/orientation-form-view/enums/preferredLanguages.enum.ts
deleted file mode 100644
index 2cb1b0bff8c0f55af538cd2e7704332e21096915..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/preferredLanguages.enum.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export enum PreferredLanguages {
-  french = 'Français',
-  english = 'Anglais',
-  arabic = 'Arabe',
-}
diff --git a/src/app/form/orientation-form-view/enums/recapsType.enum.ts b/src/app/form/orientation-form-view/enums/recapsType.enum.ts
deleted file mode 100644
index dc490a5fe2781013f6d305a3a59128f83fc56544..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/recapsType.enum.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export enum RecapsType {
-  onlineMediation,
-  structure,
-}
diff --git a/src/app/form/orientation-form-view/enums/structuresListSteps.enum.ts b/src/app/form/orientation-form-view/enums/structuresListSteps.enum.ts
deleted file mode 100644
index f3fe927b79c4ad541609fe438835ac3e6e056595..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/enums/structuresListSteps.enum.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export enum StructuresListSteps {
-  pmrAccess,
-  address,
-  structureChoice,
-  structureOrientator,
-  mediationBeneficiaryInfo,
-  comments,
-  orientationRecap,
-}
diff --git a/src/app/form/orientation-form-view/equipment-access/equipment-access-choice/equipment-access-choice.component.html b/src/app/form/orientation-form-view/equipment-access/equipment-access-choice/equipment-access-choice.component.html
index e5f682104a09de35dfa3213a9322f212b198bb80..e8ec46b0207d43d451907c459c166b19a7fbc58e 100644
--- a/src/app/form/orientation-form-view/equipment-access/equipment-access-choice/equipment-access-choice.component.html
+++ b/src/app/form/orientation-form-view/equipment-access/equipment-access-choice/equipment-access-choice.component.html
@@ -1,6 +1,6 @@
-<h2>De quel matériel a-t-il besoin ?</h2>
+<div class="orientationForm">
+  <h2>De quel matériel a-t-il besoin ?</h2>
 
-<div fxLayout="column" fxLayoutGap="32px">
   <div class="btn-grid">
     <span *ngFor="let module of equipmentType">
       <app-button
diff --git a/src/app/form/orientation-form-view/equipment-access/equipment-access.component.ts b/src/app/form/orientation-form-view/equipment-access/equipment-access.component.ts
index eb0b93368a93552cb779b92fc0682a2759a5152e..42bc7fed601b9cf238eb09314020022748277bc5 100644
--- a/src/app/form/orientation-form-view/equipment-access/equipment-access.component.ts
+++ b/src/app/form/orientation-form-view/equipment-access/equipment-access.component.ts
@@ -3,14 +3,10 @@ import { FormGroup } from '@angular/forms';
 import { User } from '../../../models/user.model';
 import { Filter } from '../../../structure-list/models/filter.model';
 import { OrientationUtils } from '../../../utils/orientationUtils';
-import { FiltersSteps } from '../enums/filtersSteps.enum';
-import { GenericOrientationSteps } from '../enums/genericOrientationSteps.enum';
-import { RecapsType } from '../enums/recapsType.enum';
-import { StructuresListSteps } from '../enums/structuresListSteps.enum';
+import { FiltersSteps, GenericOrientationSteps, RecapsType, StructuresListSteps } from '../enums/orientation.enums';
 import { FiltersForm } from '../interfaces/filtersForm.interface';
 import { StructureOrientationForm } from '../interfaces/structureOrientationForm.interface';
-import { MediationType } from '../types/mediation.type';
-import { MediationStepType } from '../types/mediationStep.type';
+import { MediationStepType, MediationType } from '../types/orientation.types';
 
 @Component({
   selector: 'app-equipment-access',
@@ -30,7 +26,7 @@ export class EquipmentAccessComponent {
 
   // Enums
   public FiltersSteps = FiltersSteps;
-  public recapsType = RecapsType;
+  public RecapsType = RecapsType;
   public GenericOrientationSteps = GenericOrientationSteps;
 
   public checkValidation(): void {
diff --git a/src/app/form/orientation-form-view/equipment-buy/equipment-buy-type/equipment-buy-type.component.html b/src/app/form/orientation-form-view/equipment-buy/equipment-buy-type/equipment-buy-type.component.html
index dbd280f8378d289c748c57874be2dd9aad026829..69d71e0bcbc30c6f95ab2ae852ed5eb124842095 100644
--- a/src/app/form/orientation-form-view/equipment-buy/equipment-buy-type/equipment-buy-type.component.html
+++ b/src/app/form/orientation-form-view/equipment-buy/equipment-buy-type/equipment-buy-type.component.html
@@ -1,6 +1,6 @@
-<h2>Quel matériel souhaite-t-il acheter à tarif solidaire ?</h2>
+<div class="orientationForm">
+  <h2>Quel matériel souhaite-t-il acheter à tarif solidaire ?</h2>
 
-<div fxLayout="column" fxLayoutGap="32px">
   <div class="btn-grid">
     <span *ngFor="let module of equipmentType">
       <app-button
diff --git a/src/app/form/orientation-form-view/equipment-buy/equipment-buy.component.ts b/src/app/form/orientation-form-view/equipment-buy/equipment-buy.component.ts
index eeb73f152dfd535b873f44cf67374a7424120554..a009475d282bd6086d8e266e8e5f41b0d9cfd74c 100644
--- a/src/app/form/orientation-form-view/equipment-buy/equipment-buy.component.ts
+++ b/src/app/form/orientation-form-view/equipment-buy/equipment-buy.component.ts
@@ -3,14 +3,10 @@ import { FormGroup } from '@angular/forms';
 import { User } from '../../../models/user.model';
 import { Filter } from '../../../structure-list/models/filter.model';
 import { OrientationUtils } from '../../../utils/orientationUtils';
-import { FiltersSteps } from '../enums/filtersSteps.enum';
-import { GenericOrientationSteps } from '../enums/genericOrientationSteps.enum';
-import { RecapsType } from '../enums/recapsType.enum';
-import { StructuresListSteps } from '../enums/structuresListSteps.enum';
+import { FiltersSteps, GenericOrientationSteps, RecapsType, StructuresListSteps } from '../enums/orientation.enums';
 import { FiltersForm } from '../interfaces/filtersForm.interface';
 import { StructureOrientationForm } from '../interfaces/structureOrientationForm.interface';
-import { MediationType } from '../types/mediation.type';
-import { MediationStepType } from '../types/mediationStep.type';
+import { MediationStepType, MediationType } from '../types/orientation.types';
 
 @Component({
   selector: 'app-equipment-buy',
@@ -30,7 +26,7 @@ export class EquipmentBuyComponent {
 
   // Enums
   public FiltersSteps = FiltersSteps;
-  public recapsType = RecapsType;
+  public RecapsType = RecapsType;
   public GenericOrientationSteps = GenericOrientationSteps;
 
   public checkValidation(): void {
diff --git a/src/app/form/orientation-form-view/global-components/information-screen/information-screen.component.html b/src/app/form/orientation-form-view/global-components/information-screen/information-screen.component.html
index 6ef01b6abb8c42992954f2a8102a9458a10f6dc5..b6e6110eefaf983c0f2f712cce8f2cdbd5c52537 100644
--- a/src/app/form/orientation-form-view/global-components/information-screen/information-screen.component.html
+++ b/src/app/form/orientation-form-view/global-components/information-screen/information-screen.component.html
@@ -1,5 +1,5 @@
 <div *ngIf="currentType === currentTypeEnum.appointment" class="container">
-  <img src="../../../../../assets/img/rdvsBeginning.svg" alt="Appointment image" />
+  <img src="../../../../../assets/img/rdvsBeginning.svg" alt="" />
   <h2>Vous vous apprêtez à demander un rendez-vous auprès d'un·e accompagnant·e numérique</h2>
   <p>
     Ces professionnel·les peuvent aider à la prise en main des services administratifs en ligne, mais ne sont pas
@@ -8,7 +8,7 @@
   </p>
 </div>
 <div *ngIf="currentType === currentTypeEnum.onlineMediation" class="container">
-  <img src="../../../../../assets/img/onlineMediationBeginning.svg" alt="Illustration RDV en ligne" />
+  <img src="../../../../../assets/img/onlineMediationBeginning.svg" alt="" />
   <h2>Vous vous apprêtez à choisir un créneau de médiation numérique à distance</h2>
   <p>
     Ce service d’accompagnement permettra à la personne d'être assistée depuis son domicile dans ses usages numériques.
diff --git a/src/app/form/orientation-form-view/global-components/information-screen/information-screen.component.ts b/src/app/form/orientation-form-view/global-components/information-screen/information-screen.component.ts
index dad34f296e9d3b8f05382c7c2a8cb519d29bb537..0c27c30d048f46d90e442a1730f61a1d4b9175f9 100644
--- a/src/app/form/orientation-form-view/global-components/information-screen/information-screen.component.ts
+++ b/src/app/form/orientation-form-view/global-components/information-screen/information-screen.component.ts
@@ -1,5 +1,5 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { OnlineDemarche } from '../../enums/onlineDemarche.enum';
+import { OnlineDemarche } from '../../enums/orientation.enums';
 
 @Component({
   selector: 'app-information-screen',
diff --git a/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.html b/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.html
deleted file mode 100644
index 9a01d6a961458aa442f36913653b911b0a232f5c..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.html
+++ /dev/null
@@ -1,19 +0,0 @@
-<div fxLayoutAlign="center left" class="radiocard" [fxLayout]="'column'" [fxLayoutGap]="'8px'">
-  <button
-    *ngFor="let item of items; let index = index"
-    type="button"
-    [ngClass]="{ selected: selectedItem === item.key, smallWidth: smallWidth }"
-    (click)="selectItem(item.key)"
-  >
-    <div class="checkmark">
-      <svg *ngIf="selectedItem === item.key" class="validate" aria-hidden="true">
-        <use [attr.xlink:href]="'assets/form/sprite.svg#checkVectorFull'" />
-      </svg>
-    </div>
-    <app-svg-icon *ngIf="displayIcon" [iconClass]="'icon-40'" [type]="'form'" [icon]="'orientationIndex' + index" />
-    <div [fxLayout]="'column'" [fxLayoutGap]="'8px'">
-      <div class="title">{{ item.title }}</div>
-      <div class="hint">{{ item.hint }}</div>
-    </div>
-  </button>
-</div>
diff --git a/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.scss b/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.scss
deleted file mode 100644
index e4a9f3ca156dac3528a298efd5054a2efe7b3a60..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.scss
+++ /dev/null
@@ -1,64 +0,0 @@
-@import 'color';
-@import 'typography';
-@import 'breakpoint';
-.radiocard {
-  button {
-    display: flex;
-    align-items: center;
-    gap: 1rem;
-    height: 85px;
-    background-color: $grey-9;
-    border: solid 3px transparent;
-    font-size: 1rem;
-    padding: 1.5rem 1rem;
-    box-sizing: border-box;
-    border-radius: 4px;
-    outline: none;
-    cursor: pointer;
-    width: 100%;
-    max-width: 600px;
-    @media #{$phone} {
-      height: 100px;
-    }
-    &.selected {
-      background: $white;
-      border: 3px solid $green-1;
-      .validate {
-        display: initial;
-      }
-    }
-
-    div {
-      text-align: left;
-      @media #{$phone} {
-        max-width: 260px;
-      }
-    }
-    .title {
-      @include font-bold-16;
-    }
-    .hint {
-      @include font-regular-15;
-      font-style: italic;
-      color: $grey-3;
-    }
-    .checkmark {
-      width: 20px;
-      height: 20px;
-      box-sizing: border-box;
-      background: $white;
-      border: 1px solid $grey-3;
-      border-radius: 10px;
-      svg {
-        width: 24px;
-        height: 24px;
-        position: relative;
-        left: -3px;
-        top: -3px;
-      }
-    }
-    &.smallWidth {
-      width: 300px;
-    }
-  }
-}
diff --git a/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.ts b/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.ts
deleted file mode 100644
index bd094556599f2d49c31f7cf52da948d2098f47f7..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/global-components/multi-radio-form/multi-radio-form.component.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { INeedItem } from '../../../../utils/orientationUtils';
-import { NeedsType } from '../../enums/needs.enum';
-
-@Component({
-  selector: 'app-multi-radio-form',
-  templateUrl: './multi-radio-form.component.html',
-  styleUrls: ['./multi-radio-form.component.scss'],
-})
-export class MultiRadioFormComponent implements OnInit {
-  @Input() items: INeedItem[];
-  @Input() selected: any;
-  @Input() smallWidth = false;
-  @Input() displayIcon = false;
-  @Output() handleSelect = new EventEmitter<any>();
-
-  public selectedItem: NeedsType | string;
-
-  ngOnInit(): void {
-    if (this.selected) this.selectedItem = this.selected;
-  }
-
-  public selectItem(key: NeedsType | string): void {
-    this.handleSelect.emit(key);
-    this.selectedItem = key;
-  }
-}
diff --git a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
index b39959c58afa99db0bf6bc971017d6b52f396081..54989dc012a444241f9576f84d3ceddbf0a40e3a 100644
--- a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
+++ b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
@@ -1,7 +1,7 @@
-<div class="footerForm" fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="center center">
+<div class="footerForm">
   <ng-container *ngIf="!shouldResetOrientation">
     <app-v3-button
-      *ngIf="currentStep !== null && !(isLastStep && needType === 2)"
+      *ngIf="currentStep !== null && !(isLastStep && needType === 'onlineDemarch')"
       [variant]="buttonTypeEnumV3.Secondary"
       [label]="'Précédent'"
       [iconName]="'arrowBackV3'"
diff --git a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.scss b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.scss
index 30bf10b6d777e5ce0b49e7b0dce3f753570b459d..507e8881755c04a69afb01cc69933f1e4828f0bf 100644
--- a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.scss
+++ b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.scss
@@ -1,4 +1,9 @@
 .footerForm {
+  display: flex;
+  justify-content: center;
+  gap: 2rem;
+  padding-top: 2rem;
+  padding-bottom: 40px;
   @media print {
     display: none !important;
   }
diff --git a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.ts b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.ts
index d20811685dedda8b8953ffb597bedf8186c31212..3f11f48f91b7cb1a8cc5c080488c1590efb25ea0 100644
--- a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.ts
+++ b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.ts
@@ -1,11 +1,8 @@
 import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { ButtonTypeV3 } from '../../../../shared/components/v3/button/button-type.enum';
-import { NeedsType } from '../../enums/needs.enum';
-import { OnlineDemarche } from '../../enums/onlineDemarche.enum';
-import { MediationType } from '../../types/mediation.type';
-import { MediationStepType } from '../../types/mediationStep.type';
-import { OnlineMediationSteps } from '../../types/onlineDemarcheStep.type';
+import { NeedsType, OnlineDemarche } from '../../enums/orientation.enums';
+import { MediationStepType, MediationType } from '../../types/orientation.types';
 
 @Component({
   selector: 'app-navigation',
@@ -13,7 +10,7 @@ import { OnlineMediationSteps } from '../../types/onlineDemarcheStep.type';
   styleUrls: ['./navigation.component.scss'],
 })
 export class NavigationComponent {
-  @Input() currentStep: OnlineMediationSteps | MediationStepType;
+  @Input() currentStep: MediationStepType;
   @Input() currentType: OnlineDemarche | MediationType;
   @Input() isPageValid: boolean;
   @Input() needType: NeedsType;
diff --git a/src/app/form/orientation-form-view/global-components/needs-selection/needs-selection.component.html b/src/app/form/orientation-form-view/global-components/needs-selection/needs-selection.component.html
index 17d5d99edc84f4fa422ef0ef720ae2e541fefca4..9d7dd1fdde49b67ac3c27bccc89de9ce64999835 100644
--- a/src/app/form/orientation-form-view/global-components/needs-selection/needs-selection.component.html
+++ b/src/app/form/orientation-form-view/global-components/needs-selection/needs-selection.component.html
@@ -1,7 +1,17 @@
-<h2>Quels sont les besoins de la personne ?</h2>
-<app-multi-radio-form
-  [items]="needsList"
-  [displayIcon]="true"
-  [selected]="getSelected()"
-  (handleSelect)="selectNeed($event)"
-/>
+<div class="orientationForm">
+  <div class="title">
+    <h2>Quels sont les besoins de la personne ?</h2>
+    <p>Un seul choix possible</p>
+  </div>
+  <div class="formGroup">
+    <app-radio-option
+      *ngFor="let option of needsList"
+      [id]="option.key"
+      [label]="option.title"
+      [description]="option.hint"
+      [iconName]="option.icon"
+      [selected]="getSelected() === option.key"
+      (selectedEvent)="selectNeed(option.key)"
+    />
+  </div>
+</div>
diff --git a/src/app/form/orientation-form-view/global-components/needs-selection/needs-selection.component.ts b/src/app/form/orientation-form-view/global-components/needs-selection/needs-selection.component.ts
index ff1eb19cccf17537e312a763eea5907c11201ef4..97a267baf7a7ed0cb20f04f3fa7433f42c88c5cf 100644
--- a/src/app/form/orientation-form-view/global-components/needs-selection/needs-selection.component.ts
+++ b/src/app/form/orientation-form-view/global-components/needs-selection/needs-selection.component.ts
@@ -3,8 +3,8 @@ import { Observable, forkJoin, tap } from 'rxjs';
 import { PersonalOffer } from '../../../../models/personalOffer.model';
 import { OrientationService } from '../../../../services/orientation.service';
 import { PersonalOfferService } from '../../../../services/personal-offer.service';
-import { INeedItem, OrientationUtils } from '../../../../utils/orientationUtils';
-import { NeedsType } from '../../enums/needs.enum';
+import { INeedItem } from '../../../../utils/orientationUtils';
+import { NeedsType, OnlineDemarche } from '../../enums/orientation.enums';
 
 @Component({
   selector: 'app-needs-selection',
@@ -14,14 +14,40 @@ export class NeedsSelectionComponent implements OnInit {
   @Input() currentNeed: NeedsType;
   @Output() setNeedType = new EventEmitter<any>();
   @Output() validate = new EventEmitter<any>();
-  public needsList: INeedItem[] = new OrientationUtils().needsList;
+
+  public needsList: INeedItem[] = [
+    {
+      title: 'Accéder à du matériel numérique en libre service',
+      hint: '(Wifi, ordinateur, imprimante, scanner…)',
+      key: NeedsType.equipmentAccess,
+      icon: 'orientationIndex0',
+    },
+    {
+      title: 'Acheter du matériel numérique à tarif solidaire',
+      hint: '(Ordinateur, smartphone, clé 4G, forfait internet…)',
+      key: NeedsType.equipmentBuy,
+      icon: 'orientationIndex1',
+    },
+    {
+      title: 'Réaliser une démarche en ligne',
+      hint: '(Démarche Caf, CPAM, Pôle emploi…)',
+      key: NeedsType.onlineDemarch,
+      icon: 'orientationIndex2',
+    },
+    {
+      title: 'Acquérir les compétences numériques de base',
+      hint: '(Ordinateur et smartphone, mails, réseaux sociaux et bureautique...)',
+      key: NeedsType.learnSkills,
+      icon: 'orientationIndex3',
+    },
+  ];
 
   constructor(public orientationService: OrientationService, private personalOfferService: PersonalOfferService) {}
 
   ngOnInit(): void {
     if (this.orientationService.rdvUser || this.orientationService.rdvStructure) {
       this.needsList = this.needsList.filter(
-        (item: INeedItem) => item.key === NeedsType.onlineDemarch || item.key === NeedsType.learnSkills
+        (item) => item.key === NeedsType.onlineDemarch || item.key === NeedsType.learnSkills
       );
     }
 
@@ -43,10 +69,10 @@ export class NeedsSelectionComponent implements OnInit {
     }
   }
 
-  public selectNeed(event: NeedsType): void {
+  public selectNeed(event: string): void {
     this.setNeedType.emit(event);
   }
-  public getSelected(): string | NeedsType {
+  public getSelected(): NeedsType | OnlineDemarche {
     const selected = this.needsList.filter((need) => need.key === this.currentNeed)[0];
     if (selected) {
       this.validate.emit();
diff --git a/src/app/form/orientation-form-view/global-components/orientation-recap/orientation-recap.component.ts b/src/app/form/orientation-form-view/global-components/orientation-recap/orientation-recap.component.ts
index d4d33cc9611bda485bcc6e19972de88250bb1dd7..d6f6f83d22a1b67ee84c2d81a488fd005d5a71e6 100644
--- a/src/app/form/orientation-form-view/global-components/orientation-recap/orientation-recap.component.ts
+++ b/src/app/form/orientation-form-view/global-components/orientation-recap/orientation-recap.component.ts
@@ -3,7 +3,7 @@ import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
 import { Structure } from '../../../../models/structure.model';
 import { Module } from '../../../../structure-list/models/module.model';
-import { RecapsType } from '../../enums/recapsType.enum';
+import { RecapsType } from '../../enums/orientation.enums';
 
 @Component({
   selector: 'app-orientation-recap',
diff --git a/src/app/form/orientation-form-view/global-components/structure-orientator/structure-orientator.component.html b/src/app/form/orientation-form-view/global-components/structure-orientator/structure-orientator.component.html
index 15cfca06aa3c372cbb1c0828e9b21511b10abca1..41a5db1a2f0855e72ee0b77461bca624bdaf6a9b 100644
--- a/src/app/form/orientation-form-view/global-components/structure-orientator/structure-orientator.component.html
+++ b/src/app/form/orientation-form-view/global-components/structure-orientator/structure-orientator.component.html
@@ -1,102 +1,106 @@
-<h2>Quelle structure oriente la personne&nbsp;?</h2>
-<div *ngIf="hasStructures && structuresLinked.length >= 2" class="select-structure border">
-  <div class="number">{{ structuresLinked.length }} structures sont associées à votre compte</div>
-  <div
-    *ngFor="let structure of structuresLinked"
-    class="structure-item"
-    tabindex="0"
-    [ngClass]="{ 'item-selected': structure.structureName === selected?.structureName }"
-    (click)="select(structure)"
-    (keyup.enter)="select(structure)"
-  >
-    <div class="item-frame">
-      <div class="name">{{ structure.structureName }}</div>
-      <div class="commune">{{ structure.address.commune }}</div>
-    </div>
-    <app-svg-icon
-      *ngIf="structure.structureName === selected?.structureName"
-      class="form-icon"
-      [iconClass]="'icon-26'"
-      [type]="'form'"
-      [icon]="'validate'"
-    />
-  </div>
-</div>
-<div *ngIf="!hasStructures" class="select-structure">
-  <form [formGroup]="form">
-    <div class="form-group" fxLayout="column">
-      <label for="structureName">Nom de votre structure</label>
-      <div fxLayout="row" fxLayoutGap="13px">
-        <input
-          type="text"
-          autocomplete="on"
-          formControlName="structureName"
-          class="form-input"
-          (input)="updatedForm('structureName', $event.target)"
-        />
-        <app-svg-icon
-          *ngIf="form.get('structureName').value && form.get('structureName').valid"
-          [iconClass]="'validation'"
-          [type]="'form'"
-          [icon]="'validate'"
-        />
-        <app-svg-icon
-          *ngIf="form.get('structureName').value && !form.get('structureName').valid"
-          [iconClass]="'validation'"
-          [type]="'form'"
-          [icon]="'notValidate'"
-        />
-      </div>
-    </div>
-    <div class="form-group" fxLayout="column">
-      <label for="structureMail">Email de votre structure</label>
-      <p class="notRequired">Facultatif</p>
-      <div fxLayout="row" fxLayoutGap="13px">
-        <input
-          type="text"
-          autocomplete="on"
-          formControlName="structureMail"
-          class="form-input"
-          (input)="updatedForm('structureMail', $event.target)"
-        />
-        <app-svg-icon
-          *ngIf="form.get('structureMail').value && form.get('structureMail').valid"
-          [iconClass]="'validation'"
-          [type]="'form'"
-          [icon]="'validate'"
-        />
-        <app-svg-icon
-          *ngIf="form.get('structureMail').value && !form.get('structureMail').valid"
-          [iconClass]="'validation'"
-          [type]="'form'"
-          [icon]="'notValidate'"
-        />
+<div class="orientationForm">
+  <h2>Quelle structure oriente la personne&nbsp;?</h2>
+  <div *ngIf="hasStructures && structuresLinked.length >= 2" class="select-structure border">
+    <div class="number">{{ structuresLinked.length }} structures sont associées à votre compte</div>
+    <div
+      *ngFor="let structure of structuresLinked"
+      class="structure-item"
+      tabindex="0"
+      [ngClass]="{ 'item-selected': structure.structureName === selected?.structureName }"
+      (click)="select(structure)"
+      (keyup.enter)="select(structure)"
+    >
+      <div class="item-frame">
+        <div class="name">{{ structure.structureName }}</div>
+        <div class="commune">{{ structure.address.commune }}</div>
       </div>
+      <app-svg-icon
+        *ngIf="structure.structureName === selected?.structureName"
+        class="form-icon"
+        [iconClass]="'icon-26'"
+        [type]="'form'"
+        [icon]="'validate'"
+      />
     </div>
-    <div class="form-group" fxLayout="column">
-      <label for="structurePhone">Téléphone de votre structure</label>
-      <p class="notRequired">Facultatif</p>
-      <div fxLayout="row" fxLayoutGap="13px">
-        <input
-          type="phone"
-          autocomplete="on"
-          formControlName="structurePhone"
-          class="form-input"
-          (input)="updatedForm('structurePhone', $event.target)"
-        />
-        <app-svg-icon
-          *ngIf="form.get('structurePhone').value && form.get('structurePhone').valid"
-          [iconClass]="'validation'"
-          [type]="'form'"
-          [icon]="'validate'"
-        />
-        <app-svg-icon
-          *ngIf="form.get('structurePhone').value && !form.get('structurePhone').valid"
-          [iconClass]="'validation'"
-          [type]="'form'"
-          [icon]="'notValidate'"
-        />
+  </div>
+  <div *ngIf="!hasStructures" class="select-structure">
+    <form [formGroup]="form">
+      <div>
+        <div class="form-group" fxLayout="column">
+          <label for="structureName">Nom de votre structure</label>
+          <div fxLayout="row" fxLayoutGap="13px">
+            <input
+              type="text"
+              autocomplete="on"
+              formControlName="structureName"
+              class="form-input"
+              (input)="updatedForm('structureName', $event.target)"
+            />
+            <app-svg-icon
+              *ngIf="form.get('structureName').value && form.get('structureName').valid"
+              [iconClass]="'validation'"
+              [type]="'form'"
+              [icon]="'validate'"
+            />
+            <app-svg-icon
+              *ngIf="form.get('structureName').value && !form.get('structureName').valid"
+              [iconClass]="'validation'"
+              [type]="'form'"
+              [icon]="'notValidate'"
+            />
+          </div>
+        </div>
+        <div class="form-group" fxLayout="column">
+          <label for="structureMail">Email de votre structure</label>
+          <p class="notRequired">Facultatif</p>
+          <div fxLayout="row" fxLayoutGap="13px">
+            <input
+              type="text"
+              autocomplete="on"
+              formControlName="structureMail"
+              class="form-input"
+              (input)="updatedForm('structureMail', $event.target)"
+            />
+            <app-svg-icon
+              *ngIf="form.get('structureMail').value && form.get('structureMail').valid"
+              [iconClass]="'validation'"
+              [type]="'form'"
+              [icon]="'validate'"
+            />
+            <app-svg-icon
+              *ngIf="form.get('structureMail').value && !form.get('structureMail').valid"
+              [iconClass]="'validation'"
+              [type]="'form'"
+              [icon]="'notValidate'"
+            />
+          </div>
+        </div>
+        <div class="form-group" fxLayout="column">
+          <label for="structurePhone">Téléphone de votre structure</label>
+          <p class="notRequired">Facultatif</p>
+          <div fxLayout="row" fxLayoutGap="13px">
+            <input
+              type="phone"
+              autocomplete="on"
+              formControlName="structurePhone"
+              class="form-input"
+              (input)="updatedForm('structurePhone', $event.target)"
+            />
+            <app-svg-icon
+              *ngIf="form.get('structurePhone').value && form.get('structurePhone').valid"
+              [iconClass]="'validation'"
+              [type]="'form'"
+              [icon]="'validate'"
+            />
+            <app-svg-icon
+              *ngIf="form.get('structurePhone').value && !form.get('structurePhone').valid"
+              [iconClass]="'validation'"
+              [type]="'form'"
+              [icon]="'notValidate'"
+            />
+          </div>
+        </div>
       </div>
-    </div>
-  </form>
+    </form>
+  </div>
 </div>
diff --git a/src/app/form/orientation-form-view/interfaces/orientationIndicator.interface.ts b/src/app/form/orientation-form-view/interfaces/orientationIndicator.interface.ts
index 8d5dc451c67c1f7e36ec7696fd8e38e54c3dd1a7..d8fadede49260bcaa7b14acfa4cc9f68284bf09c 100644
--- a/src/app/form/orientation-form-view/interfaces/orientationIndicator.interface.ts
+++ b/src/app/form/orientation-form-view/interfaces/orientationIndicator.interface.ts
@@ -1,5 +1,5 @@
 import { Address } from '../../../models/address.model';
-import { MediationType } from '../types/mediation.type';
+import { MediationType } from '../types/orientation.types';
 
 export interface OrientationIndicatorStructure {
   nom: string;
diff --git a/src/app/form/orientation-form-view/online-demarch/mediation-language-selection/mediation-language-selection.component.html b/src/app/form/orientation-form-view/online-demarch/mediation-language-selection/mediation-language-selection.component.html
index eacdee046e120b91e895f427bd77835fa54d45e1..d60a390697a47d9e936dee01305140e926d4fbb8 100644
--- a/src/app/form/orientation-form-view/online-demarch/mediation-language-selection/mediation-language-selection.component.html
+++ b/src/app/form/orientation-form-view/online-demarch/mediation-language-selection/mediation-language-selection.component.html
@@ -1,8 +1,13 @@
-<h2>Dans quelle langue la personne souhaite-t-elle être rappelée ?</h2>
+<div class="orientationForm">
+  <h2>Dans quelle langue la personne souhaite-t-elle être rappelée ?</h2>
 
-<app-multi-radio-form
-  [items]="languages"
-  [selected]="selected"
-  [smallWidth]="true"
-  (handleSelect)="handleSelect($event)"
-/>
+  <div class="formGroup">
+    <app-radio-option
+      *ngFor="let lang of languages"
+      [id]="lang.key"
+      [label]="lang.title"
+      [selected]="selected === lang.key"
+      (selectedEvent)="handleSelect(lang.key)"
+    />
+  </div>
+</div>
diff --git a/src/app/form/orientation-form-view/online-demarch/mediation-language-selection/mediation-language-selection.component.ts b/src/app/form/orientation-form-view/online-demarch/mediation-language-selection/mediation-language-selection.component.ts
index f68b86d00406008cdd362106afe1c23d6894eac4..73b426d075f61c76081b7735eff7e1ecc738f035 100644
--- a/src/app/form/orientation-form-view/online-demarch/mediation-language-selection/mediation-language-selection.component.ts
+++ b/src/app/form/orientation-form-view/online-demarch/mediation-language-selection/mediation-language-selection.component.ts
@@ -1,6 +1,6 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
-import { PreferredLanguages } from '../../enums/preferredLanguages.enum';
+import { PreferredLanguages } from '../../enums/orientation.enums';
 
 @Component({
   selector: 'app-mediation-language-selection',
diff --git a/src/app/form/orientation-form-view/online-demarch/online-demarch-common/accompaniment-type/accompaniment-type.component.html b/src/app/form/orientation-form-view/online-demarch/online-demarch-common/accompaniment-type/accompaniment-type.component.html
index 813fa15a50c24d3296e22e94416ca9c0928bdad2..06b035d1018bfff96558702017fbf0bf24f62df3 100644
--- a/src/app/form/orientation-form-view/online-demarch/online-demarch-common/accompaniment-type/accompaniment-type.component.html
+++ b/src/app/form/orientation-form-view/online-demarch/online-demarch-common/accompaniment-type/accompaniment-type.component.html
@@ -1,3 +1,13 @@
-<h2>De quel accompagnement la personne a-t-elle besoin ?</h2>
-
-<app-multi-radio-form [items]="accompanimentTypes" [selected]="selected" (handleSelect)="handleSelect($event)" />
+<div class="orientationForm">
+  <h2>De quel accompagnement la personne a-t-elle besoin ?</h2>
+  <div class="formGroup">
+    <app-radio-option
+      *ngFor="let option of accompanimentTypes"
+      [id]="option.key"
+      [label]="option.title"
+      [description]="option.hint"
+      [selected]="selected === option.key"
+      (selectedEvent)="handleSelect(option.key)"
+    />
+  </div>
+</div>
diff --git a/src/app/form/orientation-form-view/online-demarch/online-demarch-common/accompaniment-type/accompaniment-type.component.ts b/src/app/form/orientation-form-view/online-demarch/online-demarch-common/accompaniment-type/accompaniment-type.component.ts
index 24f37b39c008753a933c5fca08e7cf4c01e5a53c..1108e53efeb882db6216798a2b6456773c5d3c7e 100644
--- a/src/app/form/orientation-form-view/online-demarch/online-demarch-common/accompaniment-type/accompaniment-type.component.ts
+++ b/src/app/form/orientation-form-view/online-demarch/online-demarch-common/accompaniment-type/accompaniment-type.component.ts
@@ -1,7 +1,7 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
 import { INeedItem } from '../../../../../utils/orientationUtils';
-import { OnlineDemarche } from '../../../enums/onlineDemarche.enum';
+import { OnlineDemarche } from '../../../enums/orientation.enums';
 
 @Component({
   selector: 'app-accompaniment-type',
diff --git a/src/app/form/orientation-form-view/online-demarch/online-demarch-common/online-demarch.component.html b/src/app/form/orientation-form-view/online-demarch/online-demarch-common/online-demarch.component.html
index 9d5386cc314819a291d632084d0d8d17d960f9b0..244c733981444128c1165c9769c95455b6a3a99f 100644
--- a/src/app/form/orientation-form-view/online-demarch/online-demarch-common/online-demarch.component.html
+++ b/src/app/form/orientation-form-view/online-demarch/online-demarch-common/online-demarch.component.html
@@ -1,25 +1,28 @@
-<h2>Quelle démarche en ligne la personne a-t-elle besoin de réaliser ?</h2>
-<div class="btn-grid btnContainer">
-  <span *ngFor="let module of accompanimentType">
-    <app-button
-      *ngIf="module.id !== 'autres'"
-      [ngClass]="{ selectedChoice: true }"
-      [extraClass]="isSelectedModule(module.id) ? 'selected' : ''"
-      [disabled]="module.disabled"
-      [style]="buttonTypeEnum.CheckButton"
-      [text]="module.name"
-      (action)="handleClick(module)"
-    />
-  </span>
+<div class="orientationForm">
+  <h2>Quelle démarche en ligne la personne a-t-elle besoin de réaliser ?</h2>
+  <div class="btn-grid btnContainer">
+    <span *ngFor="let module of accompanimentType">
+      <app-button
+        *ngIf="module.id !== 'autres'"
+        [ngClass]="{ selectedChoice: true }"
+        [extraClass]="isSelectedModule(module.id) ? 'selected' : ''"
+        [disabled]="module.disabled"
+        [style]="buttonTypeEnum.CheckButton"
+        [text]="module.name"
+        (action)="handleClick(module)"
+      />
+    </span>
+  </div>
+  <app-v3-modal
+    [opened]="showStrangersModal"
+    [validateLabel]="'J\'ai compris'"
+    [singleButton]="true"
+    [title]="'Attention'"
+    (closed)="handleClose()"
+  >
+    <div class="modalContent emphasized">
+      Les premières demandes de titres de séjour doivent être redirigées vers les associations spécialisées sur les
+      droits des étrangers.
+    </div>
+  </app-v3-modal>
 </div>
-<app-v3-modal
-  [opened]="showStrangersModal"
-  [validateLabel]="'J\'ai compris'"
-  [singleButton]="true"
-  [title]="'Attention'"
-  (closed)="handleClose()"
-  ><div class="modalContent emphasized">
-    Les premières demandes de titres de séjour doivent être redirigées vers les associations spécialisées sur les droits
-    des étrangers.
-  </div></app-v3-modal
->
diff --git a/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-beneficiary-info/mediation-beneficiary-info.component.html b/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-beneficiary-info/mediation-beneficiary-info.component.html
index 8cc5163b731877f16de1f142a37fff0757768cd0..f65c86877987f5df1beca98049a11a7781a168ad 100644
--- a/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-beneficiary-info/mediation-beneficiary-info.component.html
+++ b/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-beneficiary-info/mediation-beneficiary-info.component.html
@@ -1,91 +1,98 @@
-<h2 *ngIf="currentType !== 'RDV Conseiller Numérique'">Quelles sont les informations de la personne ?</h2>
-<h2 *ngIf="currentType === 'RDV Conseiller Numérique'">Quelles sont les coordonnées de la personne ?</h2>
-<form [formGroup]="form">
-  <div class="form-group" fxLayout="column">
-    <label for="name">Prénom</label>
-    <div fxLayout="row" fxLayoutGap="13px">
-      <input
-        type="text"
-        autocomplete="on"
-        formControlName="name"
-        class="form-input"
-        (input)="updatedForm('name', $event.target)"
-      />
-      <app-svg-icon *ngIf="form.get('name').valid" [iconClass]="'validation'" [type]="'form'" [icon]="'validate'" />
-      <app-svg-icon
-        *ngIf="form.get('name').value && !form.get('name').valid"
-        [iconClass]="'validation'"
-        [type]="'form'"
-        [icon]="'notValidate'"
-      />
+<div class="orientationForm">
+  <h2 *ngIf="currentType !== 'RDV Conseiller Numérique'">Quelles sont les informations de la personne ?</h2>
+  <h2 *ngIf="currentType === 'RDV Conseiller Numérique'">Quelles sont les coordonnées de la personne ?</h2>
+  <form [formGroup]="form">
+    <div class="form-group" fxLayout="column">
+      <label for="name">Prénom</label>
+      <div fxLayout="row" fxLayoutGap="13px">
+        <input
+          type="text"
+          autocomplete="on"
+          formControlName="name"
+          class="form-input"
+          (input)="updatedForm('name', $event.target)"
+        />
+        <app-svg-icon *ngIf="form.get('name').valid" [iconClass]="'validation'" [type]="'form'" [icon]="'validate'" />
+        <app-svg-icon
+          *ngIf="form.get('name').value && !form.get('name').valid"
+          [iconClass]="'validation'"
+          [type]="'form'"
+          [icon]="'notValidate'"
+        />
+      </div>
     </div>
-  </div>
-  <div class="form-group" fxLayout="column">
-    <label for="surname">Nom</label>
-    <div fxLayout="row" fxLayoutGap="13px">
-      <input
-        type="text"
-        autocomplete="on"
-        formControlName="surname"
-        class="form-input"
-        (input)="updatedForm('surname', $event.target)"
-      />
-      <app-svg-icon *ngIf="form.get('surname').valid" [iconClass]="'validation'" [type]="'form'" [icon]="'validate'" />
-      <app-svg-icon
-        *ngIf="form.get('surname').value && !form.get('surname').valid"
-        [iconClass]="'validation'"
-        [type]="'form'"
-        [icon]="'notValidate'"
-      />
+    <div class="form-group" fxLayout="column">
+      <label for="surname">Nom</label>
+      <div fxLayout="row" fxLayoutGap="13px">
+        <input
+          type="text"
+          autocomplete="on"
+          formControlName="surname"
+          class="form-input"
+          (input)="updatedForm('surname', $event.target)"
+        />
+        <app-svg-icon
+          *ngIf="form.get('surname').valid"
+          [iconClass]="'validation'"
+          [type]="'form'"
+          [icon]="'validate'"
+        />
+        <app-svg-icon
+          *ngIf="form.get('surname').value && !form.get('surname').valid"
+          [iconClass]="'validation'"
+          [type]="'form'"
+          [icon]="'notValidate'"
+        />
+      </div>
     </div>
-  </div>
 
-  <div *ngIf="isEmail()" class="form-group" fxLayout="column">
-    <label for="email">Email <sup *ngIf="isOrientationRdv" class="footnote-nb">1</sup></label>
-    <div fxLayout="row" fxLayoutGap="13px">
-      <input
-        type="text"
-        autocomplete="on"
-        formControlName="email"
-        class="form-input"
-        (input)="updatedForm('email', $event.target)"
-      />
-      <app-svg-icon
-        *ngIf="form.get('email').value && form.get('email').valid"
-        [iconClass]="'validation'"
-        [type]="'form'"
-        [icon]="'validate'"
-      />
-      <app-svg-icon
-        *ngIf="form.get('email').value && !form.get('email').valid"
-        [iconClass]="'validation'"
-        [type]="'form'"
-        [icon]="'notValidate'"
-      />
+    <div *ngIf="isEmail()" class="form-group" fxLayout="column">
+      <label for="email">Email <sup *ngIf="isOrientationRdv" class="footnote-nb">1</sup></label>
+      <div fxLayout="row" fxLayoutGap="13px">
+        <input
+          type="text"
+          autocomplete="on"
+          formControlName="email"
+          class="form-input"
+          (input)="updatedForm('email', $event.target)"
+        />
+        <app-svg-icon
+          *ngIf="form.get('email').value && form.get('email').valid"
+          [iconClass]="'validation'"
+          [type]="'form'"
+          [icon]="'validate'"
+        />
+        <app-svg-icon
+          *ngIf="form.get('email').value && !form.get('email').valid"
+          [iconClass]="'validation'"
+          [type]="'form'"
+          [icon]="'notValidate'"
+        />
+      </div>
     </div>
-  </div>
 
-  <div *ngIf="isPhone()" class="form-group" fxLayout="column">
-    <label for="phone">Téléphone<sup *ngIf="isOrientationRdv" class="footnote-nb">1</sup></label>
-    <div fxLayout="row" fxLayoutGap="13px">
-      <input
-        type="phone"
-        autocomplete="on"
-        formControlName="phone"
-        class="form-input"
-        (input)="updatedForm('phone', $event.target)"
-      />
-      <app-svg-icon *ngIf="form.get('phone').valid" [iconClass]="'validation'" [type]="'form'" [icon]="'validate'" />
-      <app-svg-icon
-        *ngIf="form.get('phone').value && !form.get('phone').valid"
-        [iconClass]="'validation'"
-        [type]="'form'"
-        [icon]="'notValidate'"
-      />
+    <div *ngIf="isPhone()" class="form-group" fxLayout="column">
+      <label for="phone">Téléphone<sup *ngIf="isOrientationRdv" class="footnote-nb">1</sup></label>
+      <div fxLayout="row" fxLayoutGap="13px">
+        <input
+          type="phone"
+          autocomplete="on"
+          formControlName="phone"
+          class="form-input"
+          (input)="updatedForm('phone', $event.target)"
+        />
+        <app-svg-icon *ngIf="form.get('phone').valid" [iconClass]="'validation'" [type]="'form'" [icon]="'validate'" />
+        <app-svg-icon
+          *ngIf="form.get('phone').value && !form.get('phone').valid"
+          [iconClass]="'validation'"
+          [type]="'form'"
+          [icon]="'notValidate'"
+        />
+      </div>
     </div>
-  </div>
-  <p *ngIf="isOrientationRdv && isPhone() && isEmail()" class="footnote">
-    <sup class="footnote-nb">1</sup> Un moyen de communication (email et/ou téléphone) est obligatoire pour valider
-    cette étape
-  </p>
-</form>
+    <p *ngIf="isOrientationRdv && isPhone() && isEmail()" class="footnote">
+      <sup class="footnote-nb">1</sup> Un moyen de communication (email et/ou téléphone) est obligatoire pour valider
+      cette étape
+    </p>
+  </form>
+</div>
diff --git a/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-beneficiary-info/mediation-beneficiary-info.component.ts b/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-beneficiary-info/mediation-beneficiary-info.component.ts
index eddda6a5d9e02cc048e37976328a0a0be4e5d1ae..9b8ac7ac62102b6a915f1ba1d7ed15bda3fe89c3 100644
--- a/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-beneficiary-info/mediation-beneficiary-info.component.ts
+++ b/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-beneficiary-info/mediation-beneficiary-info.component.ts
@@ -1,7 +1,7 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
 import { Utils } from '../../../../../utils/utils';
-import { MediationType } from '../../../types/mediation.type';
+import { MediationType } from '../../../types/orientation.types';
 
 @Component({
   selector: 'app-mediation-beneficiary-info',
diff --git a/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-hours-selection/mediation-hours-selection.component.html b/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-hours-selection/mediation-hours-selection.component.html
index 963e7803612cc0aa234187c9d7c79501ea808593..0886512f82062b9776455ec800ea9ed65c9ac303 100644
--- a/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-hours-selection/mediation-hours-selection.component.html
+++ b/src/app/form/orientation-form-view/online-demarch/online-mediation/mediation-hours-selection/mediation-hours-selection.component.html
@@ -1,10 +1,12 @@
-<h2>Sur quel créneau horaire la personne souhaite-t-elle être rappelée ?</h2>
-<div class="subtitle">Horaires de la Hotline</div>
-<div class="container">
-  <div *ngFor="let slot of timeSlots" class="slot">
-    <div class="day">{{ slot.day }}</div>
-    <button type="button" class="time" [ngClass]="{ selected: isSelected(slot) }" (click)="selectHour(slot)">
-      <span *ngFor="let str of slot.hours.split(' ')">{{ str }}</span>
-    </button>
+<div class="orientationForm">
+  <h2>Sur quel créneau horaire la personne souhaite-t-elle être rappelée ?</h2>
+  <div class="subtitle">Horaires de la Hotline</div>
+  <div class="container">
+    <div *ngFor="let slot of timeSlots" class="slot">
+      <div class="day">{{ slot.day }}</div>
+      <button type="button" class="time" [ngClass]="{ selected: isSelected(slot) }" (click)="selectHour(slot)">
+        <span *ngFor="let str of slot.hours.split(' ')">{{ str }}</span>
+      </button>
+    </div>
   </div>
 </div>
diff --git a/src/app/form/orientation-form-view/online-demarch/onlineDemarch-form.component.html b/src/app/form/orientation-form-view/online-demarch/onlineDemarch-form.component.html
index f361b712e534582ff9add2b5a868b2a5855b17e2..551ec89f816c541e041141ff23a8a9cf4b09e5bb 100644
--- a/src/app/form/orientation-form-view/online-demarch/onlineDemarch-form.component.html
+++ b/src/app/form/orientation-form-view/online-demarch/onlineDemarch-form.component.html
@@ -1,17 +1,17 @@
 <!-- COMMON FORM -->
-<ng-container *ngIf="currentType === onlineDemarcheTypeEnum.common">
+<ng-container *ngIf="currentType === OnlineDemarche.common">
   <app-online-demarch
-    *ngIf="needType === needEnum.onlineDemarch && currentStep === onlineDemarchesCommonStepsEnum.onlineDemarche"
+    *ngIf="needType === NeedsType.onlineDemarch && currentStep === OnlineDemarchesCommonSteps.onlineDemarche"
     [form]="form"
     (checkValidation)="checkValidation()"
   />
   <app-accompaniment-type
-    *ngIf="currentStep === onlineDemarchesCommonStepsEnum.accompanimentType"
+    *ngIf="currentStep === OnlineDemarchesCommonSteps.accompanimentType"
     [form]="form"
     (checkValidation)="checkValidation()"
   />
   <app-base-skills
-    *ngIf="needType === needEnum.learnSkills && currentStep === onlineDemarchesCommonStepsEnum.onlineDemarche"
+    *ngIf="needType === NeedsType.learnSkills && currentStep === OnlineDemarchesCommonSteps.onlineDemarche"
     [currentStep]="currentStep"
     [currentType]="currentType"
     [form]="filtersForm"
@@ -19,31 +19,31 @@
   />
 </ng-container>
 <!-- APPOINTMENT FORM -->
-<ng-container *ngIf="currentType === onlineDemarcheTypeEnum.appointment">
+<ng-container *ngIf="currentType === OnlineDemarche.appointment">
   <app-information-screen
-    *ngIf="currentStep === onlineDemarchesAppointmentSteps.infoScreen"
+    *ngIf="currentStep === OnlineDemarchesAppointmentSteps.infoScreen"
     [currentType]="currentType"
     (checkValidation)="checkValidation()"
   />
   <app-structure-orientator
-    *ngIf="currentStep === onlineDemarchesAppointmentSteps.structureOrientator"
+    *ngIf="currentStep === OnlineDemarchesAppointmentSteps.structureOrientator"
     [profile]="profile"
     [form]="form"
     (validatePage)="checkValidation()"
   />
   <app-structure-pmr
-    *ngIf="currentStep === onlineDemarchesAppointmentSteps.pmrAccess"
+    *ngIf="currentStep === OnlineDemarchesAppointmentSteps.pmrAccess"
     [structureForm]="form"
     (validateForm)="checkValidation()"
     (radioChange)="onRadioChange($event)"
   />
   <app-orientation-structure-address
-    *ngIf="currentStep === onlineDemarchesAppointmentSteps.location"
+    *ngIf="currentStep === OnlineDemarchesAppointmentSteps.location"
     [form]="form"
     (addressStructure)="checkValidation()"
   />
   <app-carto
-    *ngIf="currentStep === onlineDemarchesAppointmentSteps.carto"
+    *ngIf="currentStep === OnlineDemarchesAppointmentSteps.carto"
     [isOrientationForm]="true"
     [isOrientationRdv]="true"
     [filters]="filters"
@@ -52,7 +52,7 @@
     (structureSelectionRDV)="checkValidation($event)"
   />
   <app-make-appointment
-    *ngIf="currentStep === onlineDemarchesAppointmentSteps.makeAppointment"
+    *ngIf="currentStep === OnlineDemarchesAppointmentSteps.makeAppointment"
     [form]="form"
     [structureRDV]="structureRDV"
     (checkValidation)="checkValidation()"
@@ -61,13 +61,13 @@
     (setResetOrientation)="showResetOrientation()"
   />
   <app-mediation-beneficiary-info
-    *ngIf="currentStep === onlineDemarchesAppointmentSteps.mediationBeneficiaryInfo"
+    *ngIf="currentStep === OnlineDemarchesAppointmentSteps.mediationBeneficiaryInfo"
     [form]="form"
     [isOrientationRdv]="true"
     (checkValidation)="checkValidation()"
   />
   <app-appointment-end
-    *ngIf="currentStep === onlineDemarchesAppointmentSteps.rdvEnd"
+    *ngIf="currentStep === OnlineDemarchesAppointmentSteps.rdvEnd"
     [form]="form"
     [structureRDV]="structureRDV"
     [selectedStructureRDV]="selectedStructureRDV"
@@ -77,37 +77,37 @@
   />
 </ng-container>
 <!-- ONLINE MEDIATION FORM -->
-<ng-container *ngIf="currentType === onlineDemarcheTypeEnum.onlineMediation">
+<ng-container *ngIf="currentType === OnlineDemarche.onlineMediation">
   <app-information-screen
-    *ngIf="currentStep === HotlineMediationStepsEnum.infoScreen"
+    *ngIf="currentStep === HotlineMediationSteps.infoScreen"
     [currentType]="currentType"
     (checkValidation)="checkValidation()"
   />
   <app-mediation-beneficiary-info
-    *ngIf="currentStep === HotlineMediationStepsEnum.mediationBeneficiaryInfo"
+    *ngIf="currentStep === HotlineMediationSteps.mediationBeneficiaryInfo"
     [form]="form"
     (checkValidation)="checkValidation()"
   />
   <app-mediation-hours-selection
-    *ngIf="currentStep === HotlineMediationStepsEnum.mediationHoursSelection"
+    *ngIf="currentStep === HotlineMediationSteps.mediationHoursSelection"
     [form]="form"
     (checkValidation)="checkValidation()"
   />
   <app-mediation-language-selection
-    *ngIf="currentStep === HotlineMediationStepsEnum.mediationLanguageSelection"
+    *ngIf="currentStep === HotlineMediationSteps.mediationLanguageSelection"
     [form]="form"
     (checkValidation)="checkValidation()"
   />
   <app-orientation-recap
-    *ngIf="currentStep === HotlineMediationStepsEnum.orientationRecap"
+    *ngIf="currentStep === HotlineMediationSteps.orientationRecap"
     [form]="form"
-    [recapType]="recapsType.onlineMediation"
+    [recapType]="RecapsType.onlineMediation"
     (checkValidation)="checkValidation()"
   />
 </ng-container>
 <!-- STRUCTURE LIST FORM -->
 <app-orientation-structure-list
-  *ngIf="currentType === onlineDemarcheTypeEnum.structureList"
+  *ngIf="currentType === OnlineDemarche.structureList"
   [form]="form"
   [currentStep]="currentStep"
   [filters]="filters"
diff --git a/src/app/form/orientation-form-view/online-demarch/onlineDemarch-form.component.ts b/src/app/form/orientation-form-view/online-demarch/onlineDemarch-form.component.ts
index d0dd6b8351f0a7d2fa18d6dfe862536d5011d9ec..e4fd6e3aeb8b18bff983cc9156aa6133298ae285 100644
--- a/src/app/form/orientation-form-view/online-demarch/onlineDemarch-form.component.ts
+++ b/src/app/form/orientation-form-view/online-demarch/onlineDemarch-form.component.ts
@@ -7,17 +7,17 @@ import { OrientationService } from '../../../services/orientation.service';
 import { Category } from '../../../structure-list/models/category.model';
 import { Filter } from '../../../structure-list/models/filter.model';
 import { OrientationUtils } from '../../../utils/orientationUtils';
-import { AppointmentSteps } from '../enums/AppointmentSteps.enum';
-import { HotlineMediationSteps } from '../enums/hotlineMediationSteps.enum';
-import { NeedsType } from '../enums/needs.enum';
-import { OnlineDemarche } from '../enums/onlineDemarche.enum';
-import { OnlineDemarchesCommonSteps } from '../enums/onlineDemarchesCommonSteps.enum';
-import { RecapsType } from '../enums/recapsType.enum';
-import { StructuresListSteps } from '../enums/structuresListSteps.enum';
+import {
+  AppointmentSteps,
+  HotlineMediationSteps,
+  NeedsType,
+  OnlineDemarche,
+  OnlineDemarchesCommonSteps,
+  RecapsType,
+  StructuresListSteps,
+} from '../enums/orientation.enums';
 import { FiltersForm } from '../interfaces/filtersForm.interface';
-import { MediationType } from '../types/mediation.type';
-import { MediationStepType } from '../types/mediationStep.type';
-import { OnlineMediationSteps } from '../types/onlineDemarcheStep.type';
+import { MediationStepType, MediationType, OnlineMediationSteps } from '../types/orientation.types';
 
 @Component({
   selector: 'app-online-demarch-form',
@@ -43,13 +43,13 @@ export class OnlineDemarchFormComponent {
   public socialWorker: Owner;
 
   // Enums
-  public HotlineMediationStepsEnum = HotlineMediationSteps;
-  public onlineDemarchesCommonStepsEnum = OnlineDemarchesCommonSteps;
-  public structuresListStepsEnum = StructuresListSteps;
-  public onlineDemarcheTypeEnum = OnlineDemarche;
-  public onlineDemarchesAppointmentSteps = AppointmentSteps;
-  public needEnum = NeedsType;
-  public recapsType = RecapsType;
+  public HotlineMediationSteps = HotlineMediationSteps;
+  public OnlineDemarchesCommonSteps = OnlineDemarchesCommonSteps;
+  public StructuresListSteps = StructuresListSteps;
+  public OnlineDemarche = OnlineDemarche;
+  public OnlineDemarchesAppointmentSteps = AppointmentSteps;
+  public NeedsType = NeedsType;
+  public RecapsType = RecapsType;
 
   constructor(public orientationService: OrientationService) {}
 
diff --git a/src/app/form/orientation-form-view/orientation-form-view.component.html b/src/app/form/orientation-form-view/orientation-form-view.component.html
index 6be67e3c0d3b36e7ac8fa61773545ae07156a688..54e600aa11584bdce5b139ff703d83b0d836ae0a 100644
--- a/src/app/form/orientation-form-view/orientation-form-view.component.html
+++ b/src/app/form/orientation-form-view/orientation-form-view.component.html
@@ -46,21 +46,18 @@
       />
     </ng-container>
   </div>
-  <div class="navButtons">
-    <app-navigation
-      [currentStep]="currentStep"
-      [isLastStep]="isLastStep"
-      [needType]="needType"
-      [currentType]="currentType"
-      [isPageValid]="isPageValid"
-      [hideNavButtons]="hideNavButtons"
-      [shouldResetOrientation]="shouldResetOrientation"
-      (goNext)="nextPage()"
-      (goPrev)="prevPage()"
-      (goReset)="reset()"
-    />
-  </div>
-
+  <app-navigation
+    [currentStep]="currentStep"
+    [isLastStep]="isLastStep"
+    [needType]="needType"
+    [currentType]="currentType"
+    [isPageValid]="isPageValid"
+    [hideNavButtons]="hideNavButtons"
+    [shouldResetOrientation]="shouldResetOrientation"
+    (goNext)="nextPage()"
+    (goPrev)="prevPage()"
+    (goReset)="reset()"
+  />
   <app-v3-modal
     [opened]="showConfirmationModal"
     [title]="'Attention'"
diff --git a/src/app/form/orientation-form-view/orientation-form-view.component.scss b/src/app/form/orientation-form-view/orientation-form-view.component.scss
index 1e2cf3218722ac98e46319718316a0c8aaac92de..86ab63866ba9fe435f46fa484715e66d3eb7569a 100644
--- a/src/app/form/orientation-form-view/orientation-form-view.component.scss
+++ b/src/app/form/orientation-form-view/orientation-form-view.component.scss
@@ -7,25 +7,17 @@
   height: 100%;
 }
 
-::ng-deep h2 {
-  margin-top: 0;
-}
-
 .orientation {
   height: 100%;
   display: flex;
   flex-direction: column;
   .container {
     box-sizing: border-box;
-    max-width: 980px;
-    width: 100%;
+
     height: 100%;
-    margin: 16px auto auto auto;
+    margin: auto;
     overflow-y: auto;
-    color: $grey-1;
-    background: $white;
-    border-radius: 8px;
-    border: 1px solid $grey-6;
+
     padding: 2rem 3rem;
     @media #{$tablet} {
       padding: 1rem;
@@ -35,13 +27,13 @@
     max-width: none;
     padding: 0;
   }
-  .navButtons {
-    margin-top: auto;
-    padding: 1rem;
-  }
 }
 
 ::ng-deep.title {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+
   .overtitle {
     @include font-regular-18;
     color: $grey-3;
@@ -50,7 +42,6 @@
 
   h3 {
     @include font-bold-24;
-    margin: 0;
     @media #{$tablet} {
       @include font-bold-22;
     }
@@ -63,14 +54,24 @@
   p {
     @include font-regular-18;
     color: $grey-3;
-    font-style: italic;
-    margin-top: 4px;
   }
+  // V3REMOVE
   .backArrow {
     cursor: pointer;
   }
 }
 
 div.titleform {
-  color: red;
+  color: $red;
+}
+
+::ng-deep .orientationForm {
+  display: flex;
+  flex-direction: column;
+  gap: 40px;
+
+  width: 600px;
+  @media #{$tablet} {
+    width: auto;
+  }
 }
diff --git a/src/app/form/orientation-form-view/orientation-form-view.component.ts b/src/app/form/orientation-form-view/orientation-form-view.component.ts
index 4c6ecc073b4c555900182623642f370619468d5b..73c394f7cf1c7254b32e136443af6332381085c4 100644
--- a/src/app/form/orientation-form-view/orientation-form-view.component.ts
+++ b/src/app/form/orientation-form-view/orientation-form-view.component.ts
@@ -17,14 +17,16 @@ import { Module } from '../../structure-list/models/module.model';
 import { SearchService } from '../../structure-list/services/search.service';
 import { OrientationUtils } from '../../utils/orientationUtils';
 import { Utils } from '../../utils/utils';
-import { AppointmentSteps } from './enums/AppointmentSteps.enum';
-import { FiltersSteps } from './enums/filtersSteps.enum';
-import { GenericOrientationSteps } from './enums/genericOrientationSteps.enum';
-import { HotlineMediationSteps } from './enums/hotlineMediationSteps.enum';
-import { NeedsType } from './enums/needs.enum';
-import { OnlineDemarche } from './enums/onlineDemarche.enum';
-import { OnlineDemarchesCommonSteps } from './enums/onlineDemarchesCommonSteps.enum';
-import { StructuresListSteps } from './enums/structuresListSteps.enum';
+import {
+  AppointmentSteps,
+  FiltersSteps,
+  GenericOrientationSteps,
+  HotlineMediationSteps,
+  NeedsType,
+  OnlineDemarche,
+  OnlineDemarchesCommonSteps,
+  StructuresListSteps,
+} from './enums/orientation.enums';
 import { IAppointment } from './interfaces/appointment.interface';
 import { FiltersForm } from './interfaces/filtersForm.interface';
 import { IOnlineMediation } from './interfaces/onlineMediation.interface';
@@ -35,8 +37,7 @@ import {
 } from './interfaces/orientationIndicator.interface';
 import { StructureOrientationForm } from './interfaces/structureOrientationForm.interface';
 import { StructureOrientator } from './interfaces/structureOrientator.interface';
-import { MediationType } from './types/mediation.type';
-import { MediationStepType } from './types/mediationStep.type';
+import { MediationStepType, MediationType } from './types/orientation.types';
 
 @Component({
   selector: 'app-orientation-form-view',
@@ -72,7 +73,7 @@ export class OrientationFormViewComponent implements OnInit, AfterContentChecked
   public currentStep: MediationStepType = null;
   public isLastStep = false;
   public hideNavButtons = false;
-  public nbSteps: number = OrientationFormViewComponent.MAX_STEP;
+  public nbSteps = OrientationFormViewComponent.MAX_STEP;
   public isPageValid = false;
   public filters: Filter[] = [];
   public profile: User;
@@ -245,7 +246,7 @@ export class OrientationFormViewComponent implements OnInit, AfterContentChecked
         this.notificationService.showSuccess('Votre démarche en ligne a bien été enregistrée');
       })
       .catch(() => {
-        this.notificationService.showErrorPleaseRetry('Echec de la création de votre démarche en ligne');
+        this.notificationService.showErrorPleaseRetry('Échec de la création de votre démarche en ligne');
       })
       .finally(() => this.printForm());
   }
@@ -428,7 +429,7 @@ export class OrientationFormViewComponent implements OnInit, AfterContentChecked
           await this.handleAppointment();
         } catch (e) {
           console.log(e);
-          this.notificationService.showErrorPleaseRetry("Echec de l'envoi de votre demande de RDV");
+          this.notificationService.showErrorPleaseRetry("Échec de l'envoi de votre demande de RDV");
           // If appointment fails, don't go to next page
           return;
         }
diff --git a/src/app/form/orientation-form-view/orientation-structure-list/orientation-comments/orientation-comments.component.html b/src/app/form/orientation-form-view/orientation-structure-list/orientation-comments/orientation-comments.component.html
index a035946c157161389c45724ad99aa313ce3e903b..885c7b3627f316b8f4521c4fb2e3ca0ea97dff7a 100644
--- a/src/app/form/orientation-form-view/orientation-structure-list/orientation-comments/orientation-comments.component.html
+++ b/src/app/form/orientation-form-view/orientation-structure-list/orientation-comments/orientation-comments.component.html
@@ -1,17 +1,19 @@
-<form [formGroup]="form">
+<form class="orientationForm" [formGroup]="form">
   <div class="title">
     <h3>Avez-vous des précisions à apporter&nbsp;?</h3>
     <p>Facultatif</p>
   </div>
-  <p>Ces informations accompagneront la fiche d'orientation de la personne</p>
-  <div class="textareaBlock" fxLayout="column">
-    <textarea
-      rows="8"
-      placeholder=""
-      maxlength="500"
-      formControlName="comments"
-      (input)="setComment($event.target)"
-    ></textarea>
-    <p class="count">{{ getStructureControl('comments').value?.length || 0 }}&nbsp;/&nbsp;500</p>
+  <div>
+    <p>Ces informations accompagneront la fiche d'orientation de la personne</p>
+    <div class="textareaBlock" fxLayout="column">
+      <textarea
+        rows="8"
+        placeholder=""
+        maxlength="500"
+        formControlName="comments"
+        (input)="setComment($event.target)"
+      ></textarea>
+      <p class="count">{{ getStructureControl('comments').value?.length || 0 }}&nbsp;/&nbsp;500</p>
+    </div>
   </div>
 </form>
diff --git a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.html b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.html
index 5278bdf7a1d027ef4b7619baac7d25dbd265e717..b9174874114c4c319dd6d407a53a863d67a43cb3 100644
--- a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.html
+++ b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.html
@@ -1,6 +1,5 @@
-<form *ngIf="form" [formGroup]="form">
+<form *ngIf="form" class="orientationForm" [formGroup]="form">
   <div class="title">
-    <p class="overtitle">{{ structureName }}</p>
     <h3>Autour de quelle adresse cherchez-vous une structure&nbsp;?</h3>
     <p>Facultatif</p>
   </div>
diff --git a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.ts b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.ts
index 52c536fdc956fe7a997ddee5bc4097354c81665a..1a4775b0c916a7765d0b94f07750d425d15f11f1 100644
--- a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.ts
+++ b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-address/orientation-structure-address.component.ts
@@ -9,8 +9,6 @@ import { Address } from '../../../../models/address.model';
 export class OrientationStructureAddressComponent implements OnInit {
   @Input() form: UntypedFormGroup;
   @Output() addressStructure = new EventEmitter<any>();
-  // this variable existed but never was defined
-  public structureName = '';
 
   ngOnInit(): void {
     this.setAddressStructure();
@@ -20,8 +18,4 @@ export class OrientationStructureAddressComponent implements OnInit {
     this.form.get('address').patchValue(address);
     this.addressStructure.emit(address);
   }
-
-  public goBack(): void {
-    history.back();
-  }
 }
diff --git a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-list.component.html b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-list.component.html
index 589de6bc171d92130e271d4bc0be30628134cfa6..e62fa71128b1687ed3c5308c51c65fe382eba2ee 100644
--- a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-list.component.html
+++ b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-list.component.html
@@ -1,16 +1,16 @@
 <ng-container>
   <app-structure-pmr
-    *ngIf="currentStep === structuresListStepsEnum.pmrAccess"
+    *ngIf="currentStep === StructuresListSteps.pmrAccess"
     [structureForm]="form"
     (radioChange)="radioChange($event)"
   />
   <app-orientation-structure-address
-    *ngIf="currentStep === structuresListStepsEnum.address"
+    *ngIf="currentStep === StructuresListSteps.address"
     [form]="form"
     (addressStructure)="checkValidation($event)"
   />
   <app-carto
-    *ngIf="currentStep === structuresListStepsEnum.structureChoice"
+    *ngIf="currentStep === StructuresListSteps.structureChoice"
     [isOrientationForm]="true"
     [structuresSelected]="selectedStructures"
     [filters]="filters"
@@ -19,28 +19,28 @@
     (structureSelection)="checkValidation($event)"
   />
   <app-structure-orientator
-    *ngIf="currentStep === structuresListStepsEnum.structureOrientator"
+    *ngIf="currentStep === StructuresListSteps.structureOrientator"
     [profile]="profile"
     [form]="form"
     (validatePage)="checkValidation($event)"
   />
 
   <app-mediation-beneficiary-info
-    *ngIf="currentStep === structuresListStepsEnum.mediationBeneficiaryInfo"
+    *ngIf="currentStep === StructuresListSteps.mediationBeneficiaryInfo"
     [form]="form"
     (checkValidation)="checkValidation()"
   />
 
   <app-orientation-comments
-    *ngIf="currentStep === structuresListStepsEnum.comments"
+    *ngIf="currentStep === StructuresListSteps.comments"
     [form]="form"
     (checkValidation)="checkValidation()"
   />
 
   <app-orientation-recap
-    *ngIf="currentStep === structuresListStepsEnum.orientationRecap"
+    *ngIf="currentStep === StructuresListSteps.orientationRecap"
     [form]="form"
-    [recapType]="recapsType.structure"
+    [recapType]="RecapsType.structure"
     (checkValidation)="checkValidation()"
   />
 </ng-container>
diff --git a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-list.component.ts b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-list.component.ts
index 52dd666472fcf548f33f601cf77167c1946cdd20..f2a34f123df0c959a2fa3902ea854fc663c333c4 100644
--- a/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-list.component.ts
+++ b/src/app/form/orientation-form-view/orientation-structure-list/orientation-structure-list.component.ts
@@ -4,11 +4,8 @@ import { Structure } from '../../../models/structure.model';
 import { User } from '../../../models/user.model';
 import { Filter } from '../../../structure-list/models/filter.model';
 import { OrientationUtils } from '../../../utils/orientationUtils';
-import { FiltersSteps } from '../enums/filtersSteps.enum';
-import { NeedsType } from '../enums/needs.enum';
-import { RecapsType } from '../enums/recapsType.enum';
-import { StructuresListSteps } from '../enums/structuresListSteps.enum';
-import { MediationStepType } from '../types/mediationStep.type';
+import { FiltersSteps, NeedsType, RecapsType, StructuresListSteps } from '../enums/orientation.enums';
+import { MediationStepType } from '../types/orientation.types';
 
 @Component({
   selector: 'app-orientation-structure-list',
@@ -24,8 +21,8 @@ export class OrientationStructureListComponent implements OnChanges {
   public orientationUtils = new OrientationUtils();
 
   // Enum
-  public structuresListStepsEnum = StructuresListSteps;
-  public recapsType = RecapsType;
+  public StructuresListSteps = StructuresListSteps;
+  public RecapsType = RecapsType;
   // Init data for form
   public selectedStructures: Structure[] = [];
 
diff --git a/src/app/form/orientation-form-view/orientation.module.ts b/src/app/form/orientation-form-view/orientation.module.ts
index 18f8549974a6922ea110b042729dc6192831b323..6a93092ddf55550113d4740a11beb61c08a1069b 100644
--- a/src/app/form/orientation-form-view/orientation.module.ts
+++ b/src/app/form/orientation-form-view/orientation.module.ts
@@ -8,7 +8,6 @@ import { EquipmentAccessComponent } from './equipment-access/equipment-access.co
 import { EquipmentBuyTypeComponent } from './equipment-buy/equipment-buy-type/equipment-buy-type.component';
 import { EquipmentBuyComponent } from './equipment-buy/equipment-buy.component';
 import { InformationScreenComponent } from './global-components/information-screen/information-screen.component';
-import { MultiRadioFormComponent } from './global-components/multi-radio-form/multi-radio-form.component';
 import { NavigationComponent } from './global-components/navigation/navigation.component';
 import { NeedsSelectionComponent } from './global-components/needs-selection/needs-selection.component';
 import { OrientationRecapComponent } from './global-components/orientation-recap/orientation-recap.component';
@@ -34,7 +33,6 @@ import { OrientationStructureListComponent } from './orientation-structure-list/
     OrientationFormViewComponent,
     NeedsSelectionComponent,
     NavigationComponent,
-    MultiRadioFormComponent,
     OnlineDemarchComponent,
     AccompanimentTypeComponent,
     MediationBeneficiaryInfoComponent,
diff --git a/src/app/form/orientation-form-view/types/mediation.type.ts b/src/app/form/orientation-form-view/types/mediation.type.ts
deleted file mode 100644
index 9962f47663cfe7e6baefaee280c8926e8b87170c..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/types/mediation.type.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { GenericOrientationSteps } from '../enums/genericOrientationSteps.enum';
-import { OnlineDemarche } from '../enums/onlineDemarche.enum';
-
-export type MediationType = OnlineDemarche | GenericOrientationSteps;
diff --git a/src/app/form/orientation-form-view/types/mediationStep.type.ts b/src/app/form/orientation-form-view/types/mediationStep.type.ts
deleted file mode 100644
index b9fc29ad07fd17bd2c4182e32aaeaca7b27123be..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/types/mediationStep.type.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { FiltersSteps } from '../enums/filtersSteps.enum';
-import { OnlineMediationSteps } from './onlineDemarcheStep.type';
-
-export type MediationStepType = OnlineMediationSteps | FiltersSteps;
diff --git a/src/app/form/orientation-form-view/types/onlineDemarcheStep.type.ts b/src/app/form/orientation-form-view/types/onlineDemarcheStep.type.ts
deleted file mode 100644
index 4134976e9518457e79da9cf46045fc5afd29e28a..0000000000000000000000000000000000000000
--- a/src/app/form/orientation-form-view/types/onlineDemarcheStep.type.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { AppointmentSteps } from '../enums/AppointmentSteps.enum';
-import { HotlineMediationSteps } from '../enums/hotlineMediationSteps.enum';
-import { OnlineDemarchesCommonSteps } from '../enums/onlineDemarchesCommonSteps.enum';
-import { StructuresListSteps } from '../enums/structuresListSteps.enum';
-
-export type OnlineMediationSteps =
-  | HotlineMediationSteps
-  | StructuresListSteps
-  | OnlineDemarchesCommonSteps
-  | AppointmentSteps;
diff --git a/src/app/form/orientation-form-view/types/orientation.types.ts b/src/app/form/orientation-form-view/types/orientation.types.ts
new file mode 100644
index 0000000000000000000000000000000000000000..2a9694d2aee8f938f425902a4478f1f31b802024
--- /dev/null
+++ b/src/app/form/orientation-form-view/types/orientation.types.ts
@@ -0,0 +1,19 @@
+import {
+  AppointmentSteps,
+  FiltersSteps,
+  GenericOrientationSteps,
+  HotlineMediationSteps,
+  OnlineDemarche,
+  OnlineDemarchesCommonSteps,
+  StructuresListSteps,
+} from '../enums/orientation.enums';
+
+export type MediationType = OnlineDemarche | GenericOrientationSteps;
+
+export type OnlineMediationSteps =
+  | HotlineMediationSteps
+  | StructuresListSteps
+  | OnlineDemarchesCommonSteps
+  | AppointmentSteps;
+
+export type MediationStepType = OnlineMediationSteps | FiltersSteps;
diff --git a/src/app/profile/profile-structure/personal-offer/personal-offer.component.html b/src/app/profile/profile-structure/personal-offer/personal-offer.component.html
index f449cc5ab755214ba95bfdf28331384a928c37cc..ce8e602c29d82a5587cec4f47f66a937c4371a00 100644
--- a/src/app/profile/profile-structure/personal-offer/personal-offer.component.html
+++ b/src/app/profile/profile-structure/personal-offer/personal-offer.component.html
@@ -4,7 +4,6 @@
     <app-v3-button
       *ngIf="!isPublic"
       class="hide-on-mobile"
-      tabindex="none"
       [state]="{ structureName: this.structureName }"
       routerLink="./edit-personal-offer/{{ this.personalOffer._id }}"
       [variant]="buttonTypeEnumV3.Secondary"
@@ -16,7 +15,6 @@
     <app-v3-icon-button
       *ngIf="!isPublic"
       class="hide-on-desktop"
-      tabindex="none"
       routerLink="./edit-personal-offer/{{ this.personalOffer._id }}"
       [variant]="buttonTypeEnumV3.Secondary"
       [iconName]="'editV3'"
diff --git a/src/app/profile/profile.component.scss b/src/app/profile/profile.component.scss
index 309a2c0c06316fbc75fc990c36c84dd4c510198c..c3a08de0f9e3fb0a3fc522c9b16ad3ac03ae789c 100644
--- a/src/app/profile/profile.component.scss
+++ b/src/app/profile/profile.component.scss
@@ -47,7 +47,7 @@ section {
   h1 {
     @include font-bold-18;
   }
-
+  // V3REMOVE
   .backArrow {
     cursor: pointer;
   }
diff --git a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
index b3893b542be73e6ae5e27ac2cd0c9b1498886d5e..8a61a6144a08cab71e3e5f15879d55164f6d5fdc 100644
--- a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
+++ b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
@@ -5,6 +5,7 @@ import { StructureWithOwners } from '../../models/structureWithOwners.model';
 import { TempUser } from '../../models/temp-user.model';
 import { NotificationService } from '../../services/notification.service';
 import { StructureService } from '../../services/structure.service';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
 import { CustomRegExp } from '../../utils/CustomRegExp';
 
 @Component({
@@ -16,6 +17,7 @@ export class StructureAddMemberModalComponent implements OnInit {
   @Input() public opened: boolean;
   @Input() public structure: StructureWithOwners;
   @Output() closed = new EventEmitter<boolean>();
+  public buttonTypeEnumV3 = ButtonTypeV3;
   public formAddAccount: FormGroup;
 
   constructor(
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.scss b/src/app/profile/structure-members-management/structure-members-management.component.scss
index 57822bb553ff96b580f2fef6202a0cb348877dd3..ae974d1adae0617cd562fca8f792f3ebdc6c28c6 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.scss
+++ b/src/app/profile/structure-members-management/structure-members-management.component.scss
@@ -109,9 +109,4 @@
     width: 184px !important;
     height: 24px !important;
   }
-  .button-member {
-    ::ng-deep .btn-regular.secondary .text {
-      color: $red !important;
-    }
-  }
 }
diff --git a/src/app/shared/components/password-form/password-form.component.ts b/src/app/shared/components/password-form/password-form.component.ts
index 61d34106fdab22873d231e23c9568fae31abb176..d9e5255b8924b946ff1227003199a3cd5fe91dad 100644
--- a/src/app/shared/components/password-form/password-form.component.ts
+++ b/src/app/shared/components/password-form/password-form.component.ts
@@ -83,24 +83,21 @@ export class PasswordFormComponent implements OnInit {
   }
 
   public checkIfPasswordHasSpecialChar(password: string): boolean {
-    if (password.match(CustomRegExp.SPECHAR)) return true;
-    return false;
+    return Boolean(password.match(CustomRegExp.SPECHAR));
   }
 
   public checkIfPasswordHasDigit(password: string): boolean {
-    if (password.match(CustomRegExp.DIGIT)) return true;
-    return false;
+    return Boolean(password.match(CustomRegExp.DIGIT));
   }
 
   public checkIfPasswordHasUpperCase(password: string): boolean {
-    if (password.match(CustomRegExp.UPPERCASE)) return true;
-    return false;
+    return Boolean(password.match(CustomRegExp.UPPERCASE));
   }
 
   public checkIfPasswordHasLowerCase(password: string): boolean {
-    if (password.match(CustomRegExp.LOWERCASE)) return true;
-    return false;
+    return Boolean(password.match(CustomRegExp.LOWERCASE));
   }
+
   public checkOldPassword(password: string): boolean {
     if (
       password !== '' &&
@@ -131,7 +128,7 @@ export class PasswordFormComponent implements OnInit {
             this.passwordError = false;
           },
           error: () => {
-            this.notificationService.showError('Echec de la réinitialisation de votre mot de passe');
+            this.notificationService.showError('Échec de la réinitialisation de votre mot de passe');
             this.passwordError = true;
           },
           complete: () => {
@@ -144,7 +141,7 @@ export class PasswordFormComponent implements OnInit {
           this.notificationService.showSuccess('Votre mot de passe a été réinitialisé avec succès.');
         },
         error: () => {
-          this.notificationService.showError('Echec de la réinitialisation de votre mot de passe');
+          this.notificationService.showError('Échec de la réinitialisation de votre mot de passe');
         },
         complete: () => {
           this.router.navigate(['']);
diff --git a/src/app/shared/components/radio-option/radio-option.component.html b/src/app/shared/components/radio-option/radio-option.component.html
index b095f51a5363cb0674e4d011efedf75c225f990d..00f21749e6d978e90610b438bf8be9da186a6615 100644
--- a/src/app/shared/components/radio-option/radio-option.component.html
+++ b/src/app/shared/components/radio-option/radio-option.component.html
@@ -1,3 +1,10 @@
 <button type="button" tabindex="-1" [ngClass]="{ selected: selected }" (click)="clicked()">
-  <app-radio [id]="id" [checked]="selected === true" [label]="label" [description]="description" [size]="size" />
+  <app-radio
+    [id]="id"
+    [checked]="selected === true"
+    [label]="label"
+    [description]="description"
+    [size]="size"
+    [iconName]="iconName"
+  />
 </button>
diff --git a/src/app/shared/components/radio-option/radio-option.component.ts b/src/app/shared/components/radio-option/radio-option.component.ts
index 9ce43b25c14c48325b41771b8bc4bde346832dbe..cd34e78339208eec37d9131b1da60770c9f1bd7f 100644
--- a/src/app/shared/components/radio-option/radio-option.component.ts
+++ b/src/app/shared/components/radio-option/radio-option.component.ts
@@ -24,6 +24,9 @@ export class RadioOptionComponent {
   /** What size should the checkbox be ? */
   @Input() size?: 'small' | 'medium' = 'medium';
 
+  /** Optional icon to display between the radio and label */
+  @Input() iconName?: string;
+
   @Output() selectedEvent = new EventEmitter<{ name: string; value: string | boolean }>();
 
   public clicked(): void {
diff --git a/src/app/shared/components/radio-option/radio-option.stories.ts b/src/app/shared/components/radio-option/radio-option.stories.ts
index 7b017318ad144689fbfcc66179458bb3a1b8ab93..9b0703e9d58325e7b84d1a9a9d718607e591d01e 100644
--- a/src/app/shared/components/radio-option/radio-option.stories.ts
+++ b/src/app/shared/components/radio-option/radio-option.stories.ts
@@ -29,6 +29,7 @@ export const RadioOption: Story = {
   },
   decorators: [componentWrapperDecorator((story) => `<div style="max-width:600px;">${story}</div>`)],
 };
+
 export const RadioOptionSelected: Story = {
   args: {
     id: 'yes',
@@ -37,6 +38,7 @@ export const RadioOptionSelected: Story = {
   },
   decorators: [componentWrapperDecorator((story) => `<div style="max-width:600px;">${story}</div>`)],
 };
+
 export const RadioOptionWithDescription: Story = {
   args: {
     id: 'yes',
@@ -46,3 +48,12 @@ export const RadioOptionWithDescription: Story = {
   },
   decorators: [componentWrapperDecorator((story) => `<div style="max-width:600px;">${story}</div>`)],
 };
+
+export const RadioWithIcon: Story = {
+  args: {
+    id: 'equipment',
+    label: 'Accéder à du matériel numérique en libre service',
+    description: '(Wifi, ordinateur, imprimante, scanner...)',
+    iconName: 'orientationIndex0',
+  },
+};
diff --git a/src/app/shared/components/structure-pmr/structure-pmr.component.html b/src/app/shared/components/structure-pmr/structure-pmr.component.html
index b9bf943bf89336a0dde93e56161aa4328d432351..c7726274427f2c69dba93e7f7c33f44cee00c539 100644
--- a/src/app/shared/components/structure-pmr/structure-pmr.component.html
+++ b/src/app/shared/components/structure-pmr/structure-pmr.component.html
@@ -1,4 +1,4 @@
-<form [formGroup]="structureForm">
+<form class="orientationForm" [formGroup]="structureForm">
   <app-go-back *ngIf="isEditMode" (action)="goBack()" />
   <div class="title">
     <h3>{{ title ? title : 'La personne a-t-elle besoin d’un accès mobilité réduite ?' }}</h3>
diff --git a/src/app/shared/components/svg-icon/svg-icon.component.scss b/src/app/shared/components/svg-icon/svg-icon.component.scss
index 0809bd11b58d7463fa5646b00dbe4e9ba98e05ea..7f77f0f919e7ae54d9514bd608804033a664d334 100644
--- a/src/app/shared/components/svg-icon/svg-icon.component.scss
+++ b/src/app/shared/components/svg-icon/svg-icon.component.scss
@@ -79,6 +79,7 @@ $sizes: (
     fill: $green-1;
     stroke: $green-1;
   }
+  // V3REMOVE
   &.backArrow {
     height: 40px;
     width: 40px;
diff --git a/src/app/shared/components/v3/button/Button.stories.ts b/src/app/shared/components/v3/button/Button.stories.ts
index 1fdef4e07fd87715ce4988d47d8087a191d00f65..38278a52ad6ccaeaebffb7a91fbe09a493374d47 100644
--- a/src/app/shared/components/v3/button/Button.stories.ts
+++ b/src/app/shared/components/v3/button/Button.stories.ts
@@ -50,8 +50,8 @@ export const PrimaryWithIcon: Story = {
     ...Primary.args,
     label: 'Suivant',
     iconPosition: 'right',
-    iconFolder: 'form',
-    iconName: 'chevronRight',
+    iconFolder: 'ico',
+    iconName: 'arrowForwardV3',
   },
 };
 
diff --git a/src/app/shared/components/v3/button/button.component.html b/src/app/shared/components/v3/button/button.component.html
index 25c1228668e4b29a642ee5f368251c07362c3dc0..ca37ddecd6b751764de09577de639339230b30b7 100644
--- a/src/app/shared/components/v3/button/button.component.html
+++ b/src/app/shared/components/v3/button/button.component.html
@@ -1,4 +1,9 @@
-<button [type]="type" [ngClass]="classes" [disabled]="disabled" (click)="action.emit($event)">
+<button
+  [type]="type"
+  [ngClass]="classes"
+  [disabled]="disabled"
+  (click)="action.emit($event)">
+
   <app-svg-icon
     *ngIf="iconName && iconPosition === 'left'"
     [type]="iconFolder"
@@ -14,4 +19,5 @@
     [iconColor]="'currentColor'"
     [iconClass]="'icon-20'"
   />
+
 </button>
diff --git a/src/app/shared/components/v3/button/icon-button/IconButton.stories.ts b/src/app/shared/components/v3/button/icon-button/IconButton.stories.ts
index b77ac3f1dd7e3e173d1d570a4fde2f1d8b50e133..ecd3dd0fb6b682f9de2cc0f4904692f07c4e440e 100644
--- a/src/app/shared/components/v3/button/icon-button/IconButton.stories.ts
+++ b/src/app/shared/components/v3/button/icon-button/IconButton.stories.ts
@@ -26,8 +26,8 @@ export const Primary: Story = {
   args: {
     variant: ButtonTypeV3.PrimaryBlack,
     disabled: false,
-    iconFolder: 'form',
-    iconName: 'chevronRight',
+    iconFolder: 'ico',
+    iconName: 'editV3',
   },
 };
 
diff --git a/src/app/utils/orientationUtils.ts b/src/app/utils/orientationUtils.ts
index 2192da6b9d786cf359a7c93c86dcb7357a1c6bc4..6d7f799d056681e01f4be77b1248fe31e59eee85 100644
--- a/src/app/utils/orientationUtils.ts
+++ b/src/app/utils/orientationUtils.ts
@@ -1,12 +1,15 @@
 import { FormControl, FormGroup, UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms';
 import { structureFormStep } from '../form/form-view/structure-form/structureFormStep.enum';
-import { AppointmentSteps } from '../form/orientation-form-view/enums/AppointmentSteps.enum';
-import { FiltersSteps } from '../form/orientation-form-view/enums/filtersSteps.enum';
-import { HotlineMediationSteps } from '../form/orientation-form-view/enums/hotlineMediationSteps.enum';
-import { NeedsType } from '../form/orientation-form-view/enums/needs.enum';
-import { OnlineDemarchesCommonSteps } from '../form/orientation-form-view/enums/onlineDemarchesCommonSteps.enum';
-import { PreferredLanguages } from '../form/orientation-form-view/enums/preferredLanguages.enum';
-import { StructuresListSteps } from '../form/orientation-form-view/enums/structuresListSteps.enum';
+import {
+  AppointmentSteps,
+  FiltersSteps,
+  HotlineMediationSteps,
+  NeedsType,
+  OnlineDemarche,
+  OnlineDemarchesCommonSteps,
+  PreferredLanguages,
+  StructuresListSteps,
+} from '../form/orientation-form-view/enums/orientation.enums';
 import { AppointmentForm } from '../form/orientation-form-view/interfaces/appointmentForm.interface';
 import { FiltersForm } from '../form/orientation-form-view/interfaces/filtersForm.interface';
 import { OnlineDemarchesForm } from '../form/orientation-form-view/interfaces/onlineDemarchesForm.interface';
@@ -27,32 +30,10 @@ export interface IStructureSummary {
 export interface INeedItem {
   title: string;
   hint: string;
-  key: NeedsType | string;
+  key: NeedsType | OnlineDemarche;
+  icon?: string;
 }
 export class OrientationUtils {
-  public needsList: INeedItem[] = [
-    {
-      title: 'Accéder à du matériel numérique en libre service',
-      hint: '(Wifi, ordinateur, imprimante, scanner…)',
-      key: NeedsType.equipmentAccess,
-    },
-    {
-      title: 'Acheter du matériel numérique à tarif solidaire',
-      hint: '(Ordinateur, smartphone, clé 4G, forfait internet…)',
-      key: NeedsType.equipmentBuy,
-    },
-    {
-      title: 'Réaliser une démarche en ligne',
-      hint: '(Démarche Caf, CPAM, Pôle emploi…)',
-      key: NeedsType.onlineDemarch,
-    },
-    {
-      title: 'Acquérir les compétences numériques de base',
-      hint: '(Ordinateur et smartphone, mails, réseaux sociaux et bureautique...)',
-      key: NeedsType.learnSkills,
-    },
-  ];
-
   public createOnlineDemarchesForm(): FormGroup<OnlineDemarchesForm> {
     return new FormGroup<OnlineDemarchesForm>({
       onlineDemarcheType: new FormControl<Module[]>([], Validators.required),
diff --git a/src/assets/scss/_layout.scss b/src/assets/scss/_layout.scss
index d311193145fd8827881507f3932858f9b9ae149e..8aec0e8f53891e234b80ec8db8c9ef2dcbb81813 100644
--- a/src/assets/scss/_layout.scss
+++ b/src/assets/scss/_layout.scss
@@ -5,3 +5,4 @@ $footer-height-phone: 75px;
 $header-post-height: 180px;
 $content-desktop-width: 980px;
 $orientation-progressBarAndButtons: 119px;
+$progress-bar-height: 49px;
diff --git a/src/styles.scss b/src/styles.scss
index 67665692cef2dd53d158868474a57b19fcc693fd..d124bf4a22ccbbf62e6697b13697118a2eb4a304 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -589,3 +589,10 @@ p {
 sup {
   color: $red;
 }
+
+.formGroup {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  max-width: 600px;
+}