.card h1 {
      font-size: 2rem;
      font-weight: bold;
    }
    .highlight-card {
      border-radius: 12px;
      padding: 10px;
      color: white;
    }
    .green-bg { 
      background-color: #06a04e; 
      height:320px!important;
      margin-left: -8px!important;
      width:320px!important;
    }

    .green-second, .equi-card{
      background-color: rgb(121, 209, 124);
    }
   
  
    .yellow-bg { 
      background-color: rgb(235,158,10);
      color: white; 
      width:320px!important;
      height:320px!important;
      
    }
    .header-title {
      font-size: 1.8rem;
      font-weight: bold;
      margin-left:8px;
      color:#046933;
      font-family: "Open Sans", Helvetica, Arial, sans-serif;
      
    }
    .cardnormal {
      width: auto;
      height: auto;
      margin-top: 10px;
      margin-left: -10px;
    }
    .card-body-fonten {
      padding-left: 20px;
      padding-right: 10px;
      width:100%;
    
    }
    .chart-card {
      border-radius: 12px;
      background-color: #f8f9fa;
     
    }
    .card {
      box-shadow: 0 4px 8px rgba(48, 48, 48, 0.1);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
      
    }
    .card:hover {
      transform: scale(1.03);
      cursor: pointer;
      transform: translateY(-2px);
      box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);

    }
 
    .badge-date {
      font-size: 1.48rem;
      font-weight: bold;
      border-radius: 12px;
    }
    .icon-tree {
      font-size: 36px;
      color: #f8f9fa !important;
    }
  
    .badge-light {
      border-radius: 12px;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05); 
      transition: transform 0.2s ease, box-shadow 0.2s ease;
      background-color:#ffffff;
    }
    .badge-light:hover {
      transform: scale(1.03);
      cursor: pointer;
      transform: translateY(-2px);
      box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
    }

    .energy-source {
      display: flex;
      align-items: center;
      margin: 15px 0;
    }

    /* Ajustar a width do card fonte de energia */
    .cardfonte{
     width:320px;
     min-width:120px;
     border:solid 0.5px rgb(191, 190, 190);
     margin-left:2px;
    }
    #tempicon{
      color: #ff3300;
    }
    #humicon{
      color: #00bcd4;
    }
    .green-card{
      margin-left: 8px!important;
      
    }
    .yellow-card{
      margin-left: 10px!important;
      margin-right:30px!important;
  
      
    }
    .last-card{
      margin-right: 76px!important;
    
    }
    .graphrow {
      margin-top: 20px;
  
    }
   
    .humid{
      color: #00bcd4;
    }
    .tempid{
      color:#ff3300;
    }
    .chart-container{
      height:250px;
      
     
    }
    .chart-container-fonte {
      height: 250px;
   
    }
    .chart-container2{
      height:250px;
      
    }
    .card-body{
      width:100%;
    }
    /* Ajustar a width do card de CO2 */
    .cardco2{
      width:656px;
      border:solid 0.5px rgb(191, 190, 190);
      
    }
    body{
      background-color: #f5fffa;
      padding:0;
      width:100%;
      
    }
    .spacechart{
      margin-right: 8px;
    }
    .spacechart2{
      margin-left: 8px;
    }
   
    .sub-title {
      font-size: 22.9px;
      color: #1a8623;
      margin-top:10px;
      margin-bottom:20px;
      font-family: "Open Sans", Helvetica, Arial, sans-serif;
    }
    .h4bold {
      font-weight: bold;
      text-transform: uppercase;
      color: #1a8623;
    }
    .h4light {
      font-weight: 400;
      
    }
    .fontes-card{
      margin-left:-4px;
    }
    .container{
      max-width: 1700px;
      max-height:1200px;
      padding:5px;
      display:block;
    }
    .container-news{
      max-width: 1700px;
      max-height:1200px;
      margin-left:84px!important;
     
    }
    .container-text{
     max-width: 1700px;
      max-height:1200px;
      margin-left:84px!important;
      margin-bottom:232px;
    }
   
    .card-title{
      font-size: 30px;
      font-weight: 700;
      padding:0 auto;
      margin-top:32px;
      font-family:"Open Sans", Helvetica, Arial, sans-serif;
      
    }
    /* Ajustar o width do chart de energia */
    .carden{
      width:650px;
      border:solid 0.5px rgb(191, 190, 190);
    }
    .chart-title{
      font-size:26px;
    } 
    /* Ajusta o padding to card de produção global */
    .value1, .unities1{
      padding-top:10px;
      font-family: "Open Sans", Helvetica, Arial, sans-serif;
    }
    .value2, .unities2{
      padding-top:10px;
      font-family: "Open Sans", Helvetica, Arial, sans-serif;
    }
    .icon{
      padding-top:4px;
    }
    .value3{
      margin-top:40px;
      font-family: "Open Sans", Helvetica, Arial, sans-serif;
    }
   
   .value4{
    margin-top:58px;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
   }
   .unities4{
    padding-top:10px;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
   }
   .value5, .unities5{
    padding-top:10px;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
   
   }

   .paragraph{
    font-size: 24px;
    line-height: 1.5;
    color: #333;
    margin-bottom: 20px;
    text-align: justify;
    color: #0f5215;
   }
   .context-title {
    font-size: 38px;
    font-weight: bold;
    color: #1a8623;
    margin-bottom: 20px;
    text-align: left;

   }
   #header-section{
    background-color: #fcb900;
   }


   .sobre-projeto{
    margin-top:114px!important;
   
   }
   .notas-text{
    font-size: 20px;
    line-height: 1.5;
    color: #333;
    margin-bottom: 20px;
    text-align: justify;
    color: #0f5215;
    
   }
   .newslink {
      display: block;
      margin: 10px 0;
      font-size: 1.2rem;
      color: #007bff;
      text-decoration: none;
      margin-left: 8px;
    }
    .header-titlenews{
      font-size: 1.8rem;
      font-weight: bold;
      margin-left:8px;
      margin-top:-160px;
      margin-bottom: 20px;
    }
    .btnnews{
      color: black !important;
    }
    .btnnews:hover{
      color: rgb(255, 255, 255) !important;
      background-color: #333 !important;
    }
    .container-news{
      margin:0;
     
    }

    .icon-solar{
      color:#15200258;
      margin-top:-380px!important;
      margin-left:-250px!important;
      font-size: 22px!important;
    }
    .icon-bolt{
      color:#15200258;
      margin-top:-300px!important;
      margin-left:-30px!important;
    }
    .context-blob{
      width:25px;
      height:25px;
      border-radius:8px;
    }
    .context-text{
      margin-left:34px;
      margin-top:-24px;
      color:rgb(78, 77, 77);
      font-family:"Open Sans", Helvetica, Arial, sans-serif;

    }

    .context-div{
      margin-top:8px;
      height:130px;
    }

    .orange-blob{
      background-color: rgb(235,158,10);
    }
    .light-green-blob{
      background-color: rgb(150,218,158);
    }
    .green-blob{
      background-color: rgb(8,158,84);
    }
    .break{
      display:block;
    }
   

   /* Media queries */

@media only screen and (max-width: 401px) and (max-height: 2000px)  { 
.cardco2{
    width:320px;
  }
  .carden{
    width:320px;
  }
  .green-bg,.yellow-bg{
    width:320px;
  }
  .row.justify-content-md-center > div {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 1rem;
  }

  .square-card {
    width: 100% !important;
    height: auto;
  }
  .chart-card{
    width: 100% !important;
    height: auto;
  }
  .container{
    min-height: 100%!important;
  }
   .container{
    min-height: 100%!important;
  }
  body{
    height:3500px;
  }
  .green-second{
    left:none;
    right:none;
    margin:0 auto;
  }
}

@media only screen and (max-width: 700px) and (max-height: 2000px) {
  .cardco2{
    width:320px;
  }
  .carden{
    width:320px;
  }
  .green-bg,.yellow-bg{
    min-width:100%;
  }
  .row.justify-content-md-center > div {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 1rem;
  }

  .square-card {
    width: 100% !important;
    height: auto;
  }
  .chart-card{
    width: 100% !important;
    height: auto;
  }
  .container{
    min-height: 100%!important;
  }
  body{
    height:3500px;
  }
 
  
}






   /* Dispositivos pequenos (tablets em modo retrato e telemóveis grandes) */
     /* @media only screen and (max-height: 600px) {
       .green-bg {
        max-width: 128px!important;
        max-height:190px!important;
        margin-left:-10px!important;
      }
      .last-card{
        margin-right:86px!important;
      }
      .yellow-bg{
        max-width: 138px!important;
        max-height:190px!important;
        margin-left:-10px!important;
      }
      
      .container {
        max-width: 800px!important;
        max-height: 650px!important;
        margin:0 auto;
        height:610px!important;
        border:solid 1px black;
        
    }
      .card-title{
        font-size:11px!important;
      }
      .card-title-equi {
        font-size: 12px!important;
      }
      .cardfonte{
        max-width: 128px;
        height:300px!important;  

      }
      .cardco2{
        max-width: 278px;
        margin-left: -44px!important;
        height:300px!important; 
      }
      .carden{
        max-width: 302px;
        margin-left:-4px!important;
        height:300px!important; 
      }
      .chart-title{
        font-size:12px!important;
      }
      .chart-container, .chart-container2 {
        height: 240px!important;
        width:100%!important;
      }
      .chart-container-fonte {
        height: 240px !important; 
        padding-bottom: 20px !important; 
      }
      .last-card-col {
          flex: 0 0 8.333333% !important; 
          max-width: 8.333333% !important;
        }

        .icon-solar{
          color:#15200258;
          margin-top:-354px!important;
          margin-left:-104px!important;
          font-size: 18px!important;
        }
        .icon-bolt{
          color:#15200258;
          margin-top:-270px!important;
          margin-left:-20px!important;
          font-size: 18px!important;
        }
        .notas-text{
          margin-bottom:20px!important;
        }
        .sobre-projeto{
          margin-top:170px!important;
        }
        
      }  */
   /* Dispositivos grandes (portateis e computadores) */
     /* @media only screen and (max-width: 801px) {
      .green-bg {
        max-width: 128px!important;
        max-height:190px!important;
        margin-left:-10px!important;
      }
      .last-card{
        margin-right:86px!important;
      }
      .yellow-bg{
        max-width: 138px!important;
        max-height:190px!important;
        margin-left:-10px!important;
      }
      
      .container {
        max-width: 800px!important;
        max-height: 650px!important;
        margin:0 auto;
        
        height:620px!important;
        
    }
      .card-title{
        font-size:11px!important;
      }
      .card-title-equi {
        font-size: 12px!important;
      }
      .cardfonte{
        max-width: 128px;
        height:280px!important;  
        

      }
      .cardco2{
        max-width: 278px;
        margin-left: -44px!important;
        height:280px!important;
      }
      .carden{
        max-width: 302px;
        margin-left:-4px!important;
        height:280px!important;
      }
      .chart-title{
        font-size:12px!important;
      }
      .chart-container, .chart-container2 {
        height: 240px!important;
        width:100%!important;
      }
      .chart-container-fonte {
        height: 200px !important; 
        width:100%!important;
        
      }
      
      
      .last-card-col {
          flex: 0 0 8.333333% !important; 
          max-width: 8.333333% !important;
        }
  }  */


 /* @media only screen and (max-width: 1024px) and (max-height: 768px),  1024x768 
 only screen and (device-width: 1016px) and (device-height: 642px) {
 
    .yellow-bg {
      max-width:190px!important;
      margin-left:20px!important;
      max-height:194px!important;

    }

    .green-bg {
      max-width:180px!important;
      margin-left:10px!important;     
      max-height:194px!important;
    }

    .last-card{
      margin-right:64px!important;
    }

    .sub-title{
      font-size: 16px!important;
      margin-bottom: 20px;
      letter-spacing: 2.2px!important;
    }
    .first-card{
      margin-left:-10px!important;
      max-width: 188px!important;
      
    }
    .cardfonte {
      width: 188px!important;
      height:264px!important;
      margin-left: 2px;
    }
    .cardco2 {
      width: 366px!important;
      margin-left: -44px!important;
      height:264px!important;
    }
    .carden{
      width: 398px!important;
      margin-left:-0.3px!important;
      height:264px!important;
    }
    .chart-container, .chart-container-fonte, .chart-container2 {
      height: 214px!important;
      width: 100%!important;
    }
    .container {
      max-width: 180vh!important;
      height: 100vh!important; 
     
    }
    .card-title {
      font-size: 20px!important;
      margin-bottom:-16px;
    }
    .chart-title{
      font-size:16px!important;
    }
  
    .value1, .value2, .value3, .value4, .value5 {
      
      font-size: 16px!important;
    }
    .value1, .value2{
      margin-top:12px;
    }
    .card-title-equi {
      margin-top: 48px;
      font-size: 20px!important;
    }
    .value4{
      margin-top:24px;
    }
    .unities4{
      margin-top:-10px;
    }
    .value5{
      margin-top:14px;
      margin-bottom:-1px;
    }
    .icon{
      font-size: 22px!important;
      margin-bottom:4px;
    }
    .unities1{
      margin-top:-10px;
      font-size: 16px!important;
    }
   .unities2{
      margin-top:-11px;
      font-size: 16px!important;
    }
    .unities4{
      font-size: 16px!important;
    }
    .unities5{
      font-size: 16px!important;
    }
    .chart-title{
      font-size:20px;
    }
    .value3{
      margin-top:32px;
    }
    .header-title {
      margin-left: -1px;
      
    }
    .header-titlenews{
      font-size: 1.8rem;
      font-weight: bold;
      margin-left:0px;
      margin-top:160px;
      margin-bottom: 20px;
    }
    .icon-solar{
      color:#15200258;
      margin-top:-320px!important;
      margin-left:-134px!important;
      font-size: 18px!important;
    }
    .icon-bolt{
      color:#15200258;
      margin-top:-228px!important;
      margin-left:-20px!important;
      font-size: 18px!important;
    }

  } */


   /* @media 
  only screen and (max-width: 1152px) and (min-height: 738px),  1152x864 
  only screen and (device-width: 1144px) and (device-height: 738px) {


    .yellow-bg{
      max-width: 200px;
      max-height:230px;
    }
    .green-bg{
      min-width: 210px;
      max-height:230px;
    }

   .cardfonte{
      height:240px!important;
      width:230px;
    }
    .chart-title{
      font-size:18px!important;
    }
    .cardco2{
      height:240px!important;
      margin-left: -42px!important;
      width: 436px!important;
    }
    .carden{
      height:240px!important;
      margin-left:16px!important;
      max-width: 438px!important;
    }
    .chart-container, .chart-container-fonte, .chart-container2{
      height:180px;
    }
    .equi-card{
      margin-left:28px!important;
    }
    .green-second{
      margin-left:22px!important;
      
    }
    .first-card{
      min-width:230px!important;
    }
    .yellow-first{
      margin-left:32px!important;
    }
    .yellow-last{
      margin-left:36px;
    }
    .sobre-projeto{
      margin-top:140px!important;
    }
    .notas{
      width:1146px!important;
    }
    .container-text{
      width:1186px!important;
      margin-left:28px!important;
      
    }
    .container-news{
      width:1186px!important;
      margin-left:28px!important;
    }
    .badge-date{
      margin-right:18px!important;
    }
    .card-title{
      font-size:medium;
    }
    .unities1, .unities2, .icon, .unities4, .unities5{
      font-size:medium;
    }
    .value1, .value2, .value3, .value4, .value5{
      font-size:22px!important;
    }
    .icon-solar{
      color:#15200258;
      margin-top:-308px!important;
      margin-left:-144px!important;
      font-size: 18px!important;
    }
    .icon-bolt{
      color:#15200258;
      margin-top:-228px!important;
      margin-left:-20px!important;
      font-size: 18px!important;
    }

  } */

  /*Resolução 1024*/
  @media only screen and (min-width: 1000px) and (max-width:1030px) {
    
    .yellow-bg {
      max-width:180px!important;
      margin-left:20px!important;
      max-height:194px!important;

    }

    .green-bg {
      max-width:180px!important;
      margin-left:10px!important;     
      max-height:194px!important;
    }

    .last-card{
      margin-right:64px!important;
    }

    .sub-title{
      font-size: 16px!important;
      margin-bottom: 20px;
      letter-spacing: 1.7px!important;
    }
    .first-card{
      margin-left:-10px!important;
      max-width: 188px!important;
      
    }
    .cardfonte {
      width: 188px!important;
      height:234px!important;
      margin-left: 2px;
    }
    .cardco2 {
      width: 366px!important;
      margin-left: -44px!important;
      height:234px!important;
    }
    .carden{
      width: 378px!important;
      margin-left:18px!important;
      height:234px!important;
    }
    .chart-container, .chart-container-fonte, .chart-container2 {
      height: 184px!important;
      width: 100%!important;
    }
    .container {
      max-width: 180vh!important;
      height: 100vh!important; 
     
    }
    .card-title {
      font-size: 16px!important;
      
    }
    .chart-title{
      font-size:16px!important;
    }
  
    .value1, .value2, .value3, .value4, .value5 {
      font-size: 16px!important;
    }
    .value1, .value2{
      margin-top:12px;
    }
   
    .value4{
      margin-top:24px;
    }
    .unities4{
      margin-top:-10px;
    }
    .value5{
      margin-top:14px;
      margin-bottom:-1px;
    }
    .icon{
      font-size: 22px!important;
      margin-bottom:4px;
    }
    .unities1{
      margin-top:-10px;
      font-size: 16px!important;
    }
   .unities2{
      margin-top:-11px;
      font-size: 16px!important;
    }
    .unities4{
      font-size: 16px!important;
    }
    .unities5{
      font-size: 16px!important;
    }
    .chart-title{
      font-size:20px;
    }
    .value3{
      margin-top:32px;
    }
    .header-title {
      margin-left: -1px;
      
    }
    .yellow-first{
      margin-left:34px!important;
    }
    .context-text{
      font-size: 12px;
    }
    .light-green-blob-div{
      margin-left:-46px;
    }
    .orange-blob-div{
      margin-left:16px;
    }
    

   }




   /*  Dispositivos  grandes (desktops com um ecrã grande e portateis com ecrã grande) */
    @media only screen and (min-width: 1100px) {
    
    .green-bg, .yellow-bg {
      width: 200px!important;
      height:220px!important;
      margin-left: 18px;
      margin-right: 8px;
    }
    .cardfonte {
      width: 200px;
      height:294px;
      margin-left: 2px;
    }
    .cardco2 {
      width: 410px;
      margin-left: -52px;
    }
    .carden{
      width: 510px;
      margin-left:22px;
    }
    .chart-container, .chart-container-fonte, .chart-container2 {
      height: 220px;
    }
    .container {
      max-width: 1400px;
      max-height: 900px;
      padding:20px!important;
      margin:0 auto;
    }
    .card-title {
      font-size: 22px;
    }
    .sub-title{
      font-size: 20px;
      letter-spacing: 0.35px;
    }
  
    .value1, .value2, .value3, .value4, .unities4, .value5, .unities5 {
      margin-bottom: 10px;
      font-size: 20px!important;
    }
    .value1, .value2{
      margin-top:12px;
    }
   
    .value4{
      margin-top:24px;
    }
    .unities4{
      margin-top:-10px;
    }
    .value5{
      margin-top:14px;
      margin-bottom:-1px;
    }
    .icon{
      font-size: 22px!important;
      margin-bottom:4px;
    }
    .unities1{
      margin-top:-10px;
    }
   .unities2{
      margin-top:-11px;
    }
    .chart-title{
      font-size:20px;
    }
    .value3{
      margin-top:32px;
    }
    .header-title {
      margin-left: -1px;
    }
    .header-titlenews{
      font-size: 1.8rem;
      font-weight: bold;
      margin-left:0px;
      margin-top:180px;
      margin-bottom: 20px;
    }
    .yellow-first{
      margin-left:28px!important;
    }
    .light-green-blob-div{
      margin-left:-70px;
    }
    .context-text-green{
      width:180px;
    }
    .equi-card{
      margin-left:12px!important;
    }
    .green-second{
      margin-left:10px!important;
    }
    .carden{
      margin-left:8px;
      width:418px;
    }
    .card-title{
      font-size: 18px;
    }

   }

    @media only screen and (min-width: 1200px) {
    
    .green-bg, .yellow-bg {
      width: 230px!important;
      height:220px!important;
      margin-left: 18px;
      margin-right: 8px;
    }
    .cardfonte {
      width: 240px;
      height:294px;
      margin-left: 2px;
    }
    .cardco2 {
      width: 510px;
      margin-left: -80px;
    }
    .carden{
      width: 442px!important;
      margin-left:28px!important;
    }
    .chart-container, .chart-container-fonte, .chart-container2 {
      height: 220px;
    }
    .container {
      max-width: 1400px;
      max-height: 900px;
      padding:20px!important;
      margin:0 auto;
    }
    .card-title {
      font-size: 22px;
      margin-bottom:-16px;
    }
  
    .value1, .value2, .value3, .value4, .unities4, .value5, .unities5 {
      margin-bottom: 10px;
      font-size: 20px!important;
    }
    .value1, .value2{
      margin-top:12px;
    }
    .card-title-equi {
      margin-top: 48px;
      font-size: 22px;
    }
    .value4{
      margin-top:24px;
    }
    .unities4{
      margin-top:-10px;
    }
    .value5{
      margin-top:14px;
      margin-bottom:-1px;
    }
    .icon{
      font-size: 22px!important;
      margin-bottom:4px;
    }
    .unities1{
      margin-top:-10px;
    }
   .unities2{
      margin-top:-11px;
    }
    .chart-title{
      font-size:20px;
    }
    .value3{
      margin-top:32px;
    }
    .header-title {
      margin-left: -1px;
    }
    .header-titlenews{
      font-size: 1.8rem;
      font-weight: bold;
      margin-left:0px;
      margin-top:180px;
      margin-bottom: 20px;
    }
    .yellow-first{
      margin-left:44px!important;
    }
    .light-green-blob-div{
      margin-left:-54px;
    }
    .orange-blob-div{
      margin-left:28px;
    }
    .context-text-green{
      width:180px;
    }
    .yellow-last{
      margin-left:36px!important;
    }

   }


    @media only screen and (min-width: 1250px) {
    
    .green-bg, .yellow-bg {
      width: 210px!important;
      max-height:200px!important;
      margin-left: 18px;
      margin-right: 8px;
      margin-top:-6px;
    }
    .cardfonte {
      width: 224px;
      height:230px;
      margin-left: 2px;
    }
    .first-card{
      width: 224px!important;
    }
    .cardco2 {
      width: 432px;
      margin-left: -52px;
      height: 230px;
    }
    .carden{
      width: 449.3px;
      margin-left:30px!important;
      height:230px;
    }
    .chart-container, .chart-container-fonte, .chart-container2 {
      height: 180px;
      width:100%;
    }
    .container {
      max-width: 1200px;
      max-height: 900px!important;
      height:550px;
      padding:20px!important;
      
      margin:0 auto;
    }
    .card-title {
      font-size: 20px;
      margin-top:6px;
    }
  
    .value1, .value2, .value3, .value4, .unities4, .value5, .unities5 {
      margin-bottom: 10px;
      font-size: 22px!important;
    }
    .value1, .value2{
      margin-top:12px;
    }
    .card-title-equi {
      margin-top: 6px;
      font-size: 20px;
    }
    .value3{
      margin-top:24px !important;
    }
    .value4{
      margin-top:24px;
    }
    .unities4{
      margin-top:-10px;
    }
    .value5{
      margin-top:14px;
      margin-bottom:-1px;
    }
    .icon{
      font-size: 20px!important;
      margin-bottom:4px;
    }
    .unities1{
      margin-top:-10px;
    }
   .unities2{
      margin-top:-11px;
    }
    .chart-title{
      font-size:20px;
    }
    .value3{
      margin-top:32px;
    }
    .header-title {
      margin-left: -1px;
      font-size: 24px;
      margin-top:-10px;
    }
    .sub-title{
      font-size: 16px;
      margin-top:-14px;
      letter-spacing: 3.7px;
    }
    .context-text{
      font-size: 14px;
    }
    

    
   }

   /* Para ecrãs com resolução de 1366px */
   @media only screen and (min-width: 1300px){

     .green-bg, .yellow-bg {
      width: 220px!important;
      height:220px!important;
      
      margin-right: 8px;
    }
    .cardfonte {
      width: 220px;
      height:220px;
      margin-left: 2px;

    }
    .cardco2 {
      width: 458px;
      margin-left: -75px!important;
     height:220px;
    }
    .carden{
      width: 470px;
      margin-left:10px;
      height:220px;
    }
    .chart-container, .chart-container-fonte, .chart-container2 {
      height: 150px;
   
    }
    .container {
      max-width: 1300px;
      max-height: 628px;
      padding:40px!important;
      margin:0 auto;
     
    }
    .card-title {
      font-size: 22px;
      margin-bottom:-14px;
    }
  
    .value1, .value2, .value3, .value4, .unities4, .value5, .unities5 {
      margin-bottom: 10px;
      font-size: 20px!important;
    }
    .value1, .value2{
      margin-top:12px;
    }
    .card-title-equi {
    
      font-size: 22px;
    }
    .value4{
      margin-top:24px;
    }
    .unities4{
      margin-top:-10px;
    }
    .value5{
      margin-top:14px;
      margin-bottom:-1px;
    }
    .icon{
      font-size: 22px!important;
      margin-bottom:4px;
    }
    .unities1{
      margin-top:-10px;
    }
   .unities2{
      margin-top:-11px;
    }
    .chart-title{
      font-size:20px;
    }
    .value3{
      margin-top:32px;
    }
    .header-title {
      margin-left: -1px;
      font-size: 26px;
    }
    .sub-title{
      font-size:20px;
      letter-spacing: 2px;
    }
    .header-titlenews{
      font-size: 1.8rem;
      font-weight: bold;
      margin-left:0px;
      margin-top:90px;
      margin-bottom: 20px;
    }
    .yellow-first{
      margin-left:8px!important;
    }
    .equi-card{
        margin-left:26px!important;
        max-width:210px!important;
      }
      .green-second{
        margin-left:24px!important;
        max-width:210px!important;
      }
      
      .yellow-bg{
        right:16px;
        max-width:210px!important;
      }
      .yellow-first{
        left:42px;
      }
      .yellow-last{
        left:10px;
      }
      .chart-container-fonte{
        min-height:170px!important;
        
      }
      .chart-container{
        min-height:170px!important;
        
      }
      .chart-container2{
        min-height:170px!important;
      }
      .carden{
        width: 454px!important;
        margin-left: 42px!important;
      }
      .cardco2{
        margin-left:-42px!important;
        width: 448px!important;
      }
      .cardfonte {
        width: 248px!important;
      
      }
      .first-card{
        min-width: 248px!important;
      }
      .orange-blob-div{
        margin-left:24px!important;
      }
      .light-green-blob-div{
        margin-left:-22px;
      }
      .break{
        display: block;
      }
      .card-title{
        font-size: 18px;
      }
      .value1,.value2,.value3,.value4,.value5{
        font-size: 28px!important;
      }
       .orange-blob-div{
      margin-left:40px!important;
      }
      .light-green-blob-div{
        margin-left:-40px!important;
      }
      .green-blob-div{
        margin-left:2px;
      }
      .context-text{
        font-size: 11px;;
      }

   }


 /* @media 
    only screen and (min-width: 1330px) and (max-height: 650px),  1360x768 
    only screen and (device-width: 1352px) and (device-height: 642px) {

     
      .equi-card{
        margin-left:26px!important;
        max-width:210px!important;
      }
      .green-second{
        margin-left:24px!important;
        max-width:210px!important;
      }
      
      .yellow-bg{
        right:16px;
        max-width:210px!important;
      }
      .yellow-first{
        left:42px;
      }
      .yellow-last{
        left:10px;
      }
      .chart-container-fonte{
        min-height:170px!important;
        
      }
      .chart-container{
        min-height:170px!important;
        
      }
      .chart-container2{
        min-height:170px!important;
      }
      .carden{
        width: 454px!important;
        margin-left: 42px!important;
      }
      .cardco2{
        margin-left:-42px!important;
        width: 448px!important;
      }
      .cardfonte {
        width: 248px!important;
      
      }
      .first-card{
        min-width: 248px!important;
      }
      .orange-blob-div{
        margin-left:24px!important;
      }
      .light-green-blob-div{
        margin-left:-22px;
      }
      .break{
        display: block;
      }
      .card-title{
        font-size: 18px;
      }
      .value1,.value2,.value3,.value4,.value5{
        font-size: 28px!important;
      }
       .orange-blob-div{
      margin-left:40px!important;
      }
      .light-green-blob-div{
        margin-left:-40px!important;
      }
      .green-blob-div{
        margin-left:2px;
      }
      .context-text{
        font-size: 11px;;
      }
    } */

 

    @media only screen and (min-width: 1370px) /*1400 e 1440 res*/ {

       
       .yellow-first{
          margin-left: 18px!important;
        }
         .orange-blob-div{
          margin-left:12px!important;
        }
        .light-green-blob-div{
          margin-left:-76px;
        }
        .green-blob-div{
          margin-left:2px;
        }
        .context-text{
          font-size: 13px!important;
          width:180px;
        }
        .context-text-light-green{
          width:320px;
        }
        .context-text-orange{
          width:280px;
        }
        .equi-card{
          margin-left:26px!important;
        }
        .green-second{
          margin-left:24px!important;
        }
        .yellow-first{
          margin-left:-20px!important;
        }
        .carden{
           width: 482px!important;
           margin-left:14px!important;
        }
        .sub-title{
          font-size: 19.2px;
        }
      }



      @media 
    only screen and (min-width: 1570px) /*1600 e 1680 res*/ {

      .orange-blob-div{
        margin-left:14px!important;
      }
    .light-green-blob-div{
        margin-left:-40px!important;
      }
    .green-blob-div{
        margin-left:2px;
      }
      .green-second{
        margin-left:24px!important;
      }
      .equi-card{
        margin-left: 22px!important;
      }
      .carden{
        margin-left:14px!important;
      }
    }
 

  /*  Dispositivos extra grandes (desktops com um ecrã grande e portateis com ecrã grande) */
   @media only screen and (min-width: 1800px) {
    
    .green-bg{
      min-width: 322px!important;
      min-height:310px!important;
      margin-left: 18px;
      margin-right: 8px;
    }
    
    .yellow-bg{
      min-width: 312px!important;
      min-height:310px!important;
      margin-left: 18px;
      margin-right: 8px;
    }
    .yellow-last{
      margin-left: 20px!important;
      min-width: 302px!important;
    }
    .yellow-first{
      margin-left: 2px!important;
      min-width: 302px!important;
    }
    .cardfonte {
      width: 354px!important;
      margin-left: 4px;
      height:340px;
    }
    .cardco2 {
      width: 674px!important;
      height:340px;
      margin-left:-62px!important;
    }
    .carden{
      width: 620px!important;
      height:340px;
      margin-left:78px!important;
    }
    .chart-container, .chart-container-fonte, .chart-container2 {
      height: 250px;
      width:100%;
    }
    .container{
      width: 1800px!important;
      max-width:2300px;
      min-height: 900px!important;
      max-height:2000px;
      margin:0 auto;
     
    }
    .card-title {
      font-size: 28px;
      margin-bottom:-12px;
      margin-top:50px;
    }
  
    .unities1, .unities2, .icon, .unities4{
      margin-bottom: 10px;
      font-size: 30px!important; 
    }
    .unities5{
      font-size: 30px!important; 
      margin-top:-10px!important;
    }
    .value1, .value2, .value3, .value4, .value5 {
      margin-bottom: 10px;
      font-size: 38px!important; 
    }
    .chart-title{
      font-size:24px;
    }
    .sub-title{
      font-size:26px;
      letter-spacing: 5px;
      margin-bottom:32px!important;
    }
    .header-title{
      font-size: 32px;
      margin-top:2px!important;
      margin-bottom:22px!important;
    }
    .equi-card{
      margin-left:22px!important;
    }
    .green-second{
      margin-left:20px!important;
    }
    .header-titlenews{
      font-size: 1.8rem;
      font-weight: bold;
      margin-left:0px;
      margin-top:-210px;
      margin-bottom: 20px;
    }
    .first-card{
      width: 354px!important;
    }
    .icon-solar{
        color:#15200258;
        margin-top:-356px!important;
        margin-left:-282px!important;
        font-size: 22px!important;
      }
    .icon-bolt{
        color:#15200258;
        margin-top:-280px!important;
        margin-left:-28px!important;
        font-size: 22px!important;
      }
      .notas-text{
        font-size:16px;
        margin-top:0px;
      }
      .badge-date{
        margin-right:6px!important;
      }
      .container-news{
        width: 1740px!important;
        max-width:2300px;
      }
      .container-text{
        width: 1740px!important;
        max-width:2300px;
      }
      .break{
        display:block;
      }
      .green-blob-div{
        margin-left:4px;
      }
      .light-green-blob-div{
        margin-left:-64px!important;
      }
      .orange-blob-div{
        margin-left:78px!important;
      }
      .context-text-green{
        letter-spacing: 2px;
      }
      .context-text{
        letter-spacing: 1px;
        width:280px;
      }
      .context-text-light-green{
        width:550px;
        
      }
      .context-text-orange{
        width:400px;
        
      }
   }