                                                                /* SDG-1 */
.u9sdg-header {
    background-color: #e5243b;
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u9sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u9sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u9sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: #880a1f;
  }
  
  .u9sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u9sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u9sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u9sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u9sdg-icon-row {
    margin-top: 60px;
  }
  
  .u9sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u9targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u9targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u9targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u9targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u9targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u9target-card {
    border-left: 5px solid #e5243b;
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u9target-card:hover {
    background: #f1f1f1;
  }
  
  .u9target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u9target-label {
    background: #e5243b;
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u9target-card img {
    height: 100px;
    width: auto;
  }
  
  .u9target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u9target-card p {
    font-size: 15px;
    color: #333;
  }
 

                                                            /* SDG 2 */

.u2sdg-header {
    background-color: rgb(228, 182, 52);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u2sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u2sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u2sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(119, 72, 4);
  }
  
  .u2sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u2sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u2sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u2sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u2sdg-icon-row {
    margin-top: 60px;
  }
  
  .u2sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u2targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u2targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u2targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u2targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u2targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u2target-card {
    border-left: 5px solid rgb(228, 182, 52);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u2target-card:hover {
    background: #f1f1f1;
  }
  
  .u2target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u2target-label {
    background: rgb(228, 182, 52);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u2target-card img {
    height: 100px;
    width: auto;
  }
  
  .u2target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u2target-card p {
    font-size: 15px;
    color: #333;
  }
 


  /*---------------------------------------------- SDG 3 ----------------------------------------------- */
  
  .u3sdg-header {
    background-color: rgb(75, 158, 55);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u3sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u3sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u3sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(13, 59, 6);
  }
  
  .u3sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u3sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u3sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u3sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u3sdg-icon-row {
    margin-top: 60px;
  }
  
  .u3sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u3targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u3targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u3targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u3targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u3targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u3target-card {
    border-left: 5px solid rgb(75, 158, 55);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u3target-card:hover {
    background: #f1f1f1;
  }
  
  .u3target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u3target-label {
    background: rgb(75, 158, 55);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u3target-card img {
    height: 100px;
    width: auto;
  }
  
  .u3target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u3target-card p {
    font-size: 15px;
    color: #333;
  }

  /* --------------------------SDG 5-----------------------------------  */

  .u5sdg-header{
    background-color: rgb(231, 65, 46);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u5sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u5sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u5sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(128, 5, 1);
  }
  
  .u5sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u5sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u5sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u5sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u5sdg-icon-row {
    margin-top: 60px;
  }
  
  .u5sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u5targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u5targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u5targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u5targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u5targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u5target-card {
    border-left: 5px solid rgb(231, 65, 46);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u5target-card:hover {
    background: #f1f1f1;
  }
  
  .u5target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u5target-label {
    background: rgb(231, 65, 46);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u5target-card img {
    height: 100px;
    width: auto;
  }
  
  .u5target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u5target-card p {
    font-size: 15px;
    color: #333;
  }


  /* --------------------------------------SDG 6------------------------------------- */


  .u6sdg-header{
    background-color: rgb(44, 186, 223);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u6sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u6sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u6sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(1, 83, 121);
  }
  
  .u6sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u6sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u6sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u6sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u6sdg-icon-row {
    margin-top: 60px;
  }
  
  .u6sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u6targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u6targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u6targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u6targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u6targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u6target-card {
    border-left: 5px solid rgb(44, 186, 223);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u6target-card:hover {
    background: #f1f1f1;
  }
  
  .u6target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u6target-label {
    background: rgb(44, 186, 223);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u6target-card img {
    height: 100px;
    width: auto;
  }
  
  .u6target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u6target-card p {
    font-size: 15px;
    color: #333;
  }

  /* ------------------------SDG 7-------------------------------------- */

  .u7sdg-header{
    background-color: rgb(251, 193, 13);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u7sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u7sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u7sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: white;
  }
  
  .u7sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u7sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u7sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u7sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u7sdg-icon-row {
    margin-top: 60px;
  }
  
  .u7sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u7targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u7targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u7targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u7targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u7targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u7target-card {
    border-left: 5px solid rgb(251, 193, 13);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u7target-card:hover {
    background: #f1f1f1;
  }
  
  .u7target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u7target-label {
    background: rgb(251, 193, 13);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u7target-card img {
    height: 100px;
    width: auto;
  }
  
  .u7target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u7target-card p {
    font-size: 15px;
    color: #333;
  }

  /* -----------------------------------SDG 8-------------------------------------------- */


  .u8sdg-header{
    background-color: rgb(162, 26, 67);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u8sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u8sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u8sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(64, 0, 42);
  }
  
  .u8sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u8sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u8sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u8sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u8sdg-icon-row {
    margin-top: 60px;
  }
  
  .u7sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u8targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u8targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u8targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u8targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u8targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u8target-card {
    border-left: 5px solid rgb(162, 26, 67);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u8target-card:hover {
    background: #f1f1f1;
  }
  
  .u8target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u8target-label {
    background: rgb(162, 26, 67);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u8target-card img {
    height: 100px;
    width: auto;
  }
  
  .u8target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u8target-card p {
    font-size: 15px;
    color: #333;
  }

  /*----------------------------------------------- SDG 9------------------------------------- */

  
  .u1sdg-header{
    background-color: rgb(236, 105, 47);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u1sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u1sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u1sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(135, 38, 0);
  }
  
  .u1sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u1sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u1sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u1sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u1sdg-icon-row {
    margin-top: 60px;
  }
  
  .u1sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u1targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u1targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u1targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u1targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u1targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u1target-card {
    border-left: 5px solid rgb(236, 105, 47);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u1target-card:hover {
    background: #f1f1f1;
  }
  
  .u1target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u1target-label {
    background: rgb(236, 105, 47);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u1target-card img {
    height: 100px;
    width: auto;
  }
  
  .u1target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u1target-card p {
    font-size: 15px;
    color: #333;
  }

  /*------------------------------------ SDG 10------------------------------  */

    .u10sdg-header{
    background-color: rgb(220, 22, 104);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u10sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u10sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u10sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(110, 0, 53);
  }
  
  .u10sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u10sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u10sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u10sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u10sdg-icon-row {
    margin-top: 60px;
  }
  
  .u10sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u10targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u10targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u10targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u10targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u10targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u10target-card {
    border-left: 5px solid rgb(220, 22, 104);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u10target-card:hover {
    background: #f1f1f1;
  }
  
  .u10target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u10target-label {
    background: rgb(220, 22, 104);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u10target-card img {
    height: 100px;
    width: auto;
  }
  
  .u10target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u10target-card p {
    font-size: 15px;
    color: #333;
  }

  /* ------------------------------SDG 11---------------------------------- */

      .u11sdg-header{
    background-color: rgb(244, 156, 44);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u11sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u11sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u11sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(148, 64, 9);
  }
  
  .u11sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u11sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u11sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u11sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u11sdg-icon-row {
    margin-top: 60px;
  }
  
  .u11sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u11targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u11targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u11targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u11targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u11targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u11target-card {
    border-left: 5px solid rgb(244, 156, 44);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u11target-card:hover {
    background: #f1f1f1;
  }
  
  .u11target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u11target-label {
    background: rgb(244, 156, 44);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u11target-card img {
    height: 100px;
    width: auto;
  }
  
  .u11target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u11target-card p {
    font-size: 15px;
    color: #333;
  }

  /* ---------------------------SDG 12----------------------  */

    .u12sdg-header{
    background-color: rgb(199, 152, 44);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u12sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u12sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u12sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(91, 50, 3);
  }
  
  .u12sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u12sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u12sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u12sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u12sdg-icon-row {
    margin-top: 60px;
  }
  
  .u12sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u12targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u12targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u12targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u12targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u12targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u12target-card {
    border-left: 5px solid rgb(199, 152, 44);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u12target-card:hover {
    background: #f1f1f1;
  }
  
  .u12target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u12target-label {
    background: rgb(199, 152, 44);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u12target-card img {
    height: 100px;
    width: auto;
  }
  
  .u12target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u12target-card p {
    font-size: 15px;
    color: #333;
  }


  /* -----------------SDG 13-------------------------- */

      .u13sdg-header{
    background-color: rgb(62, 126, 69);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u13sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u13sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u13sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(0, 48, 31);
  }
  
  .u13sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u13sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u13sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u13sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u13sdg-icon-row {
    margin-top: 60px;
  }
  
  .u13sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u13targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u13targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u13targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u13targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u13targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u13target-card {
    border-left: 5px solid rgb(62, 126, 69);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u13target-card:hover {
    background: #f1f1f1;
  }
  
  .u13target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u13target-label {
    background: rgb(62, 126, 69);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u13target-card img {
    height: 100px;
    width: auto;
  }
  
  .u13target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u13target-card p {
    font-size: 15px;
    color: #333;
  }

  /* -----------------------SDG 14---------------------------  */

    .u14sdg-header{
    background-color: rgb(21, 149, 211);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u14sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u14sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u14sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(0, 53, 112);
  }
  
  .u14sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u14sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u14sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u14sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u14sdg-icon-row {
    margin-top: 60px;
  }
  
  .u14sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u14targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u14targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u14targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u14targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u14targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u14target-card {
    border-left: 5px solid rgb(21, 149, 211);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u14target-card:hover {
    background: #f1f1f1;
  }
  
  .u14target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u14target-label {
    background: rgb(21, 149, 211);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u14target-card img {
    height: 100px;
    width: auto;
  }
  
  .u14target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u14target-card p {
    font-size: 15px;
    color: #333;
  }

  /*-------------------------------------------- SDG 15-----------------------  */

      .u15sdg-header{
    background-color: rgb(98, 177, 52);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u15sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u15sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u15sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(16, 87, 2);
  }
  
  .u15sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u15sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u15sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u15sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u15sdg-icon-row {
    margin-top: 60px;
  }
  
  .u15sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u15targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u15targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u15targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u15targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u15targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u15target-card {
    border-left: 5px solid rgb(98, 177, 52);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u15target-card:hover {
    background: #f1f1f1;
  }
  
  .u15target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u15target-label {
    background: rgb(98, 177, 52);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u15target-card img {
    height: 100px;
    width: auto;
  }
  
  .u15target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u15target-card p {
    font-size: 15px;
    color: #333;
  }

  /* -----------------------------SDG 16------------------------------------------ */

    .u16sdg-header{
    background-color: rgb(0, 104, 157);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u16sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u16sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u16sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(0, 27, 60);
  }
  
  .u16sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u16sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u16sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u16sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u16sdg-icon-row {
    margin-top: 60px;
  }
  
  .u16sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u16targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u16targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u16targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u16targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u16targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u16target-card {
    border-left: 5px solid rgb(0, 104, 157);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u16target-card:hover {
    background: #f1f1f1;
  }
  
  .u16target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u16target-label {
    background: rgb(0, 104, 157);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u16target-card img {
    height: 100px;
    width: auto;
  }
  
  .u16target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u16target-card p {
    font-size: 15px;
    color: #333;
  }

  /*------------------------------------------ SDG 17-----------------------------------  */
  .u17sdg-header{
    background-color: rgb(24, 72, 106);
    color: white;
    text-align: center;
    padding: 80px 20px 40px;
    position: relative;
    overflow: hidden;
  }
  
  .u17sdg-container {
    max-width: 1000px;
    margin: auto;
  }
  
  .u17sdg-main-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  
  .u17sdg-number {
    font-size: 160px;
    font-weight: bold;
    line-height: 1;
    color: rgb(0, 19, 46);
  }
  
  .u17sdg-title {
    color: white;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
  }
  
  .u17sdg-subtitle {
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  
  
  .u17sdg-more-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid white;
    padding: 8px 16px;
    border-radius: 25px;
    transition: background 0.3s;
    display: inline-block;
  }
  
  .u17sdg-more-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  
  .u17sdg-icon-row {
    margin-top: 60px;
  }
  
  .u17sdg-icon-row img {
    max-width: 100%;
    height: auto;
  }

  .u17targets-section {
    background: #fff;
    padding: 60px 20px;
    font-family: 'Segoe UI', sans-serif;
  }
  
  .u17targets-container {
    max-width: 1200px;
    margin: auto;
  }
  
  .u17targets-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  
  .u17targets-description {
    font-size: 16px;
    margin-bottom: 40px;
    color: #333;
    max-width: 800px;
  }
  
  .u17targets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
  }
  
  .u17target-card {
    border-left: 5px solid rgb(24, 72, 106);
    padding: 20px;
    background: #f9f9f9;
    transition: background 0.3s;
  }
  
  .u17target-card:hover {
    background: #f1f1f1;
  }
  
  .u17target-header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  
  .u17target-label {
    background: rgb(24, 72, 106);
    color: white;
    font-weight: bold;
    padding: 4px 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 3px;
  }
  
  .u17target-card img {
    height: 100px;
    width: auto;
  }
  
  .u17target-card h3 {
    font-size: 18px;
    margin: 10px 0 5px;
    font-weight: bold;
  }
  
  .u17target-card p {
    font-size: 15px;
    color: #333;
  }