diff --git a/src/app/features/administration/form/date-select/date-select.component.html b/src/app/features/administration/form/date-select/date-select.component.html
index 1b4716bf..978c5a1b 100644
--- a/src/app/features/administration/form/date-select/date-select.component.html
+++ b/src/app/features/administration/form/date-select/date-select.component.html
@@ -1,48 +1,47 @@
 <div class="date-selection">
-	<!--	<form [formGroup]="form">-->
-	<!--	interval-->
-	<button
-		(click)="showDateInterval = !showDateInterval"
-		[ngClass]="{ active: showDateInterval }"
-		class="btn btn--primary"
-		id="toggle_interval_button"
-	>
-		<i class="fa fa-clock-o" aria-hidden="true"></i>
-		<span>
-			{{ 'dates.add_interval' | translate }}
-		</span>
-	</button>
-	<fieldset *ngIf="showDateInterval" class="date-interval form-row is-boxed">
-		<h2>{{ 'dates.add_interval' | translate }}</h2>
-		<div class="columns">
-			<div class="column">
-				{{ 'dates.interval_propose' | translate }}
-			</div>
-			<div class="column">
-				<label for="start_interval" class="hidden">start</label>
-				<input id="start_interval" (change)="countDays()" formControlName="startDateInterval" type="date" />
-			</div>
-		</div>
-		<div class="columns">
-			<div class="column">
-				{{ 'dates.interval_span' | translate }}
-			</div>
-			<div class="column">
-				<label for="end_interval" class="hidden">end</label>
-				<input id="end_interval" formControlName="endDateInterval" type="date" />
-			</div>
-		</div>
-		<button (click)="addIntervalOfDates()" class="btn btn-block btn--primary">
-			<i class="fa fa-plus" aria-hidden="true"></i>
-			{{ 'dates.interval_button' | translate }}
-			{{ intervalDays }}
-			{{ 'dates.interval_button_dates' | translate }}
+	<form [formGroup]="form">
+		<!--	interval-->
+		<button
+			(click)="showDateInterval = !showDateInterval"
+			[ngClass]="{ active: showDateInterval }"
+			class="btn btn--primary"
+			id="toggle_interval_button"
+		>
+			<i class="fa fa-clock-o" aria-hidden="true"></i>
+			<span>
+				{{ 'dates.add_interval' | translate }}
+			</span>
 		</button>
-	</fieldset>
-
-	<!--	</form>-->
+		<fieldset *ngIf="showDateInterval" class="date-interval form-row is-boxed">
+			<h2>{{ 'dates.add_interval' | translate }}</h2>
+			<div class="columns">
+				<div class="column">
+					{{ 'dates.interval_propose' | translate }}
+				</div>
+				<div class="column">
+					<label for="start_interval" class="hidden">start</label>
+					<input id="start_interval" (change)="countDays()" formControlName="startDateInterval" type="date" />
+				</div>
+			</div>
+			<div class="columns">
+				<div class="column">
+					{{ 'dates.interval_span' | translate }}
+				</div>
+				<div class="column">
+					<label for="end_interval" class="hidden">end</label>
+					<input id="end_interval" formControlName="endDateInterval" type="date" />
+				</div>
+			</div>
+			<button (click)="addIntervalOfDates()" class="btn btn-block btn--primary">
+				<i class="fa fa-plus" aria-hidden="true"></i>
+				{{ 'dates.interval_button' | translate }}
+				{{ intervalDays }}
+				{{ 'dates.interval_button_dates' | translate }}
+			</button>
+		</fieldset>
+	</form>
 	<div class="dates-list">
-		<div class="range-container is-boxed">
+		<fieldset class="range-container is-boxed">
 			<div class="actions columns">
 				<div class="column">
 					<button
@@ -102,29 +101,40 @@
 					</span>
 					<span class="count-dates-txt">
 						{{ 'dates.count_time' | translate }}
-						(pour chaque jour)
+						(identique pour chaque jour)
 					</span>
 				</div>
-				<div *ngIf="!form.value.configuration.hasSeveralHours" class="identical-dates">
-					<div cdkDropList class="example-list" (cdkDropListDropped)="drop($event)">
-						<div *ngFor="let time of timeList; index as id" class="time-choice" cdkDrag>
-							<label for="timeChoices_{{ id }}">
-								<i class="fa fa-clock-o" aria-hidden="true"></i>
-							</label>
-							<input
-								[(ngModel)]="time.literal"
-								name="timeChoices_{{ id }}"
-								type="text"
-								id="timeChoices_{{ id }}"
-							/>
-							<button (click)="time.timeList.splice(id, 1)" class="btn btn-warning">
-								<i class="fa fa-times" aria-hidden="true"></i>
-							</button>
+				<div class="identical-dates" cdkDropListGroup>
+					<div
+						class="time-list"
+						cdkDropList
+						[cdkDropListData]="timeList"
+						(cdkDropListDropped)="dropTimeItem($event)"
+					>
+						<div *ngFor="let time of timeList; index as time_id" class="time-choice" cdkDrag>
+							<div class="columns">
+								<div class="column movable">
+									<label [for]="'timeChoices_' + time_id">
+										<i class="fa fa-clock-o" aria-hidden="true"></i>
+									</label>
+									<input
+										[(ngModel)]="time.literal"
+										name="timeChoices_{{ time_id }}"
+										type="text"
+										id="timeChoices_{{ time_id }}"
+									/>
+								</div>
+								<div class="column">
+									<button (click)="timeList.splice(time_id, 1)" class="btn btn-warning">
+										<i class="fa fa-times" aria-hidden="true"></i>
+									</button>
+								</div>
+							</div>
 						</div>
 					</div>
 				</div>
 			</div>
-		</div>
+		</fieldset>
 
 		<hr />
 		<div class="main-box is-boxed">
@@ -207,6 +217,7 @@
 							[(ngModel)]="dateCalendarEnum"
 							[locale]="'calendar_widget' | translate"
 							[inline]="true"
+							[monthNavigator]="true"
 							[selectionMode]="selectionKind"
 						></p-calendar>
 					</div>
diff --git a/src/app/features/administration/form/date-select/date-select.component.scss b/src/app/features/administration/form/date-select/date-select.component.scss
index 9dc786a0..3038c94b 100644
--- a/src/app/features/administration/form/date-select/date-select.component.scss
+++ b/src/app/features/administration/form/date-select/date-select.component.scss
@@ -10,4 +10,26 @@
 		padding: 1em;
 		margin: 1em 0;
 	}
+
+	.cdk-drag-preview {
+		box-sizing: border-box;
+		border-radius: 4px;
+		box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+			0 3px 14px 2px rgba(0, 0, 0, 0.12);
+		border: 2px solid #ccc;
+	}
+
+	.cdk-drag-placeholder {
+		* {
+			opacity: 0;
+		}
+		background: #ccc;
+	}
+
+	.cdk-drag-animating {
+		transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+	}
+	.movable {
+		cursor: move;
+	}
 }
diff --git a/src/app/features/administration/form/date-select/date-select.component.ts b/src/app/features/administration/form/date-select/date-select.component.ts
index f23cbc4c..e92cd427 100644
--- a/src/app/features/administration/form/date-select/date-select.component.ts
+++ b/src/app/features/administration/form/date-select/date-select.component.ts
@@ -7,8 +7,8 @@ import { DateUtilities } from '../../../old-stuff/config/DateUtilities';
 import { ApiService } from '../../../../core/services/api.service';
 import { Router } from '@angular/router';
 import { DOCUMENT } from '@angular/common';
-import { DateChoice, otherDefaultDates } from '../../../old-stuff/config/defaultConfigs';
-import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
+import { DateChoice, moreTimeOfDay, otherDefaultDates, TimeSlices } from '../../../old-stuff/config/defaultConfigs';
+import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
 import { TranslateService } from '@ngx-translate/core';
 
 @Component({
@@ -27,10 +27,10 @@ export class DateSelectComponent implements OnInit {
 	endDateInterval: string;
 	intervalDays: any;
 	intervalDaysDefault = 7;
-	dateList: any = otherDefaultDates; // sets of days as strings, config to set identical time for days in a special days poll
-	timeList: DateChoice[] = otherDefaultDates; // ranges of time expressed as strings
-	dateCalendarEnum: any = [new Date('02/09/2021')];
-	selectionKind: string = 'range';
+	dateList: DateChoice[] = otherDefaultDates; // sets of days as strings, config to set identical time for days in a special days poll
+	timeList: TimeSlices[] = moreTimeOfDay; // ranges of time expressed as strings
+	dateCalendarEnum: Date[] = [new Date('02/09/2021')];
+	selectionKind = 'range';
 
 	constructor(
 		private fb: FormBuilder,
@@ -46,7 +46,7 @@ export class DateSelectComponent implements OnInit {
 	) {}
 
 	ngOnInit(): void {
-		this.setDefaultDatesForInterval();
+		// this.setDefaultDatesForInterval();
 	}
 
 	get choices(): FormArray {
@@ -122,8 +122,6 @@ export class DateSelectComponent implements OnInit {
 	addTime() {
 		this.timeList.push({
 			literal: '',
-			timeList: [],
-			date_object: new Date(),
 		});
 	}
 
@@ -247,7 +245,17 @@ export class DateSelectComponent implements OnInit {
 		this.addChoice('abricot');
 	}
 
-	drop(event: CdkDragDrop<string[]>) {
-		moveItemInArray(this.form.value.choices, event.previousIndex, event.currentIndex);
+	dropTimeItem(event: any) {
+		// moveItemInArray(this.timeList, event.previousIndex, event.currentIndex);
+		if (event.previousContainer === event.container) {
+			moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
+		} else {
+			transferArrayItem(
+				event.previousContainer.data,
+				event.container.data,
+				event.previousIndex,
+				event.currentIndex
+			);
+		}
 	}
 }