modify the following " <!DOCTYPE html>
<html>
  <head>
    <title>Custom Search Bar</title>
    <style>
      .container {
        max-width: 800px;
        margin: 0 auto;
        text-align: center;
      }

      h1 {
        font-size: 36px;
        margin-bottom: 30px;
      }

      form {
        display: inline-block;
        margin-bottom: 30px;
      }

      input[type="text"] {
        padding: 10px;
        font-size: 16px;
        border: none;
        border-radius: 5px 0 0 5px;
      }

      button {
        padding: 10px;
        font-size: 16px;
        border: none;
        border-radius: 0 5px 5px 0;
        background-color: #4CAF50;
        color: white;
        cursor: pointer;
      }

      #search-results {
        display: none;
        margin-top: 30px;
      }

      #search-results table {
        width: 100%;
        border-collapse: collapse;
      }

      #search-results th {
        font-size: 24px;
        padding: 10px;
        background-color: #4CAF50;
        color: white;
      }

      #search-results td {
        font-size: 16px;
        padding: 10px;
        border: 1px solid #ddd;
        text-align: center;
      }

      #search-results td img {
        max-width: 200px;
        max-height: 200px;
      }
    </style>
  </head>
  <body>
    <div class="container">
      <h1>Custom Search Bar</h1>
      <form id="search-form">
        <input type="text" id="search-input" name="search" placeholder="Enter search term...">
        <button type="submit" id="search-button">Search</button>
      </form>
      <div id="search-results"></div>
    </div>
     <script>  
      const form = document.getElementById('search-form');
      const input = document.getElementById('search-input');
      const results = document.getElementById('search-results');

      form.addEventListener('submit', (event) => {
        event.preventDefault();
        const searchTerm = input.value.trim().toLowerCase();
        const foundElements = searchForTerm(searchTerm);
        displayResults(foundElements);
      });

      function searchForTerm(term) {
  const foundElements = [];
  const elements = document.querySelectorAll('.wsite-content .row');
  for (let i = 0; i < elements.length; i++) {
    const termElement = elements[i].querySelector('.col-left p');
    const imageElement = elements[i].querySelector('.col-right img[alt="squid"]');
    if (termElement && termElement.textContent.trim().toLowerCase() === term) {
      foundElements.push({
        term: termElement.textContent,
        imageURL: imageElement ? imageElement.src : '',
        pageURL: 'https://origami-lime.weebly.com/marine-origami-hwang.html'
      });
    }
  }
  return foundElements;
}

      function displayResults(foundElements) {
        if (foundElements.length === 0) {
          results.innerHTML = '<p>No results found.</p>';
          results.style.display = 'block';
        } else {
          const table = document.createElement('table');
          const headerRow = document.createElement('tr');
          const termHeader = document.createElement('th');
          termHeader.textContent = 'Searched Term';
          const imageHeader = document.createElement('th');
          imageHeader.textContent = 'Image';
          headerRow.appendChild(termHeader);
          headerRow.appendChild(imageHeader);
          table.appendChild(headerRow);
          for (let i = 0; i < foundElements.length; i++) {
            const row = document.createElement('tr');
            const termCell = document.createElement('td');
            termCell.textContent = foundElements[i].term;
            termCell.addEventListener('click', () => {
              window.location.href = foundElements[i].pageURL;
            });
            const imageCell = document.createElement('td');
            if (foundElements[i].imageURL) {
              const image = document.createElement('img');
              image.src = foundElements[i].imageURL;
              imageCell.appendChild(image);
            }
            row.appendChild(termCell);
            row.appendChild(imageCell);
            table.appendChild(row);
          }
          results.innerHTML = '';
          results.appendChild(table);
          results.style.display = 'block';
        }
      }
    </script>
  </body>
</html>" so that it finds TERM and IMAGE SOURCE <div class="row">
		<div class="col col-left">
			<p>TERM</p>
		</div>
		<div class="col col-right">
			<img src="IMAGE SOURCE" alt="squid" style="max-width: 150px;">                                              
		</div>