diff --git a/css/backoffice/components/_modal.scss b/css/backoffice/components/_modal.scss
index 8621bd10e..e69de29bb 100644
--- a/css/backoffice/components/_modal.scss
+++ b/css/backoffice/components/_modal.scss
@@ -1,146 +0,0 @@
-$ibo-modal--ui-dialog--padding: 16px 16px 16px !default;
-$ibo-modal--ui-dialog--border-radius: $ibo-border-radius-500 !default;
-$ibo-modal--ui-dialog--background-color: $ibo-color-white-100 !default;
-
-$ibo-modal--ui-widget-overlay--background-color: $ibo-color-blue-grey-900 !default;
-
-.ui-dialog{
-	position: absolute;
-	top: 0;
-	left: 0;
-	padding: $ibo-modal--ui-dialog--padding;
-	background-color: $ibo-modal--ui-dialog--background-color;
-	border-radius: $ibo-modal--ui-dialog--border-radius;
-	overflow: hidden;
-	outline: 0;
-	z-index: 21;
-	&::before{
-		position: absolute;
-		top: 0;
-		left: 0;
-		display: block;
-		background-color: #2c5382;
-		content: "";
-		width: 100%;
-		height: 8px;
-		padding-bottom: 8px;
-	}
-	.ui-dialog-titlebar {
-		padding: .4em 1em;
-		position: relative;
-	}
-	.ui-dialog-title {
-		float: left;
-		margin: .1em 0;
-		white-space: nowrap;
-		width: 90%;
-		overflow: hidden;
-		text-overflow: ellipsis;
-	}
-	.ui-dialog-titlebar-close {
-		position: absolute;
-		right: .3em;
-		top: 50%;
-		width: 20px;
-		margin: -10px 0 0 0;
-		padding: 1px;
-		height: 20px;
-	}
-	.ui-dialog-content {
-		position: relative;
-		padding: .5em 1em;
-	}
-	.ui-dialog-buttonpane {
-		text-align: left;
-		border-width: 1px 0 0 0;
-		background-image: none;
-		margin-top: .5em;
-		padding: .3em 1em .5em .4em;
-		.ui-dialog-buttonset {
-			float: right;
-		}
-		button {
-			margin: .5em .4em .5em 0;
-			cursor: pointer;
-		}
-	}
-	.ui-resizable-n {
-		height: 2px;
-		top: 0;
-	}
-	.ui-resizable-e {
-		width: 2px;
-		right: 0;
-	}
-	.ui-resizable-s {
-		height: 2px;
-		bottom: 0;
-	}
-	.ui-resizable-w {
-		width: 2px;
-		left: 0;
-	}
-	.ui-resizable-se {
-		width: 7px;
-		height: 7px;
-		right: 0;
-		bottom: 0;
-	}
-	.ui-resizable-sw {
-		width: 7px;
-		height: 7px;
-		left: 0;
-		bottom: 0;
-	}
-	.ui-resizable-ne {
-		width: 7px;
-		height: 7px;
-		right: 0;
-		top: 0;
-	}
-	.ui-resizable-nw {
-		width: 7px;
-		height: 7px;
-		left: 0;
-		top: 0;
-	}
-	.ui-button {
-		@extend .ibo-button;
-		@extend .ibo-is-regular;
-		@extend .ibo-is-secondary;
-		> .ui-icon {
-			background-image: none;
-			float: unset;
-			margin: auto;
-			top: 4px;
-			left: 2px;
-			
-			&.ui-icon-closethick::before{
-				content: '\f00d';
-				font-family: 'Font Awesome 5 Free';
-				font-weight: 600;
-				text-indent: 0;
-				position: absolute;
-				left: 0px;
-				width: 100%;
-			}
-		}
-		&.ui-dialog-titlebar-close{
-			@extend .ibo-is-alternative;
-			@extend .ibo-is-red;
-		}
-	}
-}
-.ui-dialog-title{
-	@extend %ibo-font-ral-nor-250;
-}
-.ui-widget-overlay.ui-front{
-	position: fixed;
-	top: 0;
-	left: 0;
-	width: 100%;
-	height: 100%;
-	opacity: .5;
-	filter: Alpha(Opacity=50);
-	background-color: $ibo-modal--ui-widget-overlay--background-color;
-}
\ No newline at end of file
diff --git a/css/backoffice/components/input/_input-date.scss b/css/backoffice/components/input/_input-date.scss
index 96d7adee7..439f962dc 100644
--- a/css/backoffice/components/input/_input-date.scss
+++ b/css/backoffice/components/input/_input-date.scss
@@ -7,14 +7,6 @@ $ibo-input-date--button--padding: 0 !default;
 $ibo-input-date--button--background-color: transparent !default;
 $ibo-input-date--button--color: $ibo-color-grey-800 !default;
 
-$ibo-input-date--ui-datepicker--padding-top: 34px !default;
-$ibo-input-date--ui-datepicker--background-color: $ibo-color-white-100 !default;
-$ibo-input-date--ui-datepicker--border-color: $ibo-color-grey-400 !default;
-$ibo-input-date--ui-datepicker--border-radius: $ibo-border-radius-500 !default;
-
-$ibo-input-date--ui-datepicker-header--padding: $ibo-border-radius-500 $ibo-border-radius-500 0 0 !default;
-$ibo-input-date--ui-datepicker-header--border-radius: 4px !default;
-
 .ibo-input-date{
 	display: inline-block;
 	width: $ibo-input-date--width;
@@ -30,17 +22,3 @@ $ibo-input-date--ui-datepicker-header--border-radius: 4px !default;
 	color: $ibo-input-date--button--color;
 	border: none;
 }
-
-.ui-datepicker{
-	padding-top: 34px;
-	background-color: $ibo-input-date--ui-datepicker--background-color;
-	border: solid 1px $ibo-input-date--ui-datepicker--border-color;
-	border-radius: $ibo-input-date--ui-datepicker--border-radius;
-}
-.ui-datepicker-header{
-	@extend .ui-dialog::before;
-	position: absolute;
-	height: unset;
-	padding: $ibo-input-date--ui-datepicker-header--border-radius;
-	border-radius: $ibo-input-date--ui-datepicker-header--border-radius;
-}
\ No newline at end of file
diff --git a/css/backoffice/vendors/_all.scss b/css/backoffice/vendors/_all.scss
index bdd9d0859..0c5229a60 100644
--- a/css/backoffice/vendors/_all.scss
+++ b/css/backoffice/vendors/_all.scss
@@ -18,4 +18,5 @@
 
 @import "bulma-variables-overload";
 @import "../../../node_modules/bulma-scss/bulma";
-@import "ckeditor";
\ No newline at end of file
+@import "ckeditor";
+@import "jqueryui";
\ No newline at end of file
diff --git a/css/backoffice/vendors/_jqueryui.scss b/css/backoffice/vendors/_jqueryui.scss
new file mode 100644
index 000000000..8cbea762b
--- /dev/null
+++ b/css/backoffice/vendors/_jqueryui.scss
@@ -0,0 +1,474 @@
+/*!
+ * @copyright   Copyright (C) 2010-2020 Combodo SARL
+ * @license     http://opensource.org/licenses/AGPL-3.0
+ */
+
+$ibo-modal--ui-dialog--padding-x: 30px !default;
+$ibo-modal--ui-dialog--border-radius: $ibo-border-radius-500 !default;
+$ibo-modal--ui-dialog--background-color: $ibo-color-white-100 !default;
+
+$ibo-modal--ui-dialog-titlebar--height: 50px !default;
+$ibo-modal--ui-dialog-titlebar--background-color: $ibo-modal--ui-dialog--background-color !default;
+$ibo-modal--ui-dialog-titlebar--border-bottom: solid 1px $ibo-color-grey-200 !default;
+
+$ibo-modal--ui-dialog-buttonpane--height: $ibo-modal--ui-dialog-titlebar--height !default;
+$ibo-modal--ui-dialog-buttonpane--background-color: $ibo-modal--ui-dialog--background-color !default;
+$ibo-modal--ui-dialog-buttonpane--border-top: $ibo-modal--ui-dialog-titlebar--border-bottom !default;
+
+$ibo-modal--ui-dialog--border: $ibo-modal--ui-dialog--background-color !default;
+
+$ibo-modal--ui-widget-overlay--background-color: $ibo-color-blue-grey-800 !default;
+
+$ibo-input-date--ui-datepicker--padding-top: 34px !default;
+$ibo-input-date--ui-datepicker--background-color: $ibo-color-white-100 !default;
+$ibo-input-date--ui-datepicker--border-color: $ibo-color-grey-400 !default;
+$ibo-input-date--ui-datepicker--border-radius: $ibo-border-radius-500 !default;
+
+$ibo-input-date--ui-datepicker-header--padding: $ibo-border-radius-500 $ibo-border-radius-500 0 0 !default;
+$ibo-input-date--ui-datepicker-header--border-radius: 4px !default;
+// Tabs
+
+.ui-dialog{
+	display: flex;
+	flex-direction: column;
+	position: absolute;
+	top: 0;
+	left: 0;
+	background-color: $ibo-modal--ui-dialog--background-color;
+	border-radius: $ibo-modal--ui-dialog--border-radius;
+	overflow: hidden;
+	outline: 0;
+	z-index: 21;
+	.ui-dialog-titlebar {
+		padding: .4em $ibo-modal--ui-dialog--padding-x;
+		position: relative;
+		background-color: $ibo-modal--ui-dialog-titlebar--background-color;
+		height: $ibo-modal--ui-dialog-titlebar--height;
+		border-bottom: $ibo-modal--ui-dialog-titlebar--border-bottom;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+	}
+	.ui-dialog-title {
+		float: left;
+		margin: .1em 0;
+		white-space: nowrap;
+		width: 90%;
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+	.ui-dialog-titlebar-close {
+		position: absolute;
+		right: $ibo-modal--ui-dialog--padding-x;
+		top: 50%;
+		width: 20px;
+		margin: -10px 0 0 0;
+		padding: 1px;
+		height: 20px;
+	}
+	.ui-dialog-content {
+		position: relative;
+		padding: 16px $ibo-modal--ui-dialog--padding-x;
+	}
+	.ui-dialog-buttonpane {
+		margin-top: auto;
+		text-align: left;
+		border-width: 1px 0 0 0;
+		background-image: none;
+		padding: .4em $ibo-modal--ui-dialog--padding-x;
+		position: relative;
+		background-color: $ibo-modal--ui-dialog-buttonpane--background-color;
+		border-top: $ibo-modal--ui-dialog-buttonpane--border-top;
+		height: $ibo-modal--ui-dialog-buttonpane--height;
+		.ui-dialog-buttonset {
+			float: right;
+		}
+		button {
+			margin: .5em .4em .5em 0;
+			cursor: pointer;
+		}
+	}
+	.ui-resizable-n {
+		height: 2px;
+		top: 0;
+	}
+	.ui-resizable-e {
+		width: 2px;
+		right: 0;
+	}
+	.ui-resizable-s {
+		height: 2px;
+		bottom: 0;
+	}
+	.ui-resizable-w {
+		width: 2px;
+		left: 0;
+	}
+	.ui-resizable-se {
+		width: 7px;
+		height: 7px;
+		right: 0;
+		bottom: 0;
+	}
+	.ui-resizable-sw {
+		width: 7px;
+		height: 7px;
+		left: 0;
+		bottom: 0;
+	}
+	.ui-resizable-ne {
+		width: 7px;
+		height: 7px;
+		right: 0;
+		top: 0;
+	}
+	.ui-resizable-nw {
+		width: 7px;
+		height: 7px;
+		left: 0;
+		top: 0;
+	}
+	.ui-button {
+		@extend .ibo-button;
+		@extend .ibo-is-regular;
+		@extend .ibo-is-secondary;
+		> .ui-icon {
+			background-image: none;
+			float: unset;
+			margin: auto;
+			&.ui-icon-closethick::after{
+				content: '\f00d';
+				font-family: 'Font Awesome 5 Free';
+				font-weight: 600;
+				text-indent: 0;
+				position: absolute;
+				left: 0px;
+				width: 100%;
+				top: 4px;
+			}
+		}
+		&.ui-dialog-titlebar-close{
+			@extend .ibo-is-alternative;
+			@extend .ibo-is-grey;
+			
+		}
+	}
+}
+.ui-button-icon-only {
+	text-indent: -9999px;
+	white-space: nowrap;
+}
+.ui-dialog-title{
+	@extend %ibo-font-ral-nor-250;
+}
+.ui-widget-overlay.ui-front{
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	opacity: .6;
+	filter: Alpha(Opacity=60);
+	background-color: $ibo-modal--ui-widget-overlay--background-color;
+}
+// Resiable
+
+
+.ui-resizable {
+	position: relative;
+}
+.ui-resizable-handle {
+	position: absolute;
+	font-size: 0.1px;
+	display: block;
+	-ms-touch-action: none;
+	touch-action: none;
+}
+.ui-resizable-disabled {
+	.ui-resizable-handle {
+		display: none;
+	}
+}
+.ui-resizable-autohide {
+	.ui-resizable-handle {
+		display: none;
+	}
+}
+.ui-resizable-n {
+	cursor: n-resize;
+	height: 7px;
+	width: 100%;
+	top: -5px;
+	left: 0;
+}
+.ui-resizable-s {
+	cursor: s-resize;
+	height: 7px;
+	width: 100%;
+	bottom: -5px;
+	left: 0;
+}
+.ui-resizable-e {
+	cursor: e-resize;
+	width: 7px;
+	right: -5px;
+	top: 0;
+	height: 100%;
+}
+.ui-resizable-w {
+	cursor: w-resize;
+	width: 7px;
+	left: -5px;
+	top: 0;
+	height: 100%;
+}
+.ui-resizable-se {
+	cursor: se-resize;
+	width: 12px;
+	height: 12px;
+	right: 1px;
+	bottom: 1px;
+}
+.ui-resizable-sw {
+	cursor: sw-resize;
+	width: 9px;
+	height: 9px;
+	left: -5px;
+	bottom: -5px;
+}
+.ui-resizable-nw {
+	cursor: nw-resize;
+	width: 9px;
+	height: 9px;
+	left: -5px;
+	top: -5px;
+}
+.ui-resizable-ne {
+	cursor: ne-resize;
+	width: 9px;
+	height: 9px;
+	right: -5px;
+	top: -5px;
+}
+
+// Date picker
+
+.ui-datepicker{
+	padding-top: 15px;
+	background-color: $ibo-input-date--ui-datepicker--background-color;
+	border: solid 1px $ibo-input-date--ui-datepicker--border-color;
+	border-radius: $ibo-input-date--ui-datepicker--border-radius;
+	.ui-datepicker-header{
+		height: unset;
+		padding: $ibo-input-date--ui-datepicker-header--border-radius;
+		border-radius: $ibo-input-date--ui-datepicker-header--border-radius;
+		&::before{
+			position: absolute;
+			top: 0;
+			left: 0;
+			display: block;
+			background-color: #2c5382;
+			content: "";
+			width: 100%;
+			height: 8px;
+			padding-bottom: 8px;
+		}
+	}
+	.ui-datepicker-prev {
+		position: absolute;
+		top: 2px;
+		width: 1.8em;
+		height: 1.8em;
+		left: 2px;
+		span {
+			display: block;
+			position: absolute;
+			left: 50%;
+			margin-left: -8px;
+			top: 50%;
+			margin-top: -8px;
+		}
+	}
+	.ui-datepicker-next {
+		position: absolute;
+		top: 2px;
+		width: 1.8em;
+		height: 1.8em;
+		right: 2px;
+		span {
+			display: block;
+			position: absolute;
+			left: 50%;
+			margin-left: -8px;
+			top: 50%;
+			margin-top: -8px;
+		}
+	}
+	.ui-datepicker-prev-hover {
+		top: 1px;
+		left: 1px;
+	}
+	.ui-datepicker-next-hover {
+		top: 1px;
+		right: 1px;
+	}
+	.ui-datepicker-title {
+		margin: 0 2.3em;
+		line-height: 1.8em;
+		text-align: center;
+		select {
+			font-size: 1em;
+			margin: 1px 0;
+		}
+	}
+	select.ui-datepicker-month {
+		width: 45%;
+	}
+	select.ui-datepicker-year {
+		width: 45%;
+	}
+	table {
+		width: 100%;
+		font-size: .9em;
+		border-collapse: collapse;
+		margin: 0 0 .4em;
+	}
+	th {
+		padding: .7em .3em;
+		text-align: center;
+		font-weight: bold;
+		// // border: 0;
+	}
+	td {
+		// // border: 0;
+		padding: 1px;
+		span {
+			display: block;
+			padding: .2em;
+			text-align: right;
+			text-decoration: none;
+		}
+		a {
+			display: block;
+			padding: .2em;
+			text-align: right;
+			text-decoration: none;
+		}
+	}
+	.ui-datepicker-buttonpane {
+		background-image: none;
+		margin: .7em 0 0 0;
+		padding: 0 .2em;
+		border-left: 0;
+		border-right: 0;
+		border-bottom: 0;
+		button {
+			float: right;
+			margin: .5em .2em .4em;
+			cursor: pointer;
+			padding: .2em .6em .3em .6em;
+			width: auto;
+			overflow: visible;
+		}
+		button.ui-datepicker-current {
+			float: left;
+		}
+	}
+	.ui-icon {
+		display: block;
+		text-indent: -99999px;
+		overflow: hidden;
+		background-repeat: no-repeat;
+		left: .5em;
+		top: .3em;
+	}
+}
+.ui-datepicker.ui-datepicker-multi {
+	width: auto;
+}
+.ui-datepicker-multi {
+	.ui-datepicker-group {
+		float: left;
+		table {
+			width: 95%;
+			margin: 0 auto .4em;
+		}
+	}
+	.ui-datepicker-group-last {
+		.ui-datepicker-header {
+			border-left-width: 0;
+		}
+	}
+	.ui-datepicker-group-middle {
+		.ui-datepicker-header {
+			border-left-width: 0;
+		}
+	}
+	.ui-datepicker-buttonpane {
+		clear: left;
+	}
+}
+.ui-datepicker-multi-2 {
+	.ui-datepicker-group {
+		width: 50%;
+	}
+}
+.ui-datepicker-multi-3 {
+	.ui-datepicker-group {
+		width: 33.3%;
+	}
+}
+.ui-datepicker-multi-4 {
+	.ui-datepicker-group {
+		width: 25%;
+	}
+}
+.ui-datepicker-row-break {
+	clear: both;
+	width: 100%;
+	font-size: 0;
+}
+.ui-datepicker-rtl {
+	direction: rtl;
+	.ui-datepicker-prev {
+		right: 2px;
+		left: auto;
+		&:hover {
+			right: 1px;
+			left: auto;
+		}
+	}
+	.ui-datepicker-next {
+		left: 2px;
+		right: auto;
+		&:hover {
+			left: 1px;
+			right: auto;
+		}
+	}
+	.ui-datepicker-buttonpane {
+		clear: right;
+		button {
+			float: left;
+		}
+		button.ui-datepicker-current {
+			float: right;
+		}
+	}
+	.ui-datepicker-group {
+		float: right;
+	}
+	.ui-datepicker-group-last {
+		.ui-datepicker-header {
+			border-right-width: 0;
+			border-left-width: 1px;
+		}
+	}
+	.ui-datepicker-group-middle {
+		.ui-datepicker-header {
+			border-right-width: 0;
+			border-left-width: 1px;
+		}
+	}
+}
\ No newline at end of file