/* dev */

.borders {
  border: 1px dotted #EF6500;
}
.borders-pink {
  border: 1px dotted #D402AB !important;
}
.borders-green {
  border: 2px dotted #72BC06;
}

.borders-blue {
  border: 1px solid #0DA0FC !important;
}







/* NAVIGATION */
      .navigation {
        margin-top: 12px;
      }
     .navItem {
       font-size: 0.93rem;
       font-weight: 700;
       margin-right: 2rem;
       text-transform: uppercase;
       color: #C1C1C1;
     }
     .navItem a {
       color: #C1C1C1;
     }



/* MENU */

     .menu {
       margin-right: 1em !important;
       margin-bottom: 0.75em !important;
       background-color: #ffffff;
     }

     .menuList{
       list-style-type: none;
       font-size: 0.85em;
       letter-spacing: 0.05em;
       text-transform: uppercase;
       margin-left: 2px;
     }

     .menuList li {
       margin: 0px;
       text-transform: uppercase;
       cursor: pointer;
     }

     .menuList li:hover {
       color: #0CB3FF; /* Text color on hover */
     }





/* TYPOGRAPHY */
body, h1, h2, h3, h4, h5, h6, ul, li p {
 font-family: 'Raleway'!important;
 color: #3D3D3D;
 line-height: 1.5;
}





/* LAYOUT GRID */

    .align-top {
        align-items: flex-start;
    }

    .grid-padding {
      padding: .3em;
    }

    .grid-x {
      display: flex;
      flex-wrap: wrap;
    }

    .gridCell {
      padding-bottom: 10px;
      padding-right: 10px;
      flex: 1 1 auto; /* Allow grid cells to grow and shrink as needed */
      min-width: 0; /* Prevent cells from overflowing */
    }

    #grid {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }



/* LAYOUT COMPANIES*/

    .featuredTitle {
    }

    .sectionTitle {
      font-size: 1.5em;
      font-weight: 600;
      color: #484641;
      margin-bottom: 1em;
    }

    .pageHeading {
      margin-top: 1.2em;
    }

    .pageDescription {
      font-size: 1.25em;
      min-height: 7em;
    }

    .companyCell {
      border: 0px solid #E3E3E3 !important;
      padding: 1em;
      display: flex;
    }

    .companyItem {
      padding-bottom: 15px;
      list-style-type: none;
    }

    .companyName {
      font-size: 2em;
      font-weight: 600;
      white-space: nowrap;
    }



    .countryName {
      margin-left: 0.5em;
      font-weight: bold;
    }

    .featuredCompanies {
      margin-bottom: 5em;
    }

    .featureCell {
      border: 1px solid #E3E3E3 !important;
      background-color: #F9F7F1;
      padding: 1em;
    }

    .otherCompanies {
      margin-bottom: 20em;
    }

    .otherCompanyName {
      font-size: 1.17em;
      font-weight: 600;
      white-space: nowrap;
    }

    .companySummary {
      margin-left: 0.5em;
      font-size: 1.08em;
      line-height: 1.55em;
    }

    .companyDescription {
      margin-left: 0.5em;
      font-size: 1.07em;
      line-height: 1.55em;
    }


/* PEOPLE */
    .person-name {
      font-size: 1em;
      font-weight: 600;
    }

    .person-card {
      margin-bottom: 0em;

    }

    .social-logo {
      width: 20px;
      margin-right: 0px;
      vertical-align: Top;
    }

    .name-and-icons {
        display: flex;
        align-items: center;
        gap: 20px; /* Adjust spacing between the name and icons */
    }


/* ORGANISATIONS */

    .organisation{
    margin-bottom: 30px;
    }

    .organisation-name {
      font-size: 1em;
      font-weight: 600;
    }

    .organisation-portfolio {
      text-transform: uppercase;
      font-size: 0.8em;
      color: #E64632;
    }

    .contact-linkedin {
      margin-left: 10px;
    }

    .introParagraph {
      margin-left: .3em;
    }





/* READING */
    .reading-list li {
      list-style: disc;
      margin-bottom: 1.6em;
    }

    .readingItem {
      font-size: 1.1em;
      font-weight: 400;
    }

    .readingDate {
      margin-left: 7px;
      text-transform: uppercase;
      color: #B2B2B2;
      font-size: 0.8em;
    }
    .readingTitle {
      margin-left: 7px;
    }

    .readingLink {
      text-transform: uppercase;
      font-size: 0.8em;
      color: #E64632;
    }

    .readingCell {
    padding-top: 1em;
    padding-right: 1em;
    }

    .readingList {
      margin-bottom: 5em;
    }







/* FOOTER */

.footer {
  padding-top: 10em;
}


.tagListIndex{
  list-style-type: none;
  font-size: 0.85em;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.tagListIndex li {
  margin: 0px;
  /* display: inline-block; */
  margin-right: 2px;
  text-transform: uppercase;
  cursor: pointer;
  margin-left: -17px;
}

.tagListIndex li:hover {
  color: #0CB3FF; /* Text color on hover */
}





.tagList {
  list-style-type: none;
  padding: 0;
  font-size: 0.80em;
  margin-left: 0rem;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.tagList li {
  color: #fff; /* Default text color */
  margin: 2px;

  display: inline-block;
  margin-right: 5px;
  margin-bottom: 5px;
  border-radius: 17px;
  border: 0px solid #ccc;
  padding: 2px 10px; /* this is the padding of the text left & right */
  min-width: 50px;
  text-transform: uppercase;
}

.tagList li {
  cursor: pointer;
}

.tagList li:hover {
  background-color: rgba(255,0,0,0.7);
  color: #3D3D3D; /* Text color on hover */
}

.tagItem {
  margin-left: : 3em !important;
}




/* TAG THEMES COLOURS */

.tagList li.tag-automation {
  background-color: #ACC400;
}
.tagList li.tag-automation:hover {
  background-color: #ACC4004D; // 33 at the end represents 20% opacity, 4D = 30% & 80 = 50%
}

.tagList li.tag-agriculture {
  background-color: #74718D;
}
.tagList li.tag-agriculture:hover {
  background-color: #74718D4D;
}

.tagList li.tag-hvac {
  background-color: #85CA23;
}
.tagList li.tag-hvac:hover {
  background-color: #85CA234D;
}

.tagList li.tag-autonomy {
  background-color: #5F919A;
}
.tagList li.tag-autonomy:hover {
  background-color: #5F919A4D;
}

.tagList li.tag-batteries {
  background-color: #0B6CCC;
}
.tagList li.tag-batteries:hover {
  background-color: #0B6CCC33;
}

.tagList li.tag-buildings {
  background-color: #4C9E86;
}
.tagList li.tag-buildings:hover {
  background-color: #4C9E864D;
}

.tagList li.tag-capital {
  background-color: #BB82BB;
}
.tagList li.tag-capital:hover {
  background-color: #BB82BB4D;
}

.tagList li.tag-carbon {
  background-color: #C0B8BB;
}
.tagList li.tag-carbon:hover {
  background-color: #C0B8BB4D;
}

.tagList li.tag-carbon-capture {
  background-color: #9C8F8D;
}
.tagList li.tag-carbon-capture:hover {
  background-color: #9C8F8D4D;
}

.tagList li.tag-carbon-removal {
  background-color: #817470;
}
.tagList li.tag-carbon-removal:hover {
  background-color: #8174704D;
}

.tagList li.tag-charging {
  background-color: #0782D7;
}
.tagList li.tag-charging:hover {
  background-color: #0782D74D;
}

.tagList li.tag-climate {
  background-color: #0CBEFF;
}
.tagList li.tag-climate:hover {
  background-color: #0CBEFF33;
}




.tagList li.tag-data {
  background-color: #CBC300;
}
.tagList li.tag-data:hover {
  background-color: #CBC3004D;
}

.tagList li.tag-default {
  background-color: #A19F9B;
}
.tagList li.tag-default:hover {
  background-color: #A19F9B4D;
}

.tagList li.tag-energy {
  background-color: #D82600;
}
.tagList li.tag-energy:hover {
  background-color: #D8260033;
}

.tagList li.tag-ev {
  background-color: #0DA0FC;
}
.tagList li.tag-ev:hover {
  background-color: #0DA0FC4D;
}

.tagList li.tag-finance {
  background-color: #2EDDDC;
}
.tagList li.tag-finance:hover {
  background-color: #2EDDDC4D;
}

.tagList li.tag-food {
  background-color: #817C56;
}
.tagList li.tag-food:hover {
  background-color: #817C564D;
}

.tagList li.tag-heatpumps {
  background-color: #608E71;
}
.tagList li.tag-heatpumps:hover {
  background-color: #608E714D;
}

.tagList li.tag-homes {
  background-color: #6AC50B;
}
.tagList li.tag-homes:hover {
  background-color: #6AC50B4D;
}

.tagList li.tag-hydrogen {
  background-color: #DD0093;
}
.tagList li.tag-hydrogen:hover {
  background-color: #DD009333;
}

.tagList li.tag-industrial {
  background-color: #6F13DD;
}
.tagList li.tag-industrial:hover {
  background-color: #6F13DD33;
}

.tagList li.tag-ldes {
  background-color: #E15400;
}
.tagList li.tag-ldes:hover {
  background-color: #E154004D;
}

.tagList li.tag-materials {
  background-color: #BC00C4;
}
.tagList li.tag-materials:hover {
  background-color: #BC00C433;
}

.tagList li.tag-microgrids {
  background-color: #F19E00;
}
.tagList li.tag-microgrids:hover {
  background-color: #F19E004D;
}

.tagList li.tag-nuclear {
  background-color: #E20096;
}
.tagList li.tag-nuclear:hover {
  background-color: #E200964D;
}

.tagList li.tag-software {
  background-color: #D7C300;
}
.tagList li.tag-software:hover {
  background-color: #D7C3004D;
}

.tagList li.tag-solar:hover {
  background-color: #EDB7014D;
}
.tagList li.tag-solar {
  background-color: #EDB701;
}

.tagList li.tag-storage {
  background-color: #EF6500;
}
.tagList li.tag-storage:hover {
  background-color: #EF65004D;
}

.tagList li.tag-transmission {
  background-color: #EB7D00;
}
.tagList li.tag-transmission:hover {
  background-color: #EB7D004D;
}

.tagList li.tag-transport {
  background-color: #0BA9F1;
}
.tagList li.tag-transport:hover {
  background-color: #0BA9F14D;
}

.tagList li.tag-waste {
  background-color: #7F05CD;
}
.tagList li.tag-waste:hover {
  background-color: #7F05CD33;
}

.tagList li.tag-wind {
  background-color: #F18000;
}
.tagList li.tag-wind:hover {
  background-color: #F180004D;
}












/* Image STYLES */
  .thumb-crop {
   width: 100%;
   max-height: 100px;
   object-fit: cover;
   object-position: 0% 30%;
  }

  /* Image STYLES */
    .thumbWidth {
     max-width: 350px;
     object-fit: cover;
    }

    .thumbHeight {
     max-height: 330px;
     object-fit: cover;
    }











/* Quotation STYLES */
      blockquote {
      	font-family: 'Cormorant Garamond';
        font-size: 1.424rem;
      	line-height: 1.2em;
      	letter-spacing: -0.01em;
      	font-style: italic;
        font-weight: 100;
      }
      blockquote:before {
        color: #CBCBCB;
        content: "\201C";
        font-size: 2em;
        font-weight: 700;
        vertical-align: -0.2em;
        line-height: 0em;
        margin-right: 5px;
      }
      .attribution {
         color: #B9B9B5;
         font-family: sans-serif;
         font-size: 1rem;
         font-style: normal;
         font-weight: 100;
      }
      .pull-quote-right {
          float: right;
        	margin-left: 0.7rem;
      }
      .pull-quote-left {
        	float: left;
          margin-left: 1rem;
      }





/* TIMELINE STYLING */

      .shadow-3, .hover-shadow-3:hover {
          box-shadow: 0 0 12px rgba(0, 0, 0, 0.06);
        }
      .rounded {
          border-radius: 0.25rem !important;
        }
      .timeline {
          position: relative;
          list-style: none;
          padding: 1rem 0;
          margin: 0;
        }
      .timeline::before {
          content: '';
          position: absolute;
          left: 50%;
          top: 0;
          bottom: 0;
          width: 2px;
          margin-left: -1px;
          background-color: #50a1ff;
        }

      .timeline-item {
          position: relative;
          width: 50%;
          padding: 1rem 0;
          padding-right: 2.5rem;
          text-align: right;
        }
      .timeline-item::before {
          content: '';
          position: absolute;
          right: -8px;
          top: 1.35rem;
          display: inline-block;
          width: 16px;
          height: 16px;
          border-radius: 50%;
          border: 2px solid #50a1ff;
          background-color: #fff;
        }
      .timeline-item:nth-child(even) {
          margin-left: 50%;
          padding-left: 2.5rem;
          padding-right: 0;
          text-align: left;
        }
      .timeline-item:nth-child(even)::before {
          right: auto;
          left: -8px;
        }
      .timeline-horizontal {
          display: flex;
        }
      .timeline-horizontal::before {
          left: 0;
          bottom: auto;
          right: 0;
          width: 100%;
          height: 2px;
        }
      .timeline-horizontal .timeline-item {
          padding: 1.5rem 1rem;
          text-align: left;
        }
      .timeline-horizontal .timeline-item::before {
          top: -1.5rem;
          left: 0.75rem;
        }
      .timeline-horizontal .timeline-item:nth-child(even) {
          margin-left: 0;
        }
      @media (max-width: 767.98px) {
      .timeline::before {
          left: 8px;
        }
      .timeline-item {
          width: 100%;
          text-align: left;
          padding-left: 2.5rem;
          padding-right: 0;
        }
      .timeline-item::before {
          top: 1.25rem;
          left: 1px;
        }
      .timeline-item:nth-child(even) {
          margin-left: 0rem;
        }
      .timeline-item:nth-child(even)::before {
          left: 1px;
        }
      .timeline-horizontal {
          flex-direction: column;
        }
      .timeline-horizontal::before {
          right: auto;
          bottom: 0;
          width: 2px;
          height: 100%;
        }
      .timeline-horizontal .timeline-item {
          padding: 1rem 0;
          padding-left: 2.5rem;
        }
      .timeline-horizontal .timeline-item::before {
          top: 1.25rem;
          left: 1px;
        }

      .timestamp {
          color: C2C2BC;
          text-transform: uppercase;
          font-size: 0.8rem;
      }
      .caption {
          font-size: 0.9rem;
          letter-spacing: 0.05rem;
          color: #5E5E5F;
      }






/* SCREEN SIZE BREAKPOINTS */

      /* If the screen size is 1520px wide or MORE */
      @media screen and (min-width: 1520px) {
        #menu .menuList {
          display: block; /* Stack items vertically */
        }

        #menu .menuList .cell {
          width: 100%; /* Full width for each item */
          display: block;
        }
      }

      /* If the screen size is 1520px wide or LESS */
      @media screen and (max-width: 1520px) {
        #menu .menuList {
          display: block; /* Stack items vertically */
        }

        #menu .menuList .cell {
          width: 100%; /* Full width for each item */
          display: block;
        }
      }

      /* If the screen size is 1024px wide or LESS */
      @media screen and (max-width: 1024px) {
        #menu .menuList {
          display: block; /* Stack items vertically */
        }

        #menu .menuList .cell {
          width: 100%; /* Full width for each item */
          display: block;
        }
      }

      /* If the screen size is 768px wide or LESS */
      @media screen and (max-width: 768px) {
        #menu .menuList {
          display: block; /* Stack items vertically */
        }

        #menu .menuList .cell {
          width: 100%; /* Full width for each item */
          display: block;
        }
      }

      /* If the screen size is 640px wide or LESS */
      @media screen and (max-width: 640px) {
        .pageHeading {
          font-size: 2.7em;
        }

        #menu .menuList {
          display: flex;
          flex-wrap: wrap; /* Allow items to wrap to the next line */
          flex-direction: row; /* Align items horizontally */
        }

        #menu .menuList .cell {
          width: auto; /* Let the width be determined by the content */
          white-space: normal; /* Allow text to wrap */
          display: inline-block;
          flex: 1 1 auto; /* Ensure items can shrink and grow as needed */
        }
      }

      /* If the screen size is 480px wide or LESS */
      @media screen and (max-width: 480px) {
        #menu .menuList {
          display: flex;
          flex-wrap: wrap; /* Allow items to wrap to the next line */
          flex-direction: row; /* Align items horizontally */
        }

        #menu .menuList .cell {
          width: auto; /* Let the width be determined by the content */
          white-space: normal; /* Allow text to wrap */
          display: inline-block;
          flex: 1 1 auto; /* Ensure items can shrink and grow as needed */
        }
      }