diff --git a/src/styles/index.css b/src/styles/index.css
index 3aff13885abc083392dad521784ad891412a1777..2a9a12baeb23acd28be0eab338ccdd2841fed2e7 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -15,92 +15,141 @@
/** App colors **/
/** TABS GRADIENT **/
/* line 4, src/styles/base/_layout.scss */
+html {
+ background: #1b1c22; }
+
+/* line 8, src/styles/base/_layout.scss */
body {
background: #1b1c22;
overflow: unset !important; }
-/* line 9, src/styles/base/_layout.scss */
+/* line 13, src/styles/base/_layout.scss */
.column {
display: flex;
flex-direction: column; }
-/* line 14, src/styles/base/_layout.scss */
+/* line 18, src/styles/base/_layout.scss */
.row {
display: flex;
flex-direction: row; }
-/* line 19, src/styles/base/_layout.scss */
+/* line 23, src/styles/base/_layout.scss */
.cozy-bar {
width: 100%;
display: flex;
align-items: center;
justify-content: center; }
-/* line 26, src/styles/base/_layout.scss */
+/* line 30, src/styles/base/_layout.scss */
+[role='banner'] .coz-bar-container {
+ padding: 0 3.25em 0 0;
+ background-color: white; }
+ @media only screen and (max-width: 768px) {
+ /* line 30, src/styles/base/_layout.scss */
+ [role='banner'] .coz-bar-container {
+ background-color: unset; } }
+
+/* line 38, src/styles/base/_layout.scss */
.coz-bar-wrapper {
- box-shadow: unset !important; }
+ box-shadow: unset !important;
+ background: unset !important; }
-/* line 30, src/styles/base/_layout.scss */
+/* line 43, src/styles/base/_layout.scss */
.header {
display: flex;
align-items: center;
flex-direction: column;
overflow: hidden;
width: 100%;
- z-index: 20;
+ z-index: 18;
position: fixed;
- top: 0;
+ top: 48px;
left: 0; }
- /* line 40, src/styles/base/_layout.scss */
+ @media only screen and (max-width: 768px) {
+ /* line 43, src/styles/base/_layout.scss */
+ .header {
+ top: 0; } }
+ /* line 56, src/styles/base/_layout.scss */
.header .header-bar {
background: linear-gradient(180deg, #000000 0%, rgba(27, 28, 34, 0) 70%);
height: 8px;
- width: 100vw; }
- /* line 45, src/styles/base/_layout.scss */
+ width: 100%; }
+ /* line 61, src/styles/base/_layout.scss */
.header .header-top {
background: radial-gradient(74.83% 76.97% at 50% 13.64%, #343641 0%, #1b1c22 100%);
width: 100%; }
- /* line 52, src/styles/base/_layout.scss */
+ /* line 68, src/styles/base/_layout.scss */
.header .header-top .header-text {
padding: 0 1rem 1rem 1rem;
color: #e0e0e0; }
- /* line 57, src/styles/base/_layout.scss */
+ /* line 73, src/styles/base/_layout.scss */
.header .header-content {
- margin: 60px 0 0 0; }
+ margin: 0 0 0 220px; }
+ /* line 75, src/styles/base/_layout.scss */
+ .header .header-content .header-text {
+ padding: 2rem 1rem; }
+ /* line 78, src/styles/base/_layout.scss */
+ .header .header-content .header-text-desktop {
+ display: block;
+ padding: 2rem 1.25rem;
+ color: #e0e0e0; }
+ @media only screen and (max-width: 1023px) {
+ /* line 73, src/styles/base/_layout.scss */
+ .header .header-content {
+ margin: 0; } }
+ @media only screen and (max-width: 768px) {
+ /* line 73, src/styles/base/_layout.scss */
+ .header .header-content {
+ margin: 60px 0 0 0; }
+ /* line 88, src/styles/base/_layout.scss */
+ .header .header-content .header-text {
+ padding: 0 1rem 1rem 1rem;
+ color: #e0e0e0; }
+ /* line 92, src/styles/base/_layout.scss */
+ .header .header-content .header-text-desktop {
+ display: none; } }
-/* line 70, src/styles/base/_layout.scss */
+/* line 99, src/styles/base/_layout.scss */
+.content-view {
+ margin-top: 116px; }
+ @media only screen and (max-width: 768px) {
+ /* line 99, src/styles/base/_layout.scss */
+ .content-view {
+ margin-top: 0; } }
+
+/* line 106, src/styles/base/_layout.scss */
.content-view-loading {
height: 80vh;
- width: 100vw;
+ width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: #e0e0e0; }
- /* line 78, src/styles/base/_layout.scss */
+ /* line 114, src/styles/base/_layout.scss */
.content-view-loading .content-view-loading-text {
padding-top: 1rem;
margin: 0 2rem;
text-align: center; }
- /* line 83, src/styles/base/_layout.scss */
+ /* line 119, src/styles/base/_layout.scss */
.content-view-loading .content-view-loading-button {
max-width: 50vw;
margin-top: 1rem; }
-/* width */
-/* line 90, src/styles/base/_layout.scss */
-::-webkit-scrollbar {
- width: 10px; }
-
-/* Track */
-/* line 94, src/styles/base/_layout.scss */
-::-webkit-scrollbar-track {
- background: #3E4045; }
-
-/* Handle */
-/* line 98, src/styles/base/_layout.scss */
-::-webkit-scrollbar-thumb {
- background: #6F7074; }
+/* line 125, src/styles/base/_layout.scss */
+[role='main'] {
+ /* width */
+ /* Track */
+ /* Handle */ }
+ /* line 127, src/styles/base/_layout.scss */
+ [role='main']::-webkit-scrollbar {
+ width: 10px; }
+ /* line 131, src/styles/base/_layout.scss */
+ [role='main']::-webkit-scrollbar-track {
+ background: #3e4045; }
+ /* line 135, src/styles/base/_layout.scss */
+ [role='main']::-webkit-scrollbar-thumb {
+ background: #6f7074; }
/** BLACK **/
/** TEXT COLOR **/
@@ -470,7 +519,15 @@ p {
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
-/* line 4, src/styles/components/_card.scss */
+/* line 5, src/styles/components/_card.scss */
+.redirect-card-link {
+ color: transparent; }
+
+/* line 8, src/styles/components/_card.scss */
+.redirect-card-content {
+ margin: 0.25rem 0; }
+
+/* line 14, src/styles/components/_card.scss */
.card {
/* linear card */
background: linear-gradient(180deg, #323339 0%, #25262b 100%);
@@ -482,48 +539,48 @@ p {
margin: 2vh 2vw 2vh 0vw;
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75); }
@media only screen and (max-width: 768px) {
- /* line 4, src/styles/components/_card.scss */
+ /* line 14, src/styles/components/_card.scss */
.card {
margin: 2vh 0; } }
- /* line 17, src/styles/components/_card.scss */
+ /* line 27, src/styles/components/_card.scss */
.card.orange {
border: 1px solid rgba(216, 123, 57, 0.4); }
- /* line 20, src/styles/components/_card.scss */
+ /* line 30, src/styles/components/_card.scss */
.card.blue {
border: 1px solid rgba(58, 152, 236, 0.4); }
- /* line 23, src/styles/components/_card.scss */
+ /* line 33, src/styles/components/_card.scss */
.card.green {
border: 1px solid rgba(69, 209, 184, 0.4); }
- /* line 26, src/styles/components/_card.scss */
+ /* line 36, src/styles/components/_card.scss */
.card .title {
font-size: 1.5rem;
font-style: normal;
font-weight: normal;
color: #e0e0e0;
line-height: 120%; }
- /* line 33, src/styles/components/_card.scss */
+ /* line 43, src/styles/components/_card.scss */
.card h1 {
font-size: 1rem;
font-style: normal;
font-weight: normal;
line-height: 120%;
color: white; }
- /* line 40, src/styles/components/_card.scss */
+ /* line 50, src/styles/components/_card.scss */
.card p {
font-style: normal;
font-weight: normal;
font-size: 1rem;
line-height: 120%; }
- /* line 46, src/styles/components/_card.scss */
+ /* line 56, src/styles/components/_card.scss */
.card .card-header {
flex-direction: row;
display: flex;
justify-content: left;
padding: 0.75rem 0rem; }
- /* line 51, src/styles/components/_card.scss */
+ /* line 61, src/styles/components/_card.scss */
.card .card-header div:first-of-type {
margin-left: 3.5vw; }
- /* line 54, src/styles/components/_card.scss */
+ /* line 64, src/styles/components/_card.scss */
.card .card-header h2 {
margin: 0;
color: #e0e0e0;
@@ -531,12 +588,12 @@ p {
font-weight: normal;
font-size: 2rem;
line-height: 120%; }
- /* line 61, src/styles/components/_card.scss */
+ /* line 71, src/styles/components/_card.scss */
.card .card-header h2 span {
color: #e0e0e0;
font-weight: 600;
font-size: 2.3rem; }
- /* line 67, src/styles/components/_card.scss */
+ /* line 77, src/styles/components/_card.scss */
.card .card-header h3 {
margin: 0;
font-style: normal;
@@ -579,26 +636,25 @@ p {
/* line 23, src/styles/components/_form.scss */
.form .form-group {
display: flex;
- flex-direction: column;
- margin: 0.5vw 0 0.5vw 0; }
- /* line 27, src/styles/components/_form.scss */
+ flex-direction: column; }
+ /* line 26, src/styles/components/_form.scss */
.form .form-group .form-trailing-icon {
float: right;
position: relative;
margin-top: -48px;
margin-right: 15px; }
- /* line 34, src/styles/components/_form.scss */
+ /* line 33, src/styles/components/_form.scss */
.form .form-control {
height: 3rem; }
@media only screen and (max-width: 768px) {
- /* line 34, src/styles/components/_form.scss */
+ /* line 33, src/styles/components/_form.scss */
.form .form-control {
max-width: 100vw; } }
- /* line 40, src/styles/components/_form.scss */
+ /* line 39, src/styles/components/_form.scss */
.form .form-message {
color: #ce3535;
min-height: 1.25rem; }
- /* line 44, src/styles/components/_form.scss */
+ /* line 43, src/styles/components/_form.scss */
.form ::placeholder {
color: #e0e0e0; }
@@ -761,93 +817,93 @@ p {
/* line 14, src/styles/components/_konnector.scss */
.accordion.active {
background-color: #34353a; }
- /* line 17, src/styles/components/_konnector.scss */
+ /* line 18, src/styles/components/_konnector.scss */
.accordion .accordion-header {
display: flex;
align-items: center;
border: none;
outline: none; }
- /* line 22, src/styles/components/_konnector.scss */
+ /* line 23, src/styles/components/_konnector.scss */
+ .accordion .accordion-header:hover {
+ cursor: pointer; }
+ /* line 26, src/styles/components/_konnector.scss */
.accordion .accordion-header .accordion-icon {
margin-right: 1rem; }
@media only screen and (max-width: 768px) {
- /* line 22, src/styles/components/_konnector.scss */
+ /* line 26, src/styles/components/_konnector.scss */
.accordion .accordion-header .accordion-icon {
max-width: 16vw; } }
- /* line 28, src/styles/components/_konnector.scss */
+ /* line 32, src/styles/components/_konnector.scss */
.accordion .accordion-header .accordion-info {
flex: 3;
color: #e0e0e0; }
@media only screen and (max-width: 768px) {
- /* line 28, src/styles/components/_konnector.scss */
+ /* line 32, src/styles/components/_konnector.scss */
.accordion .accordion-header .accordion-info {
display: block; } }
- /* line 34, src/styles/components/_konnector.scss */
+ /* line 38, src/styles/components/_konnector.scss */
.accordion .accordion-header .accordion-info .accordion-title {
flex: 1; }
- /* line 41, src/styles/components/_konnector.scss */
+ /* line 45, src/styles/components/_konnector.scss */
.accordion .accordion-header .state-picto {
position: absolute; }
- /* line 45, src/styles/components/_konnector.scss */
+ /* line 49, src/styles/components/_konnector.scss */
.accordion .accordion-update {
flex: 2;
padding: 0.5rem 1rem; }
- /* line 49, src/styles/components/_konnector.scss */
+ /* line 53, src/styles/components/_konnector.scss */
.accordion .accordion-state {
flex: 2;
margin-right: 1rem; }
- /* line 53, src/styles/components/_konnector.scss */
+ /* line 57, src/styles/components/_konnector.scss */
.accordion .accordion-frequency {
flex: 1;
padding: 0 1rem; }
- /* line 57, src/styles/components/_konnector.scss */
+ /* line 61, src/styles/components/_konnector.scss */
.accordion .accordion-caption {
font-size: 0.8rem;
color: #a0a0a0;
text-transform: lowercase; }
- /* line 61, src/styles/components/_konnector.scss */
+ /* line 65, src/styles/components/_konnector.scss */
.accordion .accordion-caption::first-letter {
text-transform: uppercase; }
- /* line 65, src/styles/components/_konnector.scss */
+ /* line 69, src/styles/components/_konnector.scss */
.accordion .accordion-caption-red {
color: #ce3535; }
- /* line 68, src/styles/components/_konnector.scss */
+ /* line 72, src/styles/components/_konnector.scss */
.accordion .accordion-content {
overflow: hidden;
transition: max-height 0.6s ease; }
- /* line 72, src/styles/components/_konnector.scss */
+ /* line 76, src/styles/components/_konnector.scss */
.accordion .inline-buttons {
display: flex;
flex-flow: row nowrap; }
- /* line 76, src/styles/components/_konnector.scss */
+ /* line 80, src/styles/components/_konnector.scss */
.accordion .btn-position {
width: 100%;
margin: 0.5rem 1rem; }
-/* line 82, src/styles/components/_konnector.scss */
+/* line 86, src/styles/components/_konnector.scss */
.kv-root {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
- padding: 1rem 1.5rem; }
- /* line 88, src/styles/components/_konnector.scss */
+ padding: 0 1.5rem; }
+ /* line 92, src/styles/components/_konnector.scss */
.kv-root .kv-content {
- width: 53.125rem; }
- @media only screen and (max-width: 992px) {
- /* line 88, src/styles/components/_konnector.scss */
- .kv-root .kv-content {
- width: 47.5rem; } }
+ width: 45.75rem; }
@media only screen and (max-width: 768px) {
- /* line 88, src/styles/components/_konnector.scss */
+ /* line 92, src/styles/components/_konnector.scss */
.kv-root .kv-content {
width: 100%; } }
- /* line 96, src/styles/components/_konnector.scss */
+ /* line 97, src/styles/components/_konnector.scss */
.kv-root .kv-content .kv-header {
- color: #e0e0e0;
- padding-bottom: 1rem; }
+ margin-top: 2.5rem;
+ margin-bottom: 1.25rem;
+ color: #e0e0e0; }
-/* line 103, src/styles/components/_konnector.scss */
+/* line 105, src/styles/components/_konnector.scss */
.state-icon {
height: 20px;
width: 20px; }
@@ -932,38 +988,50 @@ p {
/* line 71, src/styles/components/_fluid.scss */
.fv-root .fv-footer {
display: flex;
- flex-direction: row;
- justify-content: flex-end;
- align-items: center; }
- /* line 76, src/styles/components/_fluid.scss */
- .fv-root .fv-footer :hover {
- cursor: pointer; }
- /* line 79, src/styles/components/_fluid.scss */
- .fv-root .fv-footer .fv-footer-label {
- flex: 1;
+ justify-content: center; }
+ /* line 74, src/styles/components/_fluid.scss */
+ .fv-root .fv-footer .fv-footer-compare {
+ width: 100%;
+ max-width: 58.75rem;
display: flex;
- justify-content: flex-start;
- color: #a0a0a0; }
- /* line 84, src/styles/components/_fluid.scss */
- .fv-root .fv-footer .fv-footer-label.selected {
- color: #ffffff; }
- /* line 88, src/styles/components/_fluid.scss */
- .fv-root .fv-footer .fv-footer-label-padding {
- flex: 1;
+ flex-direction: row;
+ align-items: center; }
+ /* line 80, src/styles/components/_fluid.scss */
+ .fv-root .fv-footer .fv-footer-compare :hover {
+ cursor: pointer; }
+ /* line 83, src/styles/components/_fluid.scss */
+ .fv-root .fv-footer .fv-footer-compare .fv-footer-label {
+ flex: 1;
+ display: flex;
+ justify-content: flex-start;
+ color: #a0a0a0; }
+ /* line 88, src/styles/components/_fluid.scss */
+ .fv-root .fv-footer .fv-footer-compare .fv-footer-label.selected {
+ color: #ffffff; }
+ /* line 94, src/styles/components/_fluid.scss */
+ .fv-root .fv-footer .fv-footer-challenge {
+ width: 100%;
+ max-width: 58.75rem;
display: flex;
- justify-content: flex-start;
- padding-left: 0.75rem;
- color: #a0a0a0; }
+ flex-direction: row;
+ align-items: center; }
+ /* line 100, src/styles/components/_fluid.scss */
+ .fv-root .fv-footer .fv-footer-challenge .fv-footer-label-padding {
+ flex: 1;
+ display: flex;
+ justify-content: flex-start;
+ padding-left: 0.75rem;
+ color: #a0a0a0; }
-/* line 99, src/styles/components/_fluid.scss */
+/* line 112, src/styles/components/_fluid.scss */
.fs-root {
flex: 1;
height: 22rem; }
@media only screen and (max-width: 768px) {
- /* line 99, src/styles/components/_fluid.scss */
+ /* line 112, src/styles/components/_fluid.scss */
.fs-root {
height: 14rem; } }
- /* line 105, src/styles/components/_fluid.scss */
+ /* line 118, src/styles/components/_fluid.scss */
.fs-root .fs-slide {
min-height: 22rem;
overflow-x: hidden;
@@ -971,7 +1039,7 @@ p {
justify-content: center;
align-items: center; }
@media only screen and (max-width: 768px) {
- /* line 105, src/styles/components/_fluid.scss */
+ /* line 118, src/styles/components/_fluid.scss */
.fs-root .fs-slide {
min-height: 14rem; } }
@@ -986,28 +1054,21 @@ p {
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
-/* line 6, src/styles/components/_consumptionnavigator.scss */
-.cn .cn-tabs .cn-tab {
- outline: none !important; }
-
-/** BLACK **/
-/** TEXT COLOR **/
-/** RED **/
-/** YELLOW **/
-/** ORANGE **/
-/** BLUE **/
-/** GREEN **/
-/** WHITE **/
-/** GREY **/
-/** App colors **/
-/** TABS GRADIENT **/
-/* line 4, src/styles/components/_challengesnavigator.scss */
-.challenge-nav {
- width: 80%;
- margin: auto; }
- /* line 8, src/styles/components/_challengesnavigator.scss */
- .challenge-nav .cn-tabs .cn-tab {
- outline: none !important; }
+/* line 4, src/styles/components/_navigator.scss */
+.cn {
+ display: flex;
+ justify-content: center; }
+ /* line 7, src/styles/components/_navigator.scss */
+ .cn .cn-tabs {
+ width: 50.625rem; }
+ @media only screen and (max-width: 768px) {
+ /* line 7, src/styles/components/_navigator.scss */
+ .cn .cn-tabs {
+ width: 100%;
+ margin: 0 1.25rem; } }
+ /* line 13, src/styles/components/_navigator.scss */
+ .cn .cn-tabs .cn-tab {
+ outline: none !important; }
/** BLACK **/
/** TEXT COLOR **/
@@ -1024,122 +1085,127 @@ p {
.cv {
display: flex;
flex-direction: column;
- align-items: center; }
- /* line 8, src/styles/components/_consumptionvisualizer.scss */
+ align-items: center;
+ width: 27.5rem; }
+ @media only screen and (max-width: 768px) {
+ /* line 4, src/styles/components/_consumptionvisualizer.scss */
+ .cv {
+ width: 100%; } }
+ /* line 12, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-content-date {
display: flex;
flex-direction: row;
justify-content: space-around;
- width: 100vw; }
- /* line 14, src/styles/components/_consumptionvisualizer.scss */
+ width: 100%; }
+ /* line 18, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-content-date .cv-date-group {
display: flex;
flex-direction: column;
width: 38vw;
align-items: center;
align-self: center; }
- /* line 20, src/styles/components/_consumptionvisualizer.scss */
+ /* line 24, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-content-date .cv-date-group .cv-date {
color: #e0e0e0; }
- /* line 22, src/styles/components/_consumptionvisualizer.scss */
+ /* line 26, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-content-date .cv-date-group .cv-date::first-letter {
text-transform: uppercase; }
- /* line 28, src/styles/components/_consumptionvisualizer.scss */
+ /* line 32, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-load {
min-height: 5.25rem;
display: flex;
align-items: center; }
- /* line 32, src/styles/components/_consumptionvisualizer.scss */
+ /* line 36, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-load .cv-load-content {
display: flex;
flex-direction: row;
align-items: center; }
- /* line 36, src/styles/components/_consumptionvisualizer.scss */
+ /* line 40, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-load .cv-load-content .cv-load-section {
display: flex;
flex-direction: column;
align-items: center;
padding: 0.5rem 0.5rem; }
- /* line 41, src/styles/components/_consumptionvisualizer.scss */
+ /* line 45, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-load .cv-load-content .cv-load-section.cv-load-section-left {
align-items: flex-end; }
- /* line 44, src/styles/components/_consumptionvisualizer.scss */
+ /* line 48, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-load .cv-load-content .cv-load-section.cv-load-section-right {
align-items: flex-start; }
- /* line 47, src/styles/components/_consumptionvisualizer.scss */
+ /* line 51, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-load .cv-load-content .cv-load-section .cv-load-value {
flex-direction: row; }
- /* line 49, src/styles/components/_consumptionvisualizer.scss */
+ /* line 53, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-load .cv-load-content .cv-load-section .cv-load-value span {
align-self: flex-end;
margin-left: 0.5em; }
- /* line 57, src/styles/components/_consumptionvisualizer.scss */
+ /* line 61, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-euro {
display: flex;
flex-direction: row; }
- /* line 60, src/styles/components/_consumptionvisualizer.scss */
+ /* line 64, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-euro .cv-euro-link {
text-decoration: none;
color: transparent; }
- /* line 64, src/styles/components/_consumptionvisualizer.scss */
+ /* line 68, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-euro .cv-euro-fluid {
padding: 0 0.5rem;
display: flex;
align-items: center; }
- /* line 68, src/styles/components/_consumptionvisualizer.scss */
+ /* line 72, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-euro .cv-euro-fluid .cv-euro-fluid-icon {
margin-right: 0.5rem; }
- /* line 71, src/styles/components/_consumptionvisualizer.scss */
+ /* line 75, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-euro .cv-euro-fluid div {
padding-top: 0.2rem; }
- /* line 76, src/styles/components/_consumptionvisualizer.scss */
+ /* line 80, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-info {
min-height: 1.5rem;
display: flex;
align-items: center; }
- /* line 81, src/styles/components/_consumptionvisualizer.scss */
+ /* line 85, src/styles/components/_consumptionvisualizer.scss */
.cv .electricity {
color: #d87b39; }
- /* line 84, src/styles/components/_consumptionvisualizer.scss */
+ /* line 88, src/styles/components/_consumptionvisualizer.scss */
.cv .electricity-compare {
color: #e2bca1; }
- /* line 87, src/styles/components/_consumptionvisualizer.scss */
+ /* line 91, src/styles/components/_consumptionvisualizer.scss */
.cv .water {
color: #3a98ec; }
- /* line 90, src/styles/components/_consumptionvisualizer.scss */
+ /* line 94, src/styles/components/_consumptionvisualizer.scss */
.cv .water-compare {
color: #abd4fa; }
- /* line 93, src/styles/components/_consumptionvisualizer.scss */
+ /* line 97, src/styles/components/_consumptionvisualizer.scss */
.cv .gas {
color: #45d1b8; }
- /* line 96, src/styles/components/_consumptionvisualizer.scss */
+ /* line 100, src/styles/components/_consumptionvisualizer.scss */
.cv .gas-compare {
color: #a8f7e9; }
- /* line 99, src/styles/components/_consumptionvisualizer.scss */
+ /* line 103, src/styles/components/_consumptionvisualizer.scss */
.cv .multifluid {
color: #ffffff; }
- /* line 102, src/styles/components/_consumptionvisualizer.scss */
+ /* line 106, src/styles/components/_consumptionvisualizer.scss */
.cv .multifluid-compare {
color: #ffd597; }
- /* line 105, src/styles/components/_consumptionvisualizer.scss */
+ /* line 109, src/styles/components/_consumptionvisualizer.scss */
.cv .error {
color: #d24444; }
- /* line 108, src/styles/components/_consumptionvisualizer.scss */
+ /* line 112, src/styles/components/_consumptionvisualizer.scss */
.cv .error-line {
color: #d24444;
cursor: pointer;
display: flex;
align-items: center; }
- /* line 114, src/styles/components/_consumptionvisualizer.scss */
+ /* line 118, src/styles/components/_consumptionvisualizer.scss */
.cv .underlined-error {
border-bottom: solid 1px #d24444; }
- /* line 117, src/styles/components/_consumptionvisualizer.scss */
+ /* line 121, src/styles/components/_consumptionvisualizer.scss */
.cv .warning-icon {
margin-right: 4px; }
- /* line 120, src/styles/components/_consumptionvisualizer.scss */
+ /* line 124, src/styles/components/_consumptionvisualizer.scss */
.cv .multifluid-compare {
color: #ffd597; }
- /* line 123, src/styles/components/_consumptionvisualizer.scss */
+ /* line 127, src/styles/components/_consumptionvisualizer.scss */
.cv .cv-button {
border: none;
background: none;
@@ -1358,69 +1424,60 @@ p {
box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2), 0px 3px 14px rgba(0, 0, 0, 0.12), 0px 8px 10px rgba(0, 0, 0, 0.14);
border-top: unset;
border-right: unset;
- justify-content: flex-end;
- z-index: 1;
- position: fixed;
- bottom: 0;
- left: 0;
- display: block;
- width: 100%; }
+ z-index: 19; }
+ @media only screen and (max-width: 1023px) {
+ /* line 4, src/styles/components/_nav.scss */
+ .o-sidebar {
+ background-color: #25262b; } }
-/* line 18, src/styles/components/_nav.scss */
+/* line 21, src/styles/components/_nav.scss */
.c-nav-link {
padding: 0 1rem; }
- /* line 20, src/styles/components/_nav.scss */
+ /* line 23, src/styles/components/_nav.scss */
.c-nav-link .on {
display: none; }
- /* line 23, src/styles/components/_nav.scss */
+ /* line 26, src/styles/components/_nav.scss */
.c-nav-link .off {
display: block; }
-/* line 28, src/styles/components/_nav.scss */
-.c-nav {
- display: flex;
- list-style: none;
- justify-content: space-around; }
-
-/* line 33, src/styles/components/_nav.scss */
+/* line 36, src/styles/components/_nav.scss */
.c-nav-link .c-nav-icon {
padding-right: 0.5rem;
width: 50px;
height: 36px;
fill: none; }
-/* line 40, src/styles/components/_nav.scss */
+/* line 43, src/styles/components/_nav.scss */
.c-nav-link.is-active {
box-shadow: inset 0.25rem 0 0 0 #b2901b; }
-/* line 44, src/styles/components/_nav.scss */
+/* line 47, src/styles/components/_nav.scss */
.c-nav-link.is-active .c-nav-icon {
fill: #b2901b !important; }
-/* line 48, src/styles/components/_nav.scss */
+/* line 51, src/styles/components/_nav.scss */
.c-nav-link.is-active {
color: white;
text-decoration: none; }
- /* line 51, src/styles/components/_nav.scss */
+ /* line 54, src/styles/components/_nav.scss */
.c-nav-link.is-active .on {
display: block; }
- /* line 54, src/styles/components/_nav.scss */
+ /* line 57, src/styles/components/_nav.scss */
.c-nav-link.is-active .off {
display: none; }
-@media only screen and (max-width: 768px) {
- /* line 60, src/styles/components/_nav.scss */
+@media only screen and (max-width: 1023px) {
+ /* line 63, src/styles/components/_nav.scss */
.o-sidebar {
height: 56px; }
- /* line 63, src/styles/components/_nav.scss */
+ /* line 66, src/styles/components/_nav.scss */
.c-nav-link {
padding: 0; }
- /* line 67, src/styles/components/_nav.scss */
+ /* line 70, src/styles/components/_nav.scss */
.c-nav-link .c-nav-icon {
padding: 0;
- margin: auto;
- margin-bottom: 0.25rem; }
- /* line 73, src/styles/components/_nav.scss */
+ margin: auto; }
+ /* line 75, src/styles/components/_nav.scss */
.c-nav-link.is-active {
box-shadow: unset; } }
@@ -1441,8 +1498,7 @@ p {
flex-direction: column;
align-items: center;
justify-content: center;
- padding: 2rem 1.5rem;
- margin-bottom: 1rem; }
+ padding: 0.5rem 1.5rem; }
@media only screen and (max-width: 768px) {
/* line 5, src/styles/components/_indicators.scss */
.fi-root {
@@ -1450,79 +1506,95 @@ p {
/* line 15, src/styles/components/_indicators.scss */
.fi-root .fi-content {
min-height: 23.875rem;
- width: 53.125rem; }
- @media only screen and (max-width: 992px) {
- /* line 15, src/styles/components/_indicators.scss */
- .fi-root .fi-content {
- width: 47.5rem; } }
+ width: 45.75rem; }
@media only screen and (max-width: 768px) {
/* line 15, src/styles/components/_indicators.scss */
.fi-root .fi-content {
width: 100%; } }
- /* line 24, src/styles/components/_indicators.scss */
+ /* line 21, src/styles/components/_indicators.scss */
.fi-root .fi-content .fi-header {
+ margin-top: 2.5rem;
+ margin-bottom: 1.25rem;
+ color: #e0e0e0; }
+ /* line 28, src/styles/components/_indicators.scss */
+ .fi-root .sfi-content {
+ min-height: 16rem;
+ width: 45.75rem; }
+ @media only screen and (max-width: 768px) {
+ /* line 28, src/styles/components/_indicators.scss */
+ .fi-root .sfi-content {
+ width: 100%; } }
+ /* line 34, src/styles/components/_indicators.scss */
+ .fi-root .sfi-content .sfi-header {
+ margin-top: 2.5rem;
+ margin-bottom: 1.25rem;
color: #e0e0e0; }
- /* line 27, src/styles/components/_indicators.scss */
- .fi-root .fi-content .fi-loader {
- min-height: 23.875rem;
+ /* line 39, src/styles/components/_indicators.scss */
+ .fi-root .sfi-content .sfi-redirect {
+ margin-bottom: 1.25rem;
display: flex;
- justify-content: center;
- align-items: center; }
+ flex-wrap: wrap; }
+ /* line 43, src/styles/components/_indicators.scss */
+ .fi-root .sfi-content .sfi-redirect .redirect-card-link:nth-child(2) {
+ margin-left: 0.625rem; }
+ /* line 46, src/styles/components/_indicators.scss */
+ .fi-root .sfi-content .sfi-redirect .redirect-card-link {
+ flex: 1; }
-/* line 37, src/styles/components/_indicators.scss */
+/* line 54, src/styles/components/_indicators.scss */
.fpi-link {
color: transparent; }
-/* line 40, src/styles/components/_indicators.scss */
+/* line 57, src/styles/components/_indicators.scss */
.fpi {
display: flex;
flex-direction: row;
margin: 0.25rem 0.25rem;
width: 100%; }
- /* line 45, src/styles/components/_indicators.scss */
+ /* line 62, src/styles/components/_indicators.scss */
.fpi .fpi-left {
flex: 1;
display: flex;
flex-direction: column; }
- /* line 49, src/styles/components/_indicators.scss */
+ /* line 66, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-title {
align-content: flex-start;
margin-bottom: 0.5rem; }
- /* line 53, src/styles/components/_indicators.scss */
+ /* line 70, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content {
display: flex;
flex-direction: row; }
- /* line 56, src/styles/components/_indicators.scss */
+ /* line 73, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content .fpi-content-icon {
margin: 0.5rem 0; }
- /* line 59, src/styles/components/_indicators.scss */
+ /* line 76, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content .fpi-content-perf {
margin: 0 1rem;
align-self: center; }
- /* line 62, src/styles/components/_indicators.scss */
+ /* line 79, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content .fpi-content-perf .fpi-content-perf-result {
color: #e0e0e0; }
- /* line 64, src/styles/components/_indicators.scss */
+ /* line 81, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content .fpi-content-perf .fpi-content-perf-result span {
display: inline-block;
padding-right: 0.25rem; }
- /* line 69, src/styles/components/_indicators.scss */
+ /* line 86, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content .fpi-content-perf .fpi-content-perf-indicator {
color: #a0a0a0; }
- /* line 72, src/styles/components/_indicators.scss */
+ /* line 89, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content .fpi-content-perf .fpi-content-perf-indicator .fpi-content-perf-indicator-kpi.positive {
color: #ffffff; }
- /* line 75, src/styles/components/_indicators.scss */
+ /* line 92, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content .fpi-content-perf .fpi-content-perf-indicator .fpi-content-perf-indicator-kpi.positive {
color: #cf6666; }
- /* line 78, src/styles/components/_indicators.scss */
+ /* line 95, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-content .fpi-content-perf .fpi-content-perf-indicator .fpi-content-perf-indicator-kpi.negative {
color: #7fd771; }
- /* line 85, src/styles/components/_indicators.scss */
+ /* line 102, src/styles/components/_indicators.scss */
.fpi .fpi-left .fpi-footer {
margin-top: 0.5rem;
color: #a0a0a0; }
- /* line 90, src/styles/components/_indicators.scss */
+ /* line 107, src/styles/components/_indicators.scss */
.fpi .fpi-right {
align-self: center; }
@@ -1547,147 +1619,180 @@ p {
/* line 11, src/styles/components/_challenges.scss */
.ccc-root .ccc-content {
min-height: 9rem;
- width: 53.125rem; }
- @media only screen and (max-width: 992px) {
- /* line 11, src/styles/components/_challenges.scss */
- .ccc-root .ccc-content {
- width: 47.5rem; } }
+ width: 45.75rem; }
@media only screen and (max-width: 768px) {
/* line 11, src/styles/components/_challenges.scss */
.ccc-root .ccc-content {
width: 100%; } }
- /* line 20, src/styles/components/_challenges.scss */
+ /* line 17, src/styles/components/_challenges.scss */
.ccc-root .ccc-content .ccc-header {
+ margin-top: 0.375rem;
+ margin-bottom: 1.25rem;
color: #e0e0e0; }
-/* line 26, src/styles/components/_challenges.scss */
-.loc-content .timeline-line {
- background-color: #e0e0e0;
- width: 1px;
- height: 100vh;
- position: fixed;
- left: 3.5rem; }
-
-/* line 33, src/styles/components/_challenges.scss */
-.loc-content .list-of-challenge-cards {
- padding: 3rem 0; }
+/* line 24, src/styles/components/_challenges.scss */
+.loc-root {
+ display: flex;
+ justify-content: center; }
+ /* line 27, src/styles/components/_challenges.scss */
+ .loc-root .loc-content {
+ width: 100%;
+ max-width: 53rem;
+ display: grid; }
+ @media only screen and (max-width: 768px) {
+ /* line 27, src/styles/components/_challenges.scss */
+ .loc-root .loc-content {
+ display: block; } }
+ /* line 34, src/styles/components/_challenges.scss */
+ .loc-root .loc-content .timeline-line {
+ background-color: #e0e0e0;
+ width: 1px;
+ height: calc(100vh);
+ grid-column: 1;
+ grid-row: 1;
+ position: unset;
+ margin-left: 3.8rem; }
+ @media only screen and (max-width: 1023px) {
+ /* line 34, src/styles/components/_challenges.scss */
+ .loc-root .loc-content .timeline-line {
+ height: calc(100vh - 229px); } }
+ @media only screen and (max-width: 768px) {
+ /* line 34, src/styles/components/_challenges.scss */
+ .loc-root .loc-content .timeline-line {
+ height: 100vh;
+ display: block;
+ position: fixed; } }
+ /* line 51, src/styles/components/_challenges.scss */
+ .loc-root .loc-content .list-of-challenge-cards {
+ padding-top: 1rem;
+ width: 100%;
+ grid-column: 1;
+ grid-row: 1; }
+ @media only screen and (max-width: 768px) {
+ /* line 51, src/styles/components/_challenges.scss */
+ .loc-root .loc-content .list-of-challenge-cards {
+ display: block; } }
-/* line 39, src/styles/components/_challenges.scss */
+/* line 65, src/styles/components/_challenges.scss */
.cli-link {
color: black;
text-decoration: none; }
-/* line 43, src/styles/components/_challenges.scss */
+/* line 69, src/styles/components/_challenges.scss */
.cli {
cursor: pointer;
display: flex;
flex-direction: row;
- margin: 1rem 0.5rem;
+ margin: 2rem 0.5rem;
border-radius: 2px; }
- /* line 49, src/styles/components/_challenges.scss */
+ @media only screen and (max-width: 768px) {
+ /* line 69, src/styles/components/_challenges.scss */
+ .cli {
+ margin: 1rem 0.5rem; } }
+ /* line 78, src/styles/components/_challenges.scss */
.cli.cli-available {
background: linear-gradient(180deg, #61F0F2 0%, #48C2C4 100%);
-webkit-transform: translateZ(0);
transform: translateZ(0); }
- /* line 54, src/styles/components/_challenges.scss */
+ /* line 83, src/styles/components/_challenges.scss */
.cli.cli-ongoing {
border: 1px solid #58FFFF;
background: #121212;
-webkit-transform: translateZ(0);
transform: translateZ(0); }
- /* line 60, src/styles/components/_challenges.scss */
+ /* line 89, src/styles/components/_challenges.scss */
.cli .cli-left {
flex: 1;
display: flex;
flex-direction: column;
padding-left: 1.415rem; }
- /* line 65, src/styles/components/_challenges.scss */
+ /* line 94, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content {
display: flex;
flex-direction: row; }
- /* line 68, src/styles/components/_challenges.scss */
+ /* line 97, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .cli-content-icon {
margin: 0.5rem 0; }
- /* line 71, src/styles/components/_challenges.scss */
+ /* line 100, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .cli-content-title {
color: #ffffff;
margin: 0 1rem;
align-self: center; }
- /* line 76, src/styles/components/_challenges.scss */
+ /* line 105, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .subtitle-finished {
color: #a0a0a0; }
- /* line 79, src/styles/components/_challenges.scss */
+ /* line 108, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .title-finished {
color: #e0e0e0; }
- /* line 82, src/styles/components/_challenges.scss */
+ /* line 111, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .subtitle-ongoing {
color: #58FFFF; }
- /* line 85, src/styles/components/_challenges.scss */
+ /* line 114, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .title-ongoing {
color: #ffffff; }
- /* line 88, src/styles/components/_challenges.scss */
+ /* line 117, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .subtitle-available {
color: #121212; }
- /* line 91, src/styles/components/_challenges.scss */
+ /* line 120, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .title-available {
color: #121212; }
- /* line 94, src/styles/components/_challenges.scss */
+ /* line 123, src/styles/components/_challenges.scss */
.cli .cli-left .cli-content .title-locked {
color: #a0a0a0;
opacity: 0.35; }
- /* line 100, src/styles/components/_challenges.scss */
+ /* line 129, src/styles/components/_challenges.scss */
.cli .cli-right {
align-self: center;
padding-right: 1.2rem; }
- /* line 103, src/styles/components/_challenges.scss */
+ /* line 132, src/styles/components/_challenges.scss */
.cli .cli-right.cli-right-ongoing {
padding-right: calc(1.2rem + 2px); }
- /* line 106, src/styles/components/_challenges.scss */
+ /* line 135, src/styles/components/_challenges.scss */
.cli .cli-right.cli-right-available {
padding-right: calc(1.2rem + 2px); }
-/* line 113, src/styles/components/_challenges.scss */
+/* line 142, src/styles/components/_challenges.scss */
.cc-link {
color: black;
text-decoration: none; }
-/* line 117, src/styles/components/_challenges.scss */
+/* line 146, src/styles/components/_challenges.scss */
.cc {
cursor: pointer;
display: flex;
flex-direction: row;
margin: 0.25rem 0.25rem;
width: 100%; }
- /* line 123, src/styles/components/_challenges.scss */
+ /* line 152, src/styles/components/_challenges.scss */
.cc .cc-content-left {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
width: inherit; }
- /* line 129, src/styles/components/_challenges.scss */
+ /* line 158, src/styles/components/_challenges.scss */
.cc .cc-content-left .cc-content-title {
color: #ffffff; }
- /* line 131, src/styles/components/_challenges.scss */
+ /* line 160, src/styles/components/_challenges.scss */
.cc .cc-content-left .cc-content-title.cc-content-title-padding {
padding-top: 1rem; }
- /* line 135, src/styles/components/_challenges.scss */
+ /* line 164, src/styles/components/_challenges.scss */
.cc .cc-content-left .cc-content-progress {
margin-top: 1rem; }
- /* line 138, src/styles/components/_challenges.scss */
+ /* line 167, src/styles/components/_challenges.scss */
.cc .cc-content-left .cc-content-timeline {
padding: 0 0.5rem; }
- /* line 141, src/styles/components/_challenges.scss */
+ /* line 170, src/styles/components/_challenges.scss */
.cc .cc-content-left .cc-content-visu {
padding: 1rem 0; }
- /* line 145, src/styles/components/_challenges.scss */
+ /* line 174, src/styles/components/_challenges.scss */
.cc .cc-content-right {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
align-self: center; }
- /* line 151, src/styles/components/_challenges.scss */
+ /* line 180, src/styles/components/_challenges.scss */
.cc .cc-content-right .cc-notification {
display: flex;
align-items: center;
@@ -1699,110 +1804,133 @@ p {
color: black;
margin-right: 1rem; }
-/* line 166, src/styles/components/_challenges.scss */
+/* line 195, src/styles/components/_challenges.scss */
.cm-content {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
padding: 1.5rem 1rem 0.5rem;
- width: 90%; }
- /* line 173, src/styles/components/_challenges.scss */
+ width: 22.125rem; }
+ @media only screen and (max-width: 768px) {
+ /* line 195, src/styles/components/_challenges.scss */
+ .cm-content {
+ width: 90%; } }
+ /* line 205, src/styles/components/_challenges.scss */
+ .cm-content .win {
+ background: #eed582;
+ background: Linear-gradient(90deg, #bf723b 0%, #dd9a2b 26.04%, #f6d74c 45.31%, #d1880d 75%, #a05b11 100%);
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent; }
+ /* line 218, src/styles/components/_challenges.scss */
+ .cm-content .defeat {
+ background: #eed582;
+ background: Linear-gradient(90deg, #a66340 0%, #ae5f38 33.33%, #9e4e24 51.56%, #a4573a 66.67%);
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent; }
+ /* line 230, src/styles/components/_challenges.scss */
.cm-content .cm-title {
- text-align: center; }
- /* line 176, src/styles/components/_challenges.scss */
+ text-align: center;
+ margin-bottom: 210px; }
+ /* line 234, src/styles/components/_challenges.scss */
.cm-content .cm-win-badge-star {
display: grid;
align-items: center;
- justify-items: center; }
- /* line 180, src/styles/components/_challenges.scss */
+ justify-items: center;
+ position: absolute;
+ top: 22px; }
+ /* line 240, src/styles/components/_challenges.scss */
.cm-content .cm-win-badge-star .cm-win-badge {
grid-column: 1;
grid-row: 1;
z-index: 1; }
- /* line 185, src/styles/components/_challenges.scss */
+ /* line 245, src/styles/components/_challenges.scss */
.cm-content .cm-win-badge-star .cm-win-star {
grid-column: 1;
grid-row: 1; }
- /* line 190, src/styles/components/_challenges.scss */
+ /* line 250, src/styles/components/_challenges.scss */
.cm-content .cm-badge {
margin: 2rem; }
- /* line 193, src/styles/components/_challenges.scss */
+ /* line 253, src/styles/components/_challenges.scss */
.cm-content .cm-button-valid {
margin-top: 1rem;
width: 100%; }
- /* line 197, src/styles/components/_challenges.scss */
+ /* line 257, src/styles/components/_challenges.scss */
.cm-content .cm-txt {
text-align: center;
- margin-bottom: 1rem; }
+ margin-bottom: 1rem;
+ width: 100%; }
+ /* line 262, src/styles/components/_challenges.scss */
+ .cm-content .cm-text-new-available {
+ margin-top: 1.25rem; }
-/* line 202, src/styles/components/_challenges.scss */
+/* line 266, src/styles/components/_challenges.scss */
.cm-overspent-value {
color: #D25959; }
-/* line 207, src/styles/components/_challenges.scss */
+/* line 271, src/styles/components/_challenges.scss */
.list-of-days-duration {
display: flex;
flex-direction: row;
justify-content: center;
margin-top: 1rem;
width: 100%; }
- /* line 213, src/styles/components/_challenges.scss */
+ /* line 277, src/styles/components/_challenges.scss */
.list-of-days-duration .day-solo {
display: flex;
flex-direction: column;
width: 100%; }
- /* line 217, src/styles/components/_challenges.scss */
+ /* line 281, src/styles/components/_challenges.scss */
.list-of-days-duration .day-solo .day-line-label {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 100%; }
- /* line 223, src/styles/components/_challenges.scss */
+ /* line 287, src/styles/components/_challenges.scss */
.list-of-days-duration .day-solo .day-line-label .date-dash {
width: 50%;
height: 2px;
background-color: #7b7b7b; }
- /* line 228, src/styles/components/_challenges.scss */
+ /* line 292, src/styles/components/_challenges.scss */
.list-of-days-duration .day-solo .day-line-label .past {
background-color: #58FFFF; }
- /* line 231, src/styles/components/_challenges.scss */
+ /* line 295, src/styles/components/_challenges.scss */
.list-of-days-duration .day-solo .day-line-label .futur {
background-color: #7b7b7b; }
- /* line 234, src/styles/components/_challenges.scss */
+ /* line 298, src/styles/components/_challenges.scss */
.list-of-days-duration .day-solo .day-line-label .date-label {
width: 0.625rem;
height: 0.625rem;
border-radius: 50%;
position: absolute; }
- /* line 241, src/styles/components/_challenges.scss */
+ /* line 305, src/styles/components/_challenges.scss */
.list-of-days-duration .day-solo .day-letter {
margin-top: 0.8rem;
text-align: center;
color: #a0a0a0; }
- /* line 246, src/styles/components/_challenges.scss */
+ /* line 310, src/styles/components/_challenges.scss */
.list-of-days-duration .day-solo .day-date {
margin-top: 0.2rem;
text-align: center;
color: #a0a0a0; }
-/* line 255, src/styles/components/_challenges.scss */
+/* line 319, src/styles/components/_challenges.scss */
.view-start-date {
padding: 0.25rem 0;
color: #58FFFF; }
-/* line 261, src/styles/components/_challenges.scss */
+/* line 325, src/styles/components/_challenges.scss */
.pile-energy-follow {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
width: 100%; }
- /* line 267, src/styles/components/_challenges.scss */
+ /* line 331, src/styles/components/_challenges.scss */
.pile-energy-follow .pile-section {
display: grid; }
- /* line 269, src/styles/components/_challenges.scss */
+ /* line 333, src/styles/components/_challenges.scss */
.pile-energy-follow .pile-section .filter-pile {
grid-column: 1;
grid-row: 1;
@@ -1814,36 +1942,38 @@ p {
opacity: 0.8;
background-color: #121212;
z-index: 1; }
- /* line 281, src/styles/components/_challenges.scss */
+ /* line 345, src/styles/components/_challenges.scss */
.pile-energy-follow .pile-section .pile-icon {
grid-column: 1;
grid-row: 1;
margin: -25px 0; }
- /* line 287, src/styles/components/_challenges.scss */
+ /* line 351, src/styles/components/_challenges.scss */
.pile-energy-follow .max-energy {
color: #7b7b7b; }
- /* line 290, src/styles/components/_challenges.scss */
+ /* line 354, src/styles/components/_challenges.scss */
.pile-energy-follow .no-values-section {
color: #ffffff;
padding-right: 1rem; }
-/* line 297, src/styles/components/_challenges.scss */
+/* line 361, src/styles/components/_challenges.scss */
+.ongoing-challenge {
+ min-height: 620px; }
+
+/* line 364, src/styles/components/_challenges.scss */
.cp-root {
- height: 100vh;
- width: 100vw;
- position: fixed; }
- /* line 301, src/styles/components/_challenges.scss */
+ width: 100%; }
+ /* line 366, src/styles/components/_challenges.scss */
.cp-root .cp-content, .cp-root .cp-content.--locked {
display: flex;
align-items: center;
flex-direction: column;
color: #e0e0e0;
- height: 85vh;
+ height: 84vh;
justify-content: space-between; }
- /* line 310, src/styles/components/_challenges.scss */
+ /* line 374, src/styles/components/_challenges.scss */
.cp-root .--locked.cp-content {
justify-content: center; }
- /* line 314, src/styles/components/_challenges.scss */
+ /* line 378, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info {
display: flex;
flex-direction: column;
@@ -1851,85 +1981,96 @@ p {
justify-content: space-between;
background-color: #121212;
width: 100%;
+ height: 60%;
padding-top: 2rem;
padding-bottom: 0.5rem; }
- /* line 323, src/styles/components/_challenges.scss */
+ /* line 388, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-icon {
margin-bottom: 1rem; }
- /* line 326, src/styles/components/_challenges.scss */
+ /* line 391, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-icon-available {
margin: 2rem; }
- /* line 329, src/styles/components/_challenges.scss */
+ /* line 394, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-date {
color: #a0a0a0;
text-align: center;
margin-top: 1rem; }
- /* line 334, src/styles/components/_challenges.scss */
+ /* line 399, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-title {
color: #e0e0e0;
text-align: center;
margin-top: 0.5rem; }
- /* line 339, src/styles/components/_challenges.scss */
+ /* line 404, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-result {
color: #e0e0e0;
text-align: center;
margin-top: 1.5rem;
margin-bottom: 0.5rem; }
- /* line 344, src/styles/components/_challenges.scss */
+ /* line 409, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-result .cp-result-positif {
color: #7fd771; }
- /* line 347, src/styles/components/_challenges.scss */
+ /* line 412, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-result .cp-result-negatif {
color: #d24444; }
- /* line 351, src/styles/components/_challenges.scss */
+ /* line 416, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-description {
text-align: center;
margin-top: 1rem;
margin-bottom: 0.5rem;
margin-left: 1.25rem;
- margin-right: 1.25rem; }
- /* line 358, src/styles/components/_challenges.scss */
+ margin-right: 1.25rem;
+ max-width: 53rem; }
+ /* line 424, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-valid {
justify-content: center;
display: flex;
flex-direction: row;
- width: 100%;
- margin-top: 0.75rem; }
- /* line 364, src/styles/components/_challenges.scss */
+ width: 90%;
+ margin-top: 0.75rem;
+ max-width: 53rem; }
+ /* line 431, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-valid .cp-left-button {
margin-right: 0.25rem;
- margin-left: 1.25rem;
+ margin-left: 0;
width: 100%; }
- /* line 369, src/styles/components/_challenges.scss */
+ /* line 436, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-info .cp-valid .cp-right-button {
margin-left: 0.25rem;
- margin-right: 1.25rem;
+ margin-right: 0;
width: 100%; }
- /* line 376, src/styles/components/_challenges.scss */
+ /* line 443, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-follow {
width: 90%;
display: flex;
flex-direction: column;
align-items: center;
- margin-bottom: 1rem; }
- /* line 383, src/styles/components/_challenges.scss */
+ margin-bottom: 1rem;
+ max-width: 53rem; }
+ /* line 451, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-valid-locked {
margin-top: 2rem;
- width: 80%; }
- /* line 387, src/styles/components/_challenges.scss */
+ width: 80%;
+ max-width: 53rem; }
+ /* line 456, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-bottom {
- padding: 1rem 1.25rem;
+ padding: 1.25rem 1.25rem;
width: 90%;
display: flex;
flex-direction: column;
- justify-content: space-between; }
- /* line 393, src/styles/components/_challenges.scss */
+ justify-content: space-between;
+ max-width: 53rem;
+ margin-bottom: 2rem; }
+ @media only screen and (max-width: 768px) {
+ /* line 456, src/styles/components/_challenges.scss */
+ .cp-root .cp-content .cp-bottom {
+ margin-bottom: 0; } }
+ /* line 467, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-bottom .cp-eg-content {
width: 100%; }
- /* line 395, src/styles/components/_challenges.scss */
+ /* line 469, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-bottom .cp-eg-content .linked-ecogestures {
text-transform: uppercase; }
- /* line 398, src/styles/components/_challenges.scss */
+ /* line 472, src/styles/components/_challenges.scss */
.cp-root .cp-content .cp-bottom .cp-eg-content .cp-ecogestures {
width: 100%;
display: flex;
@@ -1955,70 +2096,83 @@ p {
justify-content: center;
padding: 1rem 1.5rem; }
/* line 11, src/styles/components/_ecogesture.scss */
+ .ecogesture-root .negawatt-button-content {
+ width: calc(53rem - 2%);
+ margin: 0 1%; }
+ @media only screen and (max-width: 768px) {
+ /* line 11, src/styles/components/_ecogesture.scss */
+ .ecogesture-root .negawatt-button-content {
+ width: 97%; } }
+ @media only screen and (max-width: 1023px) {
+ /* line 11, src/styles/components/_ecogesture.scss */
+ .ecogesture-root .negawatt-button-content {
+ width: 97%; } }
+ /* line 21, src/styles/components/_ecogesture.scss */
.ecogesture-root .ecogesture-content {
display: flex;
flex-wrap: wrap;
- justify-content: space-around; }
- /* line 15, src/styles/components/_ecogesture.scss */
+ justify-content: space-around;
+ width: 53rem; }
+ @media only screen and (max-width: 768px) {
+ /* line 21, src/styles/components/_ecogesture.scss */
+ .ecogesture-root .ecogesture-content {
+ width: 100%; } }
+ @media only screen and (max-width: 1023px) {
+ /* line 21, src/styles/components/_ecogesture.scss */
+ .ecogesture-root .ecogesture-content {
+ width: 100%; } }
+ /* line 32, src/styles/components/_ecogesture.scss */
.ecogesture-root .ecogesture-content .ecogesture-list-item {
width: 48%;
height: 7rem;
margin: 1% 1%; }
- /* line 20, src/styles/components/_ecogesture.scss */
+ /* line 37, src/styles/components/_ecogesture.scss */
.ecogesture-root .ecogesture-content .ecogesture-list-item > button {
height: 100%;
overflow: hidden; }
-/* line 27, src/styles/components/_ecogesture.scss */
-.ccc-content {
- margin: 0 20rem; }
- @media only screen and (max-width: 768px) {
- /* line 27, src/styles/components/_ecogesture.scss */
- .ccc-content {
- margin: 0; } }
-
-/* line 35, src/styles/components/_ecogesture.scss */
+/* line 45, src/styles/components/_ecogesture.scss */
.ec-link {
color: black; }
-/* line 38, src/styles/components/_ecogesture.scss */
+/* line 48, src/styles/components/_ecogesture.scss */
.ec {
display: flex;
width: 100%;
height: 100%; }
- /* line 42, src/styles/components/_ecogesture.scss */
+ /* line 52, src/styles/components/_ecogesture.scss */
.ec .ec-content {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-end; }
- /* line 47, src/styles/components/_ecogesture.scss */
+ /* line 57, src/styles/components/_ecogesture.scss */
.ec .ec-content .ec-content-short-name {
display: flex;
flex: 1;
align-items: center; }
- /* line 53, src/styles/components/_ecogesture.scss */
+ /* line 63, src/styles/components/_ecogesture.scss */
.ec .ec-content .ec-content-nwh-true {
margin-top: 0.25rem;
color: #121212; }
- /* line 57, src/styles/components/_ecogesture.scss */
+ /* line 67, src/styles/components/_ecogesture.scss */
.ec .ec-content .ec-content-nwh-undefined {
margin-top: 0.25rem;
color: #a0a0a0; }
-/* line 63, src/styles/components/_ecogesture.scss */
+/* line 73, src/styles/components/_ecogesture.scss */
.cp-eg-1 {
width: 100%;
margin-right: 0.25rem;
text-align: center; }
-/* line 68, src/styles/components/_ecogesture.scss */
+/* line 78, src/styles/components/_ecogesture.scss */
.cp-eg-2 {
width: 100%;
margin-left: 0.25rem;
text-align: center; }
-/* line 75, src/styles/components/_ecogesture.scss */
+/* line 85, src/styles/components/_ecogesture.scss */
.em-header {
color: #e0e0e0;
border-bottom: 1px solid rgba(163, 163, 163, 0.4);
@@ -2028,48 +2182,66 @@ p {
display: flex;
justify-content: center; }
-/* line 84, src/styles/components/_ecogesture.scss */
+/* line 94, src/styles/components/_ecogesture.scss */
.em-icon {
margin-bottom: 1rem; }
-/* line 87, src/styles/components/_ecogesture.scss */
-.em-description {
- text-align: justify; }
-
-/* line 90, src/styles/components/_ecogesture.scss */
+/* line 97, src/styles/components/_ecogesture.scss */
.em-title {
margin-bottom: 0; }
-/* line 93, src/styles/components/_ecogesture.scss */
+/* line 100, src/styles/components/_ecogesture.scss */
.em-detail {
display: flex;
flex-direction: row;
margin: 0.5em 0; }
- /* line 97, src/styles/components/_ecogesture.scss */
+ /* line 104, src/styles/components/_ecogesture.scss */
.em-detail .em-detail-nwh {
display: flex;
flex: 1;
align-self: flex-start;
margin-top: 0.65rem;
color: var(--textDark); }
- /* line 103, src/styles/components/_ecogesture.scss */
+ /* line 110, src/styles/components/_ecogesture.scss */
.em-detail .em-detail-nwh .em-detail-nwh-unit {
margin-left: 0.2rem; }
- /* line 107, src/styles/components/_ecogesture.scss */
+ /* line 114, src/styles/components/_ecogesture.scss */
.em-detail .em-picto-flow {
display: flex;
align-self: flex-end; }
- /* line 110, src/styles/components/_ecogesture.scss */
+ /* line 117, src/styles/components/_ecogesture.scss */
.em-detail .em-picto-flow .em-pic-content {
margin: 0.3em; }
-/* line 116, src/styles/components/_ecogesture.scss */
+/* line 123, src/styles/components/_ecogesture.scss */
.em-content-box {
+ max-height: 25rem;
+ overflow: auto;
+ width: 100%;
display: flex;
- flex-direction: column;
- max-height: 70vh;
- padding: 0.5rem 1.5rem;
- overflow: auto; }
+ justify-content: center;
+ /* width */
+ /* Track */
+ /* Handle */ }
+ /* line 130, src/styles/components/_ecogesture.scss */
+ .em-content-box::-webkit-scrollbar {
+ width: 10px; }
+ /* line 134, src/styles/components/_ecogesture.scss */
+ .em-content-box::-webkit-scrollbar-track {
+ background: #3e4045; }
+ /* line 138, src/styles/components/_ecogesture.scss */
+ .em-content-box::-webkit-scrollbar-thumb {
+ background: #6f7074; }
+ /* line 141, src/styles/components/_ecogesture.scss */
+ .em-content-box .em-content-box-text {
+ display: flex;
+ flex-direction: column;
+ padding: 0.5rem 1.5rem;
+ width: 22.125rem; }
+ @media only screen and (max-width: 768px) {
+ /* line 141, src/styles/components/_ecogesture.scss */
+ .em-content-box .em-content-box-text {
+ width: 100%; } }
/** BLACK **/
/** TEXT COLOR **/
@@ -2104,24 +2276,32 @@ p {
position: fixed;
top: 50%;
left: 50%;
- width: 320px;
+ width: 36rem;
max-width: 100%;
- max-height: 90%;
+ max-height: 30rem;
transform: translate(-50%, -50%);
padding: 1rem 0;
box-sizing: border-box;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
border-radius: 4px; }
- /* line 32, src/styles/components/_modal.scss */
+ @media only screen and (max-width: 768px) {
+ /* line 19, src/styles/components/_modal.scss */
+ .modal-overlay .modal-box {
+ width: 20rem; } }
+ @media only screen and (max-width: 768px) {
+ /* line 19, src/styles/components/_modal.scss */
+ .modal-overlay .modal-box {
+ max-height: unset; } }
+ /* line 38, src/styles/components/_modal.scss */
.modal-overlay .modal-box.modal-box-bordered {
border: 1px solid #58FFFF40; }
- /* line 35, src/styles/components/_modal.scss */
+ /* line 41, src/styles/components/_modal.scss */
.modal-overlay .modal-box .modal-close-button {
position: absolute;
top: 0.5rem;
right: 0.5rem;
padding: 5px 5px; }
- /* line 41, src/styles/components/_modal.scss */
+ /* line 47, src/styles/components/_modal.scss */
.modal-overlay .modal-box .modal-content {
display: flex;
flex-direction: column;
@@ -2145,53 +2325,51 @@ p {
flex-direction: column;
align-items: center;
justify-content: center;
- padding: 1rem 1.5rem;
- margin-top: 1.5rem; }
- /* line 12, src/styles/components/_faq.scss */
+ padding: 0 1.5rem; }
+ /* line 11, src/styles/components/_faq.scss */
.faq-root .faq-content {
- width: 53.125rem; }
- @media only screen and (max-width: 992px) {
- /* line 12, src/styles/components/_faq.scss */
- .faq-root .faq-content {
- width: 47.5rem; } }
+ margin-bottom: -1rem;
+ width: 45.75rem; }
@media only screen and (max-width: 768px) {
- /* line 12, src/styles/components/_faq.scss */
+ /* line 11, src/styles/components/_faq.scss */
.faq-root .faq-content {
width: 100%; } }
- /* line 20, src/styles/components/_faq.scss */
+ /* line 17, src/styles/components/_faq.scss */
.faq-root .faq-content .faq-header {
+ margin-top: 2.5rem;
+ margin-bottom: 1.25rem;
color: #e0e0e0; }
- /* line 23, src/styles/components/_faq.scss */
+ /* line 22, src/styles/components/_faq.scss */
.faq-root .faq-content .faq-content-detail {
padding-bottom: 1rem; }
-/* line 29, src/styles/components/_faq.scss */
+/* line 28, src/styles/components/_faq.scss */
.faq-card-link {
color: black; }
-/* line 32, src/styles/components/_faq.scss */
+/* line 31, src/styles/components/_faq.scss */
.faq-card {
display: flex;
flex-direction: row;
margin: -0.75rem 0;
width: 100%; }
@media only screen and (max-width: 768px) {
- /* line 32, src/styles/components/_faq.scss */
+ /* line 31, src/styles/components/_faq.scss */
.faq-card {
width: 100%; } }
- /* line 40, src/styles/components/_faq.scss */
+ /* line 39, src/styles/components/_faq.scss */
.faq-card .faq-card-content {
display: flex;
flex-direction: row; }
- /* line 43, src/styles/components/_faq.scss */
+ /* line 42, src/styles/components/_faq.scss */
.faq-card .faq-card-content .faq-card-content-icon {
margin: 0.5rem 0; }
- /* line 46, src/styles/components/_faq.scss */
+ /* line 45, src/styles/components/_faq.scss */
.faq-card .faq-card-content .faq-card-content-title {
margin: 0 1rem;
align-self: center; }
-/* line 54, src/styles/components/_faq.scss */
+/* line 53, src/styles/components/_faq.scss */
.faq-view-root {
display: flex;
flex-direction: column;
@@ -2199,15 +2377,11 @@ p {
justify-content: center;
padding: 1rem 0;
margin-top: 1.5rem; }
- /* line 61, src/styles/components/_faq.scss */
+ /* line 60, src/styles/components/_faq.scss */
.faq-view-root .faq-view-content {
- width: 53.125rem; }
- @media only screen and (max-width: 992px) {
- /* line 61, src/styles/components/_faq.scss */
- .faq-view-root .faq-view-content {
- width: 47.5rem; } }
+ width: 45.75rem; }
@media only screen and (max-width: 768px) {
- /* line 61, src/styles/components/_faq.scss */
+ /* line 60, src/styles/components/_faq.scss */
.faq-view-root .faq-view-content {
width: 100%; } }
@@ -2260,7 +2434,7 @@ p {
flex-direction: row;
width: 60%;
height: 90px; }
- @media only screen and (max-width: 992px) {
+ @media only screen and (max-width: 1023px) {
/* line 33, src/styles/components/_splash.scss */
.splash-root .splash-content .splash-step {
width: 80%; } }
@@ -2299,7 +2473,7 @@ p {
.splash-root .splash-footer .splash-footer-button {
max-width: 50vw; }
-/* line 27, src/styles/index.scss */
+/* line 26, src/styles/index.scss */
:root {
--blue: #58FFFF;
--blue40: #58FFFF40;
@@ -2333,10 +2507,10 @@ p {
--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;
--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; }
-/* line 61, src/styles/index.scss */
+/* line 60, src/styles/index.scss */
.application {
overflow-x: hidden; }
@media only screen and (max-width: 768px) {
- /* line 61, src/styles/index.scss */
+ /* line 60, src/styles/index.scss */
.application {
min-height: 100vh; } }