Update web.html

web.html

@@ -28,16 +28,31 @@
 		</div>
 	</div>
 
-    <div id="page" class="container">
-        <div class="centered-content">
-            <h2>HTML and CSS Quizzes</h2>
-            <p>Test your knowledge with these quizzes designed as part of Project 2.</p>
-            <div class="quiz-buttons">
-                <a href="https://rithikyennam.github.io/Pop-Quiz/" class="button">POP QUIZ</a>
-                <a href="https://rithikyennam.github.io/Drag-Drop/" class="button">DRAG AND DROP QUIZ</a>
+<div id="page" class="container">
+    <div class="centered-content">
+        <h2>HTML and CSS Quizzes</h2>
+        <p>Test your knowledge with these quizzes designed as part of Project 2.</p>
+        <p>Choose a quiz to get started:</p>
+        <div class="quiz-buttons">
+            <div class="quiz">
+                <h3>POP QUIZ</h3>
+		    <p>I developed a Pop quiz about health and nutrition, Starting with the JavaScript file, I modified the template given by changing and adding additional questions. On the HTML front, I selected a background image that aptly reflects the quiz's theme. I added a div take to make the quiz look good, and I have updated the table background  background to be rendered in white to ensure clarity and ease of reading. I have updated the font and i have added colours to the buttons
+
+I chose GitHub to deploy this webpage for it's simplicity. After uploading the necessary files in github, I enabled the page hosting option, leading to a smooth and successful deployment of the website.</p>
+                <a href="https://rithikyennam.github.io/Pop-Quiz/" class="button">Start Quiz</a>
+            </div>
+            <div class="quiz">
+                <h3>DRAG AND DROP QUIZ</h3>
+		    <p>I made changes to the given drag-and-drop quiz to make it look and feel better. To start off, I updated the  the page title and contents. On the CSS, I enhanced the overall appearance by changing the font, background color, and styling of various elements. I also made the footer more visible, adjusted the quiz container's width, and centered it on the page. Furthermore, I improved the appearance of draggable items by changing their style, border color, padding, and margins. I also made small boxes in the right column more visually appealing and aligned them properly. Lastly, I modified the drag container and drag drop indicator for a more modern appearance, changing their background color and border style.
+
+To host it, I chose Github. I uploaded the files to github and then I enabled static hosting on it, which lead to a seamless deployment.
+
+</p>
+                <a href="https://rithikyennam.github.io/Drag-Drop/" class="button">Start Quiz</a>
             </div>
         </div>
     </div>
+</div>
 
     <!-- Footer from the existing HTML -->