html ecommerece search box

1<div class="row">
2  <div class="left" style="background-color:transparent;">
3          <h3 style="text-align: center;">Plants</h3>
4    <input type="text" id="mySearch" onkeyup="myFunction()" placeholder="Search.." title="Type in a category">
5    <ul id="myMenu">
6      <li><a href="#">Edible Plants <p style="color: red;">60% off</p></a></li>
7      <li><a href="#">Saplings <p style="color: red;">40% off</p></a></li>
8      <li><a href="#">Small Plants</a></li>
9      <li><a href="#">Leaf Plants</a></li>
10      <li><a href="#">Flower Plants</a></li>
11    </ul>
12    
13    <style>
14    	body {
15  font-family: Arial, Helvetica, sans-serif;
16  background: #9909;
17}
18
19* {
20  box-sizing: 10px;
21}
22
23.row {
24  width: 500px;
25}
26
27/* Left column (menu) */
28.left {
29  flex: 10%;
30  padding: 15px 0;
31}
32
33.left h2 {
34  padding-left: 8px;
35}
36
37/* Style the search box */
38#mySearch {
39  width: 95%;
40  font-size: 18px;
41  padding: 11px;
42  border: 1px solid #ddd;
43}
44
45/* Style the navigation menu inside the left column */
46#myMenu {
47  padding: 1;
48  margin: 0;
49}
50
51#myMenu li a {
52  padding: 10px;
53  text-decoration: none;
54  font-size: 10px;
55  color: black;
56  display: block;
57}
58
59#myMenu li a:hover {
60  background-color: #eee;
61}
62</style>
63
64<style>
65  
66  .product{
67    width: 100%;
68  max-width: 400px;
69  height: auto;
70    border: 5px solid #555;
71    border-radius: 10px;
72  }
73
74  .product:hover{
75    padding-left: 25px;
76    box-shadow: 5px white;
77  }
78    </style>
79    
80    <script>
81    	function myFunction() {
82  var input, filter, ul, li, a, i;
83  input = document.getElementById("mySearch");
84  filter = input.value.toUpperCase();
85  ul = document.getElementById("myMenu");
86  li = ul.getElementsByTagName("li");
87  for (i = 0; i < li.length; i++) {
88    a = li[i].getElementsByTagName("a")[0];
89    if (a.innerHTML.toUpperCase().indexOf(filter) > -1) {
90      li[i].style.display = "";
91    } else {
92      li[i].style.display = "none";
93    }
94  }
95}
96    </script>
97