diff --git a/app/ecolyo.e2fd258cef29255dc684.js b/app/ecolyo.717f8a40153804e66b05.js
similarity index 99%
rename from app/ecolyo.e2fd258cef29255dc684.js
rename to app/ecolyo.717f8a40153804e66b05.js
index d58831a67c476427e196d8bddb90169d3c010454..6960c975d546ada894383be67fc835ae65a474a7 100644
--- a/app/ecolyo.e2fd258cef29255dc684.js
+++ b/app/ecolyo.717f8a40153804e66b05.js
@@ -15722,7 +15722,7 @@ module.exports = (Handlebars["default"] || Handlebars).template({"compiler":[8,"
         return undefined
     };
 
-  return "<mj-section css-class='background' padding='17px' align='center'>\n  <mj-social\n    css-class='button-with-icon'\n    icon-size='36px'\n    mode='horizontal'\n    font-size='24px'\n    font-weight='normal'\n  >\n    <mj-social-element\n      color='white'\n      src='"
+  return "<mj-section background-color='#1B1C22' padding='17px' align='center'>\n  <mj-social\n    css-class='button-with-icon'\n    icon-size='36px'\n    mode='horizontal'\n    font-size='24px'\n    font-weight='normal'\n  >\n    <mj-social-element\n      color='white'\n      src='"
     + alias4(((helper = (helper = lookupProperty(helpers,"baseUrl") || (depth0 != null ? lookupProperty(depth0,"baseUrl") : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"baseUrl","hash":{},"data":data,"loc":{"start":{"line":11,"column":11},"end":{"line":11,"column":22}}}) : helper)))
     + "/assets/ecolyo-icon.png'\n      name='ecolyo'\n      padding='0 10px 0 0'\n      align='center'\n    >\n      "
     + alias4(((helper = (helper = lookupProperty(helpers,"title") || (depth0 != null ? lookupProperty(depth0,"title") : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"title","hash":{},"data":data,"loc":{"start":{"line":16,"column":6},"end":{"line":16,"column":15}}}) : helper)))
@@ -19607,7 +19607,7 @@ var result = _node_modules_svg_sprite_loader_runtime_browser_sprite_build_js__WE
 var Handlebars = __webpack_require__("3O+N");
 function __default(obj) { return obj && (obj.__esModule ? obj["default"] : obj); }
 module.exports = (Handlebars["default"] || Handlebars).template({"compiler":[8,">= 4.3.0"],"main":function(container,depth0,helpers,partials,data) {
-    return "<mj-style>\n  .main div{ line-height: 23.4px !important; font-family: 'Lato', sans-serif\n  !important; } .main .background{ background: radial-gradient(96.2% 96.2% at\n  50% 3.8%, #343641 0%, #1B1C22 100%) !important; }\n</mj-style>\n<mj-style>\n  .small div{ font-weight: 400 !important; font-size: 13px !important;\n  line-height: 23.4px !important; }\n</mj-style>\n<mj-style>\n  .header-title div{ font-weight: normal !important; font-size: 24px !important;\n  line-height: 29px !important; }\n</mj-style>\n<mj-style>\n  .m-divider p { margin: 60px 0 54px 0 !important; }\n</mj-style>\n<mj-style>\n  .button table { background-color: #F1C017 !important; margin: 10px !important;\n  } .button-with-icon td { padding-right: 1px !important; } .button-with-icon\n  table { background-color: #F1C017 !important; margin-left: 10px !important;\n  margin-right: 10px !important; } .button-with-icon span { vertical-align:\n  middle !important; } .button-with-icon a { vertical-align: middle !important;\n  padding-right: 10px !important;} .button-with-icon a img { padding-top: 20px\n  !important;}\n</mj-style>\n<mj-style>\n  .custom-link a { color: #F1C017 !important; text-decoration: none !important;\n  } .custom-link a:visited { color: #F1C017 !important; text-decoration: none\n  !important; }\n</mj-style>\n<mj-style>\n  .text-and-image img { vertical-align: middle!important; margin-right:\n  12px!important }\n</mj-style>\n<mj-attributes>\n  <mj-all font-family='Lato, sans-serif' font-size='16px'></mj-all>\n</mj-attributes>\n<mj-font\n  name='Lato'\n  href='https://fonts.googleapis.com/css?family=Lato'\n></mj-font>\n<mj-style>\n  @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src:\n  local('Lato Regular'), local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/8qcEw_nrk_5HEcCpYdJu8BTbgVql8nDJpwnrE27mub0.woff2)\n  format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB,\n  U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Lato';\n  font-style: normal; font-weight: 400; src: local('Lato Regular'),\n  local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/MDadn8DQ_3oT6kvnUq_2r_esZW2xOQ-xsNqO47m55DA.woff2)\n  format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6,\n  U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; } @font-face {\n  font-family: 'Lato-Bold'; font-style: normal; font-weight: 800; src:\n  asset-url('Lato-Bold.woff2') format('woff2'); }\n</mj-style>";
+    return "<mj-style>\n  .main div{ line-height: 23.4px !important; font-family: 'Lato', sans-serif\n  !important; }\n</mj-style>\n<mj-style>\n  .small div{ font-weight: 400 !important; font-size: 13px !important;\n  line-height: 23.4px !important; }\n</mj-style>\n<mj-style>\n  .header-title div{ font-weight: normal !important; font-size: 24px !important;\n  line-height: 29px !important; }\n</mj-style>\n<mj-style>\n  .m-divider p { margin: 60px 0 54px 0 !important; }\n</mj-style>\n<mj-style>\n  .button table { background-color: #F1C017 !important; margin: 10px !important;\n  } .button-with-icon td { padding-right: 1px !important; } .button-with-icon\n  table { background-color: #F1C017 !important; margin-left: 10px !important;\n  margin-right: 10px !important; } .button-with-icon span { vertical-align:\n  middle !important; } .button-with-icon a { vertical-align: middle !important;\n  padding-right: 10px !important;} .button-with-icon a img { padding-top: 20px\n  !important;}\n</mj-style>\n<mj-style>\n  .custom-link a { color: #F1C017 !important; text-decoration: none !important;\n  } .custom-link a:visited { color: #F1C017 !important; text-decoration: none\n  !important; }\n</mj-style>\n<mj-style>\n  .text-and-image img { vertical-align: middle!important; margin-right:\n  12px!important }\n</mj-style>\n<mj-attributes>\n  <mj-all font-family='Lato, sans-serif' font-size='16px'></mj-all>\n</mj-attributes>\n<mj-font\n  name='Lato'\n  href='https://fonts.googleapis.com/css?family=Lato'\n></mj-font>\n<mj-style>\n  @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src:\n  local('Lato Regular'), local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/8qcEw_nrk_5HEcCpYdJu8BTbgVql8nDJpwnrE27mub0.woff2)\n  format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB,\n  U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Lato';\n  font-style: normal; font-weight: 400; src: local('Lato Regular'),\n  local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/MDadn8DQ_3oT6kvnUq_2r_esZW2xOQ-xsNqO47m55DA.woff2)\n  format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6,\n  U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; } @font-face {\n  font-family: 'Lato-Bold'; font-style: normal; font-weight: 800; src:\n  asset-url('Lato-Bold.woff2') format('woff2'); }\n</mj-style>";
 },"useData":true});
 
 /***/ }),
diff --git a/index.html b/index.html
index e0a145e995e82559d0f7b0b7c74e75968c7f5bb7..51631d215c54f9c4641f895ae78e2ee75745ff50 100644
--- a/index.html
+++ b/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html lang="{{.Locale}}"><head><meta charset="utf-8"><title>Ecolyo</title><link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32"><link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16"><!-- PWA Manifest --><link rel="manifest" href="/manifest.json" crossorigin="use-credentials"><link rel="mask-icon" href="/safari-pinned-tab.svg" color="#297EF2"><meta name="viewport" content="width=device-width,height=device-height,initial-scale=1,viewport-fit=cover"><!-- PWA Chrome --><link rel="icon" sizes="192x192" href="/android-chrome-192x192.png"><link rel="icon" sizes="512x512" href="/android-chrome-512x512.png"><!-- PWA iOS --><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"><link rel="apple-touch-startup-image" href="/apple-touch-icon.png"><meta name="apple-mobile-web-app-title" content="Ecolyo"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"><!-- PWA Colors --><meta name="theme-color" content="#343641"><meta name="background-color" content="#121212">{{.ThemeCSS}} {{.CozyBar}}<script src="//{{.Domain}}/assets/js/piwik.js"></script></head><body><div role="application" class="application" data-cozy="{{.CozyData}}"><script src="vendors/ecolyo.35f915516b9585855081.js"></script><script src="app/ecolyo.e2fd258cef29255dc684.js"></script></div></body></html>
\ No newline at end of file
+<!DOCTYPE html><html lang="{{.Locale}}"><head><meta charset="utf-8"><title>Ecolyo</title><link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32"><link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16"><!-- PWA Manifest --><link rel="manifest" href="/manifest.json" crossorigin="use-credentials"><link rel="mask-icon" href="/safari-pinned-tab.svg" color="#297EF2"><meta name="viewport" content="width=device-width,height=device-height,initial-scale=1,viewport-fit=cover"><!-- PWA Chrome --><link rel="icon" sizes="192x192" href="/android-chrome-192x192.png"><link rel="icon" sizes="512x512" href="/android-chrome-512x512.png"><!-- PWA iOS --><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"><link rel="apple-touch-startup-image" href="/apple-touch-icon.png"><meta name="apple-mobile-web-app-title" content="Ecolyo"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"><!-- PWA Colors --><meta name="theme-color" content="#343641"><meta name="background-color" content="#121212">{{.ThemeCSS}} {{.CozyBar}}<script src="//{{.Domain}}/assets/js/piwik.js"></script></head><body><div role="application" class="application" data-cozy="{{.CozyData}}"><script src="vendors/ecolyo.35f915516b9585855081.js"></script><script src="app/ecolyo.717f8a40153804e66b05.js"></script></div></body></html>
\ No newline at end of file
diff --git a/services/consumptionAlert/ecolyo.js b/services/consumptionAlert/ecolyo.js
index 5fcc023a547dc1daf2f059b1e46f94035703a14e..31a3fbb4b14fe239465cc1c9cd0c20804c7aba4a 100644
--- a/services/consumptionAlert/ecolyo.js
+++ b/services/consumptionAlert/ecolyo.js
@@ -163048,7 +163048,7 @@ module.exports = exports['default'];
 var Handlebars = __webpack_require__(1571);
 function __default(obj) { return obj && (obj.__esModule ? obj["default"] : obj); }
 module.exports = (Handlebars["default"] || Handlebars).template({"compiler":[8,">= 4.3.0"],"main":function(container,depth0,helpers,partials,data) {
-    return "<mj-style>\n  .main div{ line-height: 23.4px !important; font-family: 'Lato', sans-serif\n  !important; } .main .background{ background: radial-gradient(96.2% 96.2% at\n  50% 3.8%, #343641 0%, #1B1C22 100%) !important; }\n</mj-style>\n<mj-style>\n  .small div{ font-weight: 400 !important; font-size: 13px !important;\n  line-height: 23.4px !important; }\n</mj-style>\n<mj-style>\n  .header-title div{ font-weight: normal !important; font-size: 24px !important;\n  line-height: 29px !important; }\n</mj-style>\n<mj-style>\n  .m-divider p { margin: 60px 0 54px 0 !important; }\n</mj-style>\n<mj-style>\n  .button table { background-color: #F1C017 !important; margin: 10px !important;\n  } .button-with-icon td { padding-right: 1px !important; } .button-with-icon\n  table { background-color: #F1C017 !important; margin-left: 10px !important;\n  margin-right: 10px !important; } .button-with-icon span { vertical-align:\n  middle !important; } .button-with-icon a { vertical-align: middle !important;\n  padding-right: 10px !important;} .button-with-icon a img { padding-top: 20px\n  !important;}\n</mj-style>\n<mj-style>\n  .custom-link a { color: #F1C017 !important; text-decoration: none !important;\n  } .custom-link a:visited { color: #F1C017 !important; text-decoration: none\n  !important; }\n</mj-style>\n<mj-style>\n  .text-and-image img { vertical-align: middle!important; margin-right:\n  12px!important }\n</mj-style>\n<mj-attributes>\n  <mj-all font-family='Lato, sans-serif' font-size='16px'></mj-all>\n</mj-attributes>\n<mj-font\n  name='Lato'\n  href='https://fonts.googleapis.com/css?family=Lato'\n></mj-font>\n<mj-style>\n  @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src:\n  local('Lato Regular'), local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/8qcEw_nrk_5HEcCpYdJu8BTbgVql8nDJpwnrE27mub0.woff2)\n  format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB,\n  U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Lato';\n  font-style: normal; font-weight: 400; src: local('Lato Regular'),\n  local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/MDadn8DQ_3oT6kvnUq_2r_esZW2xOQ-xsNqO47m55DA.woff2)\n  format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6,\n  U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; } @font-face {\n  font-family: 'Lato-Bold'; font-style: normal; font-weight: 800; src:\n  asset-url('Lato-Bold.woff2') format('woff2'); }\n</mj-style>";
+    return "<mj-style>\n  .main div{ line-height: 23.4px !important; font-family: 'Lato', sans-serif\n  !important; }\n</mj-style>\n<mj-style>\n  .small div{ font-weight: 400 !important; font-size: 13px !important;\n  line-height: 23.4px !important; }\n</mj-style>\n<mj-style>\n  .header-title div{ font-weight: normal !important; font-size: 24px !important;\n  line-height: 29px !important; }\n</mj-style>\n<mj-style>\n  .m-divider p { margin: 60px 0 54px 0 !important; }\n</mj-style>\n<mj-style>\n  .button table { background-color: #F1C017 !important; margin: 10px !important;\n  } .button-with-icon td { padding-right: 1px !important; } .button-with-icon\n  table { background-color: #F1C017 !important; margin-left: 10px !important;\n  margin-right: 10px !important; } .button-with-icon span { vertical-align:\n  middle !important; } .button-with-icon a { vertical-align: middle !important;\n  padding-right: 10px !important;} .button-with-icon a img { padding-top: 20px\n  !important;}\n</mj-style>\n<mj-style>\n  .custom-link a { color: #F1C017 !important; text-decoration: none !important;\n  } .custom-link a:visited { color: #F1C017 !important; text-decoration: none\n  !important; }\n</mj-style>\n<mj-style>\n  .text-and-image img { vertical-align: middle!important; margin-right:\n  12px!important }\n</mj-style>\n<mj-attributes>\n  <mj-all font-family='Lato, sans-serif' font-size='16px'></mj-all>\n</mj-attributes>\n<mj-font\n  name='Lato'\n  href='https://fonts.googleapis.com/css?family=Lato'\n></mj-font>\n<mj-style>\n  @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src:\n  local('Lato Regular'), local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/8qcEw_nrk_5HEcCpYdJu8BTbgVql8nDJpwnrE27mub0.woff2)\n  format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB,\n  U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Lato';\n  font-style: normal; font-weight: 400; src: local('Lato Regular'),\n  local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/MDadn8DQ_3oT6kvnUq_2r_esZW2xOQ-xsNqO47m55DA.woff2)\n  format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6,\n  U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; } @font-face {\n  font-family: 'Lato-Bold'; font-style: normal; font-weight: 800; src:\n  asset-url('Lato-Bold.woff2') format('woff2'); }\n</mj-style>";
 },"useData":true});
 
 /***/ }),
@@ -163065,7 +163065,7 @@ module.exports = (Handlebars["default"] || Handlebars).template({"compiler":[8,"
         return undefined
     };
 
-  return "<mj-section css-class='background' padding='17px' align='center'>\n  <mj-social\n    css-class='button-with-icon'\n    icon-size='36px'\n    mode='horizontal'\n    font-size='24px'\n    font-weight='normal'\n  >\n    <mj-social-element\n      color='white'\n      src='"
+  return "<mj-section background-color='#1B1C22' padding='17px' align='center'>\n  <mj-social\n    css-class='button-with-icon'\n    icon-size='36px'\n    mode='horizontal'\n    font-size='24px'\n    font-weight='normal'\n  >\n    <mj-social-element\n      color='white'\n      src='"
     + alias4(((helper = (helper = lookupProperty(helpers,"baseUrl") || (depth0 != null ? lookupProperty(depth0,"baseUrl") : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"baseUrl","hash":{},"data":data,"loc":{"start":{"line":11,"column":11},"end":{"line":11,"column":22}}}) : helper)))
     + "/assets/ecolyo-icon.png'\n      name='ecolyo'\n      padding='0 10px 0 0'\n      align='center'\n    >\n      "
     + alias4(((helper = (helper = lookupProperty(helpers,"title") || (depth0 != null ? lookupProperty(depth0,"title") : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"title","hash":{},"data":data,"loc":{"start":{"line":16,"column":6},"end":{"line":16,"column":15}}}) : helper)))
diff --git a/services/monthlyReportNotification/ecolyo.js b/services/monthlyReportNotification/ecolyo.js
index 2e9d17af0d5fcbc4968e7918eceb30de9b0c8b9f..e70a368ecbaca640c393238c3018b8e7dee701c9 100644
--- a/services/monthlyReportNotification/ecolyo.js
+++ b/services/monthlyReportNotification/ecolyo.js
@@ -162898,7 +162898,7 @@ module.exports = exports['default'];
 var Handlebars = __webpack_require__(1571);
 function __default(obj) { return obj && (obj.__esModule ? obj["default"] : obj); }
 module.exports = (Handlebars["default"] || Handlebars).template({"compiler":[8,">= 4.3.0"],"main":function(container,depth0,helpers,partials,data) {
-    return "<mj-style>\n  .main div{ line-height: 23.4px !important; font-family: 'Lato', sans-serif\n  !important; } .main .background{ background: radial-gradient(96.2% 96.2% at\n  50% 3.8%, #343641 0%, #1B1C22 100%) !important; }\n</mj-style>\n<mj-style>\n  .small div{ font-weight: 400 !important; font-size: 13px !important;\n  line-height: 23.4px !important; }\n</mj-style>\n<mj-style>\n  .header-title div{ font-weight: normal !important; font-size: 24px !important;\n  line-height: 29px !important; }\n</mj-style>\n<mj-style>\n  .m-divider p { margin: 60px 0 54px 0 !important; }\n</mj-style>\n<mj-style>\n  .button table { background-color: #F1C017 !important; margin: 10px !important;\n  } .button-with-icon td { padding-right: 1px !important; } .button-with-icon\n  table { background-color: #F1C017 !important; margin-left: 10px !important;\n  margin-right: 10px !important; } .button-with-icon span { vertical-align:\n  middle !important; } .button-with-icon a { vertical-align: middle !important;\n  padding-right: 10px !important;} .button-with-icon a img { padding-top: 20px\n  !important;}\n</mj-style>\n<mj-style>\n  .custom-link a { color: #F1C017 !important; text-decoration: none !important;\n  } .custom-link a:visited { color: #F1C017 !important; text-decoration: none\n  !important; }\n</mj-style>\n<mj-style>\n  .text-and-image img { vertical-align: middle!important; margin-right:\n  12px!important }\n</mj-style>\n<mj-attributes>\n  <mj-all font-family='Lato, sans-serif' font-size='16px'></mj-all>\n</mj-attributes>\n<mj-font\n  name='Lato'\n  href='https://fonts.googleapis.com/css?family=Lato'\n></mj-font>\n<mj-style>\n  @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src:\n  local('Lato Regular'), local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/8qcEw_nrk_5HEcCpYdJu8BTbgVql8nDJpwnrE27mub0.woff2)\n  format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB,\n  U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Lato';\n  font-style: normal; font-weight: 400; src: local('Lato Regular'),\n  local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/MDadn8DQ_3oT6kvnUq_2r_esZW2xOQ-xsNqO47m55DA.woff2)\n  format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6,\n  U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; } @font-face {\n  font-family: 'Lato-Bold'; font-style: normal; font-weight: 800; src:\n  asset-url('Lato-Bold.woff2') format('woff2'); }\n</mj-style>";
+    return "<mj-style>\n  .main div{ line-height: 23.4px !important; font-family: 'Lato', sans-serif\n  !important; }\n</mj-style>\n<mj-style>\n  .small div{ font-weight: 400 !important; font-size: 13px !important;\n  line-height: 23.4px !important; }\n</mj-style>\n<mj-style>\n  .header-title div{ font-weight: normal !important; font-size: 24px !important;\n  line-height: 29px !important; }\n</mj-style>\n<mj-style>\n  .m-divider p { margin: 60px 0 54px 0 !important; }\n</mj-style>\n<mj-style>\n  .button table { background-color: #F1C017 !important; margin: 10px !important;\n  } .button-with-icon td { padding-right: 1px !important; } .button-with-icon\n  table { background-color: #F1C017 !important; margin-left: 10px !important;\n  margin-right: 10px !important; } .button-with-icon span { vertical-align:\n  middle !important; } .button-with-icon a { vertical-align: middle !important;\n  padding-right: 10px !important;} .button-with-icon a img { padding-top: 20px\n  !important;}\n</mj-style>\n<mj-style>\n  .custom-link a { color: #F1C017 !important; text-decoration: none !important;\n  } .custom-link a:visited { color: #F1C017 !important; text-decoration: none\n  !important; }\n</mj-style>\n<mj-style>\n  .text-and-image img { vertical-align: middle!important; margin-right:\n  12px!important }\n</mj-style>\n<mj-attributes>\n  <mj-all font-family='Lato, sans-serif' font-size='16px'></mj-all>\n</mj-attributes>\n<mj-font\n  name='Lato'\n  href='https://fonts.googleapis.com/css?family=Lato'\n></mj-font>\n<mj-style>\n  @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src:\n  local('Lato Regular'), local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/8qcEw_nrk_5HEcCpYdJu8BTbgVql8nDJpwnrE27mub0.woff2)\n  format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB,\n  U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Lato';\n  font-style: normal; font-weight: 400; src: local('Lato Regular'),\n  local('Lato-Regular'),\n  url(https://fonts.gstatic.com/s/lato/v13/MDadn8DQ_3oT6kvnUq_2r_esZW2xOQ-xsNqO47m55DA.woff2)\n  format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6,\n  U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; } @font-face {\n  font-family: 'Lato-Bold'; font-style: normal; font-weight: 800; src:\n  asset-url('Lato-Bold.woff2') format('woff2'); }\n</mj-style>";
 },"useData":true});
 
 /***/ }),
@@ -162915,7 +162915,7 @@ module.exports = (Handlebars["default"] || Handlebars).template({"compiler":[8,"
         return undefined
     };
 
-  return "<mj-section css-class='background' padding='17px' align='center'>\n  <mj-social\n    css-class='button-with-icon'\n    icon-size='36px'\n    mode='horizontal'\n    font-size='24px'\n    font-weight='normal'\n  >\n    <mj-social-element\n      color='white'\n      src='"
+  return "<mj-section background-color='#1B1C22' padding='17px' align='center'>\n  <mj-social\n    css-class='button-with-icon'\n    icon-size='36px'\n    mode='horizontal'\n    font-size='24px'\n    font-weight='normal'\n  >\n    <mj-social-element\n      color='white'\n      src='"
     + alias4(((helper = (helper = lookupProperty(helpers,"baseUrl") || (depth0 != null ? lookupProperty(depth0,"baseUrl") : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"baseUrl","hash":{},"data":data,"loc":{"start":{"line":11,"column":11},"end":{"line":11,"column":22}}}) : helper)))
     + "/assets/ecolyo-icon.png'\n      name='ecolyo'\n      padding='0 10px 0 0'\n      align='center'\n    >\n      "
     + alias4(((helper = (helper = lookupProperty(helpers,"title") || (depth0 != null ? lookupProperty(depth0,"title") : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"title","hash":{},"data":data,"loc":{"start":{"line":16,"column":6},"end":{"line":16,"column":15}}}) : helper)))
@@ -163275,7 +163275,7 @@ module.exports = (Handlebars["default"] || Handlebars).template({"1":function(co
         return undefined
     };
 
-  return "        <mj-text color=\"white\" font-weight=\"400\"  font-size=\"18px\">Par rapport au mois "
+  return "        <mj-text color=\"white\" font-weight=\"400\" font-size=\"18px\">Par rapport au mois "
     + container.escapeExpression(alias1((depth0 != null ? lookupProperty(depth0,"previousMonth") : depth0), depth0))
     + ", vous avez consommé :"
     + ((stack1 = alias1((depth0 != null ? lookupProperty(depth0,"consumptionText") : depth0), depth0)) != null ? stack1 : "")
@@ -163288,7 +163288,7 @@ module.exports = (Handlebars["default"] || Handlebars).template({"1":function(co
         return undefined
     };
 
-  return "      <mj-section background-color=\"radial-gradient(96.2% 96.2% at 50% 3.8%, #343641 0%, #1B1C22 100%)\">\n        <mj-column>\n"
+  return "      <mj-section background-color=\"#1B1C22\">\n        <mj-column>\n"
     + ((stack1 = lookupProperty(helpers,"if").call(alias1,(depth0 != null ? lookupProperty(depth0,"isInfo") : depth0),{"name":"if","hash":{},"fn":container.program(6, data, 0),"inverse":container.noop,"data":data,"loc":{"start":{"line":50,"column":10},"end":{"line":56,"column":17}}})) != null ? stack1 : "")
     + ((stack1 = lookupProperty(helpers,"if").call(alias1,(depth0 != null ? lookupProperty(depth0,"divider1") : depth0),{"name":"if","hash":{},"fn":container.program(8, data, 0),"inverse":container.noop,"data":data,"loc":{"start":{"line":57,"column":10},"end":{"line":59,"column":17}}})) != null ? stack1 : "")
     + ((stack1 = lookupProperty(helpers,"if").call(alias1,(depth0 != null ? lookupProperty(depth0,"isServiceNews") : depth0),{"name":"if","hash":{},"fn":container.program(10, data, 0),"inverse":container.noop,"data":data,"loc":{"start":{"line":60,"column":10},"end":{"line":65,"column":17}}})) != null ? stack1 : "")
@@ -163350,13 +163350,13 @@ module.exports = (Handlebars["default"] || Handlebars).template({"1":function(co
     + ((stack1 = container.invokePartial(__webpack_require__(1593),depth0,{"name":"style","fn":container.program(1, data, 0),"inverse":container.noop,"data":data,"helpers":helpers,"partials":partials,"decorators":container.decorators})) != null ? stack1 : "")
     + "    <mj-style>\n    .elec-text {\n        color: #d87b39 !important;\n        font-weight: normal !important;\n      }\n    .gas-text {\n        color: #45d1b8 !important;\n        font-weight: normal !important;\n      }\n    .water-text {\n        color: #3a98ec !important;\n        font-weight: normal !important;\n      }\n    </mj-style>\n  </mj-head>\n  <mj-body background-color=\"#121212\" css-class=\"main\">\n"
     + ((stack1 = container.invokePartial(__webpack_require__(1594),depth0,{"name":"base/header","fn":container.program(1, data, 0),"inverse":container.noop,"data":data,"helpers":helpers,"partials":partials,"decorators":container.decorators})) != null ? stack1 : "")
-    + "\n    <mj-section  background-color=\"#121212\">\n      <mj-column width=\"55%\" vertical-align=\"middle\">\n        <mj-text color=\"white\" font-weight=\"900\"  font-size=\"24px\">\n          Bonjour "
+    + "\n    <mj-section background-color=\"#121212\">\n      <mj-column width=\"55%\" vertical-align=\"middle\">\n        <mj-text color=\"white\" font-weight=\"900\" font-size=\"24px\">\n          Bonjour "
     + alias2(alias1((depth0 != null ? lookupProperty(depth0,"username") : depth0), depth0))
     + ",\n        </mj-text>\n"
     + ((stack1 = lookupProperty(helpers,"if").call(alias3,(depth0 != null ? lookupProperty(depth0,"consumptionTextExist") : depth0),{"name":"if","hash":{},"fn":container.program(3, data, 0),"inverse":container.noop,"data":data,"loc":{"start":{"line":29,"column":8},"end":{"line":31,"column":15}}})) != null ? stack1 : "")
     + "      </mj-column>\n      <mj-column width=\"45%\" vertical-align=\"middle\">\n        <mj-image src="
     + alias2(alias1((depth0 != null ? lookupProperty(depth0,"consoImageUrl") : depth0), depth0))
-    + " width=\"132px\" align=\"center\" alt=\"consomation\"></mj-image>\n      </mj-column>\n    </mj-section>\n    <mj-section background-color=\"#121212\">\n      <mj-column>\n        <mj-text color=\"white\" font-weight=\"400\"  font-size=\"18px\">Retrouvez le détail de vos consommations et plus d'informations dans votre bilan Ecolyo.<br /><br /></mj-text>\n        <mj-social css-class=\"button-with-icon\" icon-size=\"36px\" mode=\"horizontal\" font-size=\"20px\" font-weight=\"700\">\n          <mj-social-element src=\""
+    + " width=\"132px\" align=\"center\" alt=\"consommation\"></mj-image>\n      </mj-column>\n    </mj-section>\n    <mj-section background-color=\"#121212\">\n      <mj-column>\n        <mj-text color=\"white\" font-weight=\"400\" font-size=\"18px\">Retrouvez le détail de vos consommations et plus d'informations dans votre bilan Ecolyo.<br /><br /></mj-text>\n        <mj-social css-class=\"button-with-icon\" icon-size=\"36px\" mode=\"horizontal\" font-size=\"20px\" font-weight=\"700\">\n          <mj-social-element src=\""
     + alias2(alias1((depth0 != null ? lookupProperty(depth0,"baseUrl") : depth0), depth0))
     + "/assets/ecolyo-icon.png\" name=\"ecolyo\" padding=\"0 10px 0 0\" href=\""
     + alias2(alias1((depth0 != null ? lookupProperty(depth0,"clientUrl") : depth0), depth0))