.content-wrapper {
}

.main-content {
    width: calc(100% - 366px);
    padding: 60px 90px;
}
.main-content h3 {
    color: var(--light-green);
}
.main-content h4 {
    color: var(--light-green);
}
.main-content h5 {
    color: var(--dark-aqua);
}
.main-content .signature-img-container {
  top: -110px;
  left: -50px;
  width: 425px;
  z-index: 1;
}
.main-content .signature-img-container img {
  width: inherit;
}
.main-content .signature-texts {
  position: relative;
  z-index: 2;
}
.main-content .bg-light {
    background-color: var(--half-colonial-white) !important;
    border-radius: 35px;
    padding: 1.5rem 2.2rem;
}

.side-content {
    /* width: 366px;*/
    width: 20%;
    background-size: cover;
    background-position: left top;
}

.no-side-content .main-content {
    width: 100%;
}

.org-structure-image {
    width: 100%;
    padding: 0 90px;
}

.widget-box-title {
    font-family: var(--georgia);
    font-weight: bolder;
    text-transform: uppercase;
    font-size: 22px;
    color: var(--dark-blue);
}
.widget-box-subtitle {
    color: var(--dark-blue);
}
.widget-box-border {
    height: 2px;
    background-color: var(--dark-blue);
}
.widget-box-border2 {
    height: 2px;
    background-color: var(--aqua);
}
.widget-box-border2-full {
    height: 2px;
    background-color: var(--aqua);
    margin: 1.8rem 90px;;
}

.bold-highlight {
    font-family: var(--georgia);
    font-size: 30px;
    font-weight: bolder;
    line-height: 32px;
}
.bold-normal-highlight {
    color: var(--dark-blue);
}

.img-container {
    max-width: 100vw;
    overflow-x: auto;
}
.img-container img {
    width: calc(100vw - 43%);
}

.img-stretch-container {
  display: flex;
  align-items: stretch;
  height: 100%;
}
.img-stretch-container img {
  flex: 1;
  height: 100%;
  object-fit: contain;
}

ul {
  padding-left: 1rem;
  margin-bottom: 2rem;
}
ul li {
  padding-left: .3rem;
}
ol {
  padding-left: 1.1rem;
  margin-bottom: 2rem;
}
ol li {
  padding-left: 1rem;
}
ol.bold__marker li::marker {
  font-weight: bold;
}
ol.marker__aqua li::marker {
  color: var(--aqua);
}

.odd-even-content {
    padding: 30px 15px;
    width: calc(92% - 90px);
}
.odd-even-content .row:nth-child(even) {
    background-color: var(--half-colonial-white);
    border-radius: 35px;
}
.odd-even-content .widget-box {
    padding: 2rem 1.5rem;
}
.odd-even-content .widget-box img {
    width: auto;
}
.odd-even-content .widget-box .overflow-x-auto {
    overflow-x: auto;
}

.one-column .main-content {
    width: 100%;
}

.about-report .side-content {
    background-image: url("/static-assets/images/about-the-report/02-1-2SidePhoto-min.png");
}
.certification .side-content {
    background-image: url("/static-assets/images/certification-from-the-board/02-2-2SidePhoto-min.png");
}
.certification .main-content p,
.certification .main-content h5 {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version */
  pointer-events: none;
}
.disclaimer .side-content {
    background-image: url("/static-assets/images/disclaimer-forward-looking-statements/02-3-2SidePhoto-min.png");
}
.glance .side-content {
    background-image: url("/static-assets/images/2022-glance/glance-stack-min.png");
}
.milestones .side-content {
    width: 8%;
    background-image: url("/static-assets/images/2022-milestones/02-5-2SideLine.png");
    background-size: 10px;
    background-repeat: no-repeat;
    background-position: top center;
}
.acting-major-disruptions .side-content {
    background-image: url("/static-assets/images/acting-major-disruptions/disruptions-side-image-min.png");
}

/* OUR GOVERNANCE */
.corporate-governance .side-content {
    background-image: url("/static-assets/images/our-governance/corporate-governance/08-1-2SidePhoto.png");
}

.corporate-policies-container {
    background-image: url(/static-assets/images/our-governance/corporate-policies/08-2-3SideWave.png);
    background-repeat: no-repeat;
    background-size: 35%;
    background-position: right top;
}

.board-of-directors-container {
    background-image: url(/static-assets/images/common/08-3-3SideWave.png);
    background-repeat: no-repeat;
    background-size: 22%;
    background-position: right 5%;
}

.managing-material-risks .main-content {
    width: 100%;
}
.managing-material-risks .img-wave {
    left: -18%;
}

.what-we-do-container {
    background-image: url("/static-assets/images/our-business/03-2-2SideWaves.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right top;
}

.awards .side-content {
    background-image: url("/static-assets/images/2022-awards/09-1-2SidePhoto-min.png");
}

.third-party .side-content {
    background-image: url("/static-assets/images/third-party-review/09-2-2SidePhoto-min.jpg");
}

.natural-performance-1 {
  background-image: url('/static-assets/images/value-creation-story/delivering-on-our-strategy/4f/06-4f-2SidePhoto1.png');
  border-bottom-right-radius: 80px;
}
.natural-performance-2 {
  background-image: url('/static-assets/images/value-creation-story/delivering-on-our-strategy/4f/06-4f-13SidePhoto2.png');
}
.natural-performance-3 {
  background-image: url('/static-assets/images/value-creation-story/delivering-on-our-strategy/4f/06-4f-34SidePhoto3.png');
}



.certification .main-content p,
.certification .main-content h5,
.chairman p,
.president p,
.president h3 {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version */
  pointer-events: none;
}

.what-we-do-text,
.value-chain {
    max-width: 70%;
}

.value-chain-graph {
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    width: 100%;
}

.header-content-org-structure {
    display: flex;
    justify-content: space-between;
}

.strategic-positioning-1 {
    background-image: url("/static-assets/images/value-creation-story/strategic-positioning/06-1-2SidePhoto1-Field.png");
    background-size: cover;
    background-position: right top;
}
.strategic-positioning-2 {
    background-image: url("/static-assets/images/value-creation-story/strategic-positioning/06-1-4SidePhoto2-NatGas.png");
    background-size: cover;
    background-position: right top;
}
.strategic-positioning-3 {
    background-image: url("/static-assets/images/value-creation-story/strategic-positioning/06-1-5SidePhoto3-BINHI.png");
    background-size: cover;
    background-position: right top;
}
.strategic-positioning-4 {
    background-image: url("/static-assets/images/value-creation-story/strategic-positioning/06-1-8SidePhoto4.png");
    background-size: cover;
    background-position: right top;
}
.financial-performance {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4a/06-4a-2SidePhoto.png");
    background-size: cover;
    background-position: right top;
}
.esg-1 {
    background-image: url("/static-assets/images/value-creation-story/esg-values/06-6-2SidePhoto1.png");
    background-size: cover;
    background-position: right top;
}
.esg-2 {
    background-image: url("/static-assets/images/value-creation-story/esg-values/06-6-3SidePhoto2.png");
    background-size: cover;
    background-position: right top;
}
.manufactured-performance-1 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4b/06-4b-4SidePhoto1-NatGas-min.png");
    background-size: cover;
    background-position: right top;
}
.manufactured-performance-2 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4b/06-4b-8SidePhoto2-Geo-min.png");
    background-size: cover;
    background-position: right top;
}
.manufactured-performance-3 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4b/06-4b-9SidePhoto3-Hydro-min.png");
    background-size: cover;
    background-position: right top;
}
.manufactured-performance-4 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4b/06-4b-12SidePhoto4-WindSolar-min.png");
    background-size: cover;
    background-position: right top;
}
.manufactured-performance-5 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4b/06-4b-17SidePhoto5-min.png");
    background-size: cover;
    background-position: right top;
}
.manufactured-performance-6 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4b/06-4b-18SidePhoto6.png");
    background-size: cover;
    background-position: right top;
}
.manufactured-performance-7 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4b/06-4b-19SidePhoto7-min.png");
    background-size: cover;
    background-position: right top;
}
.manufactured-performance-8 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4b/06-4b-20SidePhoto8.png");
    background-size: cover;
    background-position: right top;
}
.human-performance-1 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4c/06-4c-2SidePhoto1.jpg");
    background-size: cover;
    background-position: right top;
}
.human-performance-2 {
    background-image: url("/static-assets/images/value-creation-story/delivering-on-our-strategy/4c/06-4c-27SidePhoto2.png");
    background-size: cover;
    background-position: right top;
}

.page-header, .page-header-2 {
    background-image: url("/static-assets/images/common/02-1-1HeaderBG.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 180px;
    max-height: max-content;
    padding: 80px 90px;
    border-bottom-right-radius: 80px;
}
.page-header-2 {
    background-image: url("/static-assets/images/common/02-1-2HeaderBG.png");
}
.card-header {
    background-image: url("/static-assets/images/common/00-card-header.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 80px;
    max-height: max-content;
    padding: 0 90px;
    border-top-right-radius: 80px;
}
.card-header-2 {
    background-image: url("/static-assets/images/common/00-card-header.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 120px;
    max-height: max-content;
    padding: 0 90px;
    border-radius: 80px 80px 0 0;
}
.page-header-our-business {
    background-image: url("/static-assets/images/our-business/03-1_1HeaderBG.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 180px;
    max-height: max-content;
    padding: 80px 90px;
    border-bottom-right-radius: 80px;
}
.page-header-we-do {
    background-image: url("/static-assets/images/our-business/03-2-1HeaderBG1.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 180px;
    max-height: max-content;
    padding: 80px 90px;
    border-bottom-right-radius: 80px;
}
.page-header-org-structure {
    background-image: url("/static-assets/images/our-business/03-2-1HeaderBG.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 180px;
    max-height: max-content;
    padding: 80px 90px;
    border-bottom-right-radius: 80px;
}
.page-header-president-message {
    background-image: url("/static-assets/images/presidents-message/04-2-1HeaderBG.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 180px;
    max-height: max-content;
    padding: 80px 90px;
    border-bottom-right-radius: 80px;
}
.page-header-chairmans-message {
    background-image: url("/static-assets/images/chairmans-message/04-1-1HeaderBG.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 180px;
    max-height: max-content;
    padding: 80px 90px;
    border-bottom-right-radius: 80px;
}
.page-header-corporate-governance {
    background-image: url("/static-assets/images/our-governance/corporate-governance/08-1-1HeaderBG.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 180px;
    max-height: max-content;
    padding: 80px 90px;
    border-bottom-right-radius: 80px;
    background-position: bottom right;
}

.scroll-icon {
    display: none;
}

.img-parent-container {
    flex: 1;
    max-width: 100%;
    max-height: 100%;
}
.img-parent-container img {
    width: 100% !important;
    height: 100% !important;
}

.img-legend-solo {
    width: 5%;
    height: fit-content;
    margin-left: 10px;
}

.img-legend-guide {
    width: 5%;
    height: fit-content;
    margin-right: 10px;
}

.el-white-bg {
  height: 35px;
  width: 100%;
  top: 7%;
  background-color: white;
}

.img-max-w-130 {
    max-width: 130% !important;
  }
  
 .pull-quote {
     margin-left: 3.5rem;
     margin-right: 3.5rem;
 }
 
 .max-width-1000 {
     max-width: 1000px;
 }
 
 .bg-wave {
  background-color: var(--azure-white);
  border-radius: 25px;
  border-bottom-left-radius: 80px;
  height: 100%;
}


.bg-wave {
      background-color: var(--azure-white);
      border-radius: 25px;
      border-bottom-left-radius: 80px;
      height: 100%;
    }

.w-inherit {
  width: inherit !important;
}
.min-w-100 {
  min-width: 100px !important;
}
.width-50 {
  width: 50% !important;
}
.width-60 {
  width: 60% !important;
}

.icn-size-1 {
    min-width: 2.4rem;
    max-width: 3.2rem;
}



/* MEDIA QUERIES */
@media screen and (max-width: 1200px) {
    .main-content {
        width: 100%;
        padding: 30px;
    }
    .main-content .img-wrapper,
    .org-structure-image .img-wrapper {
        max-width: 1200px !important;
        overflow-x: auto;
    }
    .main-content .img-wrapper img,
    .org-structure-image .img-wrapper img {
        width: 1080px !important;
    }
    /* .side-content {
    display: none;
  } */
    .side-content {
        width: 20%;
        background-size: contain;
    }

    .img-container img {
        width: calc(100vmax - 20%);
    }

    .what-we-do-container {
        background-image: none;
    }

    .what-we-do-text,
    .value-chain {
        max-width: 100%;
    }

    .header-content-org-structure {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .scroll-icon {
        display: block;
        text-align: center;
        padding: 10px 15px;
        background-color: var(--gray-opaque);
        font-size: 30px;
        border-radius: 50%;
    }
    
    .widget-box-border2-full {
        height: 2px;
        background-color: var(--aqua);
        margin: 10px 30px;
    }
    
    .el-white-bg {
        top: 4%;
    }
    
    .img-max-w-130 {
        max-width: auto !important;
    }
    
    .photo-sunrise {
        margin-top: 3rem;
    }
    
    .max-width-1000 {
        width: 100%;
    }
    
    .width-50,
    .width-60 {
      width: auto !important;
    }
}

@media screen and (max-width: 992px) {
    .main-content {
        padding: 40px !important;
    }
    .side-content {
        display: none;
    }
    .widget-box-border2-full {
        height: 2px;
        background-color: var(--aqua);
        margin: -20px 40px;
    }
    
    .width-992 {
      width: 992px !important;
    }

    .main-content .img-wrapper,
    .org-structure-image .img-wrapper,
    .phase-diagram .img-wrapper {
        max-width: 992px !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: auto;
    }
    .main-content .img-wrapper img,
    .org-structure-image .img-wrapper img,
    .phase-diagram .img-wrapper img {
        width: 640px !important;
    }
    
    .main-content .img-wrapper img.corporate-governance-img-1 {
        width: 480px !important;
    }
    
    .main-content .img-wrapper img.width-inherit {
        width: inherit !important;
    }

    .main-content .img-wrapper::-webkit-scrollbar,
    .org-structure-image .img-wrapper::-webkit-scrollbar,
    .phase-diagram .img-wrapper::-webkit-scrollbar {
        height: initial;
    }

    .main-content .img-wrapper::-webkit-scrollbar-track,
    .org-structure-image .img-wrapper::-webkit-scrollbar-track,
    .phase-diagram .img-wrapper::-webkit-scrollbar-track {
        background-color: initial;
    }

    .main-content .img-wrapper::-webkit-scrollbar-thumb,
    .org-structure-image .img-wrapper::-webkit-scrollbar-thumb,
    .phase-diagram .img-wrapper::-webkit-scrollbar-thumb {
        background-color: initial;
        height: initial;
        border-radius: initial;
    }

    .main-content .img-wrapper::-webkit-scrollbar,
    .org-structure-image .img-wrapper::-webkit-scrollbar,
    .phase-diagram .img-wrapper::-webkit-scrollbar {
        height: 8px;
        -webkit-scrollbar-width: auto; /* or auto */
    }

    .main-content .img-wrapper::-webkit-scrollbar-track,
    .org-structure-image .img-wrapper::-webkit-scrollbar-track,
    .phase-diagram .img-wrapper::-webkit-scrollbar-track {
        background-color: var(--almost-white);
    }

    .main-content .img-wrapper::-webkit-scrollbar-thumb,
    .org-structure-image .img-wrapper::-webkit-scrollbar-thumb,
    .phase-diagram .img-wrapper::-webkit-scrollbar-thumb {
        background-color: var(--gray);
        height: 8px !important;
        border-radius: 5px;
    }

    .main-content .img-wrapper::-webkit-scrollbar,
    .org-structure-image .img-wrapper::-webkit-scrollbar,
    .phase-diagram .img-wrapper::-webkit-scrollbar {
        height: 8px;
        -webkit-scrollbar-width: auto; /* or auto */
    }

    .main-content .img-wrapper::-webkit-scrollbar-track,
    .org-structure-image .img-wrapper::-webkit-scrollbar-track,
    .phase-diagram .img-wrapper::-webkit-scrollbar-track {
        background-color: var(--almost-white);
    }

    .main-content .img-wrapper::-webkit-scrollbar-thumb,
    .org-structure-image .img-wrapper::-webkit-scrollbar-thumb,
    .phase-diagram .img-wrapper::-webkit-scrollbar-thumb {
        background-color: var(--gray);
        height: 8px !important;
        border-radius: 5px;
    }

    .odd-even-content .widget-box img {
        width: 100%;
        height: auto;
    }

    .value-chain-graph {
        display: flex;
        flex-direction: column !important;
        align-items: center;
        justify-content: space-between;
    }

    .value-chain-graph-image {
        margin: 1rem 0;
    }

    .cond-display {
        display: none;
    }

    .img-sm-scroll-effect {
        margin-right: -40px;
    }
    
    .ph-power-image {
        max-width: 400px;
    }
    
    .table-container-1,
    .table-container-2,
    .table-container-3 {
        max-width: 992px;
        overflow-x: auto;
        margin-right: -40px;
    }
    .table-container-1 .table,
    .table-container-2 .table,
    .table-container-3 .table {
        width: 1200px;
    }
    .card-header {
        padding: 0 40px;
        border-top-right-radius: 50px;
    }
    .card-header-2 {
        padding: 0 40px;
        border-radius: 50px 50px 0 0;
    }
    
    .el-white-bg {
        top: 5%;
    }
    
    .pull-quote {
        margin-right: 1.5rem !important;
    }
    
    .bg-wave {
        min-height: 300px;
    }
    
    .img-sm-width-1 {
        min-width: 480px;
    }
    
    .img-sm-width-2 {
        min-width: 470px;
    }


    
}

@media screen and (max-width: 767px) {
  .table-container-1,
  .table-container-2,
  .table-container-3{
    max-width: 992px;
    overflow-x: auto;
    margin-right: -40px;
  }
  
  .table-container-1 .table,
  .table-container-2 .table,
  .table-container-3 .table{
    width: 1200px;
  }
  
  .img-legend-solo, .img-legend-guide {
    width: 10%;
    }

    .img-sm-scroll-effect img.smaller-scroll {
    width: calc(100vw + 80%) !important;
  }
  .img-sm-scroll-effect img.smaller-scroll-2 {
    width: calc(100vw + 60%) !important;
  }
  .img-sm-scroll-effect img.smaller-scroll-3 {
    width: calc(100vw + 40%) !important;
  }
  .img-sm-scroll-effect img.smaller-scroll-100 {
    width: calc(100vw + 100%) !important;
  }
  .img-sm-scroll-effect img.smaller-scroll-0 {
    width: calc(100vw + 150%) !important;
  }
  .img-sm-scroll-effect img.smaller-scroll-200 {
    width: calc(100vw + 200%) !important;
  }
  .img-sm-scroll-effect img.smaller-scroll-250 {
    width: calc(100vw + 250%) !important;
  }
  .img-sm-scroll-effect img.smaller-scroll-20 {
    width: calc(100vw + 20%) !important;
  }
  .img-sm-scroll-effect img.smaller-scroll-5 {
    width: calc(100vw + 5%) !important;
  }
  
  .card-header-2 h3{
    font-size: calc(1rem + .6vw);
    }
  
}

@media screen and (max-width: 540px) {
  .el-white-bg {
    top: 4%;
  }
}

/* END: MEDIA QUERIES */