diff --git a/img/redwood.jpg b/img/redwood.jpg
new file mode 100644
index 0000000..4b4fa5a
Binary files /dev/null and b/img/redwood.jpg differ
diff --git a/index.html b/index.html
index 7eb0fd4..57b8ba9 100644
--- a/index.html
+++ b/index.html
@@ -24,6 +24,8 @@ <h1>The Tree Encyclopedia</h1>
             <h3>Index</h3>
             <p><button id="oak">Oak</button></p>
             <p><button id="beech">Beech</button></p>
+            <p><button id="maple">Maple</button></p>
+            <p><button id="redwood">Redwood</button></p>
 
         </div>
         <div class="content">
@@ -48,11 +50,22 @@ <h3>Index</h3>
         $("#oak").click(function(){
             $("#i_content").attr("src","oak_content.html");
             $("#i_summary").attr("src","oak_summary.html");
-        })
-        $("#beech").click(function(){
-
+        });
 
-        })
+        $("#beech").click(function(){
+          $("#i_content").attr("src","beech_content.html");
+          $("#i_summary").attr("src","beech_summary.html");
+        });
+
+        $("#maple").click(function(){
+          $("#i_content").attr("src","maple_content.html");
+          $("#i_summary").attr("src","maple_summary.html");
+        });
+
+        $("#redwood").click(function(){
+          $("#i_content").attr("src","redwood_content.html");
+          $("#i_summary").attr("src","redwood_summary.html");
+        });
 
         /* This will not be merged !  */
 
diff --git a/maple_content.html b/maple_content.html
new file mode 100644
index 0000000..951140b
--- /dev/null
+++ b/maple_content.html
@@ -0,0 +1,21 @@
+<style>
+  @import url('https://fonts.googleapis.com/css2?family=Lato&family=Overlock:wght@700&display=swap');
+  body{font-family: 'Lato', sans-serif;
+  text-align: center;
+  color: white;
+  }
+  h3{
+    font-family: 'Overlock', cursive;
+    font-size: 28px;
+    margin: 0px;
+    padding-top: 10px;
+  }
+  p{
+    font-size: 16px;
+    padding: 0px;
+  }
+  </style>
+  
+  <h3>Maple</h3>
+  
+  <p>maple</p>
diff --git a/maple_summary.html b/maple_summary.html
new file mode 100644
index 0000000..fddb7f7
--- /dev/null
+++ b/maple_summary.html
@@ -0,0 +1,34 @@
+<style>body{font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+  color: white;}</style>
+  <style>
+  @import url('https://fonts.googleapis.com/css2?family=Lato&family=Overlock:wght@700&display=swap');
+  body{font-family: 'Lato', sans-serif;
+  text-align: center;
+  }
+  h3{
+    font-family: 'Overlock', cursive;
+    font-size: 26px;
+    margin: 0px;
+    padding-top: 10px;
+  
+  }
+  p{
+    font-size: 15px;
+    padding: 0px;
+  }
+  #type{
+    font-size: 12px;
+    margin: 0;
+    padding: 0;
+    margin-bottom: 10px;
+  }
+  </style>
+  
+  
+  <h3>Maple</h3>
+  
+  <p id="type"> Tree or shrub </p>
+  <img src="img/maple.jpg" style="width: 200px;">
+  <p>Family: Maple.
+  </p> 
+  
\ No newline at end of file
diff --git a/redwood_content.html b/redwood_content.html
new file mode 100644
index 0000000..12b154d
--- /dev/null
+++ b/redwood_content.html
@@ -0,0 +1,21 @@
+<style>
+  @import url('https://fonts.googleapis.com/css2?family=Lato&family=Overlock:wght@700&display=swap');
+  body{font-family: 'Lato', sans-serif;
+  text-align: center;
+  color: white;
+  }
+  h3{
+    font-family: 'Overlock', cursive;
+    font-size: 28px;
+    margin: 0px;
+    padding-top: 10px;
+  }
+  p{
+    font-size: 16px;
+    padding: 0px;
+  }
+  </style>
+  
+  <h3>Redwood</h3>
+  
+  <p>redwood</p>
diff --git a/redwood_summary.html b/redwood_summary.html
new file mode 100644
index 0000000..2a5aabc
--- /dev/null
+++ b/redwood_summary.html
@@ -0,0 +1,34 @@
+<style>body{font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+  color: white;}</style>
+  <style>
+  @import url('https://fonts.googleapis.com/css2?family=Lato&family=Overlock:wght@700&display=swap');
+  body{font-family: 'Lato', sans-serif;
+  text-align: center;
+  }
+  h3{
+    font-family: 'Overlock', cursive;
+    font-size: 26px;
+    margin: 0px;
+    padding-top: 10px;
+  
+  }
+  p{
+    font-size: 15px;
+    padding: 0px;
+  }
+  #type{
+    font-size: 12px;
+    margin: 0;
+    padding: 0;
+    margin-bottom: 10px;
+  }
+  </style>
+  
+  
+  <h3>Redwood</h3>
+  
+  <p id="type"> Tree or shrub </p>
+  <img src="img/redwood.jpg" style="width: 200px;">
+  <p>Family: Redwood.
+  </p> 
+  
\ No newline at end of file