/* Cozy UI utilities classes */
@import url(~cozy-ui/dist/cozy-ui.min.css);
/* Cozy UI React components styles */
@import url(~cozy-ui/react/stylesheet.css);
/* App styles */
/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** 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 13, src/styles/base/_layout.scss */
.column {
  display: flex;
  flex-direction: column; }

/* line 18, src/styles/base/_layout.scss */
.row {
  display: flex;
  flex-direction: row; }

/* line 23, src/styles/base/_layout.scss */
.cozy-bar {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center; }

/* line 30, src/styles/base/_layout.scss */
[role='banner'] .coz-bar-container {
  background-color: white; }
  @media only screen and (max-width: 768px) {
    /* line 30, src/styles/base/_layout.scss */
    [role='banner'] .coz-bar-container {
      padding: 0 3.25em 0 0;
      background-color: unset; } }

/* line 38, src/styles/base/_layout.scss */
.coz-bar-wrapper {
  box-shadow: unset !important;
  background: unset !important; }

/* line 43, src/styles/base/_layout.scss */
.header {
  display: flex;
  align-items: center;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
  z-index: 18;
  position: fixed;
  top: 48px;
  left: 0; }
  @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: 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 68, src/styles/base/_layout.scss */
    .header .header-top .header-text {
      padding: 0 1rem 1rem 1rem;
      color: #e0e0e0; }
  /* line 73, src/styles/base/_layout.scss */
  .header .header-content {
    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 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: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #e0e0e0; }
  /* line 114, src/styles/base/_layout.scss */
  .content-view-loading .content-view-loading-text {
    padding-top: 1rem;
    margin: 0 2rem;
    text-align: center; }
  /* line 119, src/styles/base/_layout.scss */
  .content-view-loading .content-view-loading-button {
    max-width: 50vw;
    margin-top: 1rem; }

/* 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 **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 6, src/styles/base/_typography.scss */
* {
  font-family: Lato, sans-serif; }

/* line 10, src/styles/base/_typography.scss */
h1,
h2,
h3,
h4,
h5,
h6,
p {
  color: #a0a0a0;
  font-family: Lato, sans-serif; }

/* line 21, src/styles/base/_typography.scss */
.home-title {
  font-size: 1rem;
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  line-height: 120%;
  text-transform: uppercase; }

/* line 30, src/styles/base/_typography.scss */
.app-title {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 21px;
  line-height: 24px;
  text-align: center;
  letter-spacing: 0.15px;
  color: #e0e0e0;
  text-shadow: 0px -1px 0px #060609, 0px 1px 0px rgba(255, 255, 255, 0.07); }

/* line 43, src/styles/base/_typography.scss */
.red {
  color: #D25959; }

/* line 46, src/styles/base/_typography.scss */
.blue {
  color: #81abd0; }

/* line 49, src/styles/base/_typography.scss */
.green {
  color: #7fd771; }

/* line 53, src/styles/base/_typography.scss */
.text-14-normal {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 0.875rem;
  line-height: 120%; }

/* line 60, src/styles/base/_typography.scss */
.text-14-normal-uppercase {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 0.875rem;
  line-height: 120%;
  text-transform: uppercase; }

/* line 68, src/styles/base/_typography.scss */
.text-15-normal {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 0.938rem;
  line-height: 120%; }

/* line 75, src/styles/base/_typography.scss */
.text-16-normal {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%; }

/* line 82, src/styles/base/_typography.scss */
.text-16-normal-150 {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 150%; }

/* line 89, src/styles/base/_typography.scss */
.text-16-bold {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1rem;
  line-height: 120%; }

/* line 96, src/styles/base/_typography.scss */
.text-18-medium {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 120%; }

/* line 103, src/styles/base/_typography.scss */
.text-18-bold {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1.125rem;
  line-height: 120%; }

/* line 110, src/styles/base/_typography.scss */
.text-20-bold {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1.25rem;
  line-height: 120%; }

/* line 117, src/styles/base/_typography.scss */
.text-21-bold {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1.313rem;
  line-height: 120%; }

/* line 124, src/styles/base/_typography.scss */
.text-22-normal {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1.375rem;
  line-height: 120%; }

/* line 131, src/styles/base/_typography.scss */
.text-22-bold {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1.375rem;
  line-height: 120%; }

/* line 138, src/styles/base/_typography.scss */
.text-24-normal {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1.5rem;
  line-height: 120%; }

/* line 145, src/styles/base/_typography.scss */
.text-24-bold {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1.5rem;
  line-height: 120%; }

/* Button */
/* line 155, src/styles/base/_typography.scss */
.button-primary-text span {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 164, src/styles/base/_typography.scss */
.button-secondary-text {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/* Card */
/* line 174, src/styles/base/_typography.scss */
.card-title-on {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1.125rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 182, src/styles/base/_typography.scss */
.card-title-off {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 190, src/styles/base/_typography.scss */
.card-text-bold {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 198, src/styles/base/_typography.scss */
.card-result {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: 900;
  font-size: 1.75rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 206, src/styles/base/_typography.scss */
.card-indicator {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 214, src/styles/base/_typography.scss */
.card-text {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/* Chart */
/* line 224, src/styles/base/_typography.scss */
.chart-date {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1rem;
  line-height: 123%;
  color: #e0e0e0; }

/* line 232, src/styles/base/_typography.scss */
.chart-result {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 2.25rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 240, src/styles/base/_typography.scss */
.chart-fluid {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 248, src/styles/base/_typography.scss */
.chart-switch-text {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/* line 256, src/styles/base/_typography.scss */
.chart-ticks-x-text {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%; }
  @media only screen and (max-width: 768px) {
    /* line 256, src/styles/base/_typography.scss */
    .chart-ticks-x-text {
      font-size: 0.875rem; } }

/* line 266, src/styles/base/_typography.scss */
.chart-ticks-y-text {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 0.9rem;
  line-height: 120%; }
  @media only screen and (max-width: 768px) {
    /* line 266, src/styles/base/_typography.scss */
    .chart-ticks-y-text {
      font-size: 0.75rem; } }

/* Cozy bar */
/* line 278, src/styles/base/_typography.scss */
.cozybar {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1.3125rem;
  line-height: 120%;
  color: #e0e0e0; }

/* List */
/* line 288, src/styles/base/_typography.scss */
.list-title {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 0.875rem;
  line-height: 120%;
  text-transform: uppercase;
  color: #e0e0e0; }

/* Tab */
/* line 299, src/styles/base/_typography.scss */
.tab-text-on {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1rem;
  line-height: 120%; }

/* line 306, src/styles/base/_typography.scss */
.tab-text-off {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  line-height: 120%;
  color: #e0e0e0; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* 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%);
  background-color: #25262b;
  display: flex;
  flex-direction: column;
  color: white;
  padding: 1rem 1.5rem;
  margin: 2vh 2vw 2vh 0vw;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75); }
  @media only screen and (max-width: 768px) {
    /* line 14, src/styles/components/_card.scss */
    .card {
      margin: 2vh 0; } }
  /* line 27, src/styles/components/_card.scss */
  .card.orange {
    border: 1px solid rgba(216, 123, 57, 0.4); }
  /* line 30, src/styles/components/_card.scss */
  .card.blue {
    border: 1px solid rgba(58, 152, 236, 0.4); }
  /* line 33, src/styles/components/_card.scss */
  .card.green {
    border: 1px solid rgba(69, 209, 184, 0.4); }
  /* 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 43, src/styles/components/_card.scss */
  .card h1 {
    font-size: 1rem;
    font-style: normal;
    font-weight: normal;
    line-height: 120%;
    color: white; }
  /* line 50, src/styles/components/_card.scss */
  .card p {
    font-style: normal;
    font-weight: normal;
    font-size: 1rem;
    line-height: 120%; }
  /* line 56, src/styles/components/_card.scss */
  .card .card-header {
    flex-direction: row;
    display: flex;
    justify-content: left;
    padding: 0.75rem 0rem; }
    /* line 61, src/styles/components/_card.scss */
    .card .card-header div:first-of-type {
      margin-left: 3.5vw; }
    /* line 64, src/styles/components/_card.scss */
    .card .card-header h2 {
      margin: 0;
      color: #e0e0e0;
      font-style: normal;
      font-weight: normal;
      font-size: 2rem;
      line-height: 120%; }
      /* line 71, src/styles/components/_card.scss */
      .card .card-header h2 span {
        color: #e0e0e0;
        font-weight: 600;
        font-size: 2.3rem; }
    /* line 77, src/styles/components/_card.scss */
    .card .card-header h3 {
      margin: 0;
      font-style: normal;
      font-weight: bold;
      font-size: 1rem;
      line-height: 120%; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 4, src/styles/components/_form.scss */
.form {
  padding: 1vh 1.5vw; }
  @media only screen and (max-width: 768px) {
    /* line 4, src/styles/components/_form.scss */
    .form {
      padding: 1vh 0; } }
  /* line 9, src/styles/components/_form.scss */
  .form label {
    font-style: normal;
    font-weight: normal;
    font-size: 1rem;
    color: #e0e0e0;
    margin-top: 0rem; }
  /* line 16, src/styles/components/_form.scss */
  .form .form-input {
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid #7b7b7b;
    border-radius: 4px;
    color: #e0e0e0;
    padding: 0 5%; }
  /* line 23, src/styles/components/_form.scss */
  .form .form-group {
    display: flex;
    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 33, src/styles/components/_form.scss */
  .form .form-control {
    height: 3rem; }
    @media only screen and (max-width: 768px) {
      /* line 33, src/styles/components/_form.scss */
      .form .form-control {
        max-width: 100vw; } }
  /* line 39, src/styles/components/_form.scss */
  .form .form-message {
    color: #ce3535;
    min-height: 1.25rem; }
  /* line 43, src/styles/components/_form.scss */
  .form ::placeholder {
    color: #e0e0e0; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 6, src/styles/components/_button.scss */
.btn-primary {
  height: 3rem;
  padding: 0.5vh 2vw 0.5vh 2vw;
  background-color: #b2901b;
  border: 1px solid rgba(227, 184, 42, 0.2);
  box-shadow: 0px 2px 6px #1E1C1C;
  border-radius: 2px;
  margin: 1rem 0 1rem 0;
  color: black;
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  text-transform: capitalize; }
  /* line 23, src/styles/components/_button.scss */
  .btn-primary:hover {
    cursor: pointer;
    background-color: #deaf0e;
    color: #242633; }
  /* line 28, src/styles/components/_button.scss */
  .btn-primary:active {
    position: relative;
    top: 1px;
    background-color: #c59f1c; }
  /* line 34, src/styles/components/_button.scss */
  .btn-primary:focus {
    cursor: pointer;
    outline: none; }

/* line 41, src/styles/components/_button.scss */
.btn-secondary {
  background-color: #deaf0e;
  color: black;
  height: 3rem;
  padding: 0.5vh 2vw 0.5vh 2vw;
  margin: 1rem 0 1rem 0;
  text-transform: capitalize;
  border: 1px solid rgba(227, 184, 42, 0.2);
  box-shadow: -2px -2px 6px rgba(227, 184, 42, 0.2), 2px 2px 6px #1E1C1C;
  border-radius: 6px;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%; }

/* line 60, src/styles/components/_button.scss */
.btn-secondary-negative {
  border: 1px solid #deaf0e;
  height: 3rem;
  padding: 0.5vh 2vw 0.5vh 2vw;
  margin: 1rem 0 1rem 0;
  text-transform: capitalize;
  box-shadow: -2px -2px 6px rgba(227, 184, 42, 0.2), 2px 2px 6px #1E1C1C;
  border-radius: 6px;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #E0E0E0; }

/* line 78, src/styles/components/_button.scss */
.btn-chevron {
  margin: 1rem 1rem 1rem 0;
  color: white;
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 120%; }
  /* line 88, src/styles/components/_button.scss */
  .btn-chevron:hover {
    cursor: pointer;
    color: white; }

/* line 94, src/styles/components/_button.scss */
.btn-long-string {
  height: 3rem;
  padding: 0.5vh 2vw 0.5vh 2vw;
  border: 1px solid #121212;
  box-sizing: border-box;
  border-radius: 2px;
  color: white;
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  margin: 1rem 0 1rem 0; }

/*
.btn {
  height: 3rem;
  padding: 0.5vh 2vw 0.5vh 2vw;
  background-color: $gold;
  border: none;
  margin: 1rem 0 1rem 0;
  color: $text-black;
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  text-transform: capitalize;
  &.active{
    opacity: 0.3;
  }
  &:hover {
    cursor: pointer;
    background-color: $gold-light;
    color: $dark;
  }
  &:active {
    position:relative;
    top:1px;
    background-color: #c59f1c;
  }
  .btn-content{
    display: inline-flex;
    align-items: center;
    .btn-icon{
      margin-right: 1.5vw;
    }
  }
}
*/
/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 4, src/styles/components/_konnector.scss */
.accordion {
  display: flex;
  flex-direction: column;
  color: white;
  padding: 1rem 1rem;
  margin-bottom: 2vh;
  border-radius: 4px;
  background: linear-gradient(180deg, #323339 0%, #25262b 100%);
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.75);
  transition: background-color 0.6s ease; }
  /* line 14, src/styles/components/_konnector.scss */
  .accordion.active {
    background-color: #34353a; }
  /* line 18, src/styles/components/_konnector.scss */
  .accordion .accordion-header {
    display: flex;
    align-items: center;
    border: none;
    outline: none; }
    /* 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 26, src/styles/components/_konnector.scss */
        .accordion .accordion-header .accordion-icon {
          max-width: 16vw; } }
    /* line 32, src/styles/components/_konnector.scss */
    .accordion .accordion-header .accordion-info {
      flex: 3;
      color: #e0e0e0; }
      @media only screen and (max-width: 768px) {
        /* line 32, src/styles/components/_konnector.scss */
        .accordion .accordion-header .accordion-info {
          display: block; } }
      /* line 38, src/styles/components/_konnector.scss */
      .accordion .accordion-header .accordion-info .accordion-title {
        flex: 1; }
    /* line 45, src/styles/components/_konnector.scss */
    .accordion .accordion-header .state-picto {
      position: absolute; }
  /* line 49, src/styles/components/_konnector.scss */
  .accordion .accordion-update {
    flex: 2;
    padding: 0.5rem 1rem; }
  /* line 53, src/styles/components/_konnector.scss */
  .accordion .accordion-state {
    flex: 2;
    margin-right: 1rem; }
  /* line 57, src/styles/components/_konnector.scss */
  .accordion .accordion-frequency {
    flex: 1;
    padding: 0 1rem; }
  /* line 61, src/styles/components/_konnector.scss */
  .accordion .accordion-caption {
    font-size: 0.8rem;
    color: #a0a0a0;
    text-transform: lowercase; }
    /* line 65, src/styles/components/_konnector.scss */
    .accordion .accordion-caption::first-letter {
      text-transform: uppercase; }
  /* line 69, src/styles/components/_konnector.scss */
  .accordion .accordion-caption-red {
    color: #ce3535; }
  /* line 72, src/styles/components/_konnector.scss */
  .accordion .accordion-content {
    overflow: hidden;
    transition: max-height 0.6s ease; }
  /* line 76, src/styles/components/_konnector.scss */
  .accordion .inline-buttons {
    display: flex;
    flex-flow: row nowrap; }
  /* line 80, src/styles/components/_konnector.scss */
  .accordion .btn-position {
    width: 100%;
    margin: 0.5rem 1rem; }

/* line 86, src/styles/components/_konnector.scss */
.kv-root {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 1.5rem; }
  /* line 92, src/styles/components/_konnector.scss */
  .kv-root .kv-content {
    width: 45.75rem; }
    @media only screen and (max-width: 768px) {
      /* line 92, src/styles/components/_konnector.scss */
      .kv-root .kv-content {
        width: 100%; } }
    /* line 97, src/styles/components/_konnector.scss */
    .kv-root .kv-content .kv-header {
      margin-top: 2.5rem;
      margin-bottom: 1.25rem;
      color: #e0e0e0; }

/* line 105, src/styles/components/_konnector.scss */
.state-icon {
  height: 22px;
  width: 22px;
  margin-left: 32px;
  margin-bottom: 40px; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 5, src/styles/components/_fluid.scss */
.sf {
  display: flex;
  flex-direction: column; }
  /* line 9, src/styles/components/_fluid.scss */
  .sf .sf-header .sf-header-title {
    color: #e0e0e0; }
  /* line 12, src/styles/components/_fluid.scss */
  .sf .sf-header .sf-header-text {
    color: #a0a0a0; }
  /* line 16, src/styles/components/_fluid.scss */
  .sf .sf-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 3rem; }
    /* line 21, src/styles/components/_fluid.scss */
    .sf .sf-content .sf-link {
      margin: 1rem; }

/* line 28, src/styles/components/_fluid.scss */
.fc-root {
  background-color: #121212;
  padding: 2rem 2rem 1rem 2rem;
  margin-bottom: 1rem; }
  @media only screen and (max-width: 768px) {
    /* line 28, src/styles/components/_fluid.scss */
    .fc-root {
      padding: 1.5rem 1rem 1rem 1rem;
      margin-bottom: 0.5rem; } }
  /* line 36, src/styles/components/_fluid.scss */
  .fc-root .fc-content {
    min-height: 31.875rem; }
    @media only screen and (max-width: 768px) {
      /* line 36, src/styles/components/_fluid.scss */
      .fc-root .fc-content {
        min-height: 23.875rem; } }
    /* line 41, src/styles/components/_fluid.scss */
    .fc-root .fc-content .fc-loader {
      min-height: 31.875rem;
      display: flex;
      justify-content: center;
      align-items: center; }
      @media only screen and (max-width: 768px) {
        /* line 41, src/styles/components/_fluid.scss */
        .fc-root .fc-content .fc-loader {
          min-height: 23.875rem; } }

/* line 54, src/styles/components/_fluid.scss */
.fv-root {
  direction: 'rtl'; }
  /* line 56, src/styles/components/_fluid.scss */
  .fv-root .fv-nav-period {
    display: flex;
    flex-direction: row; }
    /* line 59, src/styles/components/_fluid.scss */
    .fv-root .fv-nav-period .nav-button {
      flex: 1;
      font-size: large; }
  /* line 64, src/styles/components/_fluid.scss */
  .fv-root .fv-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 8.375rem;
    margin-bottom: 0.25rem; }
  /* line 71, src/styles/components/_fluid.scss */
  .fv-root .fv-footer {
    display: flex;
    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;
      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;
      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 112, src/styles/components/_fluid.scss */
.fs-root {
  flex: 1;
  height: 22rem; }
  @media only screen and (max-width: 768px) {
    /* line 112, src/styles/components/_fluid.scss */
    .fs-root {
      height: 14rem; } }
  /* line 118, src/styles/components/_fluid.scss */
  .fs-root .fs-slide {
    min-height: 22rem;
    overflow-x: hidden;
    display: flex;
    justify-content: center;
    align-items: center; }
    @media only screen and (max-width: 768px) {
      /* line 118, src/styles/components/_fluid.scss */
      .fs-root .fs-slide {
        min-height: 14rem; } }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* 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 **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 4, src/styles/components/_consumptionvisualizer.scss */
.cv {
  display: flex;
  flex-direction: column;
  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: 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 24, src/styles/components/_consumptionvisualizer.scss */
      .cv .cv-content-date .cv-date-group .cv-date {
        color: #e0e0e0; }
        /* line 26, src/styles/components/_consumptionvisualizer.scss */
        .cv .cv-content-date .cv-date-group .cv-date::first-letter {
          text-transform: uppercase; }
  /* line 32, src/styles/components/_consumptionvisualizer.scss */
  .cv .cv-load {
    min-height: 5.25rem;
    display: flex;
    align-items: center; }
    /* line 36, src/styles/components/_consumptionvisualizer.scss */
    .cv .cv-load .cv-load-content {
      display: flex;
      flex-direction: row;
      align-items: center; }
      /* 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 45, src/styles/components/_consumptionvisualizer.scss */
        .cv .cv-load .cv-load-content .cv-load-section.cv-load-section-left {
          align-items: flex-end; }
        /* 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 51, src/styles/components/_consumptionvisualizer.scss */
        .cv .cv-load .cv-load-content .cv-load-section .cv-load-value {
          flex-direction: row; }
          /* 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 61, src/styles/components/_consumptionvisualizer.scss */
  .cv .cv-euro {
    display: flex;
    flex-direction: row; }
    /* line 64, src/styles/components/_consumptionvisualizer.scss */
    .cv .cv-euro .cv-euro-link {
      text-decoration: none;
      color: transparent; }
    /* line 68, src/styles/components/_consumptionvisualizer.scss */
    .cv .cv-euro .cv-euro-fluid {
      padding: 0 0.5rem;
      display: flex;
      align-items: center; }
      /* line 72, src/styles/components/_consumptionvisualizer.scss */
      .cv .cv-euro .cv-euro-fluid .cv-euro-fluid-icon {
        margin-right: 0.5rem; }
      /* line 75, src/styles/components/_consumptionvisualizer.scss */
      .cv .cv-euro .cv-euro-fluid div {
        padding-top: 0.2rem; }
  /* line 80, src/styles/components/_consumptionvisualizer.scss */
  .cv .cv-info {
    min-height: 1.5rem;
    display: flex;
    align-items: center; }
  /* line 85, src/styles/components/_consumptionvisualizer.scss */
  .cv .electricity {
    color: #d87b39; }
  /* line 88, src/styles/components/_consumptionvisualizer.scss */
  .cv .electricity-compare {
    color: #e2bca1; }
  /* line 91, src/styles/components/_consumptionvisualizer.scss */
  .cv .water {
    color: #3a98ec; }
  /* line 94, src/styles/components/_consumptionvisualizer.scss */
  .cv .water-compare {
    color: #abd4fa; }
  /* line 97, src/styles/components/_consumptionvisualizer.scss */
  .cv .gas {
    color: #45d1b8; }
  /* line 100, src/styles/components/_consumptionvisualizer.scss */
  .cv .gas-compare {
    color: #a8f7e9; }
  /* line 103, src/styles/components/_consumptionvisualizer.scss */
  .cv .multifluid {
    color: #ffffff; }
  /* line 106, src/styles/components/_consumptionvisualizer.scss */
  .cv .multifluid-compare {
    color: #ffd597; }
  /* line 109, src/styles/components/_consumptionvisualizer.scss */
  .cv .error {
    color: #d24444; }
  /* line 112, src/styles/components/_consumptionvisualizer.scss */
  .cv .error-line {
    color: #d24444;
    cursor: pointer;
    display: flex;
    align-items: center; }
  /* line 118, src/styles/components/_consumptionvisualizer.scss */
  .cv .underlined-error {
    border-bottom: solid 1px #d24444; }
  /* line 121, src/styles/components/_consumptionvisualizer.scss */
  .cv .warning-icon {
    margin-right: 4px; }
  /* line 124, src/styles/components/_consumptionvisualizer.scss */
  .cv .multifluid-compare {
    color: #ffd597; }
  /* line 127, src/styles/components/_consumptionvisualizer.scss */
  .cv .cv-button {
    border: none;
    background: none;
    color: #a0a0a0;
    text-decoration: underline; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 4, src/styles/components/_barchart.scss */
.axis {
  color: #7b7b7b; }
  /* line 6, src/styles/components/_barchart.scss */
  .axis .tick-text {
    fill: #7b7b7b; }
    /* line 8, src/styles/components/_barchart.scss */
    .axis .tick-text.tick-text-selected {
      fill: #e0e0e0; }

/* line 13, src/styles/components/_barchart.scss */
.background-true {
  display: inline; }

/* line 16, src/styles/components/_barchart.scss */
.background-false {
  display: none; }

/* line 19, src/styles/components/_barchart.scss */
.bar-ELECTRICITY {
  fill: #5d3d2a; }
  /* line 21, src/styles/components/_barchart.scss */
  .bar-ELECTRICITY.selected {
    fill: #d87b39;
    filter: drop-shadow(0 -0.1rem 0.2rem #d87b39); }

/* line 27, src/styles/components/_barchart.scss */
.bar-compare-ELECTRICITY {
  fill: #795c47; }
  /* line 29, src/styles/components/_barchart.scss */
  .bar-compare-ELECTRICITY.selected {
    fill: #e2bca1;
    filter: drop-shadow(0 -0.1rem 0.2rem #e2bca1); }

/* line 35, src/styles/components/_barchart.scss */
.bar-WATER {
  fill: #20415e; }
  /* line 37, src/styles/components/_barchart.scss */
  .bar-WATER.selected {
    fill: #3a98ec;
    filter: drop-shadow(0 -0.1rem 0.2rem #3a98ec); }

/* line 43, src/styles/components/_barchart.scss */
.bar-compare-WATER {
  fill: #4d5c6e; }
  /* line 45, src/styles/components/_barchart.scss */
  .bar-compare-WATER.selected {
    fill: #abd4fa;
    filter: drop-shadow(0 -0.1rem 0.2rem #abd4fa); }

/* line 51, src/styles/components/_barchart.scss */
.bar-GAS {
  fill: #184940; }
  /* line 53, src/styles/components/_barchart.scss */
  .bar-GAS.selected {
    fill: #45d1b8;
    filter: drop-shadow(0 -0.1rem 0.2rem #45d1b8); }

/* line 59, src/styles/components/_barchart.scss */
.bar-compare-GAS {
  fill: #597773; }
  /* line 61, src/styles/components/_barchart.scss */
  .bar-compare-GAS.selected {
    fill: #a8f7e9;
    filter: drop-shadow(0 -0.1rem 0.2rem #a8f7e9); }

/* line 67, src/styles/components/_barchart.scss */
.bar-MULTIFLUID {
  fill: #705d1d; }
  /* line 69, src/styles/components/_barchart.scss */
  .bar-MULTIFLUID.selected {
    fill: #e3b82a;
    filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a); }

/* line 75, src/styles/components/_barchart.scss */
.bar-compare-MULTIFLUID {
  fill: #7d6a4e; }
  /* line 77, src/styles/components/_barchart.scss */
  .bar-compare-MULTIFLUID.selected {
    fill: #ffd597;
    filter: drop-shadow(0 -0.1rem 0.2rem #e3b82a); }

/** Animation **/
/* line 84, src/styles/components/_barchart.scss */
.bounce-1 {
  animation-name: bounce-1;
  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);
  animation-iteration-count: 1;
  transform-origin: bottom center;
  transform-box: fill-box; }

@keyframes bounce-1 {
  0% {
    transform: scale(0.1, 0.1); }
  28% {
    transform: scale(0.1, 1.1); }
  45% {
    transform: scale(0.8, 0.95); }
  55% {
    transform: scale(1, 1); }
  65% {
    transform: scale(1, 0.98); }
  75% {
    transform: scale(1, 1); } }

/* line 112, src/styles/components/_barchart.scss */
.bounce-2 {
  animation-name: bounce-2;
  animation-timing-function: cubic-bezier(1, 1, 0.42, 1);
  animation-iteration-count: 1;
  transform-origin: bottom center;
  transform-box: fill-box; }

@keyframes bounce-2 {
  0% {
    transform: scale(1, 1); }
  28% {
    transform: scale(1, 1.1); }
  45% {
    transform: scale(0.8, 0.95); }
  55% {
    transform: scale(1, 1); }
  65% {
    transform: scale(1, 0.98); }
  75% {
    transform: scale(1, 1); } }

/** Animatio ndelay **/
/* line 141, src/styles/components/_barchart.scss */
.delay {
  animation-duration: 0.4s; }

/* line 144, src/styles/components/_barchart.scss */
.delay--0 {
  animation-duration: 0.6s; }

/* line 147, src/styles/components/_barchart.scss */
.delay--1 {
  animation-duration: 0.7s; }

/* line 150, src/styles/components/_barchart.scss */
.delay--2 {
  animation-duration: 0.8s; }

/* line 153, src/styles/components/_barchart.scss */
.delay--3 {
  animation-duration: 0.9s; }

/* line 156, src/styles/components/_barchart.scss */
.delay--4 {
  animation-duration: 1s; }

/* line 159, src/styles/components/_barchart.scss */
.delay--5 {
  animation-duration: 1.1s; }

/* line 162, src/styles/components/_barchart.scss */
.delay--6 {
  animation-duration: 1.2s; }

/* line 165, src/styles/components/_barchart.scss */
.delay--7 {
  animation-duration: 1.3s; }

/* line 168, src/styles/components/_barchart.scss */
.delay--8 {
  animation-duration: 1.4s; }

/* line 171, src/styles/components/_barchart.scss */
.delay--9 {
  animation-duration: 1.5s; }

/* line 174, src/styles/components/_barchart.scss */
.delay--10 {
  animation-duration: 1.6s; }

/* line 177, src/styles/components/_barchart.scss */
.delay--11 {
  animation-duration: 1.8s; }

/* line 180, src/styles/components/_barchart.scss */
.delay--12 {
  animation-duration: 1.9s; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 4, src/styles/components/_nav.scss */
.o-sidebar {
  background-color: #25262b;
  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;
  z-index: 19; }
  @media only screen and (max-width: 1023px) {
    /* line 4, src/styles/components/_nav.scss */
    .o-sidebar {
      background-color: #25262b; } }

/* line 21, src/styles/components/_nav.scss */
.c-nav-link {
  padding: 0 1rem; }
  /* line 23, src/styles/components/_nav.scss */
  .c-nav-link .on {
    display: none; }
  /* line 26, src/styles/components/_nav.scss */
  .c-nav-link .off {
    display: block; }

/* line 36, src/styles/components/_nav.scss */
.c-nav-link .c-nav-icon {
  padding-right: 0.5rem;
  width: 50px;
  height: 36px;
  fill: none; }

/* line 43, src/styles/components/_nav.scss */
.c-nav-link.is-active {
  box-shadow: inset 0.25rem 0 0 0 #b2901b; }

/* line 47, src/styles/components/_nav.scss */
.c-nav-link.is-active .c-nav-icon {
  fill: #b2901b !important; }

/* line 51, src/styles/components/_nav.scss */
.c-nav-link.is-active {
  color: white;
  text-decoration: none; }
  /* line 54, src/styles/components/_nav.scss */
  .c-nav-link.is-active .on {
    display: block; }
  /* line 57, src/styles/components/_nav.scss */
  .c-nav-link.is-active .off {
    display: none; }

@media only screen and (max-width: 1023px) {
  /* line 63, src/styles/components/_nav.scss */
  .o-sidebar {
    height: 56px; }
  /* line 66, src/styles/components/_nav.scss */
  .c-nav-link {
    padding: 0; }
  /* line 70, src/styles/components/_nav.scss */
  .c-nav-link .c-nav-icon {
    padding: 0;
    margin: auto; }
  /* line 75, src/styles/components/_nav.scss */
  .c-nav-link.is-active {
    box-shadow: unset; } }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 5, src/styles/components/_indicators.scss */
.fi-root {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1.5rem; }
  @media only screen and (max-width: 768px) {
    /* line 5, src/styles/components/_indicators.scss */
    .fi-root {
      margin-bottom: 0; } }
  /* line 15, src/styles/components/_indicators.scss */
  .fi-root .fi-content {
    min-height: 23.875rem;
    width: 45.75rem; }
    @media only screen and (max-width: 768px) {
      /* line 15, src/styles/components/_indicators.scss */
      .fi-root .fi-content {
        width: 100%; } }
    /* 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 39, src/styles/components/_indicators.scss */
    .fi-root .sfi-content .sfi-redirect {
      margin-bottom: 1.25rem;
      display: flex;
      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 54, src/styles/components/_indicators.scss */
.fpi-link {
  color: transparent; }

/* line 57, src/styles/components/_indicators.scss */
.fpi {
  display: flex;
  flex-direction: row;
  margin: 0.25rem 0.25rem;
  width: 100%; }
  /* line 62, src/styles/components/_indicators.scss */
  .fpi .fpi-left {
    flex: 1;
    display: flex;
    flex-direction: column; }
    /* line 66, src/styles/components/_indicators.scss */
    .fpi .fpi-left .fpi-title {
      align-content: flex-start;
      margin-bottom: 0.5rem; }
    /* line 70, src/styles/components/_indicators.scss */
    .fpi .fpi-left .fpi-content {
      display: flex;
      flex-direction: row; }
      /* line 73, src/styles/components/_indicators.scss */
      .fpi .fpi-left .fpi-content .fpi-content-icon {
        margin: 0.5rem 0; }
      /* line 76, src/styles/components/_indicators.scss */
      .fpi .fpi-left .fpi-content .fpi-content-perf {
        margin: 0 1rem;
        align-self: center; }
        /* line 79, src/styles/components/_indicators.scss */
        .fpi .fpi-left .fpi-content .fpi-content-perf .fpi-content-perf-result {
          color: #e0e0e0; }
          /* 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 86, src/styles/components/_indicators.scss */
        .fpi .fpi-left .fpi-content .fpi-content-perf .fpi-content-perf-indicator {
          color: #a0a0a0; }
          /* 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 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 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 102, src/styles/components/_indicators.scss */
    .fpi .fpi-left .fpi-footer {
      margin-top: 0.5rem;
      color: #a0a0a0; }
  /* line 107, src/styles/components/_indicators.scss */
  .fpi .fpi-right {
    align-self: center; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 5, src/styles/components/_challenges.scss */
.ccc-root {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem 1.5rem; }
  /* line 11, src/styles/components/_challenges.scss */
  .ccc-root .ccc-content {
    min-height: 9rem;
    width: 45.75rem; }
    @media only screen and (max-width: 768px) {
      /* line 11, src/styles/components/_challenges.scss */
      .ccc-root .ccc-content {
        width: 100%; } }
    /* line 17, src/styles/components/_challenges.scss */
    .ccc-root .ccc-content .ccc-header {
      margin-top: 0.375rem;
      margin-bottom: 1.25rem;
      color: #e0e0e0; }

/* 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 65, src/styles/components/_challenges.scss */
.cli-link {
  color: black;
  text-decoration: none; }

/* line 69, src/styles/components/_challenges.scss */
.cli {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  margin: 2rem 0.5rem;
  border-radius: 2px; }
  @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 83, src/styles/components/_challenges.scss */
  .cli.cli-ongoing {
    border: 1px solid #58FFFF;
    background: #121212;
    -webkit-transform: translateZ(0);
    transform: translateZ(0); }
  /* line 89, src/styles/components/_challenges.scss */
  .cli .cli-left {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding-left: 1.415rem; }
    /* line 94, src/styles/components/_challenges.scss */
    .cli .cli-left .cli-content {
      display: flex;
      flex-direction: row; }
      /* line 97, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .cli-content-icon {
        margin: 0.5rem 0; }
      /* line 100, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .cli-content-title {
        color: #ffffff;
        margin: 0 1rem;
        align-self: center; }
      /* line 105, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .subtitle-finished {
        color: #a0a0a0; }
      /* line 108, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .title-finished {
        color: #e0e0e0; }
      /* line 111, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .subtitle-ongoing {
        color: #58FFFF; }
      /* line 114, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .title-ongoing {
        color: #ffffff; }
      /* line 117, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .subtitle-available {
        color: #121212; }
      /* line 120, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .title-available {
        color: #121212; }
      /* line 123, src/styles/components/_challenges.scss */
      .cli .cli-left .cli-content .title-locked {
        color: #a0a0a0;
        opacity: 0.35; }
  /* line 129, src/styles/components/_challenges.scss */
  .cli .cli-right {
    align-self: center;
    padding-right: 1.2rem; }
    /* line 132, src/styles/components/_challenges.scss */
    .cli .cli-right.cli-right-ongoing {
      padding-right: calc(1.2rem + 2px); }
    /* line 135, src/styles/components/_challenges.scss */
    .cli .cli-right.cli-right-available {
      padding-right: calc(1.2rem + 2px); }

/* line 142, src/styles/components/_challenges.scss */
.cc-link {
  color: black;
  text-decoration: none; }

/* line 146, src/styles/components/_challenges.scss */
.cc {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  margin: 0.25rem 0.25rem;
  width: 100%; }
  /* line 152, src/styles/components/_challenges.scss */
  .cc .cc-content-left {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: inherit; }
    /* line 158, src/styles/components/_challenges.scss */
    .cc .cc-content-left .cc-content-title {
      color: #ffffff; }
      /* line 160, src/styles/components/_challenges.scss */
      .cc .cc-content-left .cc-content-title.cc-content-title-padding {
        padding-top: 1rem; }
    /* line 164, src/styles/components/_challenges.scss */
    .cc .cc-content-left .cc-content-progress {
      margin-top: 1rem; }
    /* line 167, src/styles/components/_challenges.scss */
    .cc .cc-content-left .cc-content-timeline {
      padding: 0 0.5rem; }
    /* line 170, src/styles/components/_challenges.scss */
    .cc .cc-content-left .cc-content-visu {
      padding: 1rem 0; }
  /* 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 180, src/styles/components/_challenges.scss */
    .cc .cc-content-right .cc-notification {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 1.8125rem;
      width: 1.8125rem;
      border-radius: 50%;
      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;
      color: black;
      margin-right: 1rem; }

/* 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: 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;
    margin-bottom: 210px; }
  /* line 234, src/styles/components/_challenges.scss */
  .cm-content .cm-win-badge-star {
    display: grid;
    align-items: center;
    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 245, src/styles/components/_challenges.scss */
    .cm-content .cm-win-badge-star .cm-win-star {
      grid-column: 1;
      grid-row: 1; }
  /* line 250, src/styles/components/_challenges.scss */
  .cm-content .cm-badge {
    margin: 2rem; }
  /* line 253, src/styles/components/_challenges.scss */
  .cm-content .cm-button-valid {
    margin-top: 1rem;
    width: 100%; }
  /* line 257, src/styles/components/_challenges.scss */
  .cm-content .cm-txt {
    text-align: center;
    margin-bottom: 1rem;
    width: 100%; }
  /* line 262, src/styles/components/_challenges.scss */
  .cm-content .cm-text-new-available {
    margin-top: 1.25rem; }

/* line 266, src/styles/components/_challenges.scss */
.cm-overspent-value {
  color: #D25959; }

/* 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 277, src/styles/components/_challenges.scss */
  .list-of-days-duration .day-solo {
    display: flex;
    flex-direction: column;
    width: 100%; }
    /* 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 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 292, src/styles/components/_challenges.scss */
      .list-of-days-duration .day-solo .day-line-label .past {
        background-color: #58FFFF; }
      /* line 295, src/styles/components/_challenges.scss */
      .list-of-days-duration .day-solo .day-line-label .futur {
        background-color: #7b7b7b; }
      /* 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 305, src/styles/components/_challenges.scss */
    .list-of-days-duration .day-solo .day-letter {
      margin-top: 0.8rem;
      text-align: center;
      color: #a0a0a0; }
    /* 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 319, src/styles/components/_challenges.scss */
.view-start-date {
  padding: 0.25rem 0;
  color: #58FFFF; }

/* 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 331, src/styles/components/_challenges.scss */
  .pile-energy-follow .pile-section {
    display: grid; }
    /* line 333, src/styles/components/_challenges.scss */
    .pile-energy-follow .pile-section .filter-pile {
      grid-column: 1;
      grid-row: 1;
      justify-self: flex-end;
      align-self: center;
      width: 0%;
      position: relative;
      right: 0;
      opacity: 0.8;
      background-color: #121212;
      z-index: 1; }
    /* line 345, src/styles/components/_challenges.scss */
    .pile-energy-follow .pile-section .pile-icon {
      grid-column: 1;
      grid-row: 1;
      margin: -25px 0; }
  /* line 351, src/styles/components/_challenges.scss */
  .pile-energy-follow .max-energy {
    color: #7b7b7b; }
  /* line 354, src/styles/components/_challenges.scss */
  .pile-energy-follow .no-values-section {
    color: #ffffff;
    padding-right: 1rem; }

/* line 361, src/styles/components/_challenges.scss */
.ongoing-challenge {
  min-height: 620px; }

/* line 364, src/styles/components/_challenges.scss */
.cp-root {
  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;
    min-height: 84vh;
    justify-content: space-between; }
    /* line 374, src/styles/components/_challenges.scss */
    .cp-root .--locked.cp-content {
      justify-content: center; }
    /* line 379, src/styles/components/_challenges.scss */
    .cp-root .cp-content .cp-info, .cp-root .cp-content .cp-info.--available {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      background-color: #121212;
      width: 100%;
      padding-top: 1rem;
      padding-bottom: 0.5rem; }
      /* line 388, src/styles/components/_challenges.scss */
      .cp-root .cp-content .--available.cp-info {
        height: 74vh; }
      /* line 392, src/styles/components/_challenges.scss */
      .cp-root .cp-content .cp-info .cp-icon {
        margin-bottom: 1rem; }
      /* line 395, src/styles/components/_challenges.scss */
      .cp-root .cp-content .cp-info .cp-icon-available {
        margin: 2rem; }
      /* line 398, src/styles/components/_challenges.scss */
      .cp-root .cp-content .cp-info .cp-win-badge-star {
        display: grid;
        align-items: center;
        justify-items: center; }
        /* line 402, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-info .cp-win-badge-star .cp-win-badge {
          grid-column: 1;
          grid-row: 1;
          z-index: 1; }
        /* line 407, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-info .cp-win-badge-star .cp-win-star {
          grid-column: 1;
          grid-row: 1; }
      /* line 412, src/styles/components/_challenges.scss */
      .cp-root .cp-content .cp-info .cp-date {
        color: #a0a0a0;
        text-align: center;
        margin-top: 1rem; }
      /* line 417, src/styles/components/_challenges.scss */
      .cp-root .cp-content .cp-info .cp-title {
        color: #e0e0e0;
        text-align: center;
        margin-top: 0.5rem; }
      /* line 422, 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 427, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-info .cp-result .cp-result-positif {
          color: #7fd771; }
        /* line 430, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-info .cp-result .cp-result-negatif {
          color: #d24444; }
      /* line 434, 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;
        max-width: 53rem; }
      /* line 442, src/styles/components/_challenges.scss */
      .cp-root .cp-content .cp-info .cp-valid {
        justify-content: center;
        display: flex;
        flex-direction: row;
        width: 90%;
        margin-top: 0.75rem;
        max-width: 53rem; }
        /* line 449, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-info .cp-valid .cp-left-button {
          margin-right: 0.25rem;
          margin-left: 0;
          width: 100%; }
        /* line 454, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-info .cp-valid .cp-right-button {
          margin-left: 0.25rem;
          margin-right: 0;
          width: 100%; }
    /* line 461, src/styles/components/_challenges.scss */
    .cp-root .cp-content .cp-follow {
      width: 90%;
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-bottom: 1rem;
      max-width: 53rem; }
    /* line 469, src/styles/components/_challenges.scss */
    .cp-root .cp-content .cp-valid-locked {
      margin-top: 2rem;
      width: 80%;
      max-width: 53rem; }
    /* line 474, src/styles/components/_challenges.scss */
    .cp-root .cp-content .cp-bottom {
      padding: 1.25rem 1.25rem;
      width: 90%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      max-width: 53rem;
      margin-bottom: 2rem; }
      @media only screen and (max-width: 768px) {
        /* line 474, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-bottom {
          margin-bottom: 0; } }
      /* line 485, src/styles/components/_challenges.scss */
      .cp-root .cp-content .cp-bottom .cp-eg-content {
        width: 100%; }
        /* line 487, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-bottom .cp-eg-content .linked-ecogestures {
          text-transform: uppercase; }
        /* line 490, src/styles/components/_challenges.scss */
        .cp-root .cp-content .cp-bottom .cp-eg-content .cp-ecogestures {
          width: 100%;
          display: flex;
          flex-direction: row;
          justify-content: space-between; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 5, src/styles/components/_ecogesture.scss */
.ecogesture-root {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem 1.5rem 2.5rem 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;
    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 37, src/styles/components/_ecogesture.scss */
    .ecogesture-root .ecogesture-content .ecogesture-list-item > button {
      height: 100%;
      overflow: hidden; }

/* line 45, src/styles/components/_ecogesture.scss */
.ec-link {
  color: black; }

/* line 48, src/styles/components/_ecogesture.scss */
.ec {
  display: flex;
  width: 100%;
  height: 100%; }
  /* line 52, src/styles/components/_ecogesture.scss */
  .ec .ec-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end; }
    /* line 57, src/styles/components/_ecogesture.scss */
    .ec .ec-content .ec-content-short-name {
      display: flex;
      flex: 1;
      align-items: center; }
    /* line 63, src/styles/components/_ecogesture.scss */
    .ec .ec-content .ec-content-nwh-true {
      margin-top: 0.25rem;
      color: #121212; }
    /* line 67, src/styles/components/_ecogesture.scss */
    .ec .ec-content .ec-content-nwh-undefined {
      margin-top: 0.25rem;
      color: #a0a0a0; }

/* line 73, src/styles/components/_ecogesture.scss */
.cp-eg-1 {
  width: 100%;
  margin-right: 0.25rem;
  text-align: center; }

/* line 78, src/styles/components/_ecogesture.scss */
.cp-eg-2 {
  width: 100%;
  margin-left: 0.25rem;
  text-align: center; }

/* line 85, src/styles/components/_ecogesture.scss */
.em-header {
  color: #e0e0e0;
  border-bottom: 1px solid rgba(163, 163, 163, 0.4);
  padding-bottom: 1em;
  width: 100%;
  display: flex;
  justify-content: center; }

/* line 93, src/styles/components/_ecogesture.scss */
.em-icon {
  margin-bottom: 1rem; }

/* line 96, src/styles/components/_ecogesture.scss */
.em-title {
  margin-bottom: 0; }

/* line 99, src/styles/components/_ecogesture.scss */
.em-detail {
  display: flex;
  flex-direction: row;
  margin: 0.5em 0; }
  /* line 103, 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 109, src/styles/components/_ecogesture.scss */
    .em-detail .em-detail-nwh .em-detail-nwh-unit {
      margin-left: 0.2rem; }
  /* line 113, src/styles/components/_ecogesture.scss */
  .em-detail .em-picto-flow {
    display: flex;
    align-self: flex-end; }
    /* line 116, src/styles/components/_ecogesture.scss */
    .em-detail .em-picto-flow .em-pic-content {
      margin: 0.3em; }

/* line 122, src/styles/components/_ecogesture.scss */
.em-content-box {
  max-height: 25rem;
  overflow: auto;
  width: 100%;
  display: flex;
  justify-content: center;
  /* width */
  /* Track */
  /* Handle */ }
  /* line 129, src/styles/components/_ecogesture.scss */
  .em-content-box::-webkit-scrollbar {
    width: 10px; }
  /* line 133, src/styles/components/_ecogesture.scss */
  .em-content-box::-webkit-scrollbar-track {
    background: #3e4045; }
  /* line 137, src/styles/components/_ecogesture.scss */
  .em-content-box::-webkit-scrollbar-thumb {
    background: #6f7074; }
  /* line 140, src/styles/components/_ecogesture.scss */
  .em-content-box .em-content-box-text {
    display: flex;
    flex-direction: column;
    padding: 1.5rem 1.5rem;
    width: 22.125rem; }
    @media only screen and (max-width: 768px) {
      /* line 140, src/styles/components/_ecogesture.scss */
      .em-content-box .em-content-box-text {
        width: 100%; } }
    /* line 148, src/styles/components/_ecogesture.scss */
    .em-content-box .em-content-box-text .em-description {
      padding-bottom: 2.5rem; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 4, src/styles/components/_modal.scss */
.modal-overlay {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  justify-content: center;
  align-items: center;
  background-color: rgba(27, 28, 34, 0.85); }
  /* line 16, src/styles/components/_modal.scss */
  .modal-overlay.modal-opened {
    display: flex; }
  /* line 19, src/styles/components/_modal.scss */
  .modal-overlay .modal-box {
    background: linear-gradient(180deg, #323339 0%, #25262B 100%);
    position: fixed;
    top: 50%;
    left: 50%;
    width: 36rem;
    max-width: 100%;
    max-height: 30rem;
    transform: translate(-50%, -50%);
    padding: 1rem 0 0 0;
    box-sizing: border-box;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.55);
    border-radius: 4px; }
    @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 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 47, src/styles/components/_modal.scss */
    .modal-overlay .modal-box .modal-content {
      display: flex;
      flex-direction: column;
      align-items: center;
      color: #ffffff; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 5, src/styles/components/_faq.scss */
.faq-root {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 1.5rem; }
  /* line 11, src/styles/components/_faq.scss */
  .faq-root .faq-content {
    margin-bottom: -1rem;
    width: 45.75rem; }
    @media only screen and (max-width: 768px) {
      /* line 11, src/styles/components/_faq.scss */
      .faq-root .faq-content {
        width: 100%; } }
    /* line 17, src/styles/components/_faq.scss */
    .faq-root .faq-content .faq-header {
      margin-top: 2.5rem;
      margin-bottom: 1.25rem;
      color: #e0e0e0; }

/* line 25, src/styles/components/_faq.scss */
.faq-card-link {
  color: black; }

/* line 28, 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 28, src/styles/components/_faq.scss */
    .faq-card {
      width: 100%; } }
  /* line 36, src/styles/components/_faq.scss */
  .faq-card .faq-card-content {
    display: flex;
    flex-direction: row; }
    /* line 39, src/styles/components/_faq.scss */
    .faq-card .faq-card-content .faq-card-content-icon {
      margin: 0.5rem 0; }
    /* line 42, src/styles/components/_faq.scss */
    .faq-card .faq-card-content .faq-card-content-title {
      margin: 0 1rem;
      align-self: center; }

/* line 50, src/styles/components/_faq.scss */
.faq-view-root {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem 0;
  margin-top: 1.5rem; }
  /* line 57, src/styles/components/_faq.scss */
  .faq-view-root .faq-view-content {
    width: 45.75rem; }
    @media only screen and (max-width: 768px) {
      /* line 57, src/styles/components/_faq.scss */
      .faq-view-root .faq-view-content {
        width: 100%; } }
    /* line 62, src/styles/components/_faq.scss */
    .faq-view-root .faq-view-content .faq-content-detail {
      padding-bottom: 0.6rem; }
      /* line 64, src/styles/components/_faq.scss */
      .faq-view-root .faq-view-content .faq-content-detail .text-bold {
        font-weight: bold; }
      /* line 67, src/styles/components/_faq.scss */
      .faq-view-root .faq-view-content .faq-content-detail .text-underline {
        text-decoration: underline; }
      /* line 70, src/styles/components/_faq.scss */
      .faq-view-root .faq-view-content .faq-content-detail .spaceline {
        height: 0.6rem;
        display: block; }

/** BLACK **/
/** TEXT COLOR **/
/** RED **/
/** YELLOW **/
/** ORANGE **/
/** BLUE **/
/** GREEN **/
/** WHITE **/
/** GREY **/
/** App colors **/
/** TABS GRADIENT **/
/* line 4, src/styles/components/_splash.scss */
.splash-root {
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  height: 100vh;
  width: 100vw;
  overflow: hidden;
  background-color: #1b1c22;
  display: flex;
  flex-direction: column; }
  /* line 15, src/styles/components/_splash.scss */
  .splash-root .splash-header {
    height: 6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--textBright); }
  /* line 22, src/styles/components/_splash.scss */
  .splash-root .splash-content {
    margin-left: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1; }
    @media only screen and (max-width: 768px) {
      /* line 22, src/styles/components/_splash.scss */
      .splash-root .splash-content {
        align-items: flex-start;
        justify-content: flex-start; } }
    /* line 33, src/styles/components/_splash.scss */
    .splash-root .splash-content .splash-step {
      display: flex;
      flex-direction: row;
      width: 60%;
      height: 90px; }
      @media only screen and (max-width: 1023px) {
        /* line 33, src/styles/components/_splash.scss */
        .splash-root .splash-content .splash-step {
          width: 80%; } }
      @media only screen and (max-width: 768px) {
        /* line 33, src/styles/components/_splash.scss */
        .splash-root .splash-content .splash-step {
          width: 100%; } }
      /* line 44, src/styles/components/_splash.scss */
      .splash-root .splash-content .splash-step .splash-step-text {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1;
        text-align: center;
        color: #e0e0e0; }
      /* line 52, src/styles/components/_splash.scss */
      .splash-root .splash-content .splash-step .splash-step-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 90px; }
  /* line 61, src/styles/components/_splash.scss */
  .splash-root .splash-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    height: 10rem;
    margin: 0 2rem; }
    /* line 68, src/styles/components/_splash.scss */
    .splash-root .splash-footer .splash-footer-error-text {
      text-align: center;
      color: red;
      margin: 0.5rem 0; }
    /* line 73, src/styles/components/_splash.scss */
    .splash-root .splash-footer .splash-footer-button {
      max-width: 50vw; }

/* line 26, src/styles/index.scss */
:root {
  --blue: #58FFFF;
  --blue40: #58FFFF40;
  --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;
  --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;
  --blueRadialGradientTrans: radial-gradient(circle, #58FFFF 0%, rgba(255, 255, 255, 0) 100%);
  --elecColor: #d87b39;
  --elecCompareColor: #e2bca1;
  --gasColor: #45d1b8;
  --gasCompareColor: #a8f7e9;
  --waterColor: #3a98ec;
  --waterCompareColor: #abd4fa;
  --multiColor: #e3b82a;
  --multiCompareColor: #ffd597;
  --greyBright: #e0e0e0;
  --greyDark: #7b7b7b;
  --textBlack: black;
  --textWhite: #ffffff;
  --textBright: #e0e0e0;
  --textDark: #a0a0a0;
  --darkLight: #25262b;
  --darkLight2: #121212;
  --textFont: Lato, sans-serif;
  --greyBackground: linear-gradient(180deg, #323339 0%, #25262B 100%);
  --multiColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);
  --elecColorRadialGradientTrans: radial-gradient(circle, #d87b39 0%, rgba(255, 255, 255, 0) 100%);
  --waterColorRadialGradientTrans: radial-gradient(circle, #3a98ec 0%, rgba(255, 255, 255, 0) 100%);
  --gasColorRadialGradientTrans: radial-gradient(circle, #e3b82a 0%, rgba(255, 255, 255, 0) 100%);
  --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;
  --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;
  --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 60, src/styles/index.scss */
.application {
  overflow-x: hidden; }
  @media only screen and (max-width: 768px) {
    /* line 60, src/styles/index.scss */
    .application {
      min-height: 100vh; } }