diff --git a/6/ecolyo.94b4ac94168bc001f899.js b/3/ecolyo.6a2555d0fd2f917f5ede.js
similarity index 88%
rename from 6/ecolyo.94b4ac94168bc001f899.js
rename to 3/ecolyo.6a2555d0fd2f917f5ede.js
index 2d200c48a6a0aa33f5d2e1e73ba15c41234e2d85..b19d35af9a52c927d72d7af95e7d6adb62961f91 100644
--- a/6/ecolyo.94b4ac94168bc001f899.js
+++ b/3/ecolyo.6a2555d0fd2f917f5ede.js
@@ -1,4 +1,15 @@
-(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[6],{
+(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[3],{
+
+/***/ "+dce":
+/***/ (function(module, exports, __webpack_require__) {
+
+exports = module.exports = __webpack_require__("DjJv")(false);
+// Module
+exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.options-root {\n  display: flex;\n  flex-direction: column;\n  gap: 2rem;\n}\n\n.info-links {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n\n.styled-card-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1.5rem;\n}\n.styled-card-root .styled-card-content {\n  max-width: 45.75rem;\n  width: 100%;\n}\n.styled-card-root .styled-card-content .styled-card-header {\n  color: #e0e0e0;\n  margin-bottom: 1rem;\n}\n.styled-card-root .styled-card-content .matomo-content * {\n  font-family: Lato, sans-serif;\n}", ""]);
+
+
+
+/***/ }),
 
 /***/ "2R85":
 /***/ (function(module, exports, __webpack_require__) {
@@ -13,22 +24,23 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _I18n = __webpack_require__("nUfk");
 var _react = _interopRequireDefault(__webpack_require__("ivGQ"));
-__webpack_require__("wGz8");
+__webpack_require__("5mrP");
 var MatomoOptOut = function MatomoOptOut() {
   var _useI18n = (0, _I18n.useI18n)(),
     t = _useI18n.t;
   var baseUrl = "https://statweb.grandlyon.com/";
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "matomo-opt-out-container"
+    className: "styled-card-root"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "matomo-opt-out"
+    className: "styled-card-content"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "opt-out-header text-16-normal-uppercase"
+    className: "styled-card-header text-16-normal-uppercase"
   }, t('matomo.matomo_title')), /*#__PURE__*/_react.default.createElement("iframe", {
     title: "opt-out",
     style: {
       height: '250px'
     },
+    className: "matomo-content",
     src: "".concat(baseUrl, "index.php?module=CoreAdminHome&action=optOut&language=fr&backgroundColor=121212&fontColor=e0e0e0&fontSize=&fontFamily=sans-serif")
   })));
 };
@@ -70,6 +82,10 @@ var SwitchBase = (0, _styles.withStyles)({
         opacity: 1,
         backgroundColor: 'var(--multiColor)'
       }
+    },
+    '&.Mui-focusVisible': {
+      outline: '2px solid #1976d2',
+      outlineOffset: '2px'
     }
   },
   checked: {},
@@ -158,12 +174,38 @@ var result = _node_modules_svg_sprite_loader_runtime_browser_sprite_build_js__WE
 
 /***/ }),
 
+/***/ "5mrP":
+/***/ (function(module, exports, __webpack_require__) {
+
+
+var content = __webpack_require__("+dce");
+
+if(typeof content === 'string') content = [[module.i, content, '']];
+
+var transform;
+var insertInto;
+
+
+
+var options = {"hmr":true}
+
+options.transform = transform
+options.insertInto = undefined;
+
+var update = __webpack_require__("HkU0")(content, options);
+
+if(content.locals) module.exports = content.locals;
+
+if(false) {}
+
+/***/ }),
+
 /***/ "635L":
 /***/ (function(module, exports, __webpack_require__) {
 
 exports = module.exports = __webpack_require__("DjJv")(false);
 // Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.report-option-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1.5rem;\n  margin-top: 2rem;\n}\n.report-option-root .report-option-content {\n  max-width: 45.75rem;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: 2rem;\n}\n.report-option-root .head {\n  color: #e0e0e0;\n  margin-bottom: 1rem;\n}\n.report-option-root .reportCard {\n  border: 1px solid #383941;\n  border-radius: 4px;\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  color: #e0e0e0;\n}\n.report-option-root .reportCard .row {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.report-option-root .switch-container-alert {\n  color: #e0e0e0;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n.report-option-root .alert-input-subtext {\n  color: #a0a0a0;\n}", ""]);
+exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.report-option-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1.5rem;\n}\n.report-option-root .report-option-content {\n  max-width: 45.75rem;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: 2rem;\n}\n.report-option-root .head {\n  color: #e0e0e0;\n  margin-bottom: 1rem;\n}\n.report-option-root .reportCard {\n  border: 1px solid #383941;\n  border-radius: 4px;\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  color: #e0e0e0;\n}\n.report-option-root .reportCard .row {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.report-option-root .switch-container-alert {\n  color: #e0e0e0;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n.report-option-root .alert-input-subtext {\n  color: #a0a0a0;\n}", ""]);
 
 
 
@@ -235,17 +277,6 @@ var ExportStartModal = function ExportStartModal(_ref) {
 var _default = ExportStartModal;
 exports.default = _default;
 
-/***/ }),
-
-/***/ "7M/C":
-/***/ (function(module, exports, __webpack_require__) {
-
-exports = module.exports = __webpack_require__("DjJv")(false);
-// Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.help-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1.5rem;\n  margin-top: 2rem;\n}\n.help-root .help-content {\n  max-width: 45.75rem;\n  width: 100%;\n}\n.help-root .help-content a {\n  color: #ffffff;\n  text-decoration: none;\n}\n.help-root .help-content .help-header {\n  color: #e0e0e0;\n  margin-bottom: 1rem;\n}\n\n.help-card-link {\n  color: #ffffff;\n  cursor: pointer;\n}\n\n.help-card {\n  display: flex;\n  flex-direction: row;\n  margin: -0.75rem 0;\n  width: 100%;\n}\n.help-card .help-card-content {\n  display: flex;\n  flex-direction: row;\n}\n.help-card .help-card-content .help-card-content-icon {\n  margin: 0.5rem 0;\n  min-width: 42px;\n}\n.help-card .help-card-content .help-card-content-title {\n  margin: 0 1rem;\n  align-self: center;\n  text-decoration: none;\n}", ""]);
-
-
-
 /***/ }),
 
 /***/ "7iMq":
@@ -281,45 +312,32 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _Link = _interopRequireDefault(__webpack_require__("FFKy"));
 var _questionMark = _interopRequireDefault(__webpack_require__("pAsk"));
+var _StyledCard = _interopRequireDefault(__webpack_require__("y8/m"));
 var _StyledIcon = _interopRequireDefault(__webpack_require__("VP3k"));
 var _I18n = __webpack_require__("nUfk");
 var _react = _interopRequireDefault(__webpack_require__("ivGQ"));
-var _reactRouterDom = __webpack_require__("Iyno");
 var _hooks = __webpack_require__("6FOS");
 var _modal = __webpack_require__("IvDH");
-__webpack_require__("MmZq");
+__webpack_require__("5mrP");
 var HelpLink = function HelpLink() {
   var _useI18n = (0, _I18n.useI18n)(),
     t = _useI18n.t;
   var dispatch = (0, _hooks.useAppDispatch)();
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "help-root"
+    className: "styled-card-root"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "help-content"
+    className: "styled-card-content"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "help-header text-16-normal-uppercase"
-  }, t('help.title_help')), /*#__PURE__*/_react.default.createElement(_Link.default, {
-    className: "help-card-link",
-    component: _reactRouterDom.Link,
+    className: "styled-card-header text-16-normal-uppercase"
+  }, t('help.title_help')), /*#__PURE__*/_react.default.createElement(_StyledCard.default, {
     onClick: function onClick() {
       return dispatch((0, _modal.openFeedbackModal)(true));
-    },
-    to: ""
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "card"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "help-card"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "help-card-content"
+    }
   }, /*#__PURE__*/_react.default.createElement(_StyledIcon.default, {
-    className: "help-card-content-icon",
     icon: _questionMark.default,
-    size: 42
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "help-card-content-title"
-  }, t('help.read_help'))))))));
+    size: 38
+  }), t('help.read_help'))));
 };
 var _default = HelpLink;
 exports.default = _default;
@@ -662,32 +680,6 @@ var insertInto;
 
 
 
-var options = {"hmr":true}
-
-options.transform = transform
-options.insertInto = undefined;
-
-var update = __webpack_require__("HkU0")(content, options);
-
-if(content.locals) module.exports = content.locals;
-
-if(false) {}
-
-/***/ }),
-
-/***/ "C3hE":
-/***/ (function(module, exports, __webpack_require__) {
-
-
-var content = __webpack_require__("e4Hf");
-
-if(typeof content === 'string') content = [[module.i, content, '']];
-
-var transform;
-var insertInto;
-
-
-
 var options = {"hmr":true}
 
 options.transform = transform
@@ -937,17 +929,6 @@ var ExportDoneModal = function ExportDoneModal(_ref) {
 var _default = ExportDoneModal;
 exports.default = _default;
 
-/***/ }),
-
-/***/ "Jlsz":
-/***/ (function(module, exports, __webpack_require__) {
-
-exports = module.exports = __webpack_require__("DjJv")(false);
-// Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.matomo-opt-out-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1.5rem;\n  margin: 2rem 0;\n}\n.matomo-opt-out-container .matomo-opt-out {\n  margin: 0 auto;\n  max-width: 45.75rem;\n  width: 100%;\n}\n.matomo-opt-out-container .matomo-opt-out .opt-out-header {\n  color: #e0e0e0;\n}\n.matomo-opt-out-container .matomo-opt-out * {\n  font-family: Lato, sans-serif;\n}", ""]);
-
-
-
 /***/ }),
 
 /***/ "KQ7M":
@@ -959,32 +940,6 @@ exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE
 
 
 
-/***/ }),
-
-/***/ "MmZq":
-/***/ (function(module, exports, __webpack_require__) {
-
-
-var content = __webpack_require__("7M/C");
-
-if(typeof content === 'string') content = [[module.i, content, '']];
-
-var transform;
-var insertInto;
-
-
-
-var options = {"hmr":true}
-
-options.transform = transform
-options.insertInto = undefined;
-
-var update = __webpack_require__("HkU0")(content, options);
-
-if(content.locals) module.exports = content.locals;
-
-if(false) {}
-
 /***/ }),
 
 /***/ "QgM0":
@@ -1220,7 +1175,7 @@ if(false) {}
 
 /***/ }),
 
-/***/ "S8m7":
+/***/ "Shzl":
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -1231,38 +1186,30 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _Link = _interopRequireDefault(__webpack_require__("FFKy"));
 var _accessibility = _interopRequireDefault(__webpack_require__("YMCP"));
+var _StyledCard = _interopRequireDefault(__webpack_require__("y8/m"));
 var _StyledIcon = _interopRequireDefault(__webpack_require__("VP3k"));
 var _I18n = __webpack_require__("nUfk");
 var _react = _interopRequireDefault(__webpack_require__("ivGQ"));
-__webpack_require__("C3hE");
-var Accessibility = function Accessibility() {
+__webpack_require__("5mrP");
+var AccessibilityLink = function AccessibilityLink() {
   var _useI18n = (0, _I18n.useI18n)(),
     t = _useI18n.t;
+  var goToAccessibility = function goToAccessibility() {
+    window.open('https://ecolyo.com/accessibilite.html');
+  };
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-root"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-content"
-  }, /*#__PURE__*/_react.default.createElement(_Link.default, {
-    className: "gcu-link-card-link",
-    href: "https://ecolyo.com/accessibilite.html",
-    target: "_blank"
+    className: "styled-card-root"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "card"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-card"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-card-content"
+    className: "styled-card-content"
+  }, /*#__PURE__*/_react.default.createElement(_StyledCard.default, {
+    onClick: goToAccessibility
   }, /*#__PURE__*/_react.default.createElement(_StyledIcon.default, {
-    className: "gcu-link-card-content-icon",
     icon: _accessibility.default,
-    size: 42
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-card-content-title"
-  }, t('common.title_accessibility'))))))));
+    size: 38
+  }), t('common.title_accessibility'))));
 };
-var _default = Accessibility;
+var _default = AccessibilityLink;
 exports.default = _default;
 
 /***/ }),
@@ -1344,39 +1291,32 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _Link = _interopRequireDefault(__webpack_require__("FFKy"));
 var _legalNotice = _interopRequireDefault(__webpack_require__("li/p"));
+var _StyledCard = _interopRequireDefault(__webpack_require__("y8/m"));
 var _StyledIcon = _interopRequireDefault(__webpack_require__("VP3k"));
 var _I18n = __webpack_require__("nUfk");
 var _react = _interopRequireDefault(__webpack_require__("ivGQ"));
 var _reactRouterDom = __webpack_require__("Iyno");
-__webpack_require__("x7TP");
+__webpack_require__("5mrP");
 var LegalNoticeLink = function LegalNoticeLink() {
   var _useI18n = (0, _I18n.useI18n)(),
     t = _useI18n.t;
+  var navigate = (0, _reactRouterDom.useNavigate)();
+  var goToLegalNotice = function goToLegalNotice() {
+    navigate("/options/legalnotice");
+  };
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "legal-notice-root"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "legal-notice-content"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "legal-notice-header text-16-normal-uppercase"
-  }, t('legal.title_legal')), /*#__PURE__*/_react.default.createElement(_Link.default, {
-    className: "legal-notice-card-link",
-    component: _reactRouterDom.Link,
-    to: "/options/legalnotice"
+    className: "styled-card-root"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "card"
+    className: "styled-card-content"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "legal-notice-card"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "legal-notice-card-content"
+    className: "styled-card-header text-16-normal-uppercase"
+  }, t('legal.title_legal')), /*#__PURE__*/_react.default.createElement(_StyledCard.default, {
+    onClick: goToLegalNotice
   }, /*#__PURE__*/_react.default.createElement(_StyledIcon.default, {
-    className: "legal-notice-card-content-icon",
     icon: _legalNotice.default,
-    size: 42
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "legal-notice-card-content-title"
-  }, t('legal.read_legal'))))))));
+    size: 38
+  }), t('legal.read_legal'))));
 };
 var _default = LegalNoticeLink;
 exports.default = _default;
@@ -1403,17 +1343,6 @@ exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE
 
 
 
-/***/ }),
-
-/***/ "aJIj":
-/***/ (function(module, exports, __webpack_require__) {
-
-exports = module.exports = __webpack_require__("DjJv")(false);
-// Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.legal-notice-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  color: #ffffff;\n  padding: 0 1.5rem;\n  margin-top: 2rem;\n}\n.legal-notice-root .legal-notice-header {\n  color: #e0e0e0;\n  margin-bottom: 1rem;\n}\n.legal-notice-root .legal-notice-content {\n  max-width: 45.75rem;\n  width: 100%;\n}\n@media only screen and (max-width : 768px) {\n  .legal-notice-root .legal-notice-content {\n    width: 100%;\n  }\n}\n\n.legal-notice-card-link {\n  color: black;\n}\n\n.legal-notice-card {\n  display: flex;\n  flex-direction: row;\n  margin: -0.75rem 0;\n  width: 100%;\n}\n@media only screen and (max-width : 768px) {\n  .legal-notice-card {\n    width: 100%;\n  }\n}\n.legal-notice-card .legal-notice-card-content {\n  display: flex;\n  flex-direction: row;\n}\n.legal-notice-card .legal-notice-card-content .legal-notice-card-content-icon {\n  margin: 0.5rem 0;\n}\n.legal-notice-card .legal-notice-card-content .legal-notice-card-content-title {\n  margin: 0 1rem;\n  align-self: center;\n  color: white;\n}", ""]);
-
-
-
 /***/ }),
 
 /***/ "dDs/":
@@ -1637,17 +1566,6 @@ var ExportData = function ExportData() {
 var _default = ExportData;
 exports.default = _default;
 
-/***/ }),
-
-/***/ "e4Hf":
-/***/ (function(module, exports, __webpack_require__) {
-
-exports = module.exports = __webpack_require__("DjJv")(false);
-// Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.gcu-link-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  color: #ffffff;\n  padding: 0 1.5rem 0;\n  margin-top: 0.5rem;\n}\n.gcu-link-root .gcu-link-header {\n  margin-bottom: 1.25rem;\n}\n.gcu-link-root .gcu-link-content {\n  max-width: 45.75rem;\n  width: 100%;\n}\n.gcu-link-root .gcu-link-content p {\n  color: #ffffff;\n}\n.gcu-link-root .gcu-link-content a {\n  color: #ffffff;\n  text-decoration: none;\n}\n.gcu-link-root .gcu-link-content li {\n  margin: 1rem 0;\n}\n.gcu-link-root .gcu-link-content h2 {\n  color: #ffffff;\n}\n.gcu-link-root .gcu-link-content h3 {\n  color: #ffffff;\n  margin: 2.5rem 0 1rem;\n}\n.gcu-link-root .gcu-link-content .ln-contact {\n  color: #e3b82a;\n}\n\n.gcu-link-card-link {\n  color: black;\n}\n\n.gcu-link-card {\n  display: flex;\n  flex-direction: row;\n  margin: -0.75rem 0;\n  width: 100%;\n}\n.gcu-link-card .gcu-link-card-content {\n  display: flex;\n  flex-direction: row;\n}\n.gcu-link-card .gcu-link-card-content .gcu-link-card-content-icon {\n  margin: 0.5rem 0;\n}\n.gcu-link-card .gcu-link-card-content .gcu-link-card-content-title {\n  margin: 0 1rem;\n  align-self: center;\n}", ""]);
-
-
-
 /***/ }),
 
 /***/ "eLac":
@@ -1681,7 +1599,7 @@ if(false) {}
 
 exports = module.exports = __webpack_require__("DjJv")(false);
 // Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.expansion-panel-root,\ndiv.expansion-panel-root.Mui-expanded:last-child {\n  margin: 0.2rem 0;\n}\n\n.export-option-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  margin-top: 0.5rem;\n  padding: 0 1.5rem;\n}\n.export-option-root .export-option-content {\n  max-width: 45.75rem;\n  width: 100%;\n}\n.export-option-root .export-option-content .MuiAccordionSummary-content {\n  margin: 0;\n}\n.export-option-root .export-option-content .MuiIconButton-edgeEnd {\n  margin: 0;\n}\n.export-option-root .export-option-content .accordion-title {\n  color: #ffffff;\n}\n.export-option-root .export-option-content .expansion-panel-summary {\n  padding: 0 0.25rem 0 1rem;\n}\n.export-option-root .export-option-content .expansion-panel-summary .expansion-panel-content {\n  gap: 1rem;\n}\n.export-option-root .export-option-content .expansion-panel-details {\n  flex-direction: column;\n  gap: 1rem;\n}\n.export-option-root .export-option-content .expansion-panel-details .grey {\n  color: #a0a0a0;\n}\n.export-option-root .export-option-content .expansion-panel-details label {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  cursor: pointer;\n}", ""]);
+exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.expansion-panel-root,\ndiv.expansion-panel-root.Mui-expanded:last-child {\n  margin: 0.2rem 0;\n}\n\n.export-option-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 0 1.5rem;\n}\n.export-option-root .export-option-content {\n  max-width: 45.75rem;\n  width: 100%;\n}\n.export-option-root .export-option-content .MuiAccordionSummary-content {\n  margin: 0;\n}\n.export-option-root .export-option-content .MuiIconButton-edgeEnd {\n  margin: 0;\n}\n.export-option-root .export-option-content .accordion-title {\n  color: #ffffff;\n}\n.export-option-root .export-option-content .expansion-panel-summary {\n  padding: 0 0.25rem 0 1rem;\n}\n.export-option-root .export-option-content .expansion-panel-summary .expansion-panel-content {\n  gap: 1rem;\n}\n.export-option-root .export-option-content .expansion-panel-details {\n  flex-direction: column;\n  gap: 1rem;\n}\n.export-option-root .export-option-content .expansion-panel-details .grey {\n  color: #a0a0a0;\n}\n.export-option-root .export-option-content .expansion-panel-details label {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  cursor: pointer;\n}", ""]);
 
 
 
@@ -1768,37 +1686,30 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _Link = _interopRequireDefault(__webpack_require__("FFKy"));
 var _gcu = _interopRequireDefault(__webpack_require__("YaId"));
+var _StyledCard = _interopRequireDefault(__webpack_require__("y8/m"));
 var _StyledIcon = _interopRequireDefault(__webpack_require__("VP3k"));
 var _I18n = __webpack_require__("nUfk");
 var _react = _interopRequireDefault(__webpack_require__("ivGQ"));
 var _reactRouterDom = __webpack_require__("Iyno");
-__webpack_require__("C3hE");
+__webpack_require__("5mrP");
 var GCULink = function GCULink() {
   var _useI18n = (0, _I18n.useI18n)(),
     t = _useI18n.t;
+  var navigate = (0, _reactRouterDom.useNavigate)();
+  var goToGCU = function goToGCU() {
+    navigate("/options/gcu");
+  };
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-root"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-content"
-  }, /*#__PURE__*/_react.default.createElement(_Link.default, {
-    className: "gcu-link-card-link",
-    component: _reactRouterDom.Link,
-    to: "/options/gcu"
+    className: "styled-card-root"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "card"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-card"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-card-content"
+    className: "styled-card-content"
+  }, /*#__PURE__*/_react.default.createElement(_StyledCard.default, {
+    onClick: goToGCU
   }, /*#__PURE__*/_react.default.createElement(_StyledIcon.default, {
-    className: "gcu-link-card-content-icon",
     icon: _gcu.default,
-    size: 42
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "gcu-link-card-content-title"
-  }, t('common.title_gcu'))))))));
+    size: 38
+  }), t('common.title_gcu'))));
 };
 var _default = GCULink;
 exports.default = _default;
@@ -1833,12 +1744,13 @@ var _CozyBar = _interopRequireDefault(__webpack_require__("6pCu"));
 var _Header = _interopRequireDefault(__webpack_require__("0soq"));
 var _I18n = __webpack_require__("nUfk");
 var _react = _interopRequireDefault(__webpack_require__("ivGQ"));
-var _Accessibility = _interopRequireDefault(__webpack_require__("S8m7"));
+var _AccessibilityLink = _interopRequireDefault(__webpack_require__("Shzl"));
 var _ExportData = _interopRequireDefault(__webpack_require__("dhGa"));
 var _GCULink = _interopRequireDefault(__webpack_require__("peiT"));
 var _HelpLink = _interopRequireDefault(__webpack_require__("9KuK"));
 var _LegalNoticeLink = _interopRequireDefault(__webpack_require__("Z4DH"));
 var _MatomoOptOut = _interopRequireDefault(__webpack_require__("2R85"));
+__webpack_require__("5mrP");
 var _ProfileTypeOptions = _interopRequireDefault(__webpack_require__("FN7j"));
 var _ReportOptions = _interopRequireDefault(__webpack_require__("QgM0"));
 var _Version = _interopRequireDefault(__webpack_require__("v6Nj"));
@@ -1852,7 +1764,11 @@ var OptionsView = function OptionsView() {
     titleKey: "common.title_options"
   }), /*#__PURE__*/_react.default.createElement(_Header.default, {
     desktopTitleKey: "common.title_options"
-  }), /*#__PURE__*/_react.default.createElement(_Content.default, null, /*#__PURE__*/_react.default.createElement(_ProfileTypeOptions.default, null), /*#__PURE__*/_react.default.createElement(_ExportData.default, null), /*#__PURE__*/_react.default.createElement(_ReportOptions.default, null), /*#__PURE__*/_react.default.createElement(_HelpLink.default, null), /*#__PURE__*/_react.default.createElement(_LegalNoticeLink.default, null), /*#__PURE__*/_react.default.createElement(_GCULink.default, null), /*#__PURE__*/_react.default.createElement(_Accessibility.default, null), /*#__PURE__*/_react.default.createElement(_MatomoOptOut.default, null), /*#__PURE__*/_react.default.createElement("div", {
+  }), /*#__PURE__*/_react.default.createElement(_Content.default, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "options-root"
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_ProfileTypeOptions.default, null), /*#__PURE__*/_react.default.createElement(_ExportData.default, null)), /*#__PURE__*/_react.default.createElement(_ReportOptions.default, null), /*#__PURE__*/_react.default.createElement(_HelpLink.default, null), /*#__PURE__*/_react.default.createElement("div", {
+    className: "info-links"
+  }, /*#__PURE__*/_react.default.createElement(_LegalNoticeLink.default, null), /*#__PURE__*/_react.default.createElement(_GCULink.default, null), /*#__PURE__*/_react.default.createElement(_AccessibilityLink.default, null)), /*#__PURE__*/_react.default.createElement(_MatomoOptOut.default, null)), /*#__PURE__*/_react.default.createElement("div", {
     className: "parameters-logos"
   }, /*#__PURE__*/_react.default.createElement("img", {
     src: _logos_partenaires.default,
@@ -1915,32 +1831,6 @@ exports.default = _default;
 
 /***/ }),
 
-/***/ "wGz8":
-/***/ (function(module, exports, __webpack_require__) {
-
-
-var content = __webpack_require__("Jlsz");
-
-if(typeof content === 'string') content = [[module.i, content, '']];
-
-var transform;
-var insertInto;
-
-
-
-var options = {"hmr":true}
-
-options.transform = transform
-options.insertInto = undefined;
-
-var update = __webpack_require__("HkU0")(content, options);
-
-if(content.locals) module.exports = content.locals;
-
-if(false) {}
-
-/***/ }),
-
 /***/ "wb2P":
 /***/ (function(module, exports, __webpack_require__) {
 
@@ -1950,32 +1840,6 @@ exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE
 
 
 
-/***/ }),
-
-/***/ "x7TP":
-/***/ (function(module, exports, __webpack_require__) {
-
-
-var content = __webpack_require__("aJIj");
-
-if(typeof content === 'string') content = [[module.i, content, '']];
-
-var transform;
-var insertInto;
-
-
-
-var options = {"hmr":true}
-
-options.transform = transform
-options.insertInto = undefined;
-
-var update = __webpack_require__("HkU0")(content, options);
-
-if(content.locals) module.exports = content.locals;
-
-if(false) {}
-
 /***/ }),
 
 /***/ "xmwE":
diff --git a/3/ecolyo.9e542255cb37015c1678.js b/4/ecolyo.695280492ae6033997a0.js
similarity index 99%
rename from 3/ecolyo.9e542255cb37015c1678.js
rename to 4/ecolyo.695280492ae6033997a0.js
index a1800068506d63ae203efd92b692c38c6411f1ee..beee982a679e5cc0f3221e948fe711b14e7c199c 100644
--- a/3/ecolyo.9e542255cb37015c1678.js
+++ b/4/ecolyo.695280492ae6033997a0.js
@@ -1,4 +1,4 @@
-(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[3],{
+(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[4],{
 
 /***/ "//i3":
 /***/ (function(module, exports, __webpack_require__) {
@@ -550,7 +550,7 @@ exports.default = _default;
 
 exports = module.exports = __webpack_require__("DjJv")(false);
 // Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.analysis-graph {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n.analysis-graph .consumption-title {\n  display: flex;\n  justify-content: space-between;\n}\n.analysis-graph .consumption-title .user-title,\n.analysis-graph .consumption-title .average-title {\n  flex-basis: 45%;\n  line-height: 3rem;\n}\n.analysis-graph .consumption-title .user-title {\n  line-height: 3rem;\n  text-align: right;\n  color: #e3b82a;\n}\n.analysis-graph .consumption-title .average-title {\n  color: #bfcce4;\n}\n.analysis-graph .consumption-sep {\n  border: 1px solid #7b7b7b;\n  margin: 1rem 0;\n}\n.analysis-graph div.expansion-panel-root {\n  border: solid 2px #bfcce4;\n  color: #bfcce4;\n  margin-block: 0 !important;\n  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.5490196078);\n}\n.analysis-graph .accordion-title {\n  font-weight: bold;\n}\n.analysis-graph .accordion-desc {\n  color: #e0e0e0;\n}\n.analysis-graph div.expansion-panel-summary {\n  padding: 0 1rem;\n}\n.analysis-graph .loader-container {\n  min-height: 350px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin: auto;\n}\n.analysis-graph .accordion-icon {\n  color: #bfcce4;\n}\n\n.no-profile {\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  gap: 1rem;\n}\n.no-profile div {\n  text-align: center;\n  color: #ffffff;\n}\n.no-profile button {\n  max-width: 320px;\n}", ""]);
+exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.analysis-graph {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n.analysis-graph .consumption-title {\n  display: flex;\n  justify-content: space-between;\n}\n.analysis-graph .consumption-title .user-title,\n.analysis-graph .consumption-title .average-title {\n  flex-basis: 45%;\n  line-height: 3rem;\n}\n.analysis-graph .consumption-title .user-title {\n  line-height: 3rem;\n  text-align: right;\n  color: #e3b82a;\n}\n.analysis-graph .consumption-title .average-title {\n  color: #bfcce4;\n}\n.analysis-graph .consumption-sep {\n  border: 1px solid #7b7b7b;\n  margin: 1rem 0;\n}\n.analysis-graph div.expansion-panel-root {\n  border: solid 1px #bfcce4;\n  color: #bfcce4;\n  margin-block: 0 !important;\n  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.5490196078);\n}\n.analysis-graph .accordion-title {\n  font-weight: bold;\n}\n.analysis-graph .accordion-desc {\n  color: #e0e0e0;\n}\n.analysis-graph div.expansion-panel-summary {\n  padding: 0 1rem;\n}\n.analysis-graph .loader-container {\n  min-height: 350px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin: auto;\n}\n.analysis-graph .accordion-icon {\n  color: #bfcce4;\n}\n\n.no-profile {\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  gap: 1rem;\n}\n.no-profile div {\n  text-align: center;\n  color: #ffffff;\n}\n.no-profile button {\n  max-width: 320px;\n}", ""]);
 
 
 
diff --git a/4/ecolyo.33628861e9b4596e92a2.js b/5/ecolyo.097c09aeec4cd782ebaf.js
similarity index 99%
rename from 4/ecolyo.33628861e9b4596e92a2.js
rename to 5/ecolyo.097c09aeec4cd782ebaf.js
index 70591c9f829ee2b605d12d42e0f1759d73d34964..a22c8237b4529d9e3dd6a24c651d17b306c8aa0d 100644
--- a/4/ecolyo.33628861e9b4596e92a2.js
+++ b/5/ecolyo.097c09aeec4cd782ebaf.js
@@ -1,4 +1,4 @@
-(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[4],{
+(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[5],{
 
 /***/ "/jgc":
 /***/ (function(module, exports, __webpack_require__) {
@@ -296,6 +296,10 @@ var SwitchBase = (0, _styles.withStyles)({
         opacity: 1,
         backgroundColor: 'var(--multiColor)'
       }
+    },
+    '&.Mui-focusVisible': {
+      outline: '2px solid #1976d2',
+      outlineOffset: '2px'
     }
   },
   checked: {},
@@ -3168,7 +3172,7 @@ if(false) {}
 
 exports = module.exports = __webpack_require__("DjJv")(false);
 // Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.timestep-selector {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-evenly;\n  align-items: flex-end;\n  margin: auto;\n  margin-top: 1rem;\n  max-width: 45.75rem;\n}\n.timestep-selector .btnSecondary {\n  max-width: 90px;\n  border-radius: 4px;\n  margin-top: 0;\n}\n.timestep-selector .timestep-container {\n  width: 100%;\n}\n.timestep-selector .timestep-bar {\n  margin: 0 1rem 0 1.7rem;\n  padding: 0;\n  display: flex;\n  justify-content: space-evenly;\n  align-items: center;\n  height: 3rem;\n}\n.timestep-selector .timestep-bar.elec-bar {\n  margin-left: 1rem;\n}\n.timestep-selector .timestep-bar .circle {\n  cursor: pointer;\n  position: relative;\n  display: block;\n  width: 8px;\n  height: 8px;\n  border-radius: 100%;\n  text-align: center;\n  background-color: #a0a0a0;\n  z-index: 1;\n  transition: all 300ms ease;\n  margin: 0 2px;\n}\n.timestep-selector .timestep-bar .circle .clickable-area {\n  position: absolute;\n  width: 35px;\n  height: 35px;\n  display: block;\n  left: -14px;\n  top: -15px;\n}\n.timestep-selector .timestep-bar .text {\n  position: relative;\n  display: block;\n  top: 15px;\n  left: -20px;\n  text-align: center;\n  color: #7b7b7b;\n  width: 50px;\n  overflow: visible;\n}\n@media only screen and (max-width: 355px) {\n  .timestep-selector .timestep-bar .text {\n    opacity: 0;\n  }\n}\n.timestep-selector .timestep-bar .bar {\n  width: 100%;\n  position: relative;\n  display: block;\n  background-color: transparent;\n  border-top: 1px dashed #a0a0a0;\n  height: 0;\n  z-index: 0;\n  padding: 0 2px;\n}\n.timestep-selector .timestep-bar .bar:last-of-type {\n  display: none;\n}\n.timestep-selector .timestep-bar .circle.active {\n  background-color: white;\n  width: 10px;\n  height: 10px;\n}\n.timestep-selector .timestep-bar .circle.active .text {\n  opacity: 1;\n  top: 16px;\n  color: white;\n  transition: 300ms ease;\n}", ""]);
+exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.timestep-selector {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-evenly;\n  align-items: flex-end;\n  margin: auto;\n  margin-top: 1rem;\n  max-width: 45.75rem;\n}\n.timestep-selector .btnSecondary {\n  max-width: 90px;\n  border-radius: 4px;\n  margin-top: 0;\n}\n.timestep-selector .timestep-container {\n  width: 100%;\n}\n.timestep-selector .timestep-bar {\n  margin: 0 1rem 0 1.7rem;\n  padding: 0;\n  display: flex;\n  justify-content: space-evenly;\n  align-items: center;\n  height: 3rem;\n}\n.timestep-selector .timestep-bar.elec-bar {\n  margin-left: 1rem;\n}\n.timestep-selector .timestep-bar .circle {\n  cursor: pointer;\n  position: relative;\n  display: block;\n  width: 8px;\n  height: 8px;\n  border-radius: 100%;\n  text-align: center;\n  background-color: #a0a0a0;\n  z-index: 1;\n  transition: all 300ms ease;\n  margin: 0 2px;\n}\n.timestep-selector .timestep-bar .circle .clickable-area {\n  position: absolute;\n  width: 35px;\n  height: 35px;\n  display: block;\n  left: -14px;\n  top: -15px;\n}\n.timestep-selector .timestep-bar .circle:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n.timestep-selector .timestep-bar .text {\n  position: relative;\n  display: block;\n  top: 15px;\n  left: -20px;\n  text-align: center;\n  color: #7b7b7b;\n  width: 50px;\n  overflow: visible;\n}\n@media only screen and (max-width: 355px) {\n  .timestep-selector .timestep-bar .text {\n    opacity: 0;\n  }\n}\n.timestep-selector .timestep-bar .bar {\n  width: 100%;\n  position: relative;\n  display: block;\n  background-color: transparent;\n  border-top: 1px dashed #a0a0a0;\n  height: 0;\n  z-index: 0;\n  padding: 0 2px;\n}\n.timestep-selector .timestep-bar .bar:last-of-type {\n  display: none;\n}\n.timestep-selector .timestep-bar .circle.active {\n  background-color: white;\n  width: 10px;\n  height: 10px;\n}\n.timestep-selector .timestep-bar .circle.active .text {\n  opacity: 1;\n  top: 16px;\n  color: white;\n  transition: 300ms ease;\n}", ""]);
 
 
 
@@ -5452,7 +5456,7 @@ exports.default = _default;
 
 exports = module.exports = __webpack_require__("DjJv")(false);
 // Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ninput.inputText,\ninput.inputNumber {\n  box-sizing: border-box;\n  border: 1px solid #7b7b7b;\n  background: transparent;\n  transition: all 300ms ease;\n  color: #e0e0e0;\n}\ninput.inputText:focus, input.inputText:focus-visible,\ninput.inputNumber:focus,\ninput.inputNumber:focus-visible {\n  border-color: #e3b82a;\n  outline: none;\n}\n\ninput.inputText {\n  appearance: none;\n  border-radius: 4px;\n  height: 45px;\n  width: 100%;\n  max-width: 280px;\n  padding: 0 0.5rem;\n}\n\ninput.inputNumber {\n  border-radius: 2px;\n  height: 40px;\n  width: 60px;\n  max-width: 5rem;\n  text-align: center;\n}\n\ninput.inputCheckbox {\n  width: 24px;\n  min-width: 24px;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  border-radius: 4px;\n  cursor: pointer;\n  appearance: none;\n  background: #121212;\n  position: relative;\n  border: solid 1px #7b7b7b;\n}\ninput.inputCheckbox:checked {\n  background: #e3b82a;\n  border-color: #e3b82a;\n}\ninput.inputCheckbox:checked:before, input.inputCheckbox:checked:after {\n  content: \"\";\n  position: absolute;\n  display: inline-block;\n  background: #121212;\n  border-radius: 0.5rem;\n}\ninput.inputCheckbox:checked:before {\n  width: 3px;\n  height: 12px;\n  left: 10px;\n  top: 4px;\n  transform: rotate(41deg);\n}\ninput.inputCheckbox:checked:after {\n  width: 3px;\n  height: 6px;\n  left: 5px;\n  top: 8px;\n  transform: rotate(133deg);\n}\n\nform {\n  margin-top: 1rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\nform .iconShowPassword {\n  float: right;\n  position: relative;\n  margin-top: -67px;\n  margin-right: 15px;\n}\nform .errorMessage {\n  color: #d25959;\n  min-height: 1.25rem;\n}", ""]);
+exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ninput.inputText,\ninput.inputNumber {\n  box-sizing: border-box;\n  border: 1px solid #7b7b7b;\n  background: transparent;\n  transition: all 300ms ease;\n  color: #e0e0e0;\n}\n\ninput.inputText {\n  appearance: none;\n  border-radius: 4px;\n  height: 45px;\n  width: 100%;\n  max-width: 280px;\n  padding: 0 0.5rem;\n}\n\ninput.inputNumber {\n  border-radius: 2px;\n  height: 40px;\n  width: 60px;\n  max-width: 5rem;\n  text-align: center;\n}\n\ninput.inputCheckbox {\n  width: 24px;\n  min-width: 24px;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  border-radius: 4px;\n  cursor: pointer;\n  appearance: none;\n  background: #121212;\n  position: relative;\n  border: solid 1px #7b7b7b;\n}\ninput.inputCheckbox:checked {\n  background: #e3b82a;\n  border-color: #e3b82a;\n}\ninput.inputCheckbox:checked:before, input.inputCheckbox:checked:after {\n  content: \"\";\n  position: absolute;\n  display: inline-block;\n  background: #121212;\n  border-radius: 0.5rem;\n}\ninput.inputCheckbox:checked:before {\n  width: 3px;\n  height: 12px;\n  left: 10px;\n  top: 4px;\n  transform: rotate(41deg);\n}\ninput.inputCheckbox:checked:after {\n  width: 3px;\n  height: 6px;\n  left: 5px;\n  top: 8px;\n  transform: rotate(133deg);\n}\n\ninput:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n\nform {\n  margin-top: 1rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\nform .iconShowPassword {\n  float: right;\n  position: relative;\n  margin-top: -67px;\n  margin-right: 15px;\n}\nform .errorMessage {\n  color: #d25959;\n  min-height: 1.25rem;\n}", ""]);
 
 
 
diff --git a/5/ecolyo.c8ff0c6c70d106accae3.js b/6/ecolyo.0b640b6f43df00eadbb5.js
similarity index 99%
rename from 5/ecolyo.c8ff0c6c70d106accae3.js
rename to 6/ecolyo.0b640b6f43df00eadbb5.js
index 05640924ad79da29ffa3420f767eab6af04c7ae0..2f73c21202ba918614d12485b9240606eda765ae 100644
--- a/5/ecolyo.c8ff0c6c70d106accae3.js
+++ b/6/ecolyo.0b640b6f43df00eadbb5.js
@@ -1,4 +1,4 @@
-(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[5],{
+(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[6],{
 
 /***/ "0LZU":
 /***/ (function(module, exports, __webpack_require__) {
@@ -348,7 +348,7 @@ if(false) {}
 
 exports = module.exports = __webpack_require__("DjJv")(false);
 // Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.ecogesture-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 1rem 1.5rem 2.5rem 1.5rem;\n  gap: 1rem;\n}\n.ecogesture-root .efficiency-button-content {\n  max-width: 52rem;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n.ecogesture-root .efficiency-button-content .selection {\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  gap: 1rem;\n  color: white;\n  text-align: center;\n}\n.ecogesture-root .efficiency-button-content .btnFilter {\n  max-width: 13rem;\n  justify-content: flex-start;\n}\n.ecogesture-root .efficiency-button-content .btnFilter span {\n  padding-left: 0.5rem;\n}\n.ecogesture-root .efficiency-button-content .btnFilter span.opened {\n  color: #e3b82a;\n}\n.ecogesture-root .ecogesture-content {\n  display: flex;\n  flex-wrap: wrap;\n  max-width: 53rem;\n  animation: appear 600ms ease;\n  width: 100%;\n  gap: 1rem;\n}\n@keyframes appear {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.ecogesture-root .ecogesture-content .ecogesture-content-loading {\n  height: 80vh;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  color: #e0e0e0;\n}\n.ecogesture-root .ecogesture-content .ecogesture-list-item {\n  box-sizing: border-box;\n  height: 8rem;\n  animation: appear 600ms ease;\n  display: flex;\n  flex: 1;\n  flex-basis: 45%;\n  max-width: 48%;\n}\n.ecogesture-root .ecogesture-content .ecogesture-list-item > button {\n  height: 100%;\n  overflow: hidden;\n  animation: appear 600ms ease;\n}\n.ecogesture-root .ec-filter-error {\n  color: #e0e0e0;\n  text-align: center;\n  margin-top: 2rem;\n}\n.ecogesture-root .ec-filter-error div:first-child {\n  margin-bottom: 1rem;\n}\n\ndiv.filter-menu {\n  margin-top: 3.5rem;\n  margin-left: -0.5rem;\n  color: white;\n  background: linear-gradient(0deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.09)), linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border: 1px solid #a0a0a0;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  z-index: 3;\n  width: 220px;\n  padding: 0.5rem 0rem;\n  font-size: 0.875rem;\n  left: 0;\n  transition: all 300ms ease;\n}\ndiv.filter-menu.opened {\n  display: block;\n}\ndiv.filter-menu .filter {\n  padding: 0 1rem;\n}\ndiv.filter-menu .filter.filter-active {\n  background: rgba(160, 160, 160, 0.2);\n}\n\n.filter-menu-list li {\n  color: #ffffff;\n  text-transform: initial;\n  font-family: Lato, sans-serif;\n}\n.filter-menu-list li.item-active {\n  font-weight: 700;\n}\n\n.filter-menu-icon {\n  margin-left: auto;\n  min-width: 0;\n}", ""]);
+exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.ecogesture-root {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 1rem 1.5rem 2.5rem 1.5rem;\n  gap: 1rem;\n}\n.ecogesture-root .efficiency-button-content {\n  max-width: 52rem;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n.ecogesture-root .efficiency-button-content .selection {\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  gap: 1rem;\n  color: white;\n  text-align: center;\n}\n.ecogesture-root .efficiency-button-content .btnFilter {\n  max-width: 13rem;\n  justify-content: flex-start;\n}\n.ecogesture-root .efficiency-button-content .btnFilter span {\n  padding-left: 0.5rem;\n}\n.ecogesture-root .efficiency-button-content .btnFilter span.opened {\n  color: #e3b82a;\n}\n.ecogesture-root .ecogesture-content {\n  display: flex;\n  flex-wrap: wrap;\n  max-width: 53rem;\n  animation: appear 600ms ease;\n  width: 100%;\n  gap: 1rem;\n}\n@keyframes appear {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.ecogesture-root .ecogesture-content .ecogesture-content-loading {\n  height: 80vh;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  color: #e0e0e0;\n}\n.ecogesture-root .ecogesture-content .ecogesture-list-item {\n  box-sizing: border-box;\n  height: 8rem;\n  animation: appear 600ms ease;\n  display: flex;\n  flex: 1;\n  flex-basis: 45%;\n  max-width: 48%;\n}\n.ecogesture-root .ecogesture-content .ecogesture-list-item > button {\n  height: 100%;\n  overflow: hidden;\n  animation: appear 600ms ease;\n}\n.ecogesture-root .ec-filter-error {\n  color: #e0e0e0;\n  text-align: center;\n  margin-top: 2rem;\n}\n.ecogesture-root .ec-filter-error div:first-child {\n  margin-bottom: 1rem;\n}\n\ndiv.filter-menu {\n  margin-top: 3.5rem;\n  margin-left: -0.5rem;\n  color: white;\n  background: linear-gradient(0deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.09)), linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border: 1px solid #a0a0a0;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  z-index: 3;\n  width: 220px;\n  padding: 0.5rem 0rem;\n  font-size: 0.875rem;\n  left: 0;\n  transition: all 300ms ease;\n}\ndiv.filter-menu.opened {\n  display: block;\n}\ndiv.filter-menu .filter {\n  padding: 0 1rem;\n}\ndiv.filter-menu .filter.filter-active {\n  background: rgba(160, 160, 160, 0.2);\n}\n\n.filter-menu-list li {\n  color: #ffffff;\n  text-transform: initial;\n  font-family: Lato, sans-serif;\n}\n.filter-menu-list li.item-active {\n  font-weight: 700;\n}\n.filter-menu-list li:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n\n.filter-menu-icon {\n  margin-left: auto;\n  min-width: 0;\n}", ""]);
 
 
 
diff --git a/app/ecolyo.bbe9bb411c0edd51edfe.js b/app/ecolyo.d9f1446d60a3f0f2d055.js
similarity index 99%
rename from app/ecolyo.bbe9bb411c0edd51edfe.js
rename to app/ecolyo.d9f1446d60a3f0f2d055.js
index ea1c015b79a36cb1349329fe068a0aadff957433..e3c81b542fe76c7df3c3b38c34e7768cfb4073be 100644
--- a/app/ecolyo.bbe9bb411c0edd51edfe.js
+++ b/app/ecolyo.d9f1446d60a3f0f2d055.js
@@ -64,7 +64,7 @@
 /******/
 /******/ 	// script path function
 /******/ 	function jsonpScriptSrc(chunkId) {
-/******/ 		return __webpack_require__.p + "" + ({}[chunkId]||chunkId) + "/ecolyo." + {"3":"9e542255cb37015c1678","4":"33628861e9b4596e92a2","5":"c8ff0c6c70d106accae3","6":"94b4ac94168bc001f899","7":"1e90cb873be450d05a56","8":"42acbbc92a4cf3e13c3e","9":"f45e19d3c34ba67e355b","10":"fe3625578fa387c11975","11":"346fcb0fa7b2e3565ad3"}[chunkId] + ".js"
+/******/ 		return __webpack_require__.p + "" + ({}[chunkId]||chunkId) + "/ecolyo." + {"3":"6a2555d0fd2f917f5ede","4":"695280492ae6033997a0","5":"097c09aeec4cd782ebaf","6":"0b640b6f43df00eadbb5","7":"1e90cb873be450d05a56","8":"42acbbc92a4cf3e13c3e","9":"f45e19d3c34ba67e355b","10":"fe3625578fa387c11975","11":"346fcb0fa7b2e3565ad3"}[chunkId] + ".js"
 /******/ 	}
 /******/
 /******/ 	// The require function
@@ -2391,7 +2391,9 @@ var ChallengeCardOnGoing = function ChallengeCardOnGoing(_ref) {
     } else if (duel.state === _enums.UserDuelState.ONGOING && isDone) {
       return duelCard( /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
         className: "finalDuel result"
-      }, /*#__PURE__*/_react.default.createElement("span", null, t('challenge.card.ongoing.result')), /*#__PURE__*/_react.default.createElement("span", null, t('challenge.card.ongoing.duelDone'))), /*#__PURE__*/_react.default.createElement("div", {
+      }, /*#__PURE__*/_react.default.createElement("span", null, t('challenge.card.ongoing.result')), /*#__PURE__*/_react.default.createElement("span", {
+        className: "lowercase"
+      }, t('challenge.card.ongoing.duelDone'))), /*#__PURE__*/_react.default.createElement("div", {
         className: "notifChallenge"
       }, "1")), 'active');
     } else {
@@ -4267,7 +4269,7 @@ exports.i(__webpack_require__("/O3k"), "");
 exports.push([module.i, "@import url(https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap);", ""]);
 
 // Module
-exports.push([module.i, "/* Cozy UI utilities classes */\n/* Cozy UI React components styles */\n/* App styles */\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\nhtml {\n  background: #121212;\n}\n\nbody {\n  background: #121212;\n  overflow: unset !important;\n  color: #e0e0e0;\n}\n\n.column {\n  display: flex;\n  flex-direction: column;\n}\n\n.row {\n  display: flex;\n  flex-direction: row;\n}\n\n.cozy-bar {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 0;\n}\n\n[role=banner] .coz-bar-container {\n  background-color: #ffffff;\n}\n@media only screen and (max-width : 768px) {\n  [role=banner] .coz-bar-container {\n    padding: 0.6rem 0 0 0;\n    background-color: unset;\n  }\n}\n\n.coz-bar-wrapper {\n  box-shadow: unset !important;\n  background: unset !important;\n}\n\n.coz-label {\n  color: #32363f;\n}\n\n.content-view-loading {\n  height: 80vh;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  color: #e0e0e0;\n}\n.content-view-loading .content-view-loading-text {\n  padding-top: 1rem;\n  margin: 0 2rem;\n  text-align: center;\n}\n.content-view-loading .content-view-loading-button {\n  max-width: 50vw;\n  margin-top: 1rem;\n}\n\n[role=main] {\n  /* width */\n  /* Track */\n  /* Handle */\n}\n[role=main]::-webkit-scrollbar {\n  width: 10px;\n}\n[role=main]::-webkit-scrollbar-track {\n  background: #3e4045;\n}\n[role=main]::-webkit-scrollbar-thumb {\n  background: #6f7074;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n* {\n  font-family: Lato, sans-serif;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np {\n  color: #a0a0a0;\n  font-family: Lato, sans-serif;\n}\n\n.home-title {\n  font-size: 1rem;\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  line-height: 120%;\n  text-transform: uppercase;\n}\n\n.app-title {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 21px;\n  line-height: 24px;\n  text-align: center;\n  letter-spacing: 0.15px;\n  color: #e0e0e0;\n  text-shadow: 0px -1px 0px #060609, 0px 1px 0px rgba(255, 255, 255, 0.07);\n}\n\n.text-10, .text-10-italic, .text-10-bold, .text-10-bold-capitalize, .text-10-bold-uppercase, .text-10-normal, .text-10-normal-150, .text-10-normal-uppercase {\n  font-style: normal;\n  font-size: 0.625rem;\n  line-height: 120%;\n}\n.text-10-normal, .text-10-normal-150, .text-10-normal-uppercase {\n  font-weight: normal;\n}\n.text-10-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-10-normal-150 {\n  line-height: 150%;\n}\n.text-10-bold, .text-10-bold-capitalize, .text-10-bold-uppercase {\n  font-weight: 700;\n}\n.text-10-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-10-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-10-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-12, .text-12-italic, .text-12-bold, .text-12-bold-capitalize, .text-12-bold-uppercase, .text-12-normal, .text-12-normal-150, .text-12-normal-uppercase {\n  font-style: normal;\n  font-size: 0.75rem;\n  line-height: 120%;\n}\n.text-12-normal, .text-12-normal-150, .text-12-normal-uppercase {\n  font-weight: normal;\n}\n.text-12-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-12-normal-150 {\n  line-height: 150%;\n}\n.text-12-bold, .text-12-bold-capitalize, .text-12-bold-uppercase {\n  font-weight: 700;\n}\n.text-12-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-12-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-12-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-13, .text-13-italic, .text-13-bold, .text-13-bold-capitalize, .text-13-bold-uppercase, .text-13-normal, .text-13-normal-150, .text-13-normal-uppercase {\n  font-style: normal;\n  font-size: 0.8125rem;\n  line-height: 120%;\n}\n.text-13-normal, .text-13-normal-150, .text-13-normal-uppercase {\n  font-weight: normal;\n}\n.text-13-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-13-normal-150 {\n  line-height: 150%;\n}\n.text-13-bold, .text-13-bold-capitalize, .text-13-bold-uppercase {\n  font-weight: 700;\n}\n.text-13-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-13-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-13-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-14, .text-14-italic, .text-14-bold, .text-14-bold-capitalize, .text-14-bold-uppercase, .text-14-normal, .text-14-normal-150, .text-14-normal-uppercase {\n  font-style: normal;\n  font-size: 0.875rem;\n  line-height: 120%;\n}\n.text-14-normal, .text-14-normal-150, .text-14-normal-uppercase {\n  font-weight: normal;\n}\n.text-14-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-14-normal-150 {\n  line-height: 150%;\n}\n.text-14-bold, .text-14-bold-capitalize, .text-14-bold-uppercase {\n  font-weight: 700;\n}\n.text-14-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-14-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-14-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-15, .text-15-italic, .text-15-bold, .text-15-bold-capitalize, .text-15-bold-uppercase, .text-15-normal, .text-15-normal-150, .text-15-normal-uppercase {\n  font-style: normal;\n  font-size: 0.938rem;\n  line-height: 120%;\n}\n.text-15-normal, .text-15-normal-150, .text-15-normal-uppercase {\n  font-weight: normal;\n}\n.text-15-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-15-normal-150 {\n  line-height: 150%;\n}\n.text-15-bold, .text-15-bold-capitalize, .text-15-bold-uppercase {\n  font-weight: 700;\n}\n.text-15-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-15-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-15-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-16, .text-16-italic, .text-16-bold, .text-16-bold-capitalize, .text-16-bold-uppercase, .text-16-normal, .text-16-normal-150, .text-16-normal-uppercase {\n  font-style: normal;\n  font-size: 1rem;\n  line-height: 120%;\n}\n.text-16-normal, .text-16-normal-150, .text-16-normal-uppercase {\n  font-weight: normal;\n}\n.text-16-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-16-normal-150 {\n  line-height: 150%;\n}\n.text-16-bold, .text-16-bold-capitalize, .text-16-bold-uppercase {\n  font-weight: 700;\n}\n.text-16-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-16-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-16-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-18, .text-18-italic, .text-18-bold, .text-18-bold-capitalize, .text-18-bold-uppercase, .text-18-normal, .text-18-normal-150, .text-18-normal-uppercase {\n  font-style: normal;\n  font-size: 1.125rem;\n  line-height: 120%;\n}\n.text-18-normal, .text-18-normal-150, .text-18-normal-uppercase {\n  font-weight: normal;\n}\n.text-18-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-18-normal-150 {\n  line-height: 150%;\n}\n.text-18-bold, .text-18-bold-capitalize, .text-18-bold-uppercase {\n  font-weight: 700;\n}\n.text-18-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-18-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-18-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-19, .text-19-italic, .text-19-bold, .text-19-bold-capitalize, .text-19-bold-uppercase, .text-19-normal, .text-19-normal-150, .text-19-normal-uppercase {\n  font-style: normal;\n  font-size: 1.188rem;\n  line-height: 120%;\n}\n.text-19-normal, .text-19-normal-150, .text-19-normal-uppercase {\n  font-weight: normal;\n}\n.text-19-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-19-normal-150 {\n  line-height: 150%;\n}\n.text-19-bold, .text-19-bold-capitalize, .text-19-bold-uppercase {\n  font-weight: 700;\n}\n.text-19-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-19-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-19-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-20, .text-20-italic, .text-20-bold, .text-20-bold-capitalize, .text-20-bold-uppercase, .text-20-normal, .text-20-normal-150, .text-20-normal-uppercase {\n  font-style: normal;\n  font-size: 1.25rem;\n  line-height: 120%;\n}\n.text-20-normal, .text-20-normal-150, .text-20-normal-uppercase {\n  font-weight: normal;\n}\n.text-20-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-20-normal-150 {\n  line-height: 150%;\n}\n.text-20-bold, .text-20-bold-capitalize, .text-20-bold-uppercase {\n  font-weight: 700;\n}\n.text-20-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-20-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-20-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-21, .text-21-italic, .text-21-bold, .text-21-bold-capitalize, .text-21-bold-uppercase, .text-21-normal, .text-21-normal-150, .text-21-normal-uppercase {\n  font-style: normal;\n  font-size: 1.313rem;\n  line-height: 120%;\n}\n.text-21-normal, .text-21-normal-150, .text-21-normal-uppercase {\n  font-weight: normal;\n}\n.text-21-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-21-normal-150 {\n  line-height: 150%;\n}\n.text-21-bold, .text-21-bold-capitalize, .text-21-bold-uppercase {\n  font-weight: 700;\n}\n.text-21-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-21-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-21-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-22, .text-22-italic, .text-22-bold, .text-22-bold-capitalize, .text-22-bold-uppercase, .text-22-normal, .text-22-normal-150, .text-22-normal-uppercase {\n  font-style: normal;\n  font-size: 1.375rem;\n  line-height: 120%;\n}\n.text-22-normal, .text-22-normal-150, .text-22-normal-uppercase {\n  font-weight: normal;\n}\n.text-22-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-22-normal-150 {\n  line-height: 150%;\n}\n.text-22-bold, .text-22-bold-capitalize, .text-22-bold-uppercase {\n  font-weight: 700;\n}\n.text-22-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-22-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-22-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-24, .text-24-italic, .text-24-bold, .text-24-bold-capitalize, .text-24-bold-uppercase, .text-24-normal, .text-24-normal-150, .text-24-normal-uppercase {\n  font-style: normal;\n  font-size: 1.5rem;\n  line-height: 120%;\n}\n.text-24-normal, .text-24-normal-150, .text-24-normal-uppercase {\n  font-weight: normal;\n}\n.text-24-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-24-normal-150 {\n  line-height: 150%;\n}\n.text-24-bold, .text-24-bold-capitalize, .text-24-bold-uppercase {\n  font-weight: 700;\n}\n.text-24-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-24-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-24-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-26, .text-26-italic, .text-26-bold, .text-26-bold-capitalize, .text-26-bold-uppercase, .text-26-normal, .text-26-normal-150, .text-26-normal-uppercase {\n  font-style: normal;\n  font-size: 1.625rem;\n  line-height: 120%;\n}\n.text-26-normal, .text-26-normal-150, .text-26-normal-uppercase {\n  font-weight: normal;\n}\n.text-26-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-26-normal-150 {\n  line-height: 150%;\n}\n.text-26-bold, .text-26-bold-capitalize, .text-26-bold-uppercase {\n  font-weight: 700;\n}\n.text-26-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-26-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-26-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-28, .text-28-italic, .text-28-bold, .text-28-bold-capitalize, .text-28-bold-uppercase, .text-28-normal, .text-28-normal-150, .text-28-normal-uppercase {\n  font-style: normal;\n  font-size: 1.75rem;\n  line-height: 120%;\n}\n.text-28-normal, .text-28-normal-150, .text-28-normal-uppercase {\n  font-weight: normal;\n}\n.text-28-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-28-normal-150 {\n  line-height: 150%;\n}\n.text-28-bold, .text-28-bold-capitalize, .text-28-bold-uppercase {\n  font-weight: 700;\n}\n.text-28-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-28-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-28-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-36, .text-36-italic, .text-36-bold, .text-36-bold-capitalize, .text-36-bold-uppercase, .text-36-normal, .text-36-normal-150, .text-36-normal-uppercase {\n  font-style: normal;\n  font-size: 2.25rem;\n  line-height: 120%;\n}\n.text-36-normal, .text-36-normal-150, .text-36-normal-uppercase {\n  font-weight: normal;\n}\n.text-36-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-36-normal-150 {\n  line-height: 150%;\n}\n.text-36-bold, .text-36-bold-capitalize, .text-36-bold-uppercase {\n  font-weight: 700;\n}\n.text-36-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-36-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-36-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n/* Card */\n.card-title-on {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1.125rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-text-bold {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-indicator {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n/* Chart */\n.chart-ticks-x-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n}\n@media only screen and (max-width : 768px) {\n  .chart-ticks-x-text {\n    font-size: 0.685rem;\n  }\n}\n\n.chart-ticks-y-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 0.9rem;\n  line-height: 120%;\n}\n@media only screen and (max-width : 768px) {\n  .chart-ticks-y-text {\n    font-size: 0.75rem;\n  }\n}\n\n/* Cozy bar */\n.cozybar {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 1.3125rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.axis {\n  color: #7b7b7b;\n}\n.axis .tick-text {\n  fill: #7b7b7b;\n}\n.axis .tick-text.tick-text-selected {\n  fill: #e0e0e0;\n}\n.axis .separator {\n  text-align: center;\n  margin: 0 2px;\n  font-size: 1rem !important;\n}\n\n.value-text {\n  fill: #7b7b7b;\n}\n.value-text.selected {\n  fill: #e0e0e0;\n}\n\n.barContainer.disabled *,\n.barFill.disabled * {\n  cursor: default !important;\n}\n.barContainer:hover,\n.barFill:hover {\n  cursor: pointer;\n}\n\n.background-true {\n  opacity: 0.1;\n}\n.background-true:hover {\n  cursor: pointer;\n}\n\n.background-false {\n  opacity: 0;\n}\n\n.bar-compare-ELECTRICITY:hover,\n.bar-compare-GAS:hover,\n.bar-compare-WATER:hover,\n.bar-compare-MULTIFLUID:hover,\n.bar-MULTIFLUID:hover,\n.bar-WATER:hover,\n.bar-GAS:hover,\n.bar-ELECTRICITY:hover {\n  cursor: pointer;\n}\n.bar-compare-ELECTRICITY:hover.disabled,\n.bar-compare-GAS:hover.disabled,\n.bar-compare-WATER:hover.disabled,\n.bar-compare-MULTIFLUID:hover.disabled,\n.bar-MULTIFLUID:hover.disabled,\n.bar-WATER:hover.disabled,\n.bar-GAS:hover.disabled,\n.bar-ELECTRICITY:hover.disabled {\n  cursor: default;\n}\n\n.bar-ELECTRICITY {\n  fill: #5d3d2a;\n}\n.bar-ELECTRICITY.selected {\n  fill: #d87b39;\n  filter: drop-shadow(0 -0.1rem 0.2rem #d87b39);\n}\n\n.bar-compare-ELECTRICITY {\n  fill: #795c47;\n}\n.bar-compare-ELECTRICITY.selected {\n  fill: #e2bca1;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1);\n}\n\n.bar-WATER {\n  fill: #20415e;\n}\n.bar-WATER.selected {\n  fill: #3a98ec;\n  filter: drop-shadow(0 -0.1rem 0.2rem #3a98ec);\n}\n\n.bar-compare-WATER {\n  fill: #4d5c6e;\n}\n.bar-compare-WATER.selected {\n  fill: #abd4fa;\n  filter: drop-shadow(0 -0.1rem 0.2rem #abd4fa);\n}\n\n.bar-GAS {\n  fill: #184940;\n}\n.bar-GAS.selected {\n  fill: #45d1b8;\n  filter: drop-shadow(0 -0.1rem 0.2rem #45d1b8);\n}\n\n.bar-compare-GAS {\n  fill: #597773;\n}\n.bar-compare-GAS.selected {\n  fill: #a8f7e9;\n  filter: drop-shadow(0 -0.1rem 0.2rem #a8f7e9);\n}\n\n.bar-MULTIFLUID {\n  fill: #705d1d;\n}\n.bar-MULTIFLUID.selected {\n  fill: #e3b82a;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n.bar-MULTIFLUID.disabled:hover {\n  cursor: default;\n}\n\n.bar-duel {\n  fill: #61f0f2;\n}\n.bar-duel.selected {\n  fill: #61f0f2;\n  filter: drop-shadow(0 -0.1rem 0.2rem #61f0f2);\n}\n.bar-duel.disabled:hover {\n  cursor: default;\n}\n\n.bar-UPCOMING {\n  fill: #7b7b7b;\n  opacity: 0.6;\n}\n.bar-UPCOMING.selected {\n  fill: #7b7b7b;\n}\n.bar-UPCOMING.disabled:hover {\n  cursor: default;\n}\n\n.bar-compare-MULTIFLUID {\n  fill: #7d6a4e;\n}\n.bar-compare-MULTIFLUID.selected {\n  fill: #ffd597;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n\n.bar-average {\n  stroke-width: 2;\n  stroke: #e3b82a;\n}\n\n.week {\n  fill: #e2bca1;\n}\n.week.selected {\n  fill: #e2bca1;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1);\n}\n\n.weekend {\n  fill: #ffd597;\n}\n.weekend.selected {\n  fill: #ffd597;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n\n.barValue {\n  outline: none;\n}\n.barValue:focus-visible {\n  outline: 1px solid;\n}\n\n/** Animation **/\n.bounce-1 {\n  animation-name: bounce-1;\n  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);\n  animation-iteration-count: 1;\n  transform-origin: bottom center;\n  transform-box: fill-box;\n}\n\n@keyframes bounce-1 {\n  0% {\n    transform: scale(0.1, 0.1);\n  }\n  28% {\n    transform: scale(0.1, 1.1);\n  }\n  45% {\n    transform: scale(0.8, 0.95);\n  }\n  55% {\n    transform: scale(1, 1);\n  }\n  65% {\n    transform: scale(1, 0.98);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n}\n.bounce-2 {\n  animation-name: bounce-2;\n  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);\n  animation-iteration-count: 1;\n  transform-origin: bottom center;\n  transform-box: fill-box;\n}\n\n@keyframes bounce-2 {\n  0% {\n    transform: scale(1, 1);\n  }\n  28% {\n    transform: scale(1, 1.1);\n  }\n  45% {\n    transform: scale(0.8, 0.95);\n  }\n  55% {\n    transform: scale(1, 1);\n  }\n  65% {\n    transform: scale(1, 0.98);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n}\n/** Animation delay **/\n.delay {\n  animation-duration: 0.4s;\n}\n\n.delay--0 {\n  animation-duration: 0.4s;\n}\n\n.delay--1 {\n  animation-duration: 0.48s;\n}\n\n.delay--2 {\n  animation-duration: 0.56s;\n}\n\n.delay--3 {\n  animation-duration: 0.64s;\n}\n\n.delay--4 {\n  animation-duration: 0.72s;\n}\n\n.delay--5 {\n  animation-duration: 0.8s;\n}\n\n.delay--6 {\n  animation-duration: 0.88s;\n}\n\n.delay--7 {\n  animation-duration: 0.96s;\n}\n\n.delay--8 {\n  animation-duration: 1.04s;\n}\n\n.delay--9 {\n  animation-duration: 1.12s;\n}\n\n.delay--10 {\n  animation-duration: 1.2s;\n}\n\n.delay--11 {\n  animation-duration: 1.28s;\n}\n\n.delay--12 {\n  animation-duration: 1.36s;\n}\n\n.delay--13 {\n  animation-duration: 1.44s;\n}\n\n.delay--14 {\n  animation-duration: 1.52s;\n}\n\n.delay--15 {\n  animation-duration: 1.6s;\n}\n\n.delay--16 {\n  animation-duration: 1.68s;\n}\n\n.delay--17 {\n  animation-duration: 1.76s;\n}\n\n.delay--18 {\n  animation-duration: 1.84s;\n}\n\n.delay--19 {\n  animation-duration: 1.92s;\n}\n\n.delay--20 {\n  animation-duration: 2s;\n}\n\n.delay--21 {\n  animation-duration: 2.08s;\n}\n\n.delay--22 {\n  animation-duration: 2.16s;\n}\n\n.delay--23 {\n  animation-duration: 2.24s;\n}\n\n.delay--24 {\n  animation-duration: 2.32s;\n}\n\n.delay--25 {\n  animation-duration: 2.4s;\n}\n\n.delay--26 {\n  animation-duration: 2.48s;\n}\n\n.delay--27 {\n  animation-duration: 2.56s;\n}\n\n.delay--28 {\n  animation-duration: 2.64s;\n}\n\n.delay--29 {\n  animation-duration: 2.72s;\n}\n\n.delay--30 {\n  animation-duration: 2.8s;\n}\n\n.delay--31 {\n  animation-duration: 2.88s;\n}\n\n.delay--32 {\n  animation-duration: 2.96s;\n}\n\n.delay--33 {\n  animation-duration: 3.04s;\n}\n\n.delay--34 {\n  animation-duration: 3.12s;\n}\n\n.delay--35 {\n  animation-duration: 3.2s;\n}\n\n.delay--36 {\n  animation-duration: 3.28s;\n}\n\n.delay--37 {\n  animation-duration: 3.36s;\n}\n\n.delay--38 {\n  animation-duration: 3.44s;\n}\n\n.delay--39 {\n  animation-duration: 3.52s;\n}\n\n.delay--40 {\n  animation-duration: 3.6s;\n}\n\n.delay--41 {\n  animation-duration: 3.68s;\n}\n\n.delay--42 {\n  animation-duration: 3.76s;\n}\n\n.delay--43 {\n  animation-duration: 3.84s;\n}\n\n.delay--44 {\n  animation-duration: 3.92s;\n}\n\n.delay--45 {\n  animation-duration: 4s;\n}\n\n.delay--46 {\n  animation-duration: 4.08s;\n}\n\n.delay--47 {\n  animation-duration: 4.16s;\n}\n\n.delay--48 {\n  animation-duration: 4.24s;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\nbutton span {\n  font-size: 1rem;\n  font-weight: 700;\n}\nbutton.btnPrimary {\n  background: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(226, 137, 4, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #f1c017;\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnPrimary span:first-child {\n  color: #121212;\n}\nbutton.btnPrimary:hover, button.btnPrimary:focus, button.btnPrimary.active, button.btnPrimary:disabled {\n  background-color: #b89318;\n}\nbutton.btnPrimary:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnSecondary {\n  background: transparent;\n  border: 1px solid;\n  border-color: #e0e0e0;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnSecondary span:first-child {\n  color: #e0e0e0;\n}\nbutton.btnSecondary:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnText {\n  text-decoration: underline;\n}\nbutton.btnText span {\n  text-transform: none;\n  font-weight: 400;\n}\nbutton.btnPrimaryNegative {\n  background: linear-gradient(180deg, #61f0f2 0%, #48c2c4 100%);\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnPrimaryNegative span:first-child {\n  color: #121212;\n}\nbutton.btnPrimaryNegative:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnPrimaryNegative:hover {\n  opacity: 0.7;\n}\nbutton.btnIncrement {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n  min-width: 40px;\n  width: 40px;\n  height: 40px;\n  border-radius: 4px;\n  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.55);\n}\nbutton.btnIncrement span:first-child {\n  color: #ffffff;\n}\nbutton.btnIncrement:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ninput.inputText,\ninput.inputNumber {\n  box-sizing: border-box;\n  border: 1px solid #7b7b7b;\n  background: transparent;\n  transition: all 300ms ease;\n  color: #e0e0e0;\n}\ninput.inputText:focus, input.inputText:focus-visible,\ninput.inputNumber:focus,\ninput.inputNumber:focus-visible {\n  border-color: #e3b82a;\n  outline: none;\n}\n\ninput.inputText {\n  appearance: none;\n  border-radius: 4px;\n  height: 45px;\n  width: 100%;\n  max-width: 280px;\n  padding: 0 0.5rem;\n}\n\ninput.inputNumber {\n  border-radius: 2px;\n  height: 40px;\n  width: 60px;\n  max-width: 5rem;\n  text-align: center;\n}\n\ninput.inputCheckbox {\n  width: 24px;\n  min-width: 24px;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  border-radius: 4px;\n  cursor: pointer;\n  appearance: none;\n  background: #121212;\n  position: relative;\n  border: solid 1px #7b7b7b;\n}\ninput.inputCheckbox:checked {\n  background: #e3b82a;\n  border-color: #e3b82a;\n}\ninput.inputCheckbox:checked:before, input.inputCheckbox:checked:after {\n  content: \"\";\n  position: absolute;\n  display: inline-block;\n  background: #121212;\n  border-radius: 0.5rem;\n}\ninput.inputCheckbox:checked:before {\n  width: 3px;\n  height: 12px;\n  left: 10px;\n  top: 4px;\n  transform: rotate(41deg);\n}\ninput.inputCheckbox:checked:after {\n  width: 3px;\n  height: 6px;\n  left: 5px;\n  top: 8px;\n  transform: rotate(133deg);\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.card {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  box-sizing: border-box;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);\n  border-radius: 4px;\n  padding: 16px;\n}\n.card:hover {\n  background: linear-gradient(180deg, rgba(70, 71, 77, 0.7) 0%, rgba(57, 58, 63, 0.7) 100%);\n}\n.card.rich-card {\n  padding: 16px;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.modal-root .MuiBackdrop-root {\n  background-color: hsla(231deg, 11%, 12%, 0.85);\n}\n\ndiv.modal-paper {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  width: 36rem;\n  max-width: 100%;\n  max-height: 90vh;\n  padding: 2rem;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  margin: 0 0 0 13.75rem;\n  align-items: center;\n  color: #ffffff;\n}\n@media only screen and (max-width : 1023px) {\n  div.modal-paper {\n    width: 35rem;\n    margin: 0;\n  }\n}\n@media only screen and (max-width : 768px) {\n  div.modal-paper {\n    padding: 1rem 1rem 1.5rem;\n    width: 85%;\n    max-width: 35rem;\n    margin: 0;\n  }\n}\ndiv.modal-paper.no-padding {\n  padding: 0;\n}\ndiv.modal-paper.blue-border {\n  border: 1px solid rgba(88, 255, 255, 0.2509803922);\n}\ndiv.modal-paper.blue-light-border {\n  border: 1px solid #61f0f2;\n}\ndiv.modal-paper.yellow-border {\n  border: 1px solid rgba(227, 184, 42, 0.4);\n}\ndiv.modal-paper .modal-paper-close-button {\n  position: absolute;\n  top: 0.5rem;\n  right: 0.5rem;\n  padding: 5px 5px;\n  z-index: 10;\n}\n\ndiv.modal-paper-full-screen {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  width: 100%;\n  max-width: 100%;\n  height: 100%;\n  max-height: 100%;\n  padding: 0;\n  margin: 0;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  color: #ffffff;\n  display: flex;\n  align-items: center;\n}\ndiv.modal-paper-full-screen.dark-background {\n  background: #121212;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.expansion-panel-root {\n  margin: 1.2rem 0;\n  color: #e0e0e0;\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border-radius: 4px;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);\n  transition: background-color 0.6s ease;\n  box-sizing: border-box;\n}\ndiv.expansion-panel-root.Mui-expanded:first-child {\n  margin: 1.2rem 0;\n}\ndiv.expansion-panel-root.Mui-expanded:last-child {\n  margin: 1.2rem 0;\n}\ndiv.expansion-panel-root.red-border {\n  border: 1px solid #d25959;\n}\n\ndiv.expansion-panel-summary {\n  padding: 0.25rem 1.2rem;\n  min-height: 4rem;\n}\ndiv.expansion-panel-summary.Mui-focused {\n  border-radius: 4px;\n  background-color: unset;\n  box-shadow: 0 0 0 1px #e0e0e0;\n}\ndiv.expansion-panel-summary.Mui-expanded {\n  min-height: 4rem;\n}\ndiv.expansion-panel-summary.Mui-expanded.small {\n  min-height: 3rem;\n}\ndiv.expansion-panel-summary.small {\n  padding: 0 1.2rem;\n  min-height: 3rem;\n}\ndiv.expansion-panel-summary.bold-text {\n  font-weight: bold;\n}\n\ndiv.expansion-panel-content {\n  display: flex;\n  align-items: center;\n}\ndiv.expansion-panel-content.Mui-expanded {\n  margin: 0.75rem 0;\n}\n\ndiv.expansion-panel-details {\n  padding: 0 1.2rem 1.2rem;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\na {\n  color: #deaf0e;\n}\na:visited {\n  color: #deaf0e;\n}\n\na:focus {\n  outline: none;\n  box-shadow: inset 0 0 0 1px #e0e0e0;\n}\na:focus > div:first-child {\n  box-shadow: 0 0 0 1px #e0e0e0;\n}\n\na.MuiLink-underlineHover:hover {\n  text-decoration: none;\n}\n\na.MuiTypography-colorPrimary {\n  color: #e0e0e0;\n}\n\n:root {\n  white-space: pre-line;\n  --blue: #58ffff;\n  --blue40: rgba(88, 255, 255, 0.2509803922);\n  --blueBackground: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  --blueRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  --blueRadialGradientTrans: radial-gradient(circle, #58ffff 0%, rgba(255, 255, 255, 0) 100%);\n  --elecColor: #d87b39;\n  --elecColor40: rgba(216, 123, 57, 0.4);\n  --elecCompareColor: #e2bca1;\n  --gasColor: #45d1b8;\n  --gasColor40: rgba(69, 209, 184, 0.4);\n  --gasCompareColor: #a8f7e9;\n  --waterColor: #3a98ec;\n  --waterColor40: rgba(58, 152, 236, 0.4);\n  --waterCompareColor: #abd4fa;\n  --multiColor: #e3b82a;\n  --multiCompareColor: #ffd597;\n  --redPrimary: #d25959;\n  --greyBright: #e0e0e0;\n  --greyDark: #7b7b7b;\n  --textWhite: #ffffff;\n  --softGrey: #a0a0a0;\n  --darkLight: #25262b;\n  --darkLight2: #121212;\n  --textFont: Lato, sans-serif;\n  --greyLinearGradientBackground: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  --multiColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);\n  --elecColorRadialGradientTrans: radial-gradient(circle, #d87b39 0%, rgba(255, 255, 255, 0) 100%);\n  --waterColorRadialGradientTrans: radial-gradient(circle, #3a98ec 0%, rgba(255, 255, 255, 0) 100%);\n  --gasColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);\n  --multiColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(226, 137, 4, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #f1c017;\n  --elecColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(158, 67, 2, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #d87b39;\n  --gasColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(4, 106, 88, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #45d1b8;\n  --waterColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(2, 93, 174, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #3a98ec;\n}\n\n.application {\n  overflow-x: hidden;\n  background-color: #121212;\n}\n\n.accordion-icon {\n  color: #ffffff;\n}\n\n.loaderContainer {\n  height: 80vh;\n  display: flex;\n  flex: 1;\n  justify-content: center;\n  align-items: center;\n}\n\n.makeStyles-fab-1 {\n  top: 12px;\n  left: 3rem !important;\n  width: 36px !important;\n  height: 36px !important;\n  background-color: #323339 !important;\n}\n\ninput:-webkit-autofill,\ninput:-webkit-autofill:hover,\ninput:-webkit-autofill:focus,\ninput:-webkit-autofill:active {\n  -webkit-box-shadow: 0 0 0 30px #1b1c22 inset !important;\n}", ""]);
+exports.push([module.i, "/* Cozy UI utilities classes */\n/* Cozy UI React components styles */\n/* App styles */\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\nhtml {\n  background: #121212;\n}\n\nbody {\n  background: #121212;\n  overflow: unset !important;\n  color: #e0e0e0;\n}\n\n.column {\n  display: flex;\n  flex-direction: column;\n}\n\n.row {\n  display: flex;\n  flex-direction: row;\n}\n\n.cozy-bar {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 0;\n}\n\n[role=banner] .coz-bar-container {\n  background-color: #ffffff;\n}\n@media only screen and (max-width : 768px) {\n  [role=banner] .coz-bar-container {\n    padding: 0.6rem 0 0 0;\n    background-color: unset;\n  }\n}\n\n.coz-bar-wrapper {\n  box-shadow: unset !important;\n  background: unset !important;\n}\n\n.coz-label {\n  color: #32363f;\n}\n\n.content-view-loading {\n  height: 80vh;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  color: #e0e0e0;\n}\n.content-view-loading .content-view-loading-text {\n  padding-top: 1rem;\n  margin: 0 2rem;\n  text-align: center;\n}\n.content-view-loading .content-view-loading-button {\n  max-width: 50vw;\n  margin-top: 1rem;\n}\n\n[role=main] {\n  /* width */\n  /* Track */\n  /* Handle */\n}\n[role=main]::-webkit-scrollbar {\n  width: 10px;\n}\n[role=main]::-webkit-scrollbar-track {\n  background: #3e4045;\n}\n[role=main]::-webkit-scrollbar-thumb {\n  background: #6f7074;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n* {\n  font-family: Lato, sans-serif;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np {\n  color: #a0a0a0;\n  font-family: Lato, sans-serif;\n}\n\n.home-title {\n  font-size: 1rem;\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  line-height: 120%;\n  text-transform: uppercase;\n}\n\n.app-title {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 21px;\n  line-height: 24px;\n  text-align: center;\n  letter-spacing: 0.15px;\n  color: #e0e0e0;\n  text-shadow: 0px -1px 0px #060609, 0px 1px 0px rgba(255, 255, 255, 0.07);\n}\n\n.text-10, .text-10-italic, .text-10-bold, .text-10-bold-capitalize, .text-10-bold-uppercase, .text-10-normal, .text-10-normal-150, .text-10-normal-uppercase {\n  font-style: normal;\n  font-size: 0.625rem;\n  line-height: 120%;\n}\n.text-10-normal, .text-10-normal-150, .text-10-normal-uppercase {\n  font-weight: normal;\n}\n.text-10-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-10-normal-150 {\n  line-height: 150%;\n}\n.text-10-bold, .text-10-bold-capitalize, .text-10-bold-uppercase {\n  font-weight: 700;\n}\n.text-10-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-10-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-10-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-12, .text-12-italic, .text-12-bold, .text-12-bold-capitalize, .text-12-bold-uppercase, .text-12-normal, .text-12-normal-150, .text-12-normal-uppercase {\n  font-style: normal;\n  font-size: 0.75rem;\n  line-height: 120%;\n}\n.text-12-normal, .text-12-normal-150, .text-12-normal-uppercase {\n  font-weight: normal;\n}\n.text-12-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-12-normal-150 {\n  line-height: 150%;\n}\n.text-12-bold, .text-12-bold-capitalize, .text-12-bold-uppercase {\n  font-weight: 700;\n}\n.text-12-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-12-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-12-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-13, .text-13-italic, .text-13-bold, .text-13-bold-capitalize, .text-13-bold-uppercase, .text-13-normal, .text-13-normal-150, .text-13-normal-uppercase {\n  font-style: normal;\n  font-size: 0.8125rem;\n  line-height: 120%;\n}\n.text-13-normal, .text-13-normal-150, .text-13-normal-uppercase {\n  font-weight: normal;\n}\n.text-13-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-13-normal-150 {\n  line-height: 150%;\n}\n.text-13-bold, .text-13-bold-capitalize, .text-13-bold-uppercase {\n  font-weight: 700;\n}\n.text-13-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-13-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-13-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-14, .text-14-italic, .text-14-bold, .text-14-bold-capitalize, .text-14-bold-uppercase, .text-14-normal, .text-14-normal-150, .text-14-normal-uppercase {\n  font-style: normal;\n  font-size: 0.875rem;\n  line-height: 120%;\n}\n.text-14-normal, .text-14-normal-150, .text-14-normal-uppercase {\n  font-weight: normal;\n}\n.text-14-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-14-normal-150 {\n  line-height: 150%;\n}\n.text-14-bold, .text-14-bold-capitalize, .text-14-bold-uppercase {\n  font-weight: 700;\n}\n.text-14-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-14-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-14-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-15, .text-15-italic, .text-15-bold, .text-15-bold-capitalize, .text-15-bold-uppercase, .text-15-normal, .text-15-normal-150, .text-15-normal-uppercase {\n  font-style: normal;\n  font-size: 0.938rem;\n  line-height: 120%;\n}\n.text-15-normal, .text-15-normal-150, .text-15-normal-uppercase {\n  font-weight: normal;\n}\n.text-15-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-15-normal-150 {\n  line-height: 150%;\n}\n.text-15-bold, .text-15-bold-capitalize, .text-15-bold-uppercase {\n  font-weight: 700;\n}\n.text-15-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-15-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-15-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-16, .text-16-italic, .text-16-bold, .text-16-bold-capitalize, .text-16-bold-uppercase, .text-16-normal, .text-16-normal-150, .text-16-normal-uppercase {\n  font-style: normal;\n  font-size: 1rem;\n  line-height: 120%;\n}\n.text-16-normal, .text-16-normal-150, .text-16-normal-uppercase {\n  font-weight: normal;\n}\n.text-16-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-16-normal-150 {\n  line-height: 150%;\n}\n.text-16-bold, .text-16-bold-capitalize, .text-16-bold-uppercase {\n  font-weight: 700;\n}\n.text-16-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-16-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-16-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-18, .text-18-italic, .text-18-bold, .text-18-bold-capitalize, .text-18-bold-uppercase, .text-18-normal, .text-18-normal-150, .text-18-normal-uppercase {\n  font-style: normal;\n  font-size: 1.125rem;\n  line-height: 120%;\n}\n.text-18-normal, .text-18-normal-150, .text-18-normal-uppercase {\n  font-weight: normal;\n}\n.text-18-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-18-normal-150 {\n  line-height: 150%;\n}\n.text-18-bold, .text-18-bold-capitalize, .text-18-bold-uppercase {\n  font-weight: 700;\n}\n.text-18-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-18-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-18-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-19, .text-19-italic, .text-19-bold, .text-19-bold-capitalize, .text-19-bold-uppercase, .text-19-normal, .text-19-normal-150, .text-19-normal-uppercase {\n  font-style: normal;\n  font-size: 1.188rem;\n  line-height: 120%;\n}\n.text-19-normal, .text-19-normal-150, .text-19-normal-uppercase {\n  font-weight: normal;\n}\n.text-19-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-19-normal-150 {\n  line-height: 150%;\n}\n.text-19-bold, .text-19-bold-capitalize, .text-19-bold-uppercase {\n  font-weight: 700;\n}\n.text-19-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-19-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-19-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-20, .text-20-italic, .text-20-bold, .text-20-bold-capitalize, .text-20-bold-uppercase, .text-20-normal, .text-20-normal-150, .text-20-normal-uppercase {\n  font-style: normal;\n  font-size: 1.25rem;\n  line-height: 120%;\n}\n.text-20-normal, .text-20-normal-150, .text-20-normal-uppercase {\n  font-weight: normal;\n}\n.text-20-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-20-normal-150 {\n  line-height: 150%;\n}\n.text-20-bold, .text-20-bold-capitalize, .text-20-bold-uppercase {\n  font-weight: 700;\n}\n.text-20-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-20-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-20-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-21, .text-21-italic, .text-21-bold, .text-21-bold-capitalize, .text-21-bold-uppercase, .text-21-normal, .text-21-normal-150, .text-21-normal-uppercase {\n  font-style: normal;\n  font-size: 1.313rem;\n  line-height: 120%;\n}\n.text-21-normal, .text-21-normal-150, .text-21-normal-uppercase {\n  font-weight: normal;\n}\n.text-21-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-21-normal-150 {\n  line-height: 150%;\n}\n.text-21-bold, .text-21-bold-capitalize, .text-21-bold-uppercase {\n  font-weight: 700;\n}\n.text-21-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-21-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-21-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-22, .text-22-italic, .text-22-bold, .text-22-bold-capitalize, .text-22-bold-uppercase, .text-22-normal, .text-22-normal-150, .text-22-normal-uppercase {\n  font-style: normal;\n  font-size: 1.375rem;\n  line-height: 120%;\n}\n.text-22-normal, .text-22-normal-150, .text-22-normal-uppercase {\n  font-weight: normal;\n}\n.text-22-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-22-normal-150 {\n  line-height: 150%;\n}\n.text-22-bold, .text-22-bold-capitalize, .text-22-bold-uppercase {\n  font-weight: 700;\n}\n.text-22-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-22-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-22-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-24, .text-24-italic, .text-24-bold, .text-24-bold-capitalize, .text-24-bold-uppercase, .text-24-normal, .text-24-normal-150, .text-24-normal-uppercase {\n  font-style: normal;\n  font-size: 1.5rem;\n  line-height: 120%;\n}\n.text-24-normal, .text-24-normal-150, .text-24-normal-uppercase {\n  font-weight: normal;\n}\n.text-24-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-24-normal-150 {\n  line-height: 150%;\n}\n.text-24-bold, .text-24-bold-capitalize, .text-24-bold-uppercase {\n  font-weight: 700;\n}\n.text-24-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-24-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-24-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-26, .text-26-italic, .text-26-bold, .text-26-bold-capitalize, .text-26-bold-uppercase, .text-26-normal, .text-26-normal-150, .text-26-normal-uppercase {\n  font-style: normal;\n  font-size: 1.625rem;\n  line-height: 120%;\n}\n.text-26-normal, .text-26-normal-150, .text-26-normal-uppercase {\n  font-weight: normal;\n}\n.text-26-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-26-normal-150 {\n  line-height: 150%;\n}\n.text-26-bold, .text-26-bold-capitalize, .text-26-bold-uppercase {\n  font-weight: 700;\n}\n.text-26-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-26-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-26-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-28, .text-28-italic, .text-28-bold, .text-28-bold-capitalize, .text-28-bold-uppercase, .text-28-normal, .text-28-normal-150, .text-28-normal-uppercase {\n  font-style: normal;\n  font-size: 1.75rem;\n  line-height: 120%;\n}\n.text-28-normal, .text-28-normal-150, .text-28-normal-uppercase {\n  font-weight: normal;\n}\n.text-28-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-28-normal-150 {\n  line-height: 150%;\n}\n.text-28-bold, .text-28-bold-capitalize, .text-28-bold-uppercase {\n  font-weight: 700;\n}\n.text-28-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-28-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-28-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-36, .text-36-italic, .text-36-bold, .text-36-bold-capitalize, .text-36-bold-uppercase, .text-36-normal, .text-36-normal-150, .text-36-normal-uppercase {\n  font-style: normal;\n  font-size: 2.25rem;\n  line-height: 120%;\n}\n.text-36-normal, .text-36-normal-150, .text-36-normal-uppercase {\n  font-weight: normal;\n}\n.text-36-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-36-normal-150 {\n  line-height: 150%;\n}\n.text-36-bold, .text-36-bold-capitalize, .text-36-bold-uppercase {\n  font-weight: 700;\n}\n.text-36-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-36-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-36-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n/* Card */\n.card-title-on {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1.125rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-text-bold {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-indicator {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n/* Chart */\n.chart-ticks-x-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n}\n@media only screen and (max-width : 768px) {\n  .chart-ticks-x-text {\n    font-size: 0.685rem;\n  }\n}\n\n.chart-ticks-y-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 0.9rem;\n  line-height: 120%;\n}\n@media only screen and (max-width : 768px) {\n  .chart-ticks-y-text {\n    font-size: 0.75rem;\n  }\n}\n\n/* Cozy bar */\n.cozybar {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 1.3125rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.axis {\n  color: #7b7b7b;\n}\n.axis .tick-text {\n  fill: #7b7b7b;\n}\n.axis .tick-text.tick-text-selected {\n  fill: #e0e0e0;\n}\n.axis .separator {\n  text-align: center;\n  margin: 0 2px;\n  font-size: 1rem !important;\n}\n\n.value-text {\n  fill: #7b7b7b;\n}\n.value-text.selected {\n  fill: #e0e0e0;\n}\n\n.barContainer.disabled *,\n.barFill.disabled * {\n  cursor: default !important;\n}\n.barContainer:hover,\n.barFill:hover {\n  cursor: pointer;\n}\n\n.background-true {\n  opacity: 0.1;\n}\n.background-true:hover {\n  cursor: pointer;\n}\n\n.background-false {\n  opacity: 0;\n}\n\n.bar-compare-ELECTRICITY:hover,\n.bar-compare-GAS:hover,\n.bar-compare-WATER:hover,\n.bar-compare-MULTIFLUID:hover,\n.bar-MULTIFLUID:hover,\n.bar-WATER:hover,\n.bar-GAS:hover,\n.bar-ELECTRICITY:hover {\n  cursor: pointer;\n}\n.bar-compare-ELECTRICITY:hover.disabled,\n.bar-compare-GAS:hover.disabled,\n.bar-compare-WATER:hover.disabled,\n.bar-compare-MULTIFLUID:hover.disabled,\n.bar-MULTIFLUID:hover.disabled,\n.bar-WATER:hover.disabled,\n.bar-GAS:hover.disabled,\n.bar-ELECTRICITY:hover.disabled {\n  cursor: default;\n}\n\n.bar-ELECTRICITY {\n  fill: #5d3d2a;\n}\n.bar-ELECTRICITY.selected {\n  fill: #d87b39;\n  filter: drop-shadow(0 -0.1rem 0.2rem #d87b39);\n}\n\n.bar-compare-ELECTRICITY {\n  fill: #795c47;\n}\n.bar-compare-ELECTRICITY.selected {\n  fill: #e2bca1;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1);\n}\n\n.bar-WATER {\n  fill: #20415e;\n}\n.bar-WATER.selected {\n  fill: #3a98ec;\n  filter: drop-shadow(0 -0.1rem 0.2rem #3a98ec);\n}\n\n.bar-compare-WATER {\n  fill: #4d5c6e;\n}\n.bar-compare-WATER.selected {\n  fill: #abd4fa;\n  filter: drop-shadow(0 -0.1rem 0.2rem #abd4fa);\n}\n\n.bar-GAS {\n  fill: #184940;\n}\n.bar-GAS.selected {\n  fill: #45d1b8;\n  filter: drop-shadow(0 -0.1rem 0.2rem #45d1b8);\n}\n\n.bar-compare-GAS {\n  fill: #597773;\n}\n.bar-compare-GAS.selected {\n  fill: #a8f7e9;\n  filter: drop-shadow(0 -0.1rem 0.2rem #a8f7e9);\n}\n\n.bar-MULTIFLUID {\n  fill: #705d1d;\n}\n.bar-MULTIFLUID.selected {\n  fill: #e3b82a;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n.bar-MULTIFLUID.disabled:hover {\n  cursor: default;\n}\n\n.bar-duel {\n  fill: #61f0f2;\n}\n.bar-duel.selected {\n  fill: #61f0f2;\n  filter: drop-shadow(0 -0.1rem 0.2rem #61f0f2);\n}\n.bar-duel.disabled:hover {\n  cursor: default;\n}\n\n.bar-UPCOMING {\n  fill: #7b7b7b;\n  opacity: 0.6;\n}\n.bar-UPCOMING.selected {\n  fill: #7b7b7b;\n}\n.bar-UPCOMING.disabled:hover {\n  cursor: default;\n}\n\n.bar-compare-MULTIFLUID {\n  fill: #7d6a4e;\n}\n.bar-compare-MULTIFLUID.selected {\n  fill: #ffd597;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n\n.bar-average {\n  stroke-width: 2;\n  stroke: #e3b82a;\n}\n\n.week {\n  fill: #e2bca1;\n}\n.week.selected {\n  fill: #e2bca1;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1);\n}\n\n.weekend {\n  fill: #ffd597;\n}\n.weekend.selected {\n  fill: #ffd597;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n\n.barValue {\n  outline: none;\n}\n.barValue:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n\n/** Animation **/\n.bounce-1 {\n  animation-name: bounce-1;\n  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);\n  animation-iteration-count: 1;\n  transform-origin: bottom center;\n  transform-box: fill-box;\n}\n\n@keyframes bounce-1 {\n  0% {\n    transform: scale(0.1, 0.1);\n  }\n  28% {\n    transform: scale(0.1, 1.1);\n  }\n  45% {\n    transform: scale(0.8, 0.95);\n  }\n  55% {\n    transform: scale(1, 1);\n  }\n  65% {\n    transform: scale(1, 0.98);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n}\n.bounce-2 {\n  animation-name: bounce-2;\n  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);\n  animation-iteration-count: 1;\n  transform-origin: bottom center;\n  transform-box: fill-box;\n}\n\n@keyframes bounce-2 {\n  0% {\n    transform: scale(1, 1);\n  }\n  28% {\n    transform: scale(1, 1.1);\n  }\n  45% {\n    transform: scale(0.8, 0.95);\n  }\n  55% {\n    transform: scale(1, 1);\n  }\n  65% {\n    transform: scale(1, 0.98);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n}\n/** Animation delay **/\n.delay {\n  animation-duration: 0.4s;\n}\n\n.delay--0 {\n  animation-duration: 0.4s;\n}\n\n.delay--1 {\n  animation-duration: 0.48s;\n}\n\n.delay--2 {\n  animation-duration: 0.56s;\n}\n\n.delay--3 {\n  animation-duration: 0.64s;\n}\n\n.delay--4 {\n  animation-duration: 0.72s;\n}\n\n.delay--5 {\n  animation-duration: 0.8s;\n}\n\n.delay--6 {\n  animation-duration: 0.88s;\n}\n\n.delay--7 {\n  animation-duration: 0.96s;\n}\n\n.delay--8 {\n  animation-duration: 1.04s;\n}\n\n.delay--9 {\n  animation-duration: 1.12s;\n}\n\n.delay--10 {\n  animation-duration: 1.2s;\n}\n\n.delay--11 {\n  animation-duration: 1.28s;\n}\n\n.delay--12 {\n  animation-duration: 1.36s;\n}\n\n.delay--13 {\n  animation-duration: 1.44s;\n}\n\n.delay--14 {\n  animation-duration: 1.52s;\n}\n\n.delay--15 {\n  animation-duration: 1.6s;\n}\n\n.delay--16 {\n  animation-duration: 1.68s;\n}\n\n.delay--17 {\n  animation-duration: 1.76s;\n}\n\n.delay--18 {\n  animation-duration: 1.84s;\n}\n\n.delay--19 {\n  animation-duration: 1.92s;\n}\n\n.delay--20 {\n  animation-duration: 2s;\n}\n\n.delay--21 {\n  animation-duration: 2.08s;\n}\n\n.delay--22 {\n  animation-duration: 2.16s;\n}\n\n.delay--23 {\n  animation-duration: 2.24s;\n}\n\n.delay--24 {\n  animation-duration: 2.32s;\n}\n\n.delay--25 {\n  animation-duration: 2.4s;\n}\n\n.delay--26 {\n  animation-duration: 2.48s;\n}\n\n.delay--27 {\n  animation-duration: 2.56s;\n}\n\n.delay--28 {\n  animation-duration: 2.64s;\n}\n\n.delay--29 {\n  animation-duration: 2.72s;\n}\n\n.delay--30 {\n  animation-duration: 2.8s;\n}\n\n.delay--31 {\n  animation-duration: 2.88s;\n}\n\n.delay--32 {\n  animation-duration: 2.96s;\n}\n\n.delay--33 {\n  animation-duration: 3.04s;\n}\n\n.delay--34 {\n  animation-duration: 3.12s;\n}\n\n.delay--35 {\n  animation-duration: 3.2s;\n}\n\n.delay--36 {\n  animation-duration: 3.28s;\n}\n\n.delay--37 {\n  animation-duration: 3.36s;\n}\n\n.delay--38 {\n  animation-duration: 3.44s;\n}\n\n.delay--39 {\n  animation-duration: 3.52s;\n}\n\n.delay--40 {\n  animation-duration: 3.6s;\n}\n\n.delay--41 {\n  animation-duration: 3.68s;\n}\n\n.delay--42 {\n  animation-duration: 3.76s;\n}\n\n.delay--43 {\n  animation-duration: 3.84s;\n}\n\n.delay--44 {\n  animation-duration: 3.92s;\n}\n\n.delay--45 {\n  animation-duration: 4s;\n}\n\n.delay--46 {\n  animation-duration: 4.08s;\n}\n\n.delay--47 {\n  animation-duration: 4.16s;\n}\n\n.delay--48 {\n  animation-duration: 4.24s;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\nbutton span {\n  font-size: 1rem;\n  font-weight: 700;\n}\nbutton:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\nbutton.btnPrimary {\n  background: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(226, 137, 4, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #f1c017;\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnPrimary span:first-child {\n  color: #121212;\n}\nbutton.btnPrimary:hover, button.btnPrimary:focus, button.btnPrimary.active, button.btnPrimary:disabled {\n  background-color: #b89318;\n}\nbutton.btnPrimary:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnSecondary {\n  background: transparent;\n  border: 1px solid;\n  border-color: #e0e0e0;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnSecondary span:first-child {\n  color: #e0e0e0;\n}\nbutton.btnSecondary:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnText {\n  text-decoration: underline;\n}\nbutton.btnText span {\n  text-transform: none;\n  font-weight: 400;\n}\nbutton.btnPrimaryNegative {\n  background: linear-gradient(180deg, #61f0f2 0%, #48c2c4 100%);\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnPrimaryNegative span:first-child {\n  color: #121212;\n}\nbutton.btnPrimaryNegative:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnPrimaryNegative:hover {\n  opacity: 0.7;\n}\nbutton.btnIncrement {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n  min-width: 40px;\n  width: 40px;\n  height: 40px;\n  border-radius: 4px;\n  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.55);\n}\nbutton.btnIncrement span:first-child {\n  color: #ffffff;\n}\nbutton.btnIncrement:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ninput.inputText,\ninput.inputNumber {\n  box-sizing: border-box;\n  border: 1px solid #7b7b7b;\n  background: transparent;\n  transition: all 300ms ease;\n  color: #e0e0e0;\n}\n\ninput.inputText {\n  appearance: none;\n  border-radius: 4px;\n  height: 45px;\n  width: 100%;\n  max-width: 280px;\n  padding: 0 0.5rem;\n}\n\ninput.inputNumber {\n  border-radius: 2px;\n  height: 40px;\n  width: 60px;\n  max-width: 5rem;\n  text-align: center;\n}\n\ninput.inputCheckbox {\n  width: 24px;\n  min-width: 24px;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  border-radius: 4px;\n  cursor: pointer;\n  appearance: none;\n  background: #121212;\n  position: relative;\n  border: solid 1px #7b7b7b;\n}\ninput.inputCheckbox:checked {\n  background: #e3b82a;\n  border-color: #e3b82a;\n}\ninput.inputCheckbox:checked:before, input.inputCheckbox:checked:after {\n  content: \"\";\n  position: absolute;\n  display: inline-block;\n  background: #121212;\n  border-radius: 0.5rem;\n}\ninput.inputCheckbox:checked:before {\n  width: 3px;\n  height: 12px;\n  left: 10px;\n  top: 4px;\n  transform: rotate(41deg);\n}\ninput.inputCheckbox:checked:after {\n  width: 3px;\n  height: 6px;\n  left: 5px;\n  top: 8px;\n  transform: rotate(133deg);\n}\n\ninput:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.card {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  box-sizing: border-box;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);\n  border-radius: 4px;\n  padding: 16px;\n}\n.card:hover {\n  background: linear-gradient(180deg, rgba(70, 71, 77, 0.7) 0%, rgba(57, 58, 63, 0.7) 100%);\n}\n.card.rich-card {\n  padding: 16px;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.modal-root .MuiBackdrop-root {\n  background-color: hsla(231deg, 11%, 12%, 0.85);\n}\n\ndiv.modal-paper {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  width: 36rem;\n  max-width: 100%;\n  max-height: 90vh;\n  padding: 2rem;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  margin: 0 0 0 13.75rem;\n  align-items: center;\n  color: #ffffff;\n}\n@media only screen and (max-width : 1023px) {\n  div.modal-paper {\n    width: 35rem;\n    margin: 0;\n  }\n}\n@media only screen and (max-width : 768px) {\n  div.modal-paper {\n    padding: 1rem 1rem 1.5rem;\n    width: 85%;\n    max-width: 35rem;\n    margin: 0;\n  }\n}\ndiv.modal-paper.no-padding {\n  padding: 0;\n}\ndiv.modal-paper.blue-border {\n  border: 1px solid rgba(88, 255, 255, 0.2509803922);\n}\ndiv.modal-paper.blue-light-border {\n  border: 1px solid #61f0f2;\n}\ndiv.modal-paper.yellow-border {\n  border: 1px solid rgba(227, 184, 42, 0.4);\n}\ndiv.modal-paper .modal-paper-close-button {\n  position: absolute;\n  top: 0.5rem;\n  right: 0.5rem;\n  padding: 5px 5px;\n  z-index: 10;\n}\n\ndiv.modal-paper-full-screen {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  width: 100%;\n  max-width: 100%;\n  height: 100%;\n  max-height: 100%;\n  padding: 0;\n  margin: 0;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  color: #ffffff;\n  display: flex;\n  align-items: center;\n}\ndiv.modal-paper-full-screen.dark-background {\n  background: #121212;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.expansion-panel-root {\n  margin: 1.2rem 0;\n  color: #e0e0e0;\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border-radius: 4px;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);\n  transition: background-color 0.6s ease;\n  box-sizing: border-box;\n}\ndiv.expansion-panel-root.Mui-expanded:first-child {\n  margin: 1.2rem 0;\n}\ndiv.expansion-panel-root.Mui-expanded:last-child {\n  margin: 1.2rem 0;\n}\ndiv.expansion-panel-root.red-border {\n  border: 1px solid #d25959;\n}\n\ndiv.expansion-panel-summary {\n  padding: 0.25rem 1.2rem;\n  min-height: 4rem;\n}\ndiv.expansion-panel-summary.Mui-focused {\n  border-radius: 4px;\n  background-color: unset;\n  box-shadow: 0 0 0 1px #e0e0e0;\n}\ndiv.expansion-panel-summary:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\ndiv.expansion-panel-summary.Mui-expanded {\n  min-height: 4rem;\n}\ndiv.expansion-panel-summary.Mui-expanded.small {\n  min-height: 3rem;\n}\ndiv.expansion-panel-summary.small {\n  padding: 0 1.2rem;\n  min-height: 3rem;\n}\ndiv.expansion-panel-summary.bold-text {\n  font-weight: bold;\n}\n\ndiv.expansion-panel-content {\n  display: flex;\n  align-items: center;\n}\ndiv.expansion-panel-content.Mui-expanded {\n  margin: 0.75rem 0;\n}\n\ndiv.expansion-panel-details {\n  padding: 0 1.2rem 1.2rem;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\na {\n  color: #deaf0e;\n}\na:visited {\n  color: #deaf0e;\n}\n\na:focus {\n  outline: none;\n  box-shadow: inset 0 0 0 1px #e0e0e0;\n}\na:focus > div:first-child {\n  box-shadow: 0 0 0 1px #e0e0e0;\n}\n\na:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n\na.MuiLink-underlineHover:hover {\n  text-decoration: none;\n}\n\na.MuiTypography-colorPrimary {\n  color: #e0e0e0;\n}\n\n:root {\n  white-space: pre-line;\n  --blue: #58ffff;\n  --blue40: rgba(88, 255, 255, 0.2509803922);\n  --blueBackground: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  --blueRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  --blueRadialGradientTrans: radial-gradient(circle, #58ffff 0%, rgba(255, 255, 255, 0) 100%);\n  --elecColor: #d87b39;\n  --elecColor40: rgba(216, 123, 57, 0.4);\n  --elecCompareColor: #e2bca1;\n  --gasColor: #45d1b8;\n  --gasColor40: rgba(69, 209, 184, 0.4);\n  --gasCompareColor: #a8f7e9;\n  --waterColor: #3a98ec;\n  --waterColor40: rgba(58, 152, 236, 0.4);\n  --waterCompareColor: #abd4fa;\n  --multiColor: #e3b82a;\n  --multiCompareColor: #ffd597;\n  --redPrimary: #d25959;\n  --greyBright: #e0e0e0;\n  --greyDark: #7b7b7b;\n  --textWhite: #ffffff;\n  --softGrey: #a0a0a0;\n  --darkLight: #25262b;\n  --darkLight2: #121212;\n  --textFont: Lato, sans-serif;\n  --greyLinearGradientBackground: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  --multiColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);\n  --elecColorRadialGradientTrans: radial-gradient(circle, #d87b39 0%, rgba(255, 255, 255, 0) 100%);\n  --waterColorRadialGradientTrans: radial-gradient(circle, #3a98ec 0%, rgba(255, 255, 255, 0) 100%);\n  --gasColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);\n  --multiColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(226, 137, 4, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #f1c017;\n  --elecColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(158, 67, 2, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #d87b39;\n  --gasColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(4, 106, 88, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #45d1b8;\n  --waterColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(2, 93, 174, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #3a98ec;\n}\n\n.application {\n  overflow-x: hidden;\n  background-color: #121212;\n}\n\n.accordion-icon {\n  color: #ffffff;\n}\n\n.loaderContainer {\n  height: 80vh;\n  display: flex;\n  flex: 1;\n  justify-content: center;\n  align-items: center;\n}\n\n.makeStyles-fab-1 {\n  top: 12px;\n  left: 3rem !important;\n  width: 36px !important;\n  height: 36px !important;\n  background-color: #323339 !important;\n}\n\ninput:-webkit-autofill,\ninput:-webkit-autofill:hover,\ninput:-webkit-autofill:focus,\ninput:-webkit-autofill:active {\n  -webkit-box-shadow: 0 0 0 30px #1b1c22 inset !important;\n}", ""]);
 
 
 
@@ -6786,21 +6788,15 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(__webpack_require__("UdSB"));
 var _IconButton = _interopRequireDefault(__webpack_require__("x0Kp"));
-var _styles = __webpack_require__("yrWy");
 var _StyledIcon = _interopRequireDefault(__webpack_require__("VP3k"));
 var _react = _interopRequireDefault(__webpack_require__("ivGQ"));
 var _excluded = ["icon", "sized"];
-var IconButtonBase = (0, _styles.withStyles)({
-  root: {
-    outline: 'none !important'
-  }
-})(_IconButton.default);
 var StyledIconButton = function StyledIconButton(_ref) {
   var icon = _ref.icon,
     _ref$sized = _ref.sized,
     sized = _ref$sized === void 0 ? 16 : _ref$sized,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  return /*#__PURE__*/_react.default.createElement(IconButtonBase, props, /*#__PURE__*/_react.default.createElement(_StyledIcon.default, {
+  return /*#__PURE__*/_react.default.createElement(_IconButton.default, props, /*#__PURE__*/_react.default.createElement(_StyledIcon.default, {
     icon: icon,
     size: sized
   }));
@@ -18673,7 +18669,7 @@ exports.default = _default;
 
 exports = module.exports = __webpack_require__("DjJv")(false);
 // Module
-exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.cardContent {\n  background: transparent;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  gap: 1rem;\n}\n.cardContent.onGoing {\n  border: 1px solid #e0e0e0;\n  background: inherit !important;\n}\n.cardContent.onGoing .challengeTitle {\n  margin-top: 0;\n}\n.cardContent button {\n  height: unset;\n}\n\n.titleBlock {\n  position: absolute;\n  left: 0;\n  right: 0;\n  margin: auto;\n  top: -1.5rem;\n  background: #121212;\n  width: fit-content;\n  padding: 0 1rem;\n  max-width: 235px;\n}\n\n.notifChallenge {\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  right: 4px;\n  top: 4px;\n  width: 1.25rem;\n  height: 1.25rem;\n  color: #25262b;\n  border-radius: 50%;\n  border: 1px solid #25262b;\n  z-index: 1;\n  background: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  font-size: 12px;\n}\n\n.smallCard {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  max-height: 90px;\n}\n@media all and (max-height: 800px) {\n  .smallCard {\n    max-height: 85px;\n  }\n}\n@media all and (max-height: 730px) {\n  .smallCard {\n    max-height: 70px;\n  }\n}\n.smallCard.finished {\n  border: 1px solid #7b7b7b;\n  background: #121212;\n}\n.smallCard.finished > * {\n  color: #7b7b7b !important;\n}\n.smallCard.duelCard {\n  background: #181819;\n  border: solid 1px rgba(97, 240, 242, 0.5);\n}\n.smallCard.duelCard.active {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n}\n.smallCard.duelCard span {\n  justify-content: space-between !important;\n}\n.smallCard.goDuel {\n  background: linear-gradient(180deg, #61f0f2 0%, #48c2c4 100%);\n}\n.smallCard.goDuel span {\n  color: #121212 !important;\n  justify-content: space-between !important;\n  font-weight: 700;\n}\n.smallCard span.MuiButton-label {\n  display: flex;\n  justify-content: flex-start;\n  padding: 1rem 0.5rem;\n  color: #e0e0e0;\n  transition: all 300ms ease;\n  text-transform: capitalize;\n}\n.smallCard span.MuiButton-label .content {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  text-transform: capitalize;\n}\n.smallCard span.MuiButton-label .content .stars {\n  display: flex;\n  gap: 2px;\n}\n.smallCard span.MuiButton-label .spinner-container {\n  height: 3.75rem;\n  width: 3.75rem;\n  margin: auto;\n}\n.smallCard span.MuiButton-label .cardIcon {\n  margin-right: 1rem;\n}\n.smallCard span.MuiButton-label span {\n  font-size: 1.1rem;\n  font-weight: 700;\n}\n@media all and (max-height: 700px) {\n  .smallCard span.MuiButton-label span {\n    font-size: 1rem;\n  }\n}\n.smallCard span.MuiButton-label .challengeminIcon {\n  filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.55));\n}\n.smallCard span.MuiButton-label .starCount {\n  display: flex;\n  align-items: center;\n  margin: 0;\n}\n.smallCard span.MuiButton-label .starCount span {\n  margin: 0;\n}\n.smallCard span.MuiButton-label .starCount .blueNumber {\n  font-weight: 900;\n  color: #61f0f2;\n  margin: 0 0.3rem 0 0.7rem;\n}\n.smallCard span.MuiButton-label .finalDuel {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n}\n.smallCard span.MuiButton-label .finalDuel .starCount span {\n  font-size: 1rem;\n  font-weight: 500;\n}\n.smallCard span.MuiButton-label .finalDuel .starCount .blueNumber {\n  margin-left: 0;\n}\n.smallCard span.MuiButton-label .finalDuel.result span {\n  margin-bottom: 0.2rem;\n  font-weight: 600;\n  font-size: 1rem;\n}", ""]);
+exports.push([module.i, "/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.cardContent {\n  background: transparent;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  gap: 1rem;\n}\n.cardContent.onGoing {\n  border: 1px solid #e0e0e0;\n  background: inherit !important;\n}\n.cardContent.onGoing .challengeTitle {\n  margin-top: 0;\n}\n.cardContent button {\n  height: unset;\n}\n\n.titleBlock {\n  position: absolute;\n  left: 0;\n  right: 0;\n  margin: auto;\n  top: -1.5rem;\n  background: #121212;\n  width: fit-content;\n  padding: 0 1rem;\n  max-width: 235px;\n}\n\n.notifChallenge {\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  right: 4px;\n  top: 4px;\n  width: 1.25rem;\n  height: 1.25rem;\n  color: #25262b;\n  border-radius: 50%;\n  border: 1px solid #25262b;\n  z-index: 1;\n  background: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  font-size: 12px;\n}\n\n.smallCard {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  max-height: 90px;\n}\n@media all and (max-height: 800px) {\n  .smallCard {\n    max-height: 85px;\n  }\n}\n@media all and (max-height: 730px) {\n  .smallCard {\n    max-height: 70px;\n  }\n}\n.smallCard.finished {\n  border: 1px solid #7b7b7b;\n  background: #121212;\n}\n.smallCard.finished > * {\n  color: #7b7b7b !important;\n}\n.smallCard.duelCard {\n  background: #181819;\n  border: solid 1px rgba(97, 240, 242, 0.5);\n}\n.smallCard.duelCard.active {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n}\n.smallCard.duelCard span {\n  justify-content: space-between !important;\n}\n.smallCard.goDuel {\n  background: linear-gradient(180deg, #61f0f2 0%, #48c2c4 100%);\n}\n.smallCard.goDuel span {\n  color: #121212 !important;\n  justify-content: space-between !important;\n  font-weight: 700;\n}\n.smallCard span.MuiButton-label {\n  display: flex;\n  justify-content: flex-start;\n  padding: 1rem 0.5rem;\n  color: #e0e0e0;\n  transition: all 300ms ease;\n  text-transform: capitalize;\n}\n.smallCard span.MuiButton-label .content {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  text-transform: capitalize;\n}\n.smallCard span.MuiButton-label .content .stars {\n  display: flex;\n  gap: 2px;\n}\n.smallCard span.MuiButton-label .spinner-container {\n  height: 3.75rem;\n  width: 3.75rem;\n  margin: auto;\n}\n.smallCard span.MuiButton-label .cardIcon {\n  margin-right: 1rem;\n}\n.smallCard span.MuiButton-label span {\n  font-size: 1.1rem;\n  font-weight: 700;\n}\n@media all and (max-height: 700px) {\n  .smallCard span.MuiButton-label span {\n    font-size: 1rem;\n  }\n}\n.smallCard span.MuiButton-label .challengeminIcon {\n  filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.55));\n}\n.smallCard span.MuiButton-label .starCount {\n  display: flex;\n  align-items: center;\n  margin: 0;\n}\n.smallCard span.MuiButton-label .starCount span {\n  margin: 0;\n}\n.smallCard span.MuiButton-label .starCount .blueNumber {\n  font-weight: 900;\n  color: #61f0f2;\n  margin: 0 0.3rem 0 0.7rem;\n}\n.smallCard span.MuiButton-label .finalDuel {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n}\n.smallCard span.MuiButton-label .finalDuel .starCount span {\n  font-size: 1rem;\n  font-weight: 500;\n}\n.smallCard span.MuiButton-label .finalDuel .starCount .blueNumber {\n  margin-left: 0;\n}\n.smallCard span.MuiButton-label .finalDuel.result span {\n  margin-bottom: 0.2rem;\n  font-weight: 600;\n  font-size: 1rem;\n}\n.smallCard span.MuiButton-label .finalDuel .lowercase {\n  text-transform: lowercase;\n}", ""]);
 
 
 
@@ -20015,16 +20011,16 @@ var _reactRouterDom = __webpack_require__("Iyno");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var ConsumptionView = /*#__PURE__*/(0, _react.lazy)(function () {
-  return Promise.all(/* import() */[__webpack_require__.e(0), __webpack_require__.e(7), __webpack_require__.e(4)]).then(__webpack_require__.t.bind(null, "pMGC", 7));
+  return Promise.all(/* import() */[__webpack_require__.e(0), __webpack_require__.e(7), __webpack_require__.e(5)]).then(__webpack_require__.t.bind(null, "pMGC", 7));
 });
 var EcogestureTabsView = /*#__PURE__*/(0, _react.lazy)(function () {
-  return __webpack_require__.e(/* import() */ 5).then(__webpack_require__.t.bind(null, "duvQ", 7));
+  return __webpack_require__.e(/* import() */ 6).then(__webpack_require__.t.bind(null, "duvQ", 7));
 });
 var SingleEcogestureView = /*#__PURE__*/(0, _react.lazy)(function () {
   return __webpack_require__.e(/* import() */ 8).then(__webpack_require__.t.bind(null, "Xpq3", 7));
 });
 var OptionsView = /*#__PURE__*/(0, _react.lazy)(function () {
-  return Promise.all(/* import() */[__webpack_require__.e(0), __webpack_require__.e(11), __webpack_require__.e(6)]).then(__webpack_require__.t.bind(null, "tqkp", 7));
+  return Promise.all(/* import() */[__webpack_require__.e(0), __webpack_require__.e(11), __webpack_require__.e(3)]).then(__webpack_require__.t.bind(null, "tqkp", 7));
 });
 var LegalNoticeView = /*#__PURE__*/(0, _react.lazy)(function () {
   return __webpack_require__.e(/* import() */ 10).then(__webpack_require__.t.bind(null, "khfY", 7));
@@ -20033,7 +20029,7 @@ var GCUView = /*#__PURE__*/(0, _react.lazy)(function () {
   return __webpack_require__.e(/* import() */ 9).then(__webpack_require__.t.bind(null, "7qbG", 7));
 });
 var AnalysisView = /*#__PURE__*/(0, _react.lazy)(function () {
-  return Promise.all(/* import() */[__webpack_require__.e(0), __webpack_require__.e(7), __webpack_require__.e(11), __webpack_require__.e(3)]).then(__webpack_require__.t.bind(null, "iP2k", 7));
+  return Promise.all(/* import() */[__webpack_require__.e(0), __webpack_require__.e(7), __webpack_require__.e(11), __webpack_require__.e(4)]).then(__webpack_require__.t.bind(null, "iP2k", 7));
 });
 var ProfileTypeView = /*#__PURE__*/(0, _react.lazy)(function () {
   return Promise.resolve(/* import() */).then(__webpack_require__.t.bind(null, "biw3", 7));
diff --git a/index.html b/index.html
index 8825231688b06cb82f4eb791bdef9c0515b51674..730736109759593020cbd9bf0fe4e32513379f4a 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.9cebad5ae7ea932ed345.js"></script><script src="app/ecolyo.bbe9bb411c0edd51edfe.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.9cebad5ae7ea932ed345.js"></script><script src="app/ecolyo.d9f1446d60a3f0f2d055.js"></script></div></body></html>
\ No newline at end of file
diff --git a/public/ecolyo.6951db4860abd9716b36.js b/public/ecolyo.2e18443e51db3fdcaa90.js
similarity index 99%
rename from public/ecolyo.6951db4860abd9716b36.js
rename to public/ecolyo.2e18443e51db3fdcaa90.js
index 6ca5ea8cb300fd5c5e3ac853c316c8007b53608b..9d5958a424563e765e0a803274acd6d49bd89df3 100644
--- a/public/ecolyo.6951db4860abd9716b36.js
+++ b/public/ecolyo.2e18443e51db3fdcaa90.js
@@ -21284,7 +21284,7 @@ exports.i(__webpack_require__("/O3k"), "");
 exports.push([module.i, "@import url(https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap);", ""]);
 
 // Module
-exports.push([module.i, "/* Cozy UI utilities classes */\n/* Cozy UI React components styles */\n/* App styles */\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\nhtml {\n  background: #121212;\n}\n\nbody {\n  background: #121212;\n  overflow: unset !important;\n  color: #e0e0e0;\n}\n\n.column {\n  display: flex;\n  flex-direction: column;\n}\n\n.row {\n  display: flex;\n  flex-direction: row;\n}\n\n.cozy-bar {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 0;\n}\n\n[role=banner] .coz-bar-container {\n  background-color: #ffffff;\n}\n@media only screen and (max-width : 768px) {\n  [role=banner] .coz-bar-container {\n    padding: 0.6rem 0 0 0;\n    background-color: unset;\n  }\n}\n\n.coz-bar-wrapper {\n  box-shadow: unset !important;\n  background: unset !important;\n}\n\n.coz-label {\n  color: #32363f;\n}\n\n.content-view-loading {\n  height: 80vh;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  color: #e0e0e0;\n}\n.content-view-loading .content-view-loading-text {\n  padding-top: 1rem;\n  margin: 0 2rem;\n  text-align: center;\n}\n.content-view-loading .content-view-loading-button {\n  max-width: 50vw;\n  margin-top: 1rem;\n}\n\n[role=main] {\n  /* width */\n  /* Track */\n  /* Handle */\n}\n[role=main]::-webkit-scrollbar {\n  width: 10px;\n}\n[role=main]::-webkit-scrollbar-track {\n  background: #3e4045;\n}\n[role=main]::-webkit-scrollbar-thumb {\n  background: #6f7074;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n* {\n  font-family: Lato, sans-serif;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np {\n  color: #a0a0a0;\n  font-family: Lato, sans-serif;\n}\n\n.home-title {\n  font-size: 1rem;\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  line-height: 120%;\n  text-transform: uppercase;\n}\n\n.app-title {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 21px;\n  line-height: 24px;\n  text-align: center;\n  letter-spacing: 0.15px;\n  color: #e0e0e0;\n  text-shadow: 0px -1px 0px #060609, 0px 1px 0px rgba(255, 255, 255, 0.07);\n}\n\n.text-10, .text-10-italic, .text-10-bold, .text-10-bold-capitalize, .text-10-bold-uppercase, .text-10-normal, .text-10-normal-150, .text-10-normal-uppercase {\n  font-style: normal;\n  font-size: 0.625rem;\n  line-height: 120%;\n}\n.text-10-normal, .text-10-normal-150, .text-10-normal-uppercase {\n  font-weight: normal;\n}\n.text-10-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-10-normal-150 {\n  line-height: 150%;\n}\n.text-10-bold, .text-10-bold-capitalize, .text-10-bold-uppercase {\n  font-weight: 700;\n}\n.text-10-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-10-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-10-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-12, .text-12-italic, .text-12-bold, .text-12-bold-capitalize, .text-12-bold-uppercase, .text-12-normal, .text-12-normal-150, .text-12-normal-uppercase {\n  font-style: normal;\n  font-size: 0.75rem;\n  line-height: 120%;\n}\n.text-12-normal, .text-12-normal-150, .text-12-normal-uppercase {\n  font-weight: normal;\n}\n.text-12-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-12-normal-150 {\n  line-height: 150%;\n}\n.text-12-bold, .text-12-bold-capitalize, .text-12-bold-uppercase {\n  font-weight: 700;\n}\n.text-12-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-12-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-12-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-13, .text-13-italic, .text-13-bold, .text-13-bold-capitalize, .text-13-bold-uppercase, .text-13-normal, .text-13-normal-150, .text-13-normal-uppercase {\n  font-style: normal;\n  font-size: 0.8125rem;\n  line-height: 120%;\n}\n.text-13-normal, .text-13-normal-150, .text-13-normal-uppercase {\n  font-weight: normal;\n}\n.text-13-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-13-normal-150 {\n  line-height: 150%;\n}\n.text-13-bold, .text-13-bold-capitalize, .text-13-bold-uppercase {\n  font-weight: 700;\n}\n.text-13-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-13-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-13-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-14, .text-14-italic, .text-14-bold, .text-14-bold-capitalize, .text-14-bold-uppercase, .text-14-normal, .text-14-normal-150, .text-14-normal-uppercase {\n  font-style: normal;\n  font-size: 0.875rem;\n  line-height: 120%;\n}\n.text-14-normal, .text-14-normal-150, .text-14-normal-uppercase {\n  font-weight: normal;\n}\n.text-14-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-14-normal-150 {\n  line-height: 150%;\n}\n.text-14-bold, .text-14-bold-capitalize, .text-14-bold-uppercase {\n  font-weight: 700;\n}\n.text-14-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-14-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-14-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-15, .text-15-italic, .text-15-bold, .text-15-bold-capitalize, .text-15-bold-uppercase, .text-15-normal, .text-15-normal-150, .text-15-normal-uppercase {\n  font-style: normal;\n  font-size: 0.938rem;\n  line-height: 120%;\n}\n.text-15-normal, .text-15-normal-150, .text-15-normal-uppercase {\n  font-weight: normal;\n}\n.text-15-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-15-normal-150 {\n  line-height: 150%;\n}\n.text-15-bold, .text-15-bold-capitalize, .text-15-bold-uppercase {\n  font-weight: 700;\n}\n.text-15-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-15-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-15-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-16, .text-16-italic, .text-16-bold, .text-16-bold-capitalize, .text-16-bold-uppercase, .text-16-normal, .text-16-normal-150, .text-16-normal-uppercase {\n  font-style: normal;\n  font-size: 1rem;\n  line-height: 120%;\n}\n.text-16-normal, .text-16-normal-150, .text-16-normal-uppercase {\n  font-weight: normal;\n}\n.text-16-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-16-normal-150 {\n  line-height: 150%;\n}\n.text-16-bold, .text-16-bold-capitalize, .text-16-bold-uppercase {\n  font-weight: 700;\n}\n.text-16-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-16-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-16-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-18, .text-18-italic, .text-18-bold, .text-18-bold-capitalize, .text-18-bold-uppercase, .text-18-normal, .text-18-normal-150, .text-18-normal-uppercase {\n  font-style: normal;\n  font-size: 1.125rem;\n  line-height: 120%;\n}\n.text-18-normal, .text-18-normal-150, .text-18-normal-uppercase {\n  font-weight: normal;\n}\n.text-18-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-18-normal-150 {\n  line-height: 150%;\n}\n.text-18-bold, .text-18-bold-capitalize, .text-18-bold-uppercase {\n  font-weight: 700;\n}\n.text-18-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-18-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-18-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-19, .text-19-italic, .text-19-bold, .text-19-bold-capitalize, .text-19-bold-uppercase, .text-19-normal, .text-19-normal-150, .text-19-normal-uppercase {\n  font-style: normal;\n  font-size: 1.188rem;\n  line-height: 120%;\n}\n.text-19-normal, .text-19-normal-150, .text-19-normal-uppercase {\n  font-weight: normal;\n}\n.text-19-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-19-normal-150 {\n  line-height: 150%;\n}\n.text-19-bold, .text-19-bold-capitalize, .text-19-bold-uppercase {\n  font-weight: 700;\n}\n.text-19-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-19-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-19-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-20, .text-20-italic, .text-20-bold, .text-20-bold-capitalize, .text-20-bold-uppercase, .text-20-normal, .text-20-normal-150, .text-20-normal-uppercase {\n  font-style: normal;\n  font-size: 1.25rem;\n  line-height: 120%;\n}\n.text-20-normal, .text-20-normal-150, .text-20-normal-uppercase {\n  font-weight: normal;\n}\n.text-20-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-20-normal-150 {\n  line-height: 150%;\n}\n.text-20-bold, .text-20-bold-capitalize, .text-20-bold-uppercase {\n  font-weight: 700;\n}\n.text-20-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-20-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-20-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-21, .text-21-italic, .text-21-bold, .text-21-bold-capitalize, .text-21-bold-uppercase, .text-21-normal, .text-21-normal-150, .text-21-normal-uppercase {\n  font-style: normal;\n  font-size: 1.313rem;\n  line-height: 120%;\n}\n.text-21-normal, .text-21-normal-150, .text-21-normal-uppercase {\n  font-weight: normal;\n}\n.text-21-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-21-normal-150 {\n  line-height: 150%;\n}\n.text-21-bold, .text-21-bold-capitalize, .text-21-bold-uppercase {\n  font-weight: 700;\n}\n.text-21-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-21-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-21-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-22, .text-22-italic, .text-22-bold, .text-22-bold-capitalize, .text-22-bold-uppercase, .text-22-normal, .text-22-normal-150, .text-22-normal-uppercase {\n  font-style: normal;\n  font-size: 1.375rem;\n  line-height: 120%;\n}\n.text-22-normal, .text-22-normal-150, .text-22-normal-uppercase {\n  font-weight: normal;\n}\n.text-22-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-22-normal-150 {\n  line-height: 150%;\n}\n.text-22-bold, .text-22-bold-capitalize, .text-22-bold-uppercase {\n  font-weight: 700;\n}\n.text-22-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-22-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-22-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-24, .text-24-italic, .text-24-bold, .text-24-bold-capitalize, .text-24-bold-uppercase, .text-24-normal, .text-24-normal-150, .text-24-normal-uppercase {\n  font-style: normal;\n  font-size: 1.5rem;\n  line-height: 120%;\n}\n.text-24-normal, .text-24-normal-150, .text-24-normal-uppercase {\n  font-weight: normal;\n}\n.text-24-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-24-normal-150 {\n  line-height: 150%;\n}\n.text-24-bold, .text-24-bold-capitalize, .text-24-bold-uppercase {\n  font-weight: 700;\n}\n.text-24-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-24-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-24-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-26, .text-26-italic, .text-26-bold, .text-26-bold-capitalize, .text-26-bold-uppercase, .text-26-normal, .text-26-normal-150, .text-26-normal-uppercase {\n  font-style: normal;\n  font-size: 1.625rem;\n  line-height: 120%;\n}\n.text-26-normal, .text-26-normal-150, .text-26-normal-uppercase {\n  font-weight: normal;\n}\n.text-26-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-26-normal-150 {\n  line-height: 150%;\n}\n.text-26-bold, .text-26-bold-capitalize, .text-26-bold-uppercase {\n  font-weight: 700;\n}\n.text-26-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-26-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-26-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-28, .text-28-italic, .text-28-bold, .text-28-bold-capitalize, .text-28-bold-uppercase, .text-28-normal, .text-28-normal-150, .text-28-normal-uppercase {\n  font-style: normal;\n  font-size: 1.75rem;\n  line-height: 120%;\n}\n.text-28-normal, .text-28-normal-150, .text-28-normal-uppercase {\n  font-weight: normal;\n}\n.text-28-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-28-normal-150 {\n  line-height: 150%;\n}\n.text-28-bold, .text-28-bold-capitalize, .text-28-bold-uppercase {\n  font-weight: 700;\n}\n.text-28-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-28-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-28-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-36, .text-36-italic, .text-36-bold, .text-36-bold-capitalize, .text-36-bold-uppercase, .text-36-normal, .text-36-normal-150, .text-36-normal-uppercase {\n  font-style: normal;\n  font-size: 2.25rem;\n  line-height: 120%;\n}\n.text-36-normal, .text-36-normal-150, .text-36-normal-uppercase {\n  font-weight: normal;\n}\n.text-36-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-36-normal-150 {\n  line-height: 150%;\n}\n.text-36-bold, .text-36-bold-capitalize, .text-36-bold-uppercase {\n  font-weight: 700;\n}\n.text-36-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-36-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-36-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n/* Card */\n.card-title-on {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1.125rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-text-bold {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-indicator {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n/* Chart */\n.chart-ticks-x-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n}\n@media only screen and (max-width : 768px) {\n  .chart-ticks-x-text {\n    font-size: 0.685rem;\n  }\n}\n\n.chart-ticks-y-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 0.9rem;\n  line-height: 120%;\n}\n@media only screen and (max-width : 768px) {\n  .chart-ticks-y-text {\n    font-size: 0.75rem;\n  }\n}\n\n/* Cozy bar */\n.cozybar {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 1.3125rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.axis {\n  color: #7b7b7b;\n}\n.axis .tick-text {\n  fill: #7b7b7b;\n}\n.axis .tick-text.tick-text-selected {\n  fill: #e0e0e0;\n}\n.axis .separator {\n  text-align: center;\n  margin: 0 2px;\n  font-size: 1rem !important;\n}\n\n.value-text {\n  fill: #7b7b7b;\n}\n.value-text.selected {\n  fill: #e0e0e0;\n}\n\n.barContainer.disabled *,\n.barFill.disabled * {\n  cursor: default !important;\n}\n.barContainer:hover,\n.barFill:hover {\n  cursor: pointer;\n}\n\n.background-true {\n  opacity: 0.1;\n}\n.background-true:hover {\n  cursor: pointer;\n}\n\n.background-false {\n  opacity: 0;\n}\n\n.bar-compare-ELECTRICITY:hover,\n.bar-compare-GAS:hover,\n.bar-compare-WATER:hover,\n.bar-compare-MULTIFLUID:hover,\n.bar-MULTIFLUID:hover,\n.bar-WATER:hover,\n.bar-GAS:hover,\n.bar-ELECTRICITY:hover {\n  cursor: pointer;\n}\n.bar-compare-ELECTRICITY:hover.disabled,\n.bar-compare-GAS:hover.disabled,\n.bar-compare-WATER:hover.disabled,\n.bar-compare-MULTIFLUID:hover.disabled,\n.bar-MULTIFLUID:hover.disabled,\n.bar-WATER:hover.disabled,\n.bar-GAS:hover.disabled,\n.bar-ELECTRICITY:hover.disabled {\n  cursor: default;\n}\n\n.bar-ELECTRICITY {\n  fill: #5d3d2a;\n}\n.bar-ELECTRICITY.selected {\n  fill: #d87b39;\n  filter: drop-shadow(0 -0.1rem 0.2rem #d87b39);\n}\n\n.bar-compare-ELECTRICITY {\n  fill: #795c47;\n}\n.bar-compare-ELECTRICITY.selected {\n  fill: #e2bca1;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1);\n}\n\n.bar-WATER {\n  fill: #20415e;\n}\n.bar-WATER.selected {\n  fill: #3a98ec;\n  filter: drop-shadow(0 -0.1rem 0.2rem #3a98ec);\n}\n\n.bar-compare-WATER {\n  fill: #4d5c6e;\n}\n.bar-compare-WATER.selected {\n  fill: #abd4fa;\n  filter: drop-shadow(0 -0.1rem 0.2rem #abd4fa);\n}\n\n.bar-GAS {\n  fill: #184940;\n}\n.bar-GAS.selected {\n  fill: #45d1b8;\n  filter: drop-shadow(0 -0.1rem 0.2rem #45d1b8);\n}\n\n.bar-compare-GAS {\n  fill: #597773;\n}\n.bar-compare-GAS.selected {\n  fill: #a8f7e9;\n  filter: drop-shadow(0 -0.1rem 0.2rem #a8f7e9);\n}\n\n.bar-MULTIFLUID {\n  fill: #705d1d;\n}\n.bar-MULTIFLUID.selected {\n  fill: #e3b82a;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n.bar-MULTIFLUID.disabled:hover {\n  cursor: default;\n}\n\n.bar-duel {\n  fill: #61f0f2;\n}\n.bar-duel.selected {\n  fill: #61f0f2;\n  filter: drop-shadow(0 -0.1rem 0.2rem #61f0f2);\n}\n.bar-duel.disabled:hover {\n  cursor: default;\n}\n\n.bar-UPCOMING {\n  fill: #7b7b7b;\n  opacity: 0.6;\n}\n.bar-UPCOMING.selected {\n  fill: #7b7b7b;\n}\n.bar-UPCOMING.disabled:hover {\n  cursor: default;\n}\n\n.bar-compare-MULTIFLUID {\n  fill: #7d6a4e;\n}\n.bar-compare-MULTIFLUID.selected {\n  fill: #ffd597;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n\n.bar-average {\n  stroke-width: 2;\n  stroke: #e3b82a;\n}\n\n.week {\n  fill: #e2bca1;\n}\n.week.selected {\n  fill: #e2bca1;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1);\n}\n\n.weekend {\n  fill: #ffd597;\n}\n.weekend.selected {\n  fill: #ffd597;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n\n.barValue {\n  outline: none;\n}\n.barValue:focus-visible {\n  outline: 1px solid;\n}\n\n/** Animation **/\n.bounce-1 {\n  animation-name: bounce-1;\n  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);\n  animation-iteration-count: 1;\n  transform-origin: bottom center;\n  transform-box: fill-box;\n}\n\n@keyframes bounce-1 {\n  0% {\n    transform: scale(0.1, 0.1);\n  }\n  28% {\n    transform: scale(0.1, 1.1);\n  }\n  45% {\n    transform: scale(0.8, 0.95);\n  }\n  55% {\n    transform: scale(1, 1);\n  }\n  65% {\n    transform: scale(1, 0.98);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n}\n.bounce-2 {\n  animation-name: bounce-2;\n  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);\n  animation-iteration-count: 1;\n  transform-origin: bottom center;\n  transform-box: fill-box;\n}\n\n@keyframes bounce-2 {\n  0% {\n    transform: scale(1, 1);\n  }\n  28% {\n    transform: scale(1, 1.1);\n  }\n  45% {\n    transform: scale(0.8, 0.95);\n  }\n  55% {\n    transform: scale(1, 1);\n  }\n  65% {\n    transform: scale(1, 0.98);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n}\n/** Animation delay **/\n.delay {\n  animation-duration: 0.4s;\n}\n\n.delay--0 {\n  animation-duration: 0.4s;\n}\n\n.delay--1 {\n  animation-duration: 0.48s;\n}\n\n.delay--2 {\n  animation-duration: 0.56s;\n}\n\n.delay--3 {\n  animation-duration: 0.64s;\n}\n\n.delay--4 {\n  animation-duration: 0.72s;\n}\n\n.delay--5 {\n  animation-duration: 0.8s;\n}\n\n.delay--6 {\n  animation-duration: 0.88s;\n}\n\n.delay--7 {\n  animation-duration: 0.96s;\n}\n\n.delay--8 {\n  animation-duration: 1.04s;\n}\n\n.delay--9 {\n  animation-duration: 1.12s;\n}\n\n.delay--10 {\n  animation-duration: 1.2s;\n}\n\n.delay--11 {\n  animation-duration: 1.28s;\n}\n\n.delay--12 {\n  animation-duration: 1.36s;\n}\n\n.delay--13 {\n  animation-duration: 1.44s;\n}\n\n.delay--14 {\n  animation-duration: 1.52s;\n}\n\n.delay--15 {\n  animation-duration: 1.6s;\n}\n\n.delay--16 {\n  animation-duration: 1.68s;\n}\n\n.delay--17 {\n  animation-duration: 1.76s;\n}\n\n.delay--18 {\n  animation-duration: 1.84s;\n}\n\n.delay--19 {\n  animation-duration: 1.92s;\n}\n\n.delay--20 {\n  animation-duration: 2s;\n}\n\n.delay--21 {\n  animation-duration: 2.08s;\n}\n\n.delay--22 {\n  animation-duration: 2.16s;\n}\n\n.delay--23 {\n  animation-duration: 2.24s;\n}\n\n.delay--24 {\n  animation-duration: 2.32s;\n}\n\n.delay--25 {\n  animation-duration: 2.4s;\n}\n\n.delay--26 {\n  animation-duration: 2.48s;\n}\n\n.delay--27 {\n  animation-duration: 2.56s;\n}\n\n.delay--28 {\n  animation-duration: 2.64s;\n}\n\n.delay--29 {\n  animation-duration: 2.72s;\n}\n\n.delay--30 {\n  animation-duration: 2.8s;\n}\n\n.delay--31 {\n  animation-duration: 2.88s;\n}\n\n.delay--32 {\n  animation-duration: 2.96s;\n}\n\n.delay--33 {\n  animation-duration: 3.04s;\n}\n\n.delay--34 {\n  animation-duration: 3.12s;\n}\n\n.delay--35 {\n  animation-duration: 3.2s;\n}\n\n.delay--36 {\n  animation-duration: 3.28s;\n}\n\n.delay--37 {\n  animation-duration: 3.36s;\n}\n\n.delay--38 {\n  animation-duration: 3.44s;\n}\n\n.delay--39 {\n  animation-duration: 3.52s;\n}\n\n.delay--40 {\n  animation-duration: 3.6s;\n}\n\n.delay--41 {\n  animation-duration: 3.68s;\n}\n\n.delay--42 {\n  animation-duration: 3.76s;\n}\n\n.delay--43 {\n  animation-duration: 3.84s;\n}\n\n.delay--44 {\n  animation-duration: 3.92s;\n}\n\n.delay--45 {\n  animation-duration: 4s;\n}\n\n.delay--46 {\n  animation-duration: 4.08s;\n}\n\n.delay--47 {\n  animation-duration: 4.16s;\n}\n\n.delay--48 {\n  animation-duration: 4.24s;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\nbutton span {\n  font-size: 1rem;\n  font-weight: 700;\n}\nbutton.btnPrimary {\n  background: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(226, 137, 4, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #f1c017;\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnPrimary span:first-child {\n  color: #121212;\n}\nbutton.btnPrimary:hover, button.btnPrimary:focus, button.btnPrimary.active, button.btnPrimary:disabled {\n  background-color: #b89318;\n}\nbutton.btnPrimary:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnSecondary {\n  background: transparent;\n  border: 1px solid;\n  border-color: #e0e0e0;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnSecondary span:first-child {\n  color: #e0e0e0;\n}\nbutton.btnSecondary:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnText {\n  text-decoration: underline;\n}\nbutton.btnText span {\n  text-transform: none;\n  font-weight: 400;\n}\nbutton.btnPrimaryNegative {\n  background: linear-gradient(180deg, #61f0f2 0%, #48c2c4 100%);\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnPrimaryNegative span:first-child {\n  color: #121212;\n}\nbutton.btnPrimaryNegative:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnPrimaryNegative:hover {\n  opacity: 0.7;\n}\nbutton.btnIncrement {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n  min-width: 40px;\n  width: 40px;\n  height: 40px;\n  border-radius: 4px;\n  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.55);\n}\nbutton.btnIncrement span:first-child {\n  color: #ffffff;\n}\nbutton.btnIncrement:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ninput.inputText,\ninput.inputNumber {\n  box-sizing: border-box;\n  border: 1px solid #7b7b7b;\n  background: transparent;\n  transition: all 300ms ease;\n  color: #e0e0e0;\n}\ninput.inputText:focus, input.inputText:focus-visible,\ninput.inputNumber:focus,\ninput.inputNumber:focus-visible {\n  border-color: #e3b82a;\n  outline: none;\n}\n\ninput.inputText {\n  appearance: none;\n  border-radius: 4px;\n  height: 45px;\n  width: 100%;\n  max-width: 280px;\n  padding: 0 0.5rem;\n}\n\ninput.inputNumber {\n  border-radius: 2px;\n  height: 40px;\n  width: 60px;\n  max-width: 5rem;\n  text-align: center;\n}\n\ninput.inputCheckbox {\n  width: 24px;\n  min-width: 24px;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  border-radius: 4px;\n  cursor: pointer;\n  appearance: none;\n  background: #121212;\n  position: relative;\n  border: solid 1px #7b7b7b;\n}\ninput.inputCheckbox:checked {\n  background: #e3b82a;\n  border-color: #e3b82a;\n}\ninput.inputCheckbox:checked:before, input.inputCheckbox:checked:after {\n  content: \"\";\n  position: absolute;\n  display: inline-block;\n  background: #121212;\n  border-radius: 0.5rem;\n}\ninput.inputCheckbox:checked:before {\n  width: 3px;\n  height: 12px;\n  left: 10px;\n  top: 4px;\n  transform: rotate(41deg);\n}\ninput.inputCheckbox:checked:after {\n  width: 3px;\n  height: 6px;\n  left: 5px;\n  top: 8px;\n  transform: rotate(133deg);\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.card {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  box-sizing: border-box;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);\n  border-radius: 4px;\n  padding: 16px;\n}\n.card:hover {\n  background: linear-gradient(180deg, rgba(70, 71, 77, 0.7) 0%, rgba(57, 58, 63, 0.7) 100%);\n}\n.card.rich-card {\n  padding: 16px;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.modal-root .MuiBackdrop-root {\n  background-color: hsla(231deg, 11%, 12%, 0.85);\n}\n\ndiv.modal-paper {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  width: 36rem;\n  max-width: 100%;\n  max-height: 90vh;\n  padding: 2rem;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  margin: 0 0 0 13.75rem;\n  align-items: center;\n  color: #ffffff;\n}\n@media only screen and (max-width : 1023px) {\n  div.modal-paper {\n    width: 35rem;\n    margin: 0;\n  }\n}\n@media only screen and (max-width : 768px) {\n  div.modal-paper {\n    padding: 1rem 1rem 1.5rem;\n    width: 85%;\n    max-width: 35rem;\n    margin: 0;\n  }\n}\ndiv.modal-paper.no-padding {\n  padding: 0;\n}\ndiv.modal-paper.blue-border {\n  border: 1px solid rgba(88, 255, 255, 0.2509803922);\n}\ndiv.modal-paper.blue-light-border {\n  border: 1px solid #61f0f2;\n}\ndiv.modal-paper.yellow-border {\n  border: 1px solid rgba(227, 184, 42, 0.4);\n}\ndiv.modal-paper .modal-paper-close-button {\n  position: absolute;\n  top: 0.5rem;\n  right: 0.5rem;\n  padding: 5px 5px;\n  z-index: 10;\n}\n\ndiv.modal-paper-full-screen {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  width: 100%;\n  max-width: 100%;\n  height: 100%;\n  max-height: 100%;\n  padding: 0;\n  margin: 0;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  color: #ffffff;\n  display: flex;\n  align-items: center;\n}\ndiv.modal-paper-full-screen.dark-background {\n  background: #121212;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.expansion-panel-root {\n  margin: 1.2rem 0;\n  color: #e0e0e0;\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border-radius: 4px;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);\n  transition: background-color 0.6s ease;\n  box-sizing: border-box;\n}\ndiv.expansion-panel-root.Mui-expanded:first-child {\n  margin: 1.2rem 0;\n}\ndiv.expansion-panel-root.Mui-expanded:last-child {\n  margin: 1.2rem 0;\n}\ndiv.expansion-panel-root.red-border {\n  border: 1px solid #d25959;\n}\n\ndiv.expansion-panel-summary {\n  padding: 0.25rem 1.2rem;\n  min-height: 4rem;\n}\ndiv.expansion-panel-summary.Mui-focused {\n  border-radius: 4px;\n  background-color: unset;\n  box-shadow: 0 0 0 1px #e0e0e0;\n}\ndiv.expansion-panel-summary.Mui-expanded {\n  min-height: 4rem;\n}\ndiv.expansion-panel-summary.Mui-expanded.small {\n  min-height: 3rem;\n}\ndiv.expansion-panel-summary.small {\n  padding: 0 1.2rem;\n  min-height: 3rem;\n}\ndiv.expansion-panel-summary.bold-text {\n  font-weight: bold;\n}\n\ndiv.expansion-panel-content {\n  display: flex;\n  align-items: center;\n}\ndiv.expansion-panel-content.Mui-expanded {\n  margin: 0.75rem 0;\n}\n\ndiv.expansion-panel-details {\n  padding: 0 1.2rem 1.2rem;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\na {\n  color: #deaf0e;\n}\na:visited {\n  color: #deaf0e;\n}\n\na:focus {\n  outline: none;\n  box-shadow: inset 0 0 0 1px #e0e0e0;\n}\na:focus > div:first-child {\n  box-shadow: 0 0 0 1px #e0e0e0;\n}\n\na.MuiLink-underlineHover:hover {\n  text-decoration: none;\n}\n\na.MuiTypography-colorPrimary {\n  color: #e0e0e0;\n}\n\n:root {\n  white-space: pre-line;\n  --blue: #58ffff;\n  --blue40: rgba(88, 255, 255, 0.2509803922);\n  --blueBackground: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  --blueRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  --blueRadialGradientTrans: radial-gradient(circle, #58ffff 0%, rgba(255, 255, 255, 0) 100%);\n  --elecColor: #d87b39;\n  --elecColor40: rgba(216, 123, 57, 0.4);\n  --elecCompareColor: #e2bca1;\n  --gasColor: #45d1b8;\n  --gasColor40: rgba(69, 209, 184, 0.4);\n  --gasCompareColor: #a8f7e9;\n  --waterColor: #3a98ec;\n  --waterColor40: rgba(58, 152, 236, 0.4);\n  --waterCompareColor: #abd4fa;\n  --multiColor: #e3b82a;\n  --multiCompareColor: #ffd597;\n  --redPrimary: #d25959;\n  --greyBright: #e0e0e0;\n  --greyDark: #7b7b7b;\n  --textWhite: #ffffff;\n  --softGrey: #a0a0a0;\n  --darkLight: #25262b;\n  --darkLight2: #121212;\n  --textFont: Lato, sans-serif;\n  --greyLinearGradientBackground: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  --multiColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);\n  --elecColorRadialGradientTrans: radial-gradient(circle, #d87b39 0%, rgba(255, 255, 255, 0) 100%);\n  --waterColorRadialGradientTrans: radial-gradient(circle, #3a98ec 0%, rgba(255, 255, 255, 0) 100%);\n  --gasColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);\n  --multiColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(226, 137, 4, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #f1c017;\n  --elecColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(158, 67, 2, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #d87b39;\n  --gasColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(4, 106, 88, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #45d1b8;\n  --waterColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(2, 93, 174, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #3a98ec;\n}\n\n.application {\n  overflow-x: hidden;\n  background-color: #121212;\n}\n\n.accordion-icon {\n  color: #ffffff;\n}\n\n.loaderContainer {\n  height: 80vh;\n  display: flex;\n  flex: 1;\n  justify-content: center;\n  align-items: center;\n}\n\n.makeStyles-fab-1 {\n  top: 12px;\n  left: 3rem !important;\n  width: 36px !important;\n  height: 36px !important;\n  background-color: #323339 !important;\n}\n\ninput:-webkit-autofill,\ninput:-webkit-autofill:hover,\ninput:-webkit-autofill:focus,\ninput:-webkit-autofill:active {\n  -webkit-box-shadow: 0 0 0 30px #1b1c22 inset !important;\n}", ""]);
+exports.push([module.i, "/* Cozy UI utilities classes */\n/* Cozy UI React components styles */\n/* App styles */\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\nhtml {\n  background: #121212;\n}\n\nbody {\n  background: #121212;\n  overflow: unset !important;\n  color: #e0e0e0;\n}\n\n.column {\n  display: flex;\n  flex-direction: column;\n}\n\n.row {\n  display: flex;\n  flex-direction: row;\n}\n\n.cozy-bar {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 0;\n}\n\n[role=banner] .coz-bar-container {\n  background-color: #ffffff;\n}\n@media only screen and (max-width : 768px) {\n  [role=banner] .coz-bar-container {\n    padding: 0.6rem 0 0 0;\n    background-color: unset;\n  }\n}\n\n.coz-bar-wrapper {\n  box-shadow: unset !important;\n  background: unset !important;\n}\n\n.coz-label {\n  color: #32363f;\n}\n\n.content-view-loading {\n  height: 80vh;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  color: #e0e0e0;\n}\n.content-view-loading .content-view-loading-text {\n  padding-top: 1rem;\n  margin: 0 2rem;\n  text-align: center;\n}\n.content-view-loading .content-view-loading-button {\n  max-width: 50vw;\n  margin-top: 1rem;\n}\n\n[role=main] {\n  /* width */\n  /* Track */\n  /* Handle */\n}\n[role=main]::-webkit-scrollbar {\n  width: 10px;\n}\n[role=main]::-webkit-scrollbar-track {\n  background: #3e4045;\n}\n[role=main]::-webkit-scrollbar-thumb {\n  background: #6f7074;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n* {\n  font-family: Lato, sans-serif;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np {\n  color: #a0a0a0;\n  font-family: Lato, sans-serif;\n}\n\n.home-title {\n  font-size: 1rem;\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  line-height: 120%;\n  text-transform: uppercase;\n}\n\n.app-title {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 21px;\n  line-height: 24px;\n  text-align: center;\n  letter-spacing: 0.15px;\n  color: #e0e0e0;\n  text-shadow: 0px -1px 0px #060609, 0px 1px 0px rgba(255, 255, 255, 0.07);\n}\n\n.text-10, .text-10-italic, .text-10-bold, .text-10-bold-capitalize, .text-10-bold-uppercase, .text-10-normal, .text-10-normal-150, .text-10-normal-uppercase {\n  font-style: normal;\n  font-size: 0.625rem;\n  line-height: 120%;\n}\n.text-10-normal, .text-10-normal-150, .text-10-normal-uppercase {\n  font-weight: normal;\n}\n.text-10-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-10-normal-150 {\n  line-height: 150%;\n}\n.text-10-bold, .text-10-bold-capitalize, .text-10-bold-uppercase {\n  font-weight: 700;\n}\n.text-10-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-10-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-10-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-12, .text-12-italic, .text-12-bold, .text-12-bold-capitalize, .text-12-bold-uppercase, .text-12-normal, .text-12-normal-150, .text-12-normal-uppercase {\n  font-style: normal;\n  font-size: 0.75rem;\n  line-height: 120%;\n}\n.text-12-normal, .text-12-normal-150, .text-12-normal-uppercase {\n  font-weight: normal;\n}\n.text-12-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-12-normal-150 {\n  line-height: 150%;\n}\n.text-12-bold, .text-12-bold-capitalize, .text-12-bold-uppercase {\n  font-weight: 700;\n}\n.text-12-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-12-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-12-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-13, .text-13-italic, .text-13-bold, .text-13-bold-capitalize, .text-13-bold-uppercase, .text-13-normal, .text-13-normal-150, .text-13-normal-uppercase {\n  font-style: normal;\n  font-size: 0.8125rem;\n  line-height: 120%;\n}\n.text-13-normal, .text-13-normal-150, .text-13-normal-uppercase {\n  font-weight: normal;\n}\n.text-13-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-13-normal-150 {\n  line-height: 150%;\n}\n.text-13-bold, .text-13-bold-capitalize, .text-13-bold-uppercase {\n  font-weight: 700;\n}\n.text-13-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-13-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-13-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-14, .text-14-italic, .text-14-bold, .text-14-bold-capitalize, .text-14-bold-uppercase, .text-14-normal, .text-14-normal-150, .text-14-normal-uppercase {\n  font-style: normal;\n  font-size: 0.875rem;\n  line-height: 120%;\n}\n.text-14-normal, .text-14-normal-150, .text-14-normal-uppercase {\n  font-weight: normal;\n}\n.text-14-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-14-normal-150 {\n  line-height: 150%;\n}\n.text-14-bold, .text-14-bold-capitalize, .text-14-bold-uppercase {\n  font-weight: 700;\n}\n.text-14-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-14-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-14-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-15, .text-15-italic, .text-15-bold, .text-15-bold-capitalize, .text-15-bold-uppercase, .text-15-normal, .text-15-normal-150, .text-15-normal-uppercase {\n  font-style: normal;\n  font-size: 0.938rem;\n  line-height: 120%;\n}\n.text-15-normal, .text-15-normal-150, .text-15-normal-uppercase {\n  font-weight: normal;\n}\n.text-15-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-15-normal-150 {\n  line-height: 150%;\n}\n.text-15-bold, .text-15-bold-capitalize, .text-15-bold-uppercase {\n  font-weight: 700;\n}\n.text-15-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-15-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-15-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-16, .text-16-italic, .text-16-bold, .text-16-bold-capitalize, .text-16-bold-uppercase, .text-16-normal, .text-16-normal-150, .text-16-normal-uppercase {\n  font-style: normal;\n  font-size: 1rem;\n  line-height: 120%;\n}\n.text-16-normal, .text-16-normal-150, .text-16-normal-uppercase {\n  font-weight: normal;\n}\n.text-16-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-16-normal-150 {\n  line-height: 150%;\n}\n.text-16-bold, .text-16-bold-capitalize, .text-16-bold-uppercase {\n  font-weight: 700;\n}\n.text-16-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-16-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-16-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-18, .text-18-italic, .text-18-bold, .text-18-bold-capitalize, .text-18-bold-uppercase, .text-18-normal, .text-18-normal-150, .text-18-normal-uppercase {\n  font-style: normal;\n  font-size: 1.125rem;\n  line-height: 120%;\n}\n.text-18-normal, .text-18-normal-150, .text-18-normal-uppercase {\n  font-weight: normal;\n}\n.text-18-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-18-normal-150 {\n  line-height: 150%;\n}\n.text-18-bold, .text-18-bold-capitalize, .text-18-bold-uppercase {\n  font-weight: 700;\n}\n.text-18-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-18-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-18-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-19, .text-19-italic, .text-19-bold, .text-19-bold-capitalize, .text-19-bold-uppercase, .text-19-normal, .text-19-normal-150, .text-19-normal-uppercase {\n  font-style: normal;\n  font-size: 1.188rem;\n  line-height: 120%;\n}\n.text-19-normal, .text-19-normal-150, .text-19-normal-uppercase {\n  font-weight: normal;\n}\n.text-19-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-19-normal-150 {\n  line-height: 150%;\n}\n.text-19-bold, .text-19-bold-capitalize, .text-19-bold-uppercase {\n  font-weight: 700;\n}\n.text-19-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-19-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-19-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-20, .text-20-italic, .text-20-bold, .text-20-bold-capitalize, .text-20-bold-uppercase, .text-20-normal, .text-20-normal-150, .text-20-normal-uppercase {\n  font-style: normal;\n  font-size: 1.25rem;\n  line-height: 120%;\n}\n.text-20-normal, .text-20-normal-150, .text-20-normal-uppercase {\n  font-weight: normal;\n}\n.text-20-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-20-normal-150 {\n  line-height: 150%;\n}\n.text-20-bold, .text-20-bold-capitalize, .text-20-bold-uppercase {\n  font-weight: 700;\n}\n.text-20-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-20-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-20-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-21, .text-21-italic, .text-21-bold, .text-21-bold-capitalize, .text-21-bold-uppercase, .text-21-normal, .text-21-normal-150, .text-21-normal-uppercase {\n  font-style: normal;\n  font-size: 1.313rem;\n  line-height: 120%;\n}\n.text-21-normal, .text-21-normal-150, .text-21-normal-uppercase {\n  font-weight: normal;\n}\n.text-21-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-21-normal-150 {\n  line-height: 150%;\n}\n.text-21-bold, .text-21-bold-capitalize, .text-21-bold-uppercase {\n  font-weight: 700;\n}\n.text-21-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-21-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-21-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-22, .text-22-italic, .text-22-bold, .text-22-bold-capitalize, .text-22-bold-uppercase, .text-22-normal, .text-22-normal-150, .text-22-normal-uppercase {\n  font-style: normal;\n  font-size: 1.375rem;\n  line-height: 120%;\n}\n.text-22-normal, .text-22-normal-150, .text-22-normal-uppercase {\n  font-weight: normal;\n}\n.text-22-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-22-normal-150 {\n  line-height: 150%;\n}\n.text-22-bold, .text-22-bold-capitalize, .text-22-bold-uppercase {\n  font-weight: 700;\n}\n.text-22-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-22-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-22-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-24, .text-24-italic, .text-24-bold, .text-24-bold-capitalize, .text-24-bold-uppercase, .text-24-normal, .text-24-normal-150, .text-24-normal-uppercase {\n  font-style: normal;\n  font-size: 1.5rem;\n  line-height: 120%;\n}\n.text-24-normal, .text-24-normal-150, .text-24-normal-uppercase {\n  font-weight: normal;\n}\n.text-24-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-24-normal-150 {\n  line-height: 150%;\n}\n.text-24-bold, .text-24-bold-capitalize, .text-24-bold-uppercase {\n  font-weight: 700;\n}\n.text-24-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-24-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-24-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-26, .text-26-italic, .text-26-bold, .text-26-bold-capitalize, .text-26-bold-uppercase, .text-26-normal, .text-26-normal-150, .text-26-normal-uppercase {\n  font-style: normal;\n  font-size: 1.625rem;\n  line-height: 120%;\n}\n.text-26-normal, .text-26-normal-150, .text-26-normal-uppercase {\n  font-weight: normal;\n}\n.text-26-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-26-normal-150 {\n  line-height: 150%;\n}\n.text-26-bold, .text-26-bold-capitalize, .text-26-bold-uppercase {\n  font-weight: 700;\n}\n.text-26-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-26-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-26-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-28, .text-28-italic, .text-28-bold, .text-28-bold-capitalize, .text-28-bold-uppercase, .text-28-normal, .text-28-normal-150, .text-28-normal-uppercase {\n  font-style: normal;\n  font-size: 1.75rem;\n  line-height: 120%;\n}\n.text-28-normal, .text-28-normal-150, .text-28-normal-uppercase {\n  font-weight: normal;\n}\n.text-28-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-28-normal-150 {\n  line-height: 150%;\n}\n.text-28-bold, .text-28-bold-capitalize, .text-28-bold-uppercase {\n  font-weight: 700;\n}\n.text-28-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-28-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-28-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n.text-36, .text-36-italic, .text-36-bold, .text-36-bold-capitalize, .text-36-bold-uppercase, .text-36-normal, .text-36-normal-150, .text-36-normal-uppercase {\n  font-style: normal;\n  font-size: 2.25rem;\n  line-height: 120%;\n}\n.text-36-normal, .text-36-normal-150, .text-36-normal-uppercase {\n  font-weight: normal;\n}\n.text-36-normal-uppercase {\n  text-transform: uppercase;\n}\n.text-36-normal-150 {\n  line-height: 150%;\n}\n.text-36-bold, .text-36-bold-capitalize, .text-36-bold-uppercase {\n  font-weight: 700;\n}\n.text-36-bold-uppercase {\n  text-transform: uppercase;\n}\n.text-36-bold-capitalize {\n  text-transform: capitalize;\n}\n.text-36-italic {\n  font-style: italic;\n  font-weight: normal;\n}\n\n/* Card */\n.card-title-on {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1.125rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-text-bold {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-indicator {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n.card-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n/* Chart */\n.chart-ticks-x-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 1rem;\n  line-height: 120%;\n}\n@media only screen and (max-width : 768px) {\n  .chart-ticks-x-text {\n    font-size: 0.685rem;\n  }\n}\n\n.chart-ticks-y-text {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 0.9rem;\n  line-height: 120%;\n}\n@media only screen and (max-width : 768px) {\n  .chart-ticks-y-text {\n    font-size: 0.75rem;\n  }\n}\n\n/* Cozy bar */\n.cozybar {\n  font-family: Lato, sans-serif;\n  font-style: normal;\n  font-weight: bold;\n  font-size: 1.3125rem;\n  line-height: 120%;\n  color: #e0e0e0;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.axis {\n  color: #7b7b7b;\n}\n.axis .tick-text {\n  fill: #7b7b7b;\n}\n.axis .tick-text.tick-text-selected {\n  fill: #e0e0e0;\n}\n.axis .separator {\n  text-align: center;\n  margin: 0 2px;\n  font-size: 1rem !important;\n}\n\n.value-text {\n  fill: #7b7b7b;\n}\n.value-text.selected {\n  fill: #e0e0e0;\n}\n\n.barContainer.disabled *,\n.barFill.disabled * {\n  cursor: default !important;\n}\n.barContainer:hover,\n.barFill:hover {\n  cursor: pointer;\n}\n\n.background-true {\n  opacity: 0.1;\n}\n.background-true:hover {\n  cursor: pointer;\n}\n\n.background-false {\n  opacity: 0;\n}\n\n.bar-compare-ELECTRICITY:hover,\n.bar-compare-GAS:hover,\n.bar-compare-WATER:hover,\n.bar-compare-MULTIFLUID:hover,\n.bar-MULTIFLUID:hover,\n.bar-WATER:hover,\n.bar-GAS:hover,\n.bar-ELECTRICITY:hover {\n  cursor: pointer;\n}\n.bar-compare-ELECTRICITY:hover.disabled,\n.bar-compare-GAS:hover.disabled,\n.bar-compare-WATER:hover.disabled,\n.bar-compare-MULTIFLUID:hover.disabled,\n.bar-MULTIFLUID:hover.disabled,\n.bar-WATER:hover.disabled,\n.bar-GAS:hover.disabled,\n.bar-ELECTRICITY:hover.disabled {\n  cursor: default;\n}\n\n.bar-ELECTRICITY {\n  fill: #5d3d2a;\n}\n.bar-ELECTRICITY.selected {\n  fill: #d87b39;\n  filter: drop-shadow(0 -0.1rem 0.2rem #d87b39);\n}\n\n.bar-compare-ELECTRICITY {\n  fill: #795c47;\n}\n.bar-compare-ELECTRICITY.selected {\n  fill: #e2bca1;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1);\n}\n\n.bar-WATER {\n  fill: #20415e;\n}\n.bar-WATER.selected {\n  fill: #3a98ec;\n  filter: drop-shadow(0 -0.1rem 0.2rem #3a98ec);\n}\n\n.bar-compare-WATER {\n  fill: #4d5c6e;\n}\n.bar-compare-WATER.selected {\n  fill: #abd4fa;\n  filter: drop-shadow(0 -0.1rem 0.2rem #abd4fa);\n}\n\n.bar-GAS {\n  fill: #184940;\n}\n.bar-GAS.selected {\n  fill: #45d1b8;\n  filter: drop-shadow(0 -0.1rem 0.2rem #45d1b8);\n}\n\n.bar-compare-GAS {\n  fill: #597773;\n}\n.bar-compare-GAS.selected {\n  fill: #a8f7e9;\n  filter: drop-shadow(0 -0.1rem 0.2rem #a8f7e9);\n}\n\n.bar-MULTIFLUID {\n  fill: #705d1d;\n}\n.bar-MULTIFLUID.selected {\n  fill: #e3b82a;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n.bar-MULTIFLUID.disabled:hover {\n  cursor: default;\n}\n\n.bar-duel {\n  fill: #61f0f2;\n}\n.bar-duel.selected {\n  fill: #61f0f2;\n  filter: drop-shadow(0 -0.1rem 0.2rem #61f0f2);\n}\n.bar-duel.disabled:hover {\n  cursor: default;\n}\n\n.bar-UPCOMING {\n  fill: #7b7b7b;\n  opacity: 0.6;\n}\n.bar-UPCOMING.selected {\n  fill: #7b7b7b;\n}\n.bar-UPCOMING.disabled:hover {\n  cursor: default;\n}\n\n.bar-compare-MULTIFLUID {\n  fill: #7d6a4e;\n}\n.bar-compare-MULTIFLUID.selected {\n  fill: #ffd597;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n\n.bar-average {\n  stroke-width: 2;\n  stroke: #e3b82a;\n}\n\n.week {\n  fill: #e2bca1;\n}\n.week.selected {\n  fill: #e2bca1;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1);\n}\n\n.weekend {\n  fill: #ffd597;\n}\n.weekend.selected {\n  fill: #ffd597;\n  filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a);\n}\n\n.barValue {\n  outline: none;\n}\n.barValue:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n\n/** Animation **/\n.bounce-1 {\n  animation-name: bounce-1;\n  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);\n  animation-iteration-count: 1;\n  transform-origin: bottom center;\n  transform-box: fill-box;\n}\n\n@keyframes bounce-1 {\n  0% {\n    transform: scale(0.1, 0.1);\n  }\n  28% {\n    transform: scale(0.1, 1.1);\n  }\n  45% {\n    transform: scale(0.8, 0.95);\n  }\n  55% {\n    transform: scale(1, 1);\n  }\n  65% {\n    transform: scale(1, 0.98);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n}\n.bounce-2 {\n  animation-name: bounce-2;\n  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);\n  animation-iteration-count: 1;\n  transform-origin: bottom center;\n  transform-box: fill-box;\n}\n\n@keyframes bounce-2 {\n  0% {\n    transform: scale(1, 1);\n  }\n  28% {\n    transform: scale(1, 1.1);\n  }\n  45% {\n    transform: scale(0.8, 0.95);\n  }\n  55% {\n    transform: scale(1, 1);\n  }\n  65% {\n    transform: scale(1, 0.98);\n  }\n  75% {\n    transform: scale(1, 1);\n  }\n}\n/** Animation delay **/\n.delay {\n  animation-duration: 0.4s;\n}\n\n.delay--0 {\n  animation-duration: 0.4s;\n}\n\n.delay--1 {\n  animation-duration: 0.48s;\n}\n\n.delay--2 {\n  animation-duration: 0.56s;\n}\n\n.delay--3 {\n  animation-duration: 0.64s;\n}\n\n.delay--4 {\n  animation-duration: 0.72s;\n}\n\n.delay--5 {\n  animation-duration: 0.8s;\n}\n\n.delay--6 {\n  animation-duration: 0.88s;\n}\n\n.delay--7 {\n  animation-duration: 0.96s;\n}\n\n.delay--8 {\n  animation-duration: 1.04s;\n}\n\n.delay--9 {\n  animation-duration: 1.12s;\n}\n\n.delay--10 {\n  animation-duration: 1.2s;\n}\n\n.delay--11 {\n  animation-duration: 1.28s;\n}\n\n.delay--12 {\n  animation-duration: 1.36s;\n}\n\n.delay--13 {\n  animation-duration: 1.44s;\n}\n\n.delay--14 {\n  animation-duration: 1.52s;\n}\n\n.delay--15 {\n  animation-duration: 1.6s;\n}\n\n.delay--16 {\n  animation-duration: 1.68s;\n}\n\n.delay--17 {\n  animation-duration: 1.76s;\n}\n\n.delay--18 {\n  animation-duration: 1.84s;\n}\n\n.delay--19 {\n  animation-duration: 1.92s;\n}\n\n.delay--20 {\n  animation-duration: 2s;\n}\n\n.delay--21 {\n  animation-duration: 2.08s;\n}\n\n.delay--22 {\n  animation-duration: 2.16s;\n}\n\n.delay--23 {\n  animation-duration: 2.24s;\n}\n\n.delay--24 {\n  animation-duration: 2.32s;\n}\n\n.delay--25 {\n  animation-duration: 2.4s;\n}\n\n.delay--26 {\n  animation-duration: 2.48s;\n}\n\n.delay--27 {\n  animation-duration: 2.56s;\n}\n\n.delay--28 {\n  animation-duration: 2.64s;\n}\n\n.delay--29 {\n  animation-duration: 2.72s;\n}\n\n.delay--30 {\n  animation-duration: 2.8s;\n}\n\n.delay--31 {\n  animation-duration: 2.88s;\n}\n\n.delay--32 {\n  animation-duration: 2.96s;\n}\n\n.delay--33 {\n  animation-duration: 3.04s;\n}\n\n.delay--34 {\n  animation-duration: 3.12s;\n}\n\n.delay--35 {\n  animation-duration: 3.2s;\n}\n\n.delay--36 {\n  animation-duration: 3.28s;\n}\n\n.delay--37 {\n  animation-duration: 3.36s;\n}\n\n.delay--38 {\n  animation-duration: 3.44s;\n}\n\n.delay--39 {\n  animation-duration: 3.52s;\n}\n\n.delay--40 {\n  animation-duration: 3.6s;\n}\n\n.delay--41 {\n  animation-duration: 3.68s;\n}\n\n.delay--42 {\n  animation-duration: 3.76s;\n}\n\n.delay--43 {\n  animation-duration: 3.84s;\n}\n\n.delay--44 {\n  animation-duration: 3.92s;\n}\n\n.delay--45 {\n  animation-duration: 4s;\n}\n\n.delay--46 {\n  animation-duration: 4.08s;\n}\n\n.delay--47 {\n  animation-duration: 4.16s;\n}\n\n.delay--48 {\n  animation-duration: 4.24s;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\nbutton span {\n  font-size: 1rem;\n  font-weight: 700;\n}\nbutton:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\nbutton.btnPrimary {\n  background: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(226, 137, 4, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #f1c017;\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnPrimary span:first-child {\n  color: #121212;\n}\nbutton.btnPrimary:hover, button.btnPrimary:focus, button.btnPrimary.active, button.btnPrimary:disabled {\n  background-color: #b89318;\n}\nbutton.btnPrimary:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnSecondary {\n  background: transparent;\n  border: 1px solid;\n  border-color: #e0e0e0;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnSecondary span:first-child {\n  color: #e0e0e0;\n}\nbutton.btnSecondary:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnText {\n  text-decoration: underline;\n}\nbutton.btnText span {\n  text-transform: none;\n  font-weight: 400;\n}\nbutton.btnPrimaryNegative {\n  background: linear-gradient(180deg, #61f0f2 0%, #48c2c4 100%);\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n}\nbutton.btnPrimaryNegative span:first-child {\n  color: #121212;\n}\nbutton.btnPrimaryNegative:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\nbutton.btnPrimaryNegative:hover {\n  opacity: 0.7;\n}\nbutton.btnIncrement {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border: 1px solid;\n  border-color: transparent;\n  border-radius: 2px;\n  width: 100%;\n  text-transform: initial;\n  transition: all 150ms ease-in-out;\n  min-width: 40px;\n  width: 40px;\n  height: 40px;\n  border-radius: 4px;\n  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.55);\n}\nbutton.btnIncrement span:first-child {\n  color: #ffffff;\n}\nbutton.btnIncrement:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ninput.inputText,\ninput.inputNumber {\n  box-sizing: border-box;\n  border: 1px solid #7b7b7b;\n  background: transparent;\n  transition: all 300ms ease;\n  color: #e0e0e0;\n}\n\ninput.inputText {\n  appearance: none;\n  border-radius: 4px;\n  height: 45px;\n  width: 100%;\n  max-width: 280px;\n  padding: 0 0.5rem;\n}\n\ninput.inputNumber {\n  border-radius: 2px;\n  height: 40px;\n  width: 60px;\n  max-width: 5rem;\n  text-align: center;\n}\n\ninput.inputCheckbox {\n  width: 24px;\n  min-width: 24px;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  border-radius: 4px;\n  cursor: pointer;\n  appearance: none;\n  background: #121212;\n  position: relative;\n  border: solid 1px #7b7b7b;\n}\ninput.inputCheckbox:checked {\n  background: #e3b82a;\n  border-color: #e3b82a;\n}\ninput.inputCheckbox:checked:before, input.inputCheckbox:checked:after {\n  content: \"\";\n  position: absolute;\n  display: inline-block;\n  background: #121212;\n  border-radius: 0.5rem;\n}\ninput.inputCheckbox:checked:before {\n  width: 3px;\n  height: 12px;\n  left: 10px;\n  top: 4px;\n  transform: rotate(41deg);\n}\ninput.inputCheckbox:checked:after {\n  width: 3px;\n  height: 6px;\n  left: 5px;\n  top: 8px;\n  transform: rotate(133deg);\n}\n\ninput:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\n.card {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  box-sizing: border-box;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);\n  border-radius: 4px;\n  padding: 16px;\n}\n.card:hover {\n  background: linear-gradient(180deg, rgba(70, 71, 77, 0.7) 0%, rgba(57, 58, 63, 0.7) 100%);\n}\n.card.rich-card {\n  padding: 16px;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.modal-root .MuiBackdrop-root {\n  background-color: hsla(231deg, 11%, 12%, 0.85);\n}\n\ndiv.modal-paper {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  width: 36rem;\n  max-width: 100%;\n  max-height: 90vh;\n  padding: 2rem;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  margin: 0 0 0 13.75rem;\n  align-items: center;\n  color: #ffffff;\n}\n@media only screen and (max-width : 1023px) {\n  div.modal-paper {\n    width: 35rem;\n    margin: 0;\n  }\n}\n@media only screen and (max-width : 768px) {\n  div.modal-paper {\n    padding: 1rem 1rem 1.5rem;\n    width: 85%;\n    max-width: 35rem;\n    margin: 0;\n  }\n}\ndiv.modal-paper.no-padding {\n  padding: 0;\n}\ndiv.modal-paper.blue-border {\n  border: 1px solid rgba(88, 255, 255, 0.2509803922);\n}\ndiv.modal-paper.blue-light-border {\n  border: 1px solid #61f0f2;\n}\ndiv.modal-paper.yellow-border {\n  border: 1px solid rgba(227, 184, 42, 0.4);\n}\ndiv.modal-paper .modal-paper-close-button {\n  position: absolute;\n  top: 0.5rem;\n  right: 0.5rem;\n  padding: 5px 5px;\n  z-index: 10;\n}\n\ndiv.modal-paper-full-screen {\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  width: 100%;\n  max-width: 100%;\n  height: 100%;\n  max-height: 100%;\n  padding: 0;\n  margin: 0;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);\n  border-radius: 4px;\n  color: #ffffff;\n  display: flex;\n  align-items: center;\n}\ndiv.modal-paper-full-screen.dark-background {\n  background: #121212;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\ndiv.expansion-panel-root {\n  margin: 1.2rem 0;\n  color: #e0e0e0;\n  background: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  border-radius: 4px;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);\n  transition: background-color 0.6s ease;\n  box-sizing: border-box;\n}\ndiv.expansion-panel-root.Mui-expanded:first-child {\n  margin: 1.2rem 0;\n}\ndiv.expansion-panel-root.Mui-expanded:last-child {\n  margin: 1.2rem 0;\n}\ndiv.expansion-panel-root.red-border {\n  border: 1px solid #d25959;\n}\n\ndiv.expansion-panel-summary {\n  padding: 0.25rem 1.2rem;\n  min-height: 4rem;\n}\ndiv.expansion-panel-summary.Mui-focused {\n  border-radius: 4px;\n  background-color: unset;\n  box-shadow: 0 0 0 1px #e0e0e0;\n}\ndiv.expansion-panel-summary:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\ndiv.expansion-panel-summary.Mui-expanded {\n  min-height: 4rem;\n}\ndiv.expansion-panel-summary.Mui-expanded.small {\n  min-height: 3rem;\n}\ndiv.expansion-panel-summary.small {\n  padding: 0 1.2rem;\n  min-height: 3rem;\n}\ndiv.expansion-panel-summary.bold-text {\n  font-weight: bold;\n}\n\ndiv.expansion-panel-content {\n  display: flex;\n  align-items: center;\n}\ndiv.expansion-panel-content.Mui-expanded {\n  margin: 0.75rem 0;\n}\n\ndiv.expansion-panel-details {\n  padding: 0 1.2rem 1.2rem;\n}\n\n/** BLACK **/\n/** RED **/\n/** YELLOW **/\n/** ORANGE **/\n/** BLUE **/\n/** GREEN **/\n/** WHITE **/\n/** GREY **/\n/** App colors **/\n/** TABS GRADIENT **/\n/** SCROLLBAR **/\na {\n  color: #deaf0e;\n}\na:visited {\n  color: #deaf0e;\n}\n\na:focus {\n  outline: none;\n  box-shadow: inset 0 0 0 1px #e0e0e0;\n}\na:focus > div:first-child {\n  box-shadow: 0 0 0 1px #e0e0e0;\n}\n\na:focus-visible {\n  outline: 2px solid #1b8bff;\n  outline-offset: 2px;\n}\n\na.MuiLink-underlineHover:hover {\n  text-decoration: none;\n}\n\na.MuiTypography-colorPrimary {\n  color: #e0e0e0;\n}\n\n:root {\n  white-space: pre-line;\n  --blue: #58ffff;\n  --blue40: rgba(88, 255, 255, 0.2509803922);\n  --blueBackground: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  --blueRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(1, 153, 163, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #58ffff;\n  --blueRadialGradientTrans: radial-gradient(circle, #58ffff 0%, rgba(255, 255, 255, 0) 100%);\n  --elecColor: #d87b39;\n  --elecColor40: rgba(216, 123, 57, 0.4);\n  --elecCompareColor: #e2bca1;\n  --gasColor: #45d1b8;\n  --gasColor40: rgba(69, 209, 184, 0.4);\n  --gasCompareColor: #a8f7e9;\n  --waterColor: #3a98ec;\n  --waterColor40: rgba(58, 152, 236, 0.4);\n  --waterCompareColor: #abd4fa;\n  --multiColor: #e3b82a;\n  --multiCompareColor: #ffd597;\n  --redPrimary: #d25959;\n  --greyBright: #e0e0e0;\n  --greyDark: #7b7b7b;\n  --textWhite: #ffffff;\n  --softGrey: #a0a0a0;\n  --darkLight: #25262b;\n  --darkLight2: #121212;\n  --textFont: Lato, sans-serif;\n  --greyLinearGradientBackground: linear-gradient(180deg, #323339 0%, #25262b 100%);\n  --multiColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);\n  --elecColorRadialGradientTrans: radial-gradient(circle, #d87b39 0%, rgba(255, 255, 255, 0) 100%);\n  --waterColorRadialGradientTrans: radial-gradient(circle, #3a98ec 0%, rgba(255, 255, 255, 0) 100%);\n  --gasColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);\n  --multiColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(226, 137, 4, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #f1c017;\n  --elecColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(158, 67, 2, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #d87b39;\n  --gasColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(4, 106, 88, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #45d1b8;\n  --waterColorRadialGradient: radial-gradient(105.25% 64.58% at 49.68% 70.83%, rgba(2, 93, 174, 0.5) 0%, rgba(255, 255, 255, 0) 100%), #3a98ec;\n}\n\n.application {\n  overflow-x: hidden;\n  background-color: #121212;\n}\n\n.accordion-icon {\n  color: #ffffff;\n}\n\n.loaderContainer {\n  height: 80vh;\n  display: flex;\n  flex: 1;\n  justify-content: center;\n  align-items: center;\n}\n\n.makeStyles-fab-1 {\n  top: 12px;\n  left: 3rem !important;\n  width: 36px !important;\n  height: 36px !important;\n  background-color: #323339 !important;\n}\n\ninput:-webkit-autofill,\ninput:-webkit-autofill:hover,\ninput:-webkit-autofill:focus,\ninput:-webkit-autofill:active {\n  -webkit-box-shadow: 0 0 0 30px #1b1c22 inset !important;\n}", ""]);
 
 
 
diff --git a/public/index.html b/public/index.html
index 57c23ccd4ffffdbeff67ae21399519c8cc9a3298..739f40e455f12f2c6fa99cfc77f9dffa1e77f3da 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html lang="{{.Locale}}"><head><meta charset="utf-8"><title>Ecolyo | Désabonnement</title><link rel="icon" type="image/png" href="public/favicon-32x32.png" sizes="32x32"><link rel="icon" type="image/png" href="public/favicon-16x16.png" sizes="16x16"><!-- PWA Manifest --><link rel="mask-icon" href="public/safari-pinned-tab.svg" color="#297EF2"><meta name="viewport" content="width=device-width,height=device-height,initial-scale=1,viewport-fit=cover"><!-- PWA iOS --><link rel="apple-touch-icon" sizes="180x180" href="public/apple-touch-icon.png"><link rel="apple-touch-startup-image" href="public/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="../public/ecolyo.6951db4860abd9716b36.js"></script></div></body></html>
\ No newline at end of file
+<!DOCTYPE html><html lang="{{.Locale}}"><head><meta charset="utf-8"><title>Ecolyo | Désabonnement</title><link rel="icon" type="image/png" href="public/favicon-32x32.png" sizes="32x32"><link rel="icon" type="image/png" href="public/favicon-16x16.png" sizes="16x16"><!-- PWA Manifest --><link rel="mask-icon" href="public/safari-pinned-tab.svg" color="#297EF2"><meta name="viewport" content="width=device-width,height=device-height,initial-scale=1,viewport-fit=cover"><!-- PWA iOS --><link rel="apple-touch-icon" sizes="180x180" href="public/apple-touch-icon.png"><link rel="apple-touch-startup-image" href="public/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="../public/ecolyo.2e18443e51db3fdcaa90.js"></script></div></body></html>
\ No newline at end of file