diff --git a/htdocs/index.php b/htdocs/index.php
index 3e33570a379..59233f5f110 100644
--- a/htdocs/index.php
+++ b/htdocs/index.php
@@ -606,6 +606,14 @@ $dashboardgroup = array (
 		),
 );
 
+$object=new stdClass();
+$parameters=array(
+	'dashboardgroup' => $dashboardgroup
+);
+$reshook=$hookmanager->executeHooks('addOpenElementsDashboardGroup', $parameters, $object, $action);    // Note that $action and $object may have been modified by some hooks
+if ($reshook == 0) {
+	$dashboardgroup = array_merge($dashboardgroup, $hookmanager->resArray);
+}
 
 
 // Calculate total nb of late
@@ -677,7 +685,7 @@ if (!empty($valid_dashboardlines))
 	foreach($dashboardgroup as $groupKey => $groupElement) {
 		$boards = array();
 
-		if(!empty($conf->global->MAIN_DISPLAY_NEW_OPENED_DASH_BOARD))
+		if(!empty($conf->global->MAIN_DISPLAY_NEW_OPENED_DASH_BOARD) || !empty($conf->global->MAIN_FEATURES_LEVEL))
 		{
 			foreach ($groupElement['stats'] as $infoKey)
 			{
@@ -756,11 +764,16 @@ if (!empty($valid_dashboardlines))
 		$weatherDashBoard.= '		<span class="info-box-icon"><i class="fa fa-weather-level'.$weather->level.'"></i></span>'."\n";
 		$weatherDashBoard.= '		<div class="info-box-content">'."\n";
 		$weatherDashBoard.= '			<span class="info-box-title">'.$langs->trans('GlobalOpenedElemView').'</span>' . "\n";
-		$weatherDashBoard.= '			<span class="info-box-number">'.$langs->transnoentitiesnoconv("NActionsLate", $totalLateNumber).'</span>' . "\n";
 
 		if($totallatePercentage>0 && !empty($conf->global->MAIN_USE_METEO_WITH_PERCENTAGE)){
-			$weatherDashBoard.= '			<div class="progress"><div class="progress-bar" style="width: '.$totallatePercentage.'%"></div></div>';
-			$weatherDashBoard.= '			<span class="progress-description">'.$langs->trans('NActionsLate', price($totallatePercentage).'%').'</span>' . "\n";
+			$weatherDashBoard.= '			<span class="info-box-number">'.$langs->transnoentitiesnoconv("NActionsLate", price($totallatePercentage).'%').'</span>' . "\n";
+			$weatherDashBoard.= '			<span class="progress-description">'.$langs->trans('NActionsLate', $totalLateNumber).'</span>' . "\n";
+		}
+		else{
+			$weatherDashBoard.= '			<span class="info-box-number">'.$langs->transnoentitiesnoconv("NActionsLate", $totalLateNumber).'</span>' . "\n";
+			if($totallatePercentage>0){
+				$weatherDashBoard.= '			<span class="progress-description">'.$langs->trans('NActionsLate', price($totallatePercentage).'%').'</span>' . "\n";
+			}
 		}
 
 		$weatherDashBoard.= '		</div><!-- /.info-box-content -->'."\n";
diff --git a/htdocs/theme/md/badges.inc.php b/htdocs/theme/md/badges.inc.php
new file mode 100644
index 00000000000..390348e2919
--- /dev/null
+++ b/htdocs/theme/md/badges.inc.php
@@ -0,0 +1,204 @@
+<?php
+if (! defined('ISLOADEDBYSTEELSHEET')) die('Must be call by steelsheet'); ?>
+/* <style type="text/css" > */
+/*
+ Badge style is based on boostrap framework
+ */
+
+.badge {
+    display: inline-block;
+    padding: .1em .35em;
+    font-size: 80%;
+    font-weight: 700 !important;
+    line-height: 1;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: baseline;
+    border-radius: .25rem;
+    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
+    border-width: 2px;
+    border-style: solid;
+    border-color: rgba(255,255,255,0);
+    box-sizing: border-box;
+}
+/* Themes for badges */
+
+.badge-pill, .tabs .badge {
+    padding-right: .5em;
+    padding-left: .5em;
+    border-radius: 0.25rem;
+}
+
+.badge-dot {
+    padding: 0;
+    border-radius: 50%;
+    padding: 0.25rem;
+    vertical-align: middle;
+}
+
+a.badge:focus, a.badge:hover {
+    text-decoration: none;
+}
+
+.liste_titre .badge {
+    background-color: <?php print $badgeSecondary; ?>;
+    color: #fff;
+}
+
+
+/* PRIMARY */
+.badge-primary{
+    color: #fff !important;
+    background-color: <?php print $badgePrimary; ?>;
+}
+a.badge-primary.focus, a.badge-primary:focus {
+    outline: 0;
+    box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb($badgePrimary, 0.5); ?>;
+}
+a.badge-primary:focus, a.badge-primary:hover {
+    color: #fff !important;
+    background-color: <?php print colorDarker($badgePrimary, 10); ?>;
+}
+
+/* SECONDARY */
+.badge-secondary, .tabs .badge {
+    color: #fff !important;
+    background-color: <?php print $badgeSecondary; ?>;
+}
+a.badge-secondary.focus, a.badge-secondary:focus {
+    outline: 0;
+    box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb($badgeSecondary, 0.5); ?>;
+}
+a.badge-secondary:focus, a.badge-secondary:hover {
+    color: #fff !important;
+    background-color: <?php print colorDarker($badgeSecondary, 10); ?>;
+}
+
+/* SUCCESS */
+.badge-success {
+    color: #fff !important;
+    background-color: <?php print $badgeSuccess; ?>;
+}
+a.badge-success.focus, a.badge-success:focus {
+    outline: 0;
+    box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb($badgeSuccess, 0.5); ?>;
+}
+a.badge-success:focus, a.badge-success:hover {
+    color: #fff !important;
+    background-color: <?php print colorDarker($badgeSuccess, 10); ?>;
+}
+
+/* DANGER */
+.badge-danger {
+    color: #fff !important;
+    background-color:  <?php print $badgeDanger; ?>;
+}
+a.badge-danger.focus, a.badge-danger:focus {
+    outline: 0;
+    box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb($badgeDanger, 0.5); ?>;
+}
+a.badge-danger:focus, a.badge-danger:hover {
+    color: #fff !important;
+    background-color: <?php print colorDarker($badgeDanger, 10); ?>;
+}
+
+/* WARNING */
+.badge-warning {
+    color: #212529 !important;
+    background-color: <?php print $badgeWarning; ?>;
+}
+a.badge-warning.focus, a.badge-warning:focus {
+    outline: 0;
+    box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb($badgeWarning, 0.5); ?>;
+}
+a.badge-warning:focus, a.badge-warning:hover {
+    color: #212529 !important;
+    background-color: <?php print colorDarker($badgeWarning, 10); ?>;
+}
+
+/* INFO */
+.badge-info {
+    color: #fff !important;
+    background-color: <?php print $badgeInfo; ?>;
+}
+a.badge-info.focus, a.badge-info:focus {
+    outline: 0;
+    box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb($badgeInfo, 0.5); ?>;
+}
+a.badge-info:focus, a.badge-info:hover {
+    color: #fff !important;
+    background-color: <?php print colorDarker($badgeInfo, 10); ?>;
+}
+
+/* LIGHT */
+.badge-light {
+    color: #212529 !important;
+    background-color: <?php print $badgeLight; ?>;
+}
+a.badge-light.focus, a.badge-light:focus {
+    outline: 0;
+    box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb($badgeLight, 0.5); ?>;
+}
+a.badge-light:focus, a.badge-light:hover {
+    color: #212529 !important;
+    background-color: <?php print colorDarker($badgeLight, 10); ?>;
+}
+
+/* DARK */
+.badge-dark {
+    color: #fff !important;
+    background-color: <?php print $badgeDark; ?>;
+}
+a.badge-dark.focus, a.badge-dark:focus {
+    outline: 0;
+    box-shadow: 0 0 0 0.2rem <?php print colorHexToRgb($badgeDark, 0.5); ?>;
+}
+a.badge-dark:focus, a.badge-dark:hover {
+    color: #fff !important;
+    background-color: <?php print colorDarker($badgeDark, 10); ?>;
+}
+
+/*
+* STATUS BADGES
+*/
+
+/* Default Status */
+
+<?php for ($i = 0; $i <= 9; $i++){
+
+    print "\n/* STATUS".$i." */\n";
+
+    $thisBadgeBackgroundColor = $thisBadgeBorderColor = ${'badgeStatus'.$i};
+
+
+    $TBadgeBorderOnly = array(0,3,5,7);
+    $thisBadgeTextColor = colorIsLight(${'badgeStatus'.$i})?'#212529':'#ffffff';
+    if(in_array($i, $TBadgeBorderOnly)){
+        $thisBadgeTextColor = '#212529';
+        $thisBadgeBackgroundColor = "#fff";
+    }
+
+    print ".badge-status".$i." {\n";
+    print "        color: ".$thisBadgeTextColor." !important;\n";
+
+    if(in_array($i, $TBadgeBorderOnly)){
+        print "        border-color: ".$thisBadgeBorderColor.";\n";
+    }
+
+    print "        background-color: ".$thisBadgeBackgroundColor.";\n";
+    print "}\n";
+
+    print ".badge-status".$i.".focus, .badge-status".$i.":focus {\n";
+    print "    outline: 0;\n";
+    print "    box-shadow: 0 0 0 0.2rem ".colorHexToRgb($thisBadgeBackgroundColor, 0.5).";\n";
+    print "}\n";
+
+    print ".badge-status".$i.":focus, .badge-status".$i.":hover {\n";
+    print "    color: ".$thisBadgeTextColor." !important;\n";
+    print "    background-color: ".colorDarker($thisBadgeBackgroundColor, 10).";\n";
+    if(in_array($i, $TBadgeBorderOnly)){
+        print "        border-color: ".colorDarker($thisBadgeBorderColor, 10).";\n";
+    }
+    print "}\n";
+}
+
diff --git a/htdocs/theme/md/info-box.inc.php b/htdocs/theme/md/info-box.inc.php
new file mode 100644
index 00000000000..d2009a94b76
--- /dev/null
+++ b/htdocs/theme/md/info-box.inc.php
@@ -0,0 +1,244 @@
+<?php
+if (! defined('ISLOADEDBYSTEELSHEET'))  die('Must be call by steelsheet'); ?>
+/* <style type="text/css" > */
+
+/*
+ * Component: Info Box
+ * -------------------
+ */
+.info-box {
+	display: block;
+	min-height: 90px;
+	background: #fff;
+	width: 100%;
+	margin-bottom: 15px;
+	border: 1px solid #ddd;
+}
+.info-box small {
+	font-size: 14px;
+}
+.info-box .progress {
+	background: rgba(0, 0, 0, 0.2);
+	margin: 5px -10px 5px -10px;
+	height: 2px;
+}
+.info-box .progress,
+.info-box .progress .progress-bar {
+	border-radius: 0;
+}
+
+.info-box .progress .progress-bar {
+		float: left;
+		width: 0;
+		height: 100%;
+		font-size: 12px;
+		line-height: 20px;
+		color: #fff;
+		text-align: center;
+		background-color: #337ab7;
+		-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
+		box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
+		-webkit-transition: width .6s ease;
+		-o-transition: width .6s ease;
+		transition: width .6s ease;
+}
+.info-box-icon {
+	display: block;
+	float: left;
+	height: 90px;
+	width: 90px;
+	text-align: center;
+	font-size: 45px;
+	line-height: 90px;
+	background: #eee;
+}
+.info-box-icon > img {
+	max-width: 100%;
+}
+.info-box-content {
+	padding: 5px 10px;
+	margin-left: 90px;
+}
+.info-box-number {
+	display: block;
+	font-weight: bold;
+	font-size: 18px;
+}
+.progress-description,
+.info-box-text,
+.info-box-title{
+	display: block;
+	font-size: 12px;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+.info-box-title{
+	text-transform: uppercase;
+	font-weight: bold;
+}
+.info-box-text:first-letter{text-transform: uppercase}
+a.info-box-text{ text-decoration: none;}
+
+
+.info-box-more {
+	display: block;
+}
+.progress-description {
+	margin: 0;
+}
+
+
+
+/* ICONS */
+.info-box-icon {
+	color: #000 !important;
+}
+/*
+.bg-infoxbox-project{
+	background-color: #605ca8 !important;
+}
+.bg-infoxbox-action{
+	background-color: #d81b60 !important;
+}
+.bg-infoxbox-propal,
+.bg-infoxbox-facture,
+.bg-infoxbox-commande{
+	background-color: #dd4b39 !important;
+}
+.bg-infoxbox-supplier_proposal,
+.bg-infoxbox-invoice_supplier,
+.bg-infoxbox-order_supplier{
+	background-color: #00c0ef !important;
+}
+.bg-infoxbox-contrat{
+	background-color: #00a65a !important;
+}
+.bg-infoxbox-bank_account{
+	background-color: #f39c12 !important;
+}
+.bg-infoxbox-adherent{
+	//background-color: #f39c12 !important;
+}
+.bg-infoxbox-expensereport{
+	background-color: #a55114 !important;
+}
+.bg-infoxbox-holiday{
+	background-color: #cbd81b !important;
+}
+*/
+
+.fa-dol-action:before {
+	content: "\f073";
+}
+.fa-dol-propal:before,
+.fa-dol-supplier_proposal:before {
+	content: "\f2b5";
+}
+.fa-dol-facture:before,
+.fa-dol-invoice_supplier:before {
+	content: "\f571";
+}
+.fa-dol-project:before {
+	content: "\f0e8";
+}
+.fa-dol-commande:before,
+.fa-dol-order_supplier:before {
+	content: "\f570";
+}
+.fa-dol-contrat:before {
+	content: "\f1e6";
+}
+.fa-dol-bank_account:before {
+	content: "\f19c";
+}
+.fa-dol-adherent:before {
+	content: "\f0c0";
+}
+.fa-dol-expensereport:before {
+	content: "\f555";
+}
+.fa-dol-holiday:before {
+	content: "\f5ca";
+}
+
+
+/* USING FONTAWESOME FOR WEATHER */
+.info-box-weather .info-box-icon{
+	background: rgba(0, 0, 0, 0); !important;
+}
+.fa-weather-level0:before{
+	content: "\f185";
+	color : #000000;
+}
+.fa-weather-level1:before{
+	content: "\f6c4";
+	color : #000000;
+}
+.fa-weather-level2:before{
+	content: "\f0c2";
+	color : #000000;
+}
+.fa-weather-level3:before{
+	content: "\f740";
+	color : #000000;
+}
+.fa-weather-level4:before{
+	content: "\f0e7";
+	color : #000000;
+}
+
+/* USING IMAGES FOR WEATHER INTEAD OF FONT AWESOME */
+/* For other themes just uncomment this part */
+/*.info-box-weather-level0,
+.info-box-weather-level1,
+.info-box-weather-level2,
+.info-box-weather-level3,
+.info-box-weather-level4 {
+	background-position: 15px 50%;
+	background-repeat: no-repeat;
+}
+
+.info-box-weather .info-box-icon{
+	display: none !important;
+}
+.info-box-weather-level0 {
+	background-image: url("img/weather/weather-clear.png");
+}
+.info-box-weather-level1 {
+	background-image: url("img/weather/weather-few-clouds.png");
+}
+.info-box-weather-level2 {
+	background-image: url("img/weather/weather-clouds.png");
+}
+.info-box-weather-level3 {
+	background-image: url("img/weather/weather-many-clouds.png");
+}
+.info-box-weather-level4 {
+	background-image: url("img/weather/weather-storm.png");
+}*/
+
+
+
+.box-flex-container{
+	display: flex; /* or inline-flex */
+	flex-direction: row;
+	flex-wrap: wrap;
+	width: 100%;
+	/*justify-content: space-between;*/
+}
+
+.box-flex-item{
+	flex-grow : 1;
+	flex-shrink: 1;
+	flex-basis: auto;
+
+	width: 280px;
+	padding: 5px 10px;
+}
+.box-flex-item.filler{
+	margin: 0;
+	padding: 0px 10px !important;
+	height: 0;
+}
diff --git a/htdocs/theme/md/style.css.php b/htdocs/theme/md/style.css.php
index 8999a73aaea..c064502b0b9 100644
--- a/htdocs/theme/md/style.css.php
+++ b/htdocs/theme/md/style.css.php
@@ -691,20 +691,7 @@ textarea.centpercent {
 }
 
 /* Themes for badges */
-.badge {
-	display: inline-block;
-	min-width: 10px;
-	padding: 2px 5px;
-	font-size: 10px;
-	font-weight: 700;
-	line-height: 1em;
-	color: #fff;
-	text-align: center;
-	white-space: nowrap;
-	vertical-align: baseline;
-	background-color: #777;
-	border-radius: 10px;
-}
+<?php include dol_buildpath($path.'/theme/'.$theme.'/badges.inc.php', 0); ?>
 
 .borderrightlight
 {
@@ -5860,6 +5847,6 @@ border-top-right-radius: 6px;
 
 include dol_buildpath($path.'/theme/'.$theme.'/dropdown.inc.php', 0);
 
-
+include dol_buildpath($path.'/theme/'.$theme.'/info-box.inc.php', 0);
 
 if (is_object($db)) $db->close();
diff --git a/htdocs/theme/md/theme_vars.inc.php b/htdocs/theme/md/theme_vars.inc.php
index 95ac3abdd34..c69d9c82a3c 100644
--- a/htdocs/theme/md/theme_vars.inc.php
+++ b/htdocs/theme/md/theme_vars.inc.php
@@ -54,3 +54,28 @@ $colortext='0,0,0';
 $colortextlink='0,0,120';
 $fontsize='14';
 $fontsizesmaller='11';
+
+// Badges colors
+$badgePrimary   ='#007bff';
+$badgeSecondary ='#999999';
+$badgeSuccess   ='#28a745';
+$badgeDanger    ='#8c4446';
+$badgeWarning   ='#ffc107';
+$badgeInfo      ='#17a2b8';
+$badgeDark      ='#343a40';
+$badgeLight     ='#f8f9fa';
+
+/* default color for status : After a quick check, somme status can have oposite function according to objects
+*  So this badges status uses default value according to theme eldy status img
+*  TODO: use color definition vars above for define badges color status X -> expemple $badgeStatusValidate, $badgeStatusClosed, $badgeStatusActive ....
+*/
+$badgeStatus0='#cbd3d3';
+$badgeStatus1='#bc9526';
+$badgeStatus2='#e6f0f0';
+$badgeStatus3='#bca52b';
+$badgeStatus4='#277d1e';
+$badgeStatus5='#cad2d2';
+$badgeStatus6='#cad2d2';
+$badgeStatus7='#baa32b';
+$badgeStatus8='#be3013';
+$badgeStatus9='#e7f0f0';