html {
    overflow-x: hidden;
}

html,
body {
    font-family: "Roboto", sans-serif;
    letter-spacing: normal;
}

.main-container {
    width: 100%;
    height: calc(100vh - 48px);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-top: 48px;
}

.main-container .aside-container {
    width: 255px;
    height: calc(100% - 30px);
    border-right: 1px solid #dfe0df;
    background-color: #ffffff;
    padding: 4px 0 20px;
    overflow-y: auto;
    position: fixed;
    top: 48px;
    left: 0;
    z-index: 10;
}

.main-container .aside-container .aside-links {
    width: 100%;
    height: auto;
    border-bottom: 1px solid #c4c4c4;
    padding-bottom: 14px;
    margin-top: 16px;
}

.main-container .aside-container .aside-links .link-title {
    padding: 8px 8px 8px 16px;
}

.main-container .aside-container .aside-links .link-title .aside-link {
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #161616;
    cursor: pointer;
    padding-right: 32px;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background-image: url("../img/accordion-minus.svg");
    background-repeat: no-repeat;
    background-position: right center;
}

.main-container
    .aside-container
    .aside-links
    .link-title
    .aside-link.collapsed {
    background-image: url("../img/accordion-plus.svg");
}

.main-container .aside-container .aside-links .aside-link-body {
    width: 100%;
    height: auto;
}

.main-container .aside-container .aside-links .aside-link-body ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.main-container .aside-container .aside-links .aside-link-body ul li {
    padding: 9px 8px 7px 28px;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #525252;
    border-left: 5px solid rgba(255, 255, 255, 0);
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.main-container .aside-container .aside-links .aside-link-body ul li.active {
    font-weight: 700;
    color: #161616;
    color: #4aa7a9;
    /* background-color: #e0e0e0; */
    background-color: rgba(74, 167, 169, 0.09);
    border-left: 5px solid #4aa7a9;
}

.main-container
    .aside-container
    .aside-links
    .aside-link-body
    ul
    li.current-page {
    background-color: rgba(253, 205, 83, 0.4);
}

.main-container .content-container {
    width: calc(100% - 255px);
    height: auto;
    min-height: 100%;
    background-color: #ffffff;
    margin-left: 255px;
}

.main-container .content-container .center-grid {
    width: 100%;
    max-width: 1366px;
    /* margin: 42px auto 32px auto; */
    margin: 48px auto 32px auto;
}

header {
    width: 100%;
    height: 48px;
    background-color: #ffffff;
    box-shadow: 0px 1px 0px 1px rgba(0, 0, 0, 0.14);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    display: flex;
    align-items: center;
}

header .logo {
    margin-left: 16px;
}

.inner-container {
    width: 100%;
    height: auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    position: relative;
    /* padding: 0 24px; */
    padding: 0 0 0 24px;
}

.inner-container .inner-content-container {
    /* width: calc(100% - 295px); */
    width: calc(100% - 195px);
    height: auto;
    padding-right: 100px;
}

.inner-container .side-navigation {
    /* width: 295px; */
    width: 195px;
    height: auto;
    min-height: 200px;
    position: sticky;
    top: 70px;
    right: 0;
    z-index: 10;
}

.inner-container .side-navigation ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.inner-container .side-navigation ul li {
    padding: 0;
    margin: 0;
    list-style: none;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.02em;
    color: #525252;
    padding: 8px;
    cursor: pointer;
    border-left: 2px solid #dfe0df;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.inner-container .side-navigation ul li.active {
    border-left: 2px solid #4aa7a9;
}

.inner-container .side-navigation ul li.active a {
    font-weight: 500;
    color: #161616;
}

.inner-container .side-navigation ul li a {
    color: #525252;
    text-decoration: none;
}

/* loader */

.loader-outer {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    z-index: 100000;
}

.loader {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #4aa7a9;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* TYPO */

.section h1 {
    font-weight: 400;
    font-size: 48px;
    line-height: 100%;
    /* color: #161616; */
    color: #2b2b2b;
    /* margin-bottom: 24px; */
    margin-bottom: 16px;
}

.section h2 {
    font-weight: 400;
    font-size: 32px;
    line-height: 100%;
    color: #2b2b2b;
    margin-bottom: 24px;
}

.section h3 {
    font-weight: 400;
    font-size: 24px;
    line-height: 100%;
    color: #2b2b2b;
    margin-bottom: 24px;
}

.section h4 {
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    /* color: #373737; */
    color: #2b2b2b;
    margin-bottom: 24px;
}

.section h6 {
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    /* color: #373737; */
    color: #2b2b2b;
    margin-bottom: 24px;
}

.section p {
    font-weight: 400;
    font-size: 16px;
    line-height: 142%;
    color: #4b4b4b;
    margin-bottom: 16px;
}

.section ul,
.section ol {
    padding: 0;
    margin: 0 0 28px 0;
}

.section ol {
    padding-left: 15px;
}

.section ol li {
    color: #4b4b4b;
}

.section ul li {
    font-weight: normal;
    font-size: 16px;
    line-height: 160%;
    color: #4b4b4b;
    list-style: none;
    position: relative;
}
.section ul.non-order li {
    list-style: disc;
}
.section ul.disc li {
    padding-left: 20px;
}

.section ul.disc li::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #4b4b4b;
    position: absolute;
    top: calc(50% - 3px);
    left: 0;
    z-index: 1;
}

.section ol.order li,
.section ul.order li {
    font-weight: bold;
    font-size: 16px;
    line-height: 100%;
    /* margin-bottom: 24px; */
}
.section ol.order li {
    /* color: #717171; */
    color: #4b4b4b;
}
.section ul.order li {
    color: #4b4b4b;
}
.section ol.order li:not(:last-child),
.section ul.order li:not(:last-child) {
    margin-bottom: 24px;
}
.section ol.order li span,
.section ul.order li span {
    display: block;
    font-weight: 400;
    margin-top: 12px;
    color: #6b6b6b;
}
.section ul.order li span {
    padding-left: 20px;
}
.section ul.disc-sm li {
    font-size: 14px;
    color: #717171;
    padding-left: 16px;
}
.section ul.disc-sm li::before {
    width: 4px;
    height: 4px;
    background-color: #717171;
}
.section .img-container {
    width: 100%;
    height: auto;
    min-height: 100px;
    margin-bottom: 18px;
}
.section hr {
    margin-top: 0;
    margin-bottom: 0;
    border: 0;
    border-top: 1px solid #e7e7e7;
}

.section .multi-img-container {
    width: 100%;
    height: auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 18px;
}

.section .multi-img-container .img-container {
    width: calc(50% - 24px);
    height: auto;
    min-height: 100px;
}

.section .multi-img-container.three-img .img-container {
    width: calc(33.33333% - 16px);
}

.section .multi-img-container.three-img .img-container img {
    width: 100%;
}

.section .img-container .img-status {
    width: 100%;
    height: auto;
    background-color: #ffffff;
    padding-top: 36px;
    position: relative;
}

.section .img-container .img-status::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 8px;
    background-color: rgba(0, 0, 0, 0.14);
}

.section .img-container .img-status h6 {
    font-weight: bold;
    font-size: 16px;
    line-height: 100%;
    margin-bottom: 8px;
}

.section .img-container .img-status p {
    font-weight: normal;
    font-size: 14px;
    line-height: 140%;
    /* color: #717171; */
    color: #6b6b6b;
}

.section .other-controls .img-container .img-status p {
    font-size: 16px;
    color: #4b4b4b;
}

.section .img-container .img-status p strong {
    font-weight: 700;
}

.section .img-container .img-status.default {
    padding-top: 0;
}

.section .img-container .img-status.default::before {
    content: none;
}

.section .img-container .img-status.do h6 {
    color: #2e7b32;
}

.section .img-container .img-status.dont h6 {
    color: #d32f2f;
}

.section .img-container .img-status.cautions h6 {
    color: #f9a825;
}

.section .img-container .img-status.do::before {
    background-color: #2e7b32;
}

.section .img-container .img-status.dont::before {
    background-color: #d32f2f;
}

.section .img-container .img-status.cautions::before {
    background-color: #f9a825;
}

.section .img-container .img-status span {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 140%;
    color: #6b6b6b;
}

.light-grey {
    color: #717171 !important;
}
.normal-grey {
    color: #373737 !important;
}
.font-sm {
    font-size: 14px !important;
}
.mb-7 {
    margin-bottom: 7px !important;
}
.mb-13 {
    margin-bottom: 13px !important;
}
.mb-20 {
    margin-bottom: 20px !important;
}
.mb-23 {
    margin-bottom: 23px !important;
}
.mb-41 {
    margin-bottom: 41px !important;
}
.mb-43 {
    margin-bottom: 43px !important;
}
.mb-47 {
    margin-bottom: 47px !important;
}
.mb-68 {
    margin-bottom: 68px !important;
}
.mb-42 {
    margin-bottom: 42px !important;
}
.mb-90 {
    margin-bottom: 90px !important;
}
.mb-33 {
    margin-bottom: 33px !important;
}
.mb-48 {
    margin-bottom: 48px !important;
}

.mb-6 {
    margin-bottom: 6px !important;
}
.mb-13 {
    margin-bottom: 13px !important;
}
.mb-46 {
    margin-bottom: 46px !important;
}
.mb-44 {
    margin-bottom: 44px !important;
}
.mb-42 {
    margin-bottom: 42px !important;
}
.mb-40 {
    margin-bottom: 40px !important;
}
.mb-38 {
    margin-bottom: 38px !important;
}
.mb-36 {
    margin-bottom: 36px !important;
}
.mb-34 {
    margin-bottom: 34px !important;
}
.fw-bold {
    font-weight: bold !important;
}
.mb-8 {
    margin-bottom: 8px;
}
.mt-48 {
    margin-top: 48px !important;
}
.mb-31 {
    margin-bottom: 31px !important;
}
.mb-32 {
    margin-bottom: 32px !important;
}
.mb-30 {
    margin-bottom: 30px !important;
}
.mb-64 {
    margin-bottom: 64px !important;
}
.mb-78 {
    margin-bottom: 78px !important;
}
.mb-30 {
    margin-bottom: 30px !important;
}
.mb-23 {
    margin-bottom: 23px !important;
}
.mb-9 {
    margin-bottom: 9px !important;
}
.mb-2 {
    margin-bottom: 2px !important;
}
.mb-28 {
    margin-bottom: 28px !important;
}
.mb-39 {
    margin-bottom: 39px !important;
}
.mb-17 {
    margin-bottom: 17px !important;
}
.mb-56 {
    margin-bottom: 56px !important;
}
.mb-60 {
    margin-bottom: 60px !important;
}
.mb-26 {
    margin-bottom: 26px !important;
}
.mb-86 {
    margin-bottom: 86px !important;
}
.mb-99 {
    margin-bottom: 99px !important;
}
.mb-121 {
    margin-bottom: 121px !important;
}
.mb-127 {
    margin-bottom: 127px !important;
}
.mb-24 {
    margin-bottom: 24px !important;
}
.mb-91 {
    margin-bottom: 91px !important;
}
.fs-18 {
    font-size: 18px !important;
}
.fs-20 {
    font-size: 20px !important;
}
.fs-30 {
    font-size: 30px !important;
}
.mb-22 {
    margin-bottom: 22px !important;
}

.mb-20 {
    margin-bottom: 20px !important;
}
.mb-58 {
    margin-bottom: 58px !important;
}
.mb-18 {
    margin-bottom: 18px !important;
}
.mb-20 {
    margin-bottom: 20px !important;
}
.fs-16 {
    font-size: 16px !important;
}
.mb-16 {
    margin-bottom: 16px !important;
}
.fs-14 {
    font-size: 14px !important;
}
.mb-14 {
    margin-bottom: 14px !important;
}
.mb-46 {
    margin-bottom: 46px !important;
}
.mb-40 {
    margin-bottom: 40px;
}
.fs-12 {
    font-size: 12px !important;
}
.mb-12 {
    margin-bottom: 12px !important;
}
.mt-24 {
    margin-top: 24px !important;
}
.fs-10 {
    font-size: 10px !important;
}
.mb-10 {
    margin-bottom: 10px !important;
}
.mb-76 {
    margin-bottom: 76px !important;
}
.mb-30 {
    margin-bottom: 30px !important;
}
.mb-44 {
    margin-bottom: 44px !important;
}
.mb-8 {
    margin-bottom: 8px !important;
}
mb-12 .mt-38 {
    margin-top: 38px !important;
}
.mb-50 {
    margin-bottom: 50px !important;
}
.mb-26 {
    margin-bottom: 26px;
}
.mb-68 {
    margin-bottom: 68px !important;
}
.mb-122 {
    margin-bottom: 122px !important;
}
.w__35 {
    width: 35%;
}

.w__10 {
    width: 10%;
}

.w__15 {
    width: 15%;
}

.w__20 {
    width: 20%;
}
.font-weight-medium {
    font-weight: 500;
}
.table__cell {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 16px;
}

table.content {
    border: 1px solid #c8c8c8;
}

table.content thead {
}
table.content thead tr {
}
table.content thead tr th {
    font-weight: 500;
    font-size: 16px;
    border: 1px solid #c8c8c8;
    line-height: 100%;
    padding: 23px 24px;
    color: #4b4b4b;
    background: #efeff2;
}
table.content tbody {
}
table.content tbody tr {
}
table.content tbody tr td {
    font-weight: normal;
    font-size: 16px;
    line-height: 100%;
    border: 1px solid #c8c8c8;
    padding: 23px 24px;
    color: #373737;
}

/* Font Size Units */

table.fontsize-unit thead tr th {
    color: #4aa7a9;
    font-weight: bold;
    font-size: 16px;
    line-height: 100%;
}

table.fontsize-unit thead tr th,
table.fontsize-unit tbody tr td {
    border: 1px solid #c4c4c4;
    padding: 20px 24px;
}

table.fontsize-unit tbody tr td {
    font-size: 14px;
    color: #4b4b4b;
}

.text-green {
    color: #4aa7a9;
}
.text-black {
    color: #000;
}
.text-6f6f6f {
    color: #6f6f6f;
}
.text-2b2b2b {
    color: #2b2b2b;
}

/* Colors */
.multi-color-container {
    width: 100%;
    height: auto;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    /* justify-content: space-between; */
}

.color-container {
    /* width: calc(33% - 6px); */
    width: 33.333333%;
    height: auto;
    min-height: 100px;
}

.color-container .color-box {
    width: 100%;
    height: 135px;
}

.color-container h5 {
    font-weight: 400;
    color: #2d3a48;
}

.color-container p,
.color-container ul li {
    font-weight: 500;
    color: #728192;
}

.bg-primary {
    background: #4aa7a9 !important;
}

.bg-primary-vibrant {
    background: #378e8f !important;
}

.bg-primary-light {
    background: #f0f9f9;
}

.bg-light-shade1 {
    background: #ffffff;
}

.bg-light-shade2 {
    background: #f8f8fb;
}

.bg-light-shade3 {
    background: #f2f2f2;
}

.bg-dark-shade1 {
    background: #2b2b2b;
}

.bg-dark-shade2 {
    background: #9699a1;
}

.bg-dark-shade3 {
    background: #dbdbdb;
}

.bg-success {
    background: #12b568;
}

.bg-success-light {
    background: #9cd7c5;
}

.bg-warning {
    background: #fecd00 !important;
}

.bg-warning-light {
    background: #ffee8d;
}

.bg-error {
    background: #ff6043;
}

.bg-error-light {
    background: #ffa990;
}

.bg-parallel {
    background: #ea7e2b;
}

.bg-time {
    background: #fecd00;
}

.bg-cores {
    background: #bb6a83;
}

.bg-cores2 {
    background: #5c5487;
}

.bg-average-time {
    background: #8a2be2;
}

.bg-demand {
    background: #6ead71;
}

.bg-virtual-machine {
    background: #0079bc;
}

.bg-avg-demand {
    background: #fef7f2;
}

.bg-generation {
    background: #fefaf1;
}

.bg-unreserved-energy {
    background: #fbf6f7;
}

.bg-avg-price {
    background: #f5f4f7;
}

.bg-dump-energy {
    background: #f1fbf6;
}

.bg-production-cost {
    background: #f6faf6;
}

.bg-lossers {
    background: #fafcfe;
}

.bg-study-overview {
    background: #479aff;
}

.icon-library:link,
.icon-library:visited {
    background: #fff;
    box-shadow: 0px 4px 4px rgb(0 0 0 / 15%), 0px 1px 4px rgb(0 0 0 / 15%);
    border-radius: 4px;
    padding: 24px;
    min-width: 280px;
}

.icon-library:hover,
.icon-library:active {
    text-decoration: none;
}

.icon-library .icon-library-content {
    margin-left: 12px;
}

.table .thead-light th {
    color: #2b2b2b;
    background: #efefef;
}

.table-bordered td {
    color: #4b4b4b;
}
.table-bordered td,
.table-bordered th,
.table .thead-light th {
    padding: 20px;
    border-color: #c8c8c8;
    border-width: 1px;
}