diff --git a/client/index.html b/client/index.html
index 9127a68e6..2e1175b93 100644
--- a/client/index.html
+++ b/client/index.html
@@ -10,7 +10,7 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
     <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
-    <link rel="stylesheet" href="/site/styles.css" />
+    <link rel="stylesheet" href="/site/styles.css"/>
     <style>
         .avatar {
             width: 60px;
@@ -27,108 +27,154 @@
             flex-direction: column;
             align-items: center;
         }
+
+        .agent-choices {
+            display: none;
+        }
+
+        .btn-show {
+            display: none;
+        }
     </style>
 </head>
 
 <body>
 
-    <section class="landing">
-        <div class="max-w-5xl mx-auto text-center">
-            <h1 class="text-4xl font-extrabold mx-auto lg:text-7xl">
-                Say Goodbye to <br>
-                <span
+<section class="landing">
+    <div class="max-w-5xl mx-auto text-center">
+        <h1 class="text-4xl font-extrabold mx-auto lg:text-7xl">
+            Say Goodbye to <br>
+            <span
                     style="background-image:linear-gradient(to right, #9867F0, #ED4E50); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">Hours
                     of Research</span>
-            </h1>
-            <p class="max-w-5xl mx-auto text-gray-600 mt-8" style="font-size:20px">
-                Say Hello to GPT Researcher, your AI mate for rapid insights and comprehensive research. GPT Researcher
-                takes care of everything from accurate source gathering to organization of research results - all in one
-                platform designed to make your research process a breeze.
-            </p>
-            <a href="#form" class="btn btn-primary">Get Started</a>
-        </div>
-    </section>
+        </h1>
+        <p class="max-w-5xl mx-auto text-gray-600 mt-8" style="font-size:20px">
+            Say Hello to GPT Researcher, your AI mate for rapid insights and comprehensive research. GPT Researcher
+            takes care of everything from accurate source gathering to organization of research results - all in one
+            platform designed to make your research process a breeze.
+        </p>
+        <a href="#form" class="btn btn-primary">Get Started</a>
+    </div>
+</section>
 
-    <main class="container" id="form">
-        <form method="POST" class="mt-3" onsubmit="GPTResearcher.startResearch(); return false;">
-            <div class="form-group">
-                <label for="task" class="agent-question">What would you like me to research next?</label>
-                <input type="text" id="task" name="task" class="form-control" required>
-            </div>
-            <div class="form-group">
-                <label for="agent">Select your agent:</label>
-                <div class="row">
-                    <div class="col agent-item">
-                        <label for="autoAgent"><img src="/static/defaultAgentAvatar.JPG" class="avatar" alt="Auto Agent"></label>
-                        <div class="agent-name"><input type="radio" name="agent" id="autoAgent"
-                                value="Auto Agent">Auto Agent</div>
-                    </div>
-                    <div class="col agent-item">
-                        <label for="defaultAgent"><img src="/static/defaultAgentAvatar.JPG" class="avatar" alt="Default Agent"></label>
-                        <div class="agent-name"><input type="radio" name="agent" id="defaultAgent"
-                                value="Default Agent">Default Agent</div>
-                    </div>
-                    <div class="col agent-item">
-                        <label for="businessAnalystAgent"><img src="/static/businessAnalystAgentAvatar.png"
-                                class="avatar" alt="Business Analyst Agent"></label>
-                        <div class="agent-name"><input type="radio" name="agent" id="businessAnalystAgent"
-                                value="Business Analyst Agent">Business Analyst Agent</div>
-                    </div>
-                    <div class="col agent-item">
-                        <label for="financeAgent"><img src="/static/financeAgentAvatar.png" class="avatar" alt="Finance Agent"></label>
-                        <div class="agent-name"><input type="radio" name="agent" id="financeAgent" value="Finance Agent"
-                                required>Finance Agent</div>
-                    </div>
-                    <div class="col agent-item">
-                        <label for="travelAgent"><img src="/static/travelAgentAvatar.png" class="avatar" alt="Travel Agent"></label>
-                        <div class="agent-name"><input type="radio" name="agent" id="travelAgent"
-                                value="Travel Agent">Travel Agent</div>
-                    </div>
-                    <div class="col agent-item">
-                        <label for="academicResearchAgent"><img src="/static/academicResearchAgentAvatar.png"
-                                class="avatar" alt="Academic Research Agent"></label>
-                        <div class="agent-name"><input type="radio" name="agent" id="academicResearchAgent"
-                                value="Academic Research Agent">Academic Research Agent</div>
+<main class="container" id="form">
+    <form method="POST" class="mt-3" onsubmit="GPTResearcher.startResearch(); return false;">
+        <div class="form-group">
+            <label for="task" class="agent-question">What would you like me to research next?</label>
+            <input type="text" id="task" name="task" class="form-control" required>
+        </div>
+        <div class="form-group">
+            <label for="agent">Select your agent:</label>
+            <div class="row">
+                <div class="col agent-item" id="autoAgentDiv">
+                    <label for="autoAgent"><img src="/static/defaultAgentAvatar.JPG" class="avatar"
+                                                alt="Auto Agent"></label>
+                    <div class="agent-name"><input type="radio" name="agent" id="autoAgent"
+                                                   value="Auto Agent" checked>Auto Agent
                     </div>
-                    <div class="col agent-item">
-                        <label for="computerSecurityAnalyst"><img src="/static/computerSecurityAnalystAvatar.png"
-                                class="avatar" alt="Computer Security Analyst Agent"></label>
-                        <div class="agent-name"><input type="radio" name="agent" id="computerSecurityAnalyst"
-                                value="Computer Security Analyst Agent">Computer Security Analyst Agent</div>
+                    <p class="mt-2 text-center" style="font-size: 0.8rem;">An agent tailored specifically to your task
+                        will be generated to provide the most precise and relevant research results.</p>
+
+                </div>
+
+                <div class="agent-choices">
+                    <div class="row">
+                        <div class="col agent-item">
+                            <label for="businessAnalystAgent"><img src="/static/businessAnalystAgentAvatar.png"
+                                                                   class="avatar" alt="Business Analyst Agent"></label>
+                            <div class="agent-name"><input type="radio" name="agent" id="businessAnalystAgent"
+                                                           value="Business Analyst Agent">Business Analyst Agent
+                            </div>
+                        </div>
+                        <div class="col agent-item">
+                            <label for="financeAgent"><img src="/static/financeAgentAvatar.png" class="avatar"
+                                                           alt="Finance Agent"></label>
+                            <div class="agent-name"><input type="radio" name="agent" id="financeAgent"
+                                                           value="Finance Agent"
+                                                           required>Finance Agent
+                            </div>
+                        </div>
+                        <div class="col agent-item">
+                            <label for="travelAgent"><img src="/static/travelAgentAvatar.png" class="avatar"
+                                                          alt="Travel Agent"></label>
+                            <div class="agent-name"><input type="radio" name="agent" id="travelAgent"
+                                                           value="Travel Agent">Travel Agent
+                            </div>
+                        </div>
+                        <div class="col agent-item">
+                            <label for="academicResearchAgent"><img src="/static/academicResearchAgentAvatar.png"
+                                                                    class="avatar"
+                                                                    alt="Academic Research Agent"></label>
+                            <div class="agent-name"><input type="radio" name="agent" id="academicResearchAgent"
+                                                           value="Academic Research Agent">Academic Research Agent
+                            </div>
+                        </div>
+                        <div class="col agent-item">
+                            <label for="computerSecurityAnalyst"><img src="/static/computerSecurityAnalystAvatar.png"
+                                                                      class="avatar"
+                                                                      alt="Computer Security Analyst Agent"></label>
+                            <div class="agent-name"><input type="radio" name="agent" id="computerSecurityAnalyst"
+                                                           value="Computer Security Analyst Agent">Computer Security
+                                Analyst Agent
+                            </div>
+                        </div>
                     </div>
                 </div>
-            </div>
-            <div class="form-group">
-                <label for="report_type" class="agent-question">What type of report would you like me to generate?</label>
-                <select name="report_type" class="form-control" required>
-                    <option value="research_report">Research Report</option>
-                    <option value="resource_report">Resource Report</option>
-                    <option value="outline_report">Outline Report</option>
-                </select>
-            </div>
-            <input type="submit" value="Research" class="btn btn-primary button-padding">
-        </form>
 
-        <div class="margin-div">
-            <h2>Agent Output</h2>
-            <div id="output"></div>
+            </div>
+            <button type="button" id="btnChoose" class="btn btn-secondary mt-3">Choose an Agent</button>
+            <button type="button" id="btnShowAuto" class="btn btn-secondary mt-3 btn-show">Auto Agent</button>
         </div>
-        <div class="margin-div">
-            <h2>Research Report</h2>
-            <div id="reportContainer"></div>
-            <button onclick="copyToClipboard()" class="btn btn-secondary mt-3">Copy to clipboard</button>
-            <a id="downloadLink" href="#" class="btn btn-secondary mt-3" target="_blank">Download as PDF</a>
+        <div class="form-group">
+            <label for="report_type" class="agent-question">What type of report would you like me to generate?</label>
+            <select name="report_type" class="form-control" required>
+                <option value="research_report">Research Report</option>
+                <option value="resource_report">Resource Report</option>
+                <option value="outline_report">Outline Report</option>
+            </select>
         </div>
-    </main>
+        <input type="submit" value="Research" class="btn btn-primary button-padding">
+    </form>
+
+    <div class="margin-div">
+        <h2>Agent Output</h2>
+        <div id="output"></div>
+    </div>
+    <div class="margin-div">
+        <h2>Research Report</h2>
+        <div id="reportContainer"></div>
+        <button onclick="copyToClipboard()" class="btn btn-secondary mt-3">Copy to clipboard</button>
+        <a id="downloadLink" href="#" class="btn btn-secondary mt-3" target="_blank">Download as PDF</a>
+    </div>
+</main>
+
+<footer>
+    <p>GPT Researcher &copy; 2023 | <a target="_blank" href="https://github.com/assafelovic/gpt-researcher">GitHub
+        Page</a></p>
+</footer>
 
-    <footer>
-        <p>GPT Researcher &copy; 2023 | <a target="_blank" href="https://github.com/assafelovic/gpt-researcher">GitHub
-                Page</a></p>
-    </footer>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js"></script>
+<script src="/site/scripts.js"></script>
+<script>
+    const btnChoose = document.getElementById('btnChoose');
+    const btnShowAuto = document.getElementById('btnShowAuto');
+    const autoAgentDiv = document.getElementById('autoAgentDiv');
+    const agentChoices = document.getElementsByClassName('agent-choices');
 
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js"></script>
-    <script src="/site/scripts.js"></script>
+    btnChoose.addEventListener('click', function () {
+        btnShowAuto.style.display = 'inline-block';
+        btnChoose.style.display = 'none';
+        autoAgentDiv.style.display = 'none';
+        agentChoices[0].style.display = 'flex';
+    });
 
+    btnShowAuto.addEventListener('click', function () {
+        btnShowAuto.style.display = 'none';
+        btnChoose.style.display = 'inline-block';
+        autoAgentDiv.style.display = 'flex';
+        agentChoices[0].style.display = 'none';
+    });
+</script>
 </body>
 
 </html>
