diff --git a/src/app/features/administration/form/date/list/day/day-list.component.html b/src/app/features/administration/form/date/list/day/day-list.component.html
index 3a367730..fc5a32e0 100644
--- a/src/app/features/administration/form/date/list/day/day-list.component.html
+++ b/src/app/features/administration/form/date/list/day/day-list.component.html
@@ -2,15 +2,16 @@
 	<div
 		class="columns days-list"
 		cdkDropList
+		[ngClass]="{ 'colored-weekend-days': environment.enable_colored_weekend_days }"
 		[cdkDropListData]="dateChoices"
 		(cdkDropListDropped)="dropDayItem($event)"
 	>
 		<div class="column">
 			<div
 				*ngFor="let choice of dateChoices; index as id"
-				class="date-choice padded"
+				class="date-choice"
 				cdkDrag
-				[ngClass]="{ 'day-weekend': isWeekendDay(choice.date_object) }"
+				[ngClass]="{ 'day-weekend': isWeekendDay(choice.date_input) }"
 			>
 				<!--				<span class="button is-default">-->
 				<!--					<i class="icon fa fa-arrows-v"></i>-->
@@ -18,49 +19,47 @@
 				<!--						{{ timeSlice.date_object | date: 'E':'Europe/Paris':'fr_FR' }}-->
 				<!--					</span>-->
 				<!--				</span>-->
-				<div class="columns">
-					<div class="column">
-						<label class="pull-left" for="dateChoices_{{ id }}">
-							Date {{ id + 1 }}
-							<!--							- {{ choice.date_object | date: 'E':'Europe/Paris':'fr_FR' }}-->
-						</label>
-						<span class="format-helper pull-right">JJ/MM/AAAA</span>
-					</div>
-				</div>
+				<div class="top">
+					<label class="pull-left" for="dateChoices_{{ id }}">
+						Date {{ id + 1 }} ( weekend : {{ isWeekendDay(choice.date_input) }} )
+						<!--							- {{ choice.date_object | date: 'E':'Europe/Paris':'fr_FR' }}-->
+					</label>
+					<span class="format-helper pull-right">JJ/MM/AAAA</span>
 
-				<input
-					[(ngModel)]="choice.date_input"
-					class="date-choice-item"
-					name="dateChoices_{{ id }}"
-					id="dateChoices_{{ id }}"
-					type="date"
-				/>
-				<hr />
-				<div class="button delete-date is-block" (click)="dateChoices.splice(id, 1)">
-					<img class="icon" aria-hidden="true" src="assets/icons/trash.svg" />
-					Supprimer la date
+					<input
+						[(ngModel)]="choice.date_input"
+						class="date-choice-item"
+						name="dateChoices_{{ id }}"
+						id="dateChoices_{{ id }}"
+						type="date"
+					/>
 				</div>
-				<div *ngIf="hasSeveralHours" class="several-times">
-					<br />
-					<app-time-list [timeSlices]="choice.timeSlices" [prefix_choice_id]="id"></app-time-list>
-					<div class="text-right">
-						<button (click)="addTimeToDate(choice, id)" class="button is-primary">
-							<i class="fa fa-plus"></i>
-							{{ 'dates.add_time' | translate }}
-							<i class="fa fa-clock-o"></i>
-						</button>
+				<hr />
+				<div class="bottom">
+					<div class="button delete-date is-block" (click)="dateChoices.splice(id, 1)">
+						<img class="icon" aria-hidden="true" src="assets/icons/trash.svg" />
+						Supprimer la date
+					</div>
+					<div *ngIf="hasSeveralHours" class="several-times">
+						<br />
+						<app-time-list [timeSlices]="choice.timeSlices" [prefix_choice_id]="id"></app-time-list>
+						<div class="text-right">
+							<button (click)="addTimeToDate(choice, id)" class="button is-primary">
+								<i class="fa fa-plus"></i>
+								{{ 'dates.add_time' | translate }}
+								<i class="fa fa-clock-o"></i>
+							</button>
+						</div>
 					</div>
 				</div>
 			</div>
-		</div>
-	</div>
-	<div class="columns">
-		<div class="column">
-			<!--				ajouter une date-->
-			<button class="button is-primary" (click)="addChoice()">
-				<i class="fa fa-plus"></i>
-				{{ 'dates.add' | translate }}
-			</button>
+			<div class="add_date">
+				<!--				ajouter une date-->
+				<button class="button is-primary" (click)="addChoice()">
+					<i class="fa fa-plus"></i>
+					{{ 'dates.add' | translate }}
+				</button>
+			</div>
 		</div>
 	</div>
 </div>
diff --git a/src/app/features/administration/form/date/list/day/day-list.component.scss b/src/app/features/administration/form/date/list/day/day-list.component.scss
index 98711a8b..5bba04dd 100644
--- a/src/app/features/administration/form/date/list/day/day-list.component.scss
+++ b/src/app/features/administration/form/date/list/day/day-list.component.scss
@@ -3,12 +3,27 @@
 .day-list-container {
 	padding-bottom: 2rem;
 
+	.bottom,
+	.top {
+		padding-left: 1rem;
+		padding-right: 1rem;
+	}
+
+	.top {
+		padding-top: 1rem;
+	}
+
+	.bottom {
+		padding-bottom: 1rem;
+	}
+
 	.day-weekend {
 		background: #dccfed;
 	}
 
 	.button {
 		min-width: 9ch;
+		margin-left: -1rem;
 	}
 
 	.icon {
@@ -38,6 +53,7 @@
 		input {
 			margin-bottom: 1rem;
 		}
+
 		input,
 		.button {
 			width: 100%;
@@ -45,25 +61,29 @@
 		}
 
 		hr {
-			margin: 0.5em -1em;
 			background: $rules;
+			margin: 0;
 		}
+	}
 
-		//&.day-weekend {
-		//	background: mix($legend_color_2, $grey-lighter);
-		//}
+	.colored-weekend-days {
+		.date-choice {
+			&.day-weekend {
+				background: #b1a1d5;
+			}
 
-		//&:nth-child(odd) {
-		//	background: $grey-lighter;
-		//
-		//	&.day-weekend {
-		//		background: mix($d-neutral, $grey-lighter);
-		//	}
-		//}
+			&:nth-of-type(odd) {
+				background: #9880d5;
+				&.day-weekend {
+					background: #8e72d4;
+				}
+			}
+		}
 	}
 
 	.date-choice-item {
 		width: 75%;
+		border-color: $border-color !important;
 	}
 
 	.button .fa {
@@ -76,11 +96,13 @@
 		border: 0;
 		background: transparent;
 		text-align: left;
+		margin-right: 0;
 
 		.fa,
 		.icon {
 			float: left;
 			color: $primary_color;
+			margin: 0;
 			margin-right: 1rem;
 			height: 1.25rem;
 			// filter converter is here https://codepen.io/sosuke/pen/Pjoqqp
@@ -105,4 +127,7 @@
 		font-size: 14px;
 		line-height: 16px;
 	}
+	.add_date {
+		margin-left: 1rem;
+	}
 }
diff --git a/src/app/features/administration/form/date/list/day/day-list.component.ts b/src/app/features/administration/form/date/list/day/day-list.component.ts
index df491534..15d26446 100644
--- a/src/app/features/administration/form/date/list/day/day-list.component.ts
+++ b/src/app/features/administration/form/date/list/day/day-list.component.ts
@@ -9,6 +9,7 @@ import { ShortcutsHelpComponent } from '../../../../../shared/components/ui/shor
 import { DateChoice } from '../../../../../../core/models/dateChoice.model';
 import { PollService } from '../../../../../../core/services/poll.service';
 import { DateUtilitiesService } from '../../../../../../core/services/date.utilities.service';
+import { environment } from 'src/environments/environment';
 @Component({
 	selector: 'app-day-list',
 	templateUrl: './day-list.component.html',
@@ -23,6 +24,7 @@ export class DayListComponent {
 	public hasSeveralHours: boolean;
 	timeList: any;
 	display = false;
+	public environment = environment;
 
 	constructor(
 		public dialog: MatDialog,
@@ -164,9 +166,12 @@ export class DayListComponent {
 		}
 	}
 
-	isWeekendDay(date_object: Date) {
+	isWeekendDay(date_input: string) {
+		let date_object = new Date(Date.parse(date_input));
+		console.log('date_object', date_object);
 		if (date_object) {
 			const day = date_object.getDay();
+			console.log('day', day);
 			return day === 6 || day === 0;
 		}
 		return false;
diff --git a/src/app/features/administration/nav-steps/nav-steps.component.html b/src/app/features/administration/nav-steps/nav-steps.component.html
index 9b7e93c2..d6b66a5e 100644
--- a/src/app/features/administration/nav-steps/nav-steps.component.html
+++ b/src/app/features/administration/nav-steps/nav-steps.component.html
@@ -2,7 +2,7 @@
 	<div class="contained-in-main-column">
 		<button
 			*ngIf="display_previous_button"
-			class="button button-previous is-secondary pull-left"
+			class="button-previous is-secondary pull-left"
 			[routerLink]="['/administration/step/' + previous_step_number]"
 		>
 			{{ 'nav.previous' | translate }}
@@ -10,17 +10,17 @@
 
 		<button
 			*ngIf="display_next_button"
-			class="button button-next pull-right"
+			class="button-next pull-right"
 			[ngClass]="{ 'is-finish': is_finish_step, 'is-primary': !is_finish_step }"
 			[routerLink]="['/administration/step/' + next_step_number]"
 			(click)="runNextAction()"
 		>
-			<span *ngIf="is_finish_step">
-				{{ 'nav.save' | translate }}
-			</span>
-			<span *ngIf="!is_finish_step">
+			<b *ngIf="!is_finish_step">
 				{{ 'nav.next' | translate }}
-			</span>
+			</b>
+			<b *ngIf="is_finish_step">
+				{{ 'nav.save' | translate }}
+			</b>
 		</button>
 	</div>
 </div>
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
index e7148fa3..a5cb8a62 100644
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@@ -31,6 +31,7 @@ export const environment = {
 	display_header_create_button: false,
 	display_menu_creation: false,
 	display_routes: false, // demo paths to test polls
+	enable_colored_weekend_days: false, // color differently the weekend days
 	expiresDaysDelay: 60,
 	frontDomain: 'http://127.0.0.1:4200',
 	interval_days_default: 7,
diff --git a/src/styles/partials/_forms.scss b/src/styles/partials/_forms.scss
index 00979d80..9e0a0093 100644
--- a/src/styles/partials/_forms.scss
+++ b/src/styles/partials/_forms.scss
@@ -12,7 +12,7 @@ input.is-hovered,
 select.is-hovered,
 .is-hovered.textarea,
 .select select.is-hovered {
-	border-color: $font_color !important;
+	border-color: $input-border-color !important;
 }
 
 app-step-one,
@@ -53,7 +53,8 @@ select,
 .select {
 	font-size: 1rem !important;
 	line-height: 1.25rem;
-	border: solid 1px $font_color;
+	border: solid 1px $input-border-color !important;
+	border-radius: 4px;
 	max-width: 90vw !important;
 	@extend .clickable;
 	&:focus {
@@ -89,6 +90,11 @@ textarea {
 	overflow-x: auto;
 	@extend .clickable;
 }
+.button {
+	display: inline-block;
+	padding: 10px 30px;
+	height: auto;
+}
 .button {
 	label {
 		margin-bottom: 0;
diff --git a/src/styles/partials/_navigation.scss b/src/styles/partials/_navigation.scss
index b839c546..276d9bd4 100644
--- a/src/styles/partials/_navigation.scss
+++ b/src/styles/partials/_navigation.scss
@@ -88,7 +88,8 @@ a span.ui-steps-number {
 
 	.button {
 		display: inline-block;
-		padding: 0.5rem 1rem;
+		padding: 10px 30px;
+		height: auto;
 	}
 	.button {
 		&.is-secondary {
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index 87b63e27..f425b4f1 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -27,9 +27,10 @@ $d-primary-intense: #3e3882; // bleu 800
 $d-blue-700: #4f47af; // bleu 700
 $d-primary: #6359cf; // bleu 600
 $d-grey: #e3e3ea;
-$d-blue30: #f6f5fd; // bleu 300
+$d-blue30: #d6d2e0; // bleu 300
 $d-rule: #e2e0fa; // bleu 100
-$d-neutral: #767486;
+$d-neutral: #b5b5c6;
+$d-border: #4e4c59;
 $d-alt: #a9607f;
 
 $d-info: #ecf4ff;
@@ -56,6 +57,7 @@ $choice_select_border_color: $d-info;
 $hover-color: $d-neutral;
 $rules: $d-rule;
 $border-color: $d-neutral;
+$input-border-color: $d-border;
 $grey-dark: $d-primary;
 $grey-lighter: $beige-light;
 $clicked-color: $d-primary;