.logo-container {
  display: flex;
  align-items: center; /* Align the logo and text vertically */
}

.site-logo {
  margin-right: 10px; /* Space between the logo and the site title */
  max-height: 50px; /* Optional: Resize the logo */
}

.site-title {
  font-size: 1.2em; /* Adjust the font size of the site title */
  font-weight: bold;
  color: #333; /* Adjust color if needed */
}


    .info-block {
      background-color: #e8f5e9; /* Light green */
      border: 1px solid #c8e6c9; /* Slightly darker green */
      border-radius: 8px;
      text-align: center;
      padding: 15px;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      transition: transform 0.2s, box-shadow 0.2s;
      flex: 1 1 calc(33.33% - 20px); /* Flexible layout with space for 3 items per row */
      max-width: calc(33.33% - 20px); /* Ensure proper spacing in desktop */
      margin-bottom: 20px; /* Space between rows */
    }
    .info-block:hover {
      transform: translateY(-5px);
      box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
    }
    .info-block img {
      max-width: 100%;
      height: auto;
      border-radius: 8px;
      margin-bottom: 10px;
    }
    .info-block h3 {
      color: #1b5e20; /* Dark green */
      margin-bottom: 10px;
    }
    .info-container {
      display: flex; /* Flex layout for side-by-side items */
      flex-wrap: wrap; /* Wrap items to the next row on smaller screens */
      justify-content: center; /* Center blocks in the row */
      gap: 20px; /* Space between blocks */
    }
    @media (max-width: 768px) {
      .info-block {
        flex: 1 1 100%; /* Each block takes full width on mobile */
        max-width: 100%;
      }
    }