/* === Design System === */
@import url("https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i");
:root {
  --gray50: #fafafa;
  --gray100: #f5f5f5;
  --gray200: #eeeeee;
  --gray300: #e0e0e0;
  --gray400: #bdbdbd;
  --gray500: #9e9e9e;
  --gray600: #757575;
  --gray700: #616161;
  --gray800: #424242;
  --gray900: #212121;
  --primary-50: #e6e9f0;
  --primary-100: #c1c7db;
  --primary-200: #99a3c2;
  --primary-300: #7280a9;
  --primary-400: #566598;
  --primary-500: #394c89;
  --primary-600: #334480;
  --primary-700: #2b3b75;
  --primary-800: #243268;
  --primary-900: #192251;
  --secondary-50: #e0f4fb;
  --secondary-100: #afe2f4;
  --secondary-200: #7ccfed;
  --secondary-300: #48bce5;
  --secondary-400: #17aee2;
  --secondary-500: #00a0de;
  --secondary-600: #0093d0;
  --secondary-700: #0080be;
  --secondary-800: #0070aa;
  --secondary-900: #00518a;
  --energy-blue: #055DAA;
  --renewable-green: #78be20;
  --sunstreet-gold: #FFC107;
  --sunstreet-teal: #009688;
  --disabled-text: rgba(0, 0, 0, 0.38);
  --med-emp-text: rgba(0, 0, 0, 0.6);
  --med-high-emp-text: rgba(0, 0, 0, 0.74);
  --high-emp-text: rgba(0, 0, 0, 0.87);
  --hover-bg: rgba(0, 0, 0, 0.04);
  --focus-bg: rgba(0, 0, 0, 0.12);
  /* Elevation */
  --elevation-1dp: 0 2px 1px -1px rgba(0, 0, 0, 0.2),
    0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  --elevation-2dp: 0 3px 1px -2px rgba(0, 0, 0, 0.2),
    0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  --elevation-3dp: 0 3px 3px -2px rgba(0, 0, 0, 0.2),
    0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
  --elevation-4dp: 0 2px 4px -1px rgba(0, 0, 0, 0.2),
    0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  --elevation-5dp: 0 3px 5px -1px rgba(0, 0, 0, 0.2),
    0 5px 8px 0 rgba(0, 0, 0, 0.14), 0 1px 14px 0 rgba(0, 0, 0, 0.12);
  --elevation-6dp: 0 3px 5px -1px rgba(0, 0, 0, 0.2),
    0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);
  --elevation-7dp: 0 4px 5px -2px rgba(0, 0, 0, 0.2),
    0 7px 10px 1px rgba(0, 0, 0, 0.14), 0 2px 16px 1px rgba(0, 0, 0, 0.12);
  --elevation-8dp: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
    0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
  --elevation-9dp: 0 5px 6px -3px rgba(0, 0, 0, 0.2),
    0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12);
  --elevation-10dp: 0 6px 6px -3px rgba(0, 0, 0, 0.2),
    0 10px 14px 1px rgba(0, 0, 0, 0.14), 0 4px 18px 3px rgba(0, 0, 0, 0.12);
  --elevation-11p: 0 6px 7px -4px rgba(0, 0, 0, 0.2),
    0 11px 15px 1px rgba(0, 0, 0, 0.14), 0 4px 20px 3px rgba(0, 0, 0, 0.12);
  --elevation-12dp: 0 7px 8px -4px rgba(0, 0, 0, 0.2),
    0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12);
  --elevation-13dp: 0 7px 8px -4px rgba(0, 0, 0, 0.2),
    0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12);
  --elevation-14dp: 0 7px 9px -4px rgba(0, 0, 0, 0.2),
    0 14px 21px 2px rgba(0, 0, 0, 0.14), 0 5px 26px 4px rgba(0, 0, 0, 0.12);
  --elevation-15dp: 0 8px 9px -5px rgba(0, 0, 0, 0.2),
    0 15px 22px 2px rgba(0, 0, 0, 0.14), 0 6px 28px 5px rgba(0, 0, 0, 0.12);
  --elevation-16dp: 0 8px 10px -5px rgba(0, 0, 0, 0.2),
    0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
  --elevation-17dp: 0 8px 11px -5px rgba(0, 0, 0, 0.2),
    0 17px 26px 2px rgba(0, 0, 0, 0.14), 0 6px 32px 5px rgba(0, 0, 0, 0.12);
  --elevation-18dp: 0 9px 11px -5px rgba(0, 0, 0, 0.2),
    0 18px 28px 2px rgba(0, 0, 0, 0.14), 0 7px 34px 6px rgba(0, 0, 0, 0.12);
  --elevation-19dp: 0 9px 12px -6px rgba(0, 0, 0, 0.2),
    0 19px 29px 2px rgba(0, 0, 0, 0.14), 0 7px 36px 6px rgba(0, 0, 0, 0.12);
  --elevation-20dp: 0 10px 13px -6px rgba(0, 0, 0, 0.2),
    0 20px 31px 3px rgba(0, 0, 0, 0.14), 0 8px 38px 7px rgba(0, 0, 0, 0.12);
  --elevation-21dp: 0 10px 13px -6px rgba(0, 0, 0, 0.2),
    0 21px 33px 3px rgba(0, 0, 0, 0.14), 0 8px 40px 7px rgba(0, 0, 0, 0.12);
  --elevation-22dp: 0 10px 14px -6px rgba(0, 0, 0, 0.2),
    0 22px 35px 3px rgba(0, 0, 0, 0.14), 0 8px 42px 7px rgba(0, 0, 0, 0.12);
  --elevation-23dp: 0 11px 14px -7px rgba(0, 0, 0, 0.2),
    0 23px 36px 3px rgba(0, 0, 0, 0.14), 0 9px 44px 8px rgba(0, 0, 0, 0.12);
  --elevation-24dp: 0 11px 15px -7px rgba(0, 0, 0, 0.2),
    0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
  /* Anti-aliased */
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

/* === Mixins ==== */
/* === Typography === */
* {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI",
 Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  margin: 0;
}

h1 {
  font-size: 97.72px;
  line-height: 104px;
  letter-spacing: -4.5px;
}

h2 {
  font-size: 61.08px;
  line-height: 72px;
  letter-spacing: -2.5px;
}

h3 {
  font-size: 48.03px;
  line-height: 56px;
  letter-spacing: -2px;
}

h4 {
  font-size: 34px;
  line-height: 40px;
  letter-spacing: -1px;
}

h5 {
  font-size: 26px;
  line-height: 32px;
  letter-spacing: -0.35px;
}

h6 {
  font-size: 20px;
  line-height: 24px;
  letter-spacing: -0.15px;
}

.subtitle {
  font-weight: normal;
  line-height: 24px;
  font-size: 16px;
  letter-spacing: 0.15px;
  color: rgba(0, 0, 0, 0.54);
}

.subtitle2 {
  font-weight: normal;
  line-height: 24px;
  font-size: 14px;
  letter-spacing: 0.1px;
  color: rgba(0, 0, 0, 0.54);
}

.body {
  font-weight: normal;
  line-height: 32px;
  font-size: 18px;
  letter-spacing: -0.5px;
  color: rgba(0, 0, 0, 0.87);
}

.body2 {
  font-weight: normal;
  line-height: 28px;
  font-size: 16.1px;
  letter-spacing: -0.25px;
  color: rgba(0, 0, 0, 0.87);
}

.body3 {
  font-weight: normal;
  line-height: 20px;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.87);
}

.button {
  font-weight: bold;
  line-height: 16px;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.87);
}

.caption {
  font-weight: 500;
  line-height: 16px;
  font-size: 12.08px;
  letter-spacing: 0.4px;
  color: rgba(0, 0, 0, 0.54);
}

.overline {
  font-weight: 500;
  line-height: 16px;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.54);
}

/* === Styles === */
body {
  background-color: var(--gray200);
}

/* header */
#header {
  display: grid;
  grid-template-columns: 1fr 6fr 1fr;
  align-items: center;
  color: white;
  width: 100%;
  height: 56px;
  background: var(--primary-900);
  box-shadow: var(--elevation-4dp);
}

#header img {
  max-height: 20px;
  margin: auto auto auto 16px;
}

#header h5 {
  margin: auto;
  padding: 0 16px;
  text-align: center;
}

#header span {
  text-align: right;
  margin: auto 16px auto 0;
  font-size: 16px;
  color: white;
}

#header select {
  color: white;
  font-size: 16px;
  text-align: right;
  margin: auto 16px auto 0;
  max-width: 40px;
}

#header .header-pages {
  margin: auto 16px auto auto;
}

#header .header-pages a {
  text-align: right;
  margin: auto 8px auto;
  font-weight: 700;
  font-size: 16px;
  color: white;
  text-decoration: none;
}

/* Main */
#main {
  min-height: calc(100vh - 72px);
  margin: 8px;
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-column-gap: 8px;
}

.vol-left-grid,
.vol-right-grid {
  display: grid;
  width: 100%;
}

.vol-left-grid {
  grid-template-rows: repeat(4, 1fr);
  grid-row-gap: 8px;
}

.vol-right-grid {
  grid-template-rows: repeat(3, 1fr);
  grid-row-gap: 8px;
}

.card-container {
  display: flex;
  flex-direction: column;
  padding: 16px;
  border-radius: 4px;
  background-color: white;
  box-shadow: var(--elevation-1dp);
}

.card-container h5 {
  margin-bottom: 16px;
}

.card-container .subtitle,
.card-container .subtitle2 {
  margin-bottom: 16px;
}

.mo-card td,
.ytd-card td,
.pfy-card td,
.lt-card td {
  width: 20%;
}

.card-table {
  width: 100%;
  font-size: 16px;
  line-height: 2.45;
  letter-spacing: -0.5px;
  font-weight: 500;
  color: var(--high-emp-text);
  text-align: right;
  border-collapse: collapse;
}

.card-table th,
.card-table td {
  padding: 0 16px;
}

.card-table th,
.card-table .table-item {
  font-weight: 600;
  color: var(--med-emp-text);
}

.card-table tr {
  border-bottom: 1px solid var(--gray300);
}

.card-table tr:last-of-type {
  border-bottom: none;
}

.budget,
.variance,
.bold-text {
  font-weight: bold;
}

.budget {
  color: #528316;
}

.negativeNumber {
  color: #b00020;
}

/* === Cycle Times === */
#cycle-times {
  min-height: calc(100vh - 72px);
  margin: 8px;
  display: grid;
  grid-template-rows: 1fr 1fr;
  grid-row-gap: 8px;
}

#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1614.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1619.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1639.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1644.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1629.apexcharts-data-labels {
  transform: translateY(30px);
}

#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1649.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1624.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1597.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1604.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1609.apexcharts-data-labels,
#SvgjsG1590.apexcharts-line-series #SvgjsG1591.apexcharts-series #SvgjsG1593.apexcharts-datalabels #SvgjsG1634.apexcharts-data-labels {
  transform: translateY(-30px);
}

#SvgjsG1529.apexcharts-datalabels text {
  fill: black;
}

/* === Care === */
#customer-experience {
  min-height: calc(100vh - 72px);
  margin: 8px;
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 8px;
}

.h2insight {
  grid-column-start: span 3;
}

#cc-chart1,
#sch-chart1,
#mon-chart1 {
  margin-bottom: 24px;
  border-bottom: 1px solid var(--gray300);
}

/* === Asset Management === */
#asset-management {
  min-height: calc(100vh - 72px);
  margin: 8px;
  display: grid;
}

.am-grid {
  display: grid;
  grid-template-rows: auto auto;
  grid-row-gap: 8px;
}

.table-item.am-table-item {
  text-align: left;
  padding-left: 0;
}

.am-card td {
  width: 7.69%;
}

.sc-card td {
  width: 11.1111111%;
}

#yr1-com,
#yr2-com,
#yr3-com,
#yr4-com {
  border-left: 1px solid var(--gray300);
  border-right: 1px solid var(--gray300);
}

/* === Infograph === */
#data-infograph {
  min-height: calc(100vh - 72px);
  margin: 8px;
  display: grid;
}

.di-grid {
  display: grid;
  grid-template-rows: repeat(4, 1fr);
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 8px;
}

.di-card {
  justify-content: center;
  align-items: center;
  padding: 24px;
}

.di-card img {
  margin-bottom: 24px;
}

.di-card h4,
.di-card p {
  text-align: center;
}

.di-card h4 {
  color: var(--primary-900);
}

.di-card p {
  color: var(--med-high-emp-text);
}

/* === Apex Charts === */
.apexcharts-title-text {
  font-size: 1.25rem;
  line-height: 24px;
  font-weight: 700;
  fill: var(--high-emp-text);
  letter-spacing: -0.15px;
}

.apexcharts-xaxis-texts-g text,
.apexcharts-yaxis-texts-g text {
  font-weight: bold;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.75px;
  text-align: center;
  fill: var(--med-emp-text);
}

.vol-grid-chart {
  display: grid;
  grid-template-columns: 3fr 1fr;
  grid-column-gap: 8px;
}

.chart-container {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  padding: 16px;
  border-radius: 4px;
  background-color: white;
  box-shadow: var(--elevation-1dp);
}

.h5-legend-container {
  display: flex;
  flex-direction: row;
  margin-bottom: 16px;
}

.h5-legend-container h5 {
  margin: auto auto auto 0;
}

.h5-legend-container .chart-legend-container {
  display: flex;
  flex-direction: row;
  margin: auto 0 auto auto;
}

.h5-legend-container .chart-legend-container-group {
  display: flex;
  flex-direction: column;
  margin: auto 0 auto auto;
}

.h5-legend-container .chart-legend-container-group .legend-group {
  display: flex;
  flex-direction: row;
  margin: auto 0 auto auto;
}

.chart-legend {
  padding-right: 16px;
}

.chart-legend:last-of-type {
  padding-right: 0;
}

.svg-legend {
  padding-right: 4px;
  margin: auto;
}

.svg-legend .perc-legend {
  fill: #FFA450;
}

.svg-legend .issue-legend {
  fill: var(--primary-900);
}

.svg-legend .actual-legend,
.svg-legend .h2sunstreet-legend,
.svg-legend .oc-legend,
.svg-legend .ccsgoal-legend,
.svg-legend .ctpto-legend,
.svg-legend .goal15days-legend {
  fill: var(--primary-500);
}

.svg-legend .projected-legend {
  fill: var(--primary-100);
}

.svg-legend .budget-legend,
.svg-legend .h2lennar-legend,
.svg-legend .cp-legend,
.svg-legend .ccpgoal-legend,
.svg-legend .cta-legend,
.svg-legend rect.goal20days-legend,
.svg-legend .elec-legend {
  fill: var(--secondary-400);
}

.svg-legend .h2goal-legend,
.svg-legend .ptoa-legend,
.svg-legend .goal5days-legend,
.svg-legend .comm-legend {
  fill: var(--renewable-green);
}

.svg-legend .ctv-legend,
.svg-legend .gen-legend,
.svg-legend .goal7days-legend {
  fill: var(--sunstreet-gold);
}

.svg-legend .hard-legend {
  fill: var(--energy-blue);
}

.svg-legend .seas-legend {
  fill: var(--sunstreet-teal);
}

span {
  font-weight: 500;
  font-size: 12.08px;
  line-height: 16px;
  letter-spacing: 0.4px;
  color: rgba(0, 0, 0, 0.6);
}

.h5-legend-container-subtitle2 {
  margin-bottom: 24px;
}

.h5-legend-container-subtitle2 .h5-legend-container {
  margin-bottom: 0;
}

.apexcharts-bar-series .apexcharts-data-labels text,
.apexcharts-line-series .apexcharts-data-labels text {
  font-weight: bold;
  line-height: 20px;
}

#SvgjsG1015.apexcharts-bar-series .apexcharts-data-labels,
#SvgjsG1247.apexcharts-bar-series .apexcharts-data-labels,
#SvgjsG1482.apexcharts-bar-series .apexcharts-data-labels {
  clip-path: none;
}

#SvgjsG1015.apexcharts-bar-series .apexcharts-data-labels text,
#SvgjsG1247.apexcharts-bar-series .apexcharts-data-labels text,
#SvgjsG1482.apexcharts-bar-series .apexcharts-data-labels text {
  fill: white;
  text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
}

.apexcharts-line-series .apexcharts-data-labels {
  clip-path: none;
}

.apexcharts-line-series .apexcharts-data-labels text {
  fill: black;
}

.apexcharts-radialbar {
  transform: scale(1.3) translateX(-7%);
}

.apexcharts-radialbar text#SvgjsText1221,
.apexcharts-radialbar text#SvgjsText1227,
.apexcharts-radialbar text#SvgjsText1462,
.apexcharts-radialbar text#SvgjsText1694,
.apexcharts-radialbar text#SvgjsText1741,
.apexcharts-radialbar text#SvgjsText1783,
.apexcharts-radialbar text#SvgjsText1825 {
  font-weight: 500;
  font-size: 10px;
  line-height: 16px;
  text-align: center;
  letter-spacing: 2px;
  text-transform: uppercase;
  fill: var(--med-emp-text);
}

.apexcharts-radialbar text#SvgjsText1222,
.apexcharts-radialbar text#SvgjsText1228,
.apexcharts-radialbar text#SvgjsText1463,
.apexcharts-radialbar text#SvgjsText1695,
.apexcharts-radialbar text#SvgjsText1742,
.apexcharts-radialbar text#SvgjsText1784,
.apexcharts-radialbar text#SvgjsText1826 {
  font-weight: bold;
  font-size: 28px;
  line-height: 32px;
  text-align: center;
  letter-spacing: -1px;
  fill: var(--high-emp-text);
}

/* === Volumes Line Series Data Label Offset === */
#SvgjsG1081.apexcharts-datalabels {
  transform: translateY(-12px);
}

#SvgjsG1081.apexcharts-datalabels #SvgjsG1096 text#SvgjsText1098,
#SvgjsG1081.apexcharts-datalabels #SvgjsG1102 text#SvgjsText1104,
#SvgjsG1081.apexcharts-datalabels #SvgjsG1105 text#SvgjsText1107,
#SvgjsG1081.apexcharts-datalabels #SvgjsG1114 text#SvgjsText1116 {
  transform: translateY(-22px);
}

#SvgjsG1313.apexcharts-datalabels {
  transform: translateY(-12px);
}

#SvgjsG1313.apexcharts-datalabels #SvgjsG1322 text#SvgjsText1324,
#SvgjsG1313.apexcharts-datalabels #SvgjsG1331 text#SvgjsText1333 {
  transform: translateY(-22px);
}

#SvgjsG1548.apexcharts-datalabels {
  transform: translateY(-30px);
}

#SvgjsG1548.apexcharts-datalabels #SvgjsG1557 text#SvgjsText1559,
#SvgjsG1548.apexcharts-datalabels #SvgjsG1566 text#SvgjsText1568,
#SvgjsG1548.apexcharts-datalabels #SvgjsG1572 text#SvgjsText1574,
#SvgjsG1548.apexcharts-datalabels #SvgjsG1575 text#SvgjsText1577,
#SvgjsG1548.apexcharts-datalabels #SvgjsG1578 text#SvgjsText1580,
#SvgjsG1548.apexcharts-datalabels #SvgjsG1581 text#SvgjsText1583 {
  transform: translateY(20px);
}

/* === Y Axis labels offset === */
#SvgjsG1225.apexcharts-yaxis,
#SvgjsG1401.apexcharts-yaxis,
#SvgjsG1676.apexcharts-yaxis {
  transform: translateX(8px);
}

#test-main {
  min-height: calc(100vh - 72px);
  margin: 8px;
  display: grid;
}

.resize-triggers,
.resize-triggers > div,
.contract-trigger:before {
  display: none !important;
}

/* === Media Queries === */
@media screen and (max-width: 812px) {
  .di-grid {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  }
}
/*# sourceMappingURL=styles.css.map */