Update index.html

index.html

@@ -150,7 +150,39 @@
       font-weight: bold;
       margin: 0 0 5px 0;
     }
+<section id="about">
+        <div class="background-image">
+            <div class="abcd">
+                <h2>About Us</h2>
+                <p>Welcome to Be Music , where the rhythm of words meets the melody of music.
+ We are more than just a website; we're a community of music enthusiasts, creators, and explorers united by our love for diverse sounds and meaningful lyrics.</p>
+        
+ <section id="mission">
+    <h2>Our Mission</h2>
+    <p>At YourMusicHub, our mission is simple: to cultivate a space where music lovers can discover, connect, and celebrate the diverse world of music. Whether you're into chart-toppers, indie gems, or timeless classics, we've got you covered.</p>
+  </section>
+
+  <section id="features">
+    <h2>What Sets Us Apart</h2>
+    <ul>
+      <li><strong>Diverse Music Selection:</strong> From pop to rock, classical to hip-hop, explore a vast array of musical genres.</li>
+      <li><strong>Expert Reviews:</strong> Our team of music connoisseurs provides insightful reviews to guide your musical exploration.</li>
+      <li><strong>User Engagement:</strong> Share your thoughts, create playlists, and connect with like-minded music aficionados.</li>
+    </ul>
+  </section>
 
+  <section id="join">
+    <h2>Join the Community</h2>
+    <p>Ready to embark on a musical adventure? Join YourMusicHub today and become part of a community that shares your love for great tunes. Let the music unite us!</p>
+    <a href="#signup" class="btn">Sign Up Now</a>
+  </section>
+
+  <section id="contact">
+    <h2>Contact Us</h2>
+    <p>Have questions or suggestions? We'd love to hear from you. Reach out to us at <a href="mailto:[email protected]">[email protected]</a></p>
+  </section>    
+        </div>
+    </section>
     .song-artist {
       font-size: 14px;
       color: #666666;
@@ -236,6 +268,19 @@ audio {
       border: 1px solid #cccccc;
       border-radius: 5px;
       box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    }
+      .container3 {
+      margin: 0 auto;
+        width: 70vw;
+      font-family: Arial, sans-serif;
+        color: #ffffff;
+      padding: 20px;
+      background-image: linear-gradient( 135deg, #43CBFF 10%, #9708CC 100%);
+        border-width: 0px;
+      background-size: cover;
+      border: 1px solid #cccccc;
+      border-radius: 5px;
+      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
     }
     </style>
 </head>
@@ -252,7 +297,39 @@ audio {
         <nav class="navbar navbar-expand-lg navbar-light bg-primary">
             <a class="navbar-brand" href="#"><img src="https://cdn.dribbble.com/users/3547568/screenshots/14395014/media/0b94c75b97182946d495f34c16eab987.jpg?resize=400x300&vertical=center" style="height: 65px; width: 65px; border-radius: 100px;"/></a>
             <div>
-            <input type="search" id="searchBar" placeholder="Search for a song" class="mr-2 ml-2 p-2 mt-2">
+            <input type="search" id="searchBar" placeholder="Search for a song" class="mr-2 m<section id="about">
+        <div class="background-image">
+            <div class="abcd">
+                <h2>About Us</h2>
+                <p>Welcome to Be Music , where the rhythm of words meets the melody of music.
+ We are more than just a website; we're a community of music enthusiasts, creators, and explorers united by our love for diverse sounds and meaningful lyrics.</p>
+        
+ <section id="mission">
+    <h2>Our Mission</h2>
+    <p>At YourMusicHub, our mission is simple: to cultivate a space where music lovers can discover, connect, and celebrate the diverse world of music. Whether you're into chart-toppers, indie gems, or timeless classics, we've got you covered.</p>
+  </section>
+
+  <section id="features">
+    <h2>What Sets Us Apart</h2>
+    <ul>
+      <li><strong>Diverse Music Selection:</strong> From pop to rock, classical to hip-hop, explore a vast array of musical genres.</li>
+      <li><strong>Expert Reviews:</strong> Our team of music connoisseurs provides insightful reviews to guide your musical exploration.</li>
+      <li><strong>User Engagement:</strong> Share your thoughts, create playlists, and connect with like-minded music aficionados.</li>
+    </ul>
+  </section>
+
+  <section id="join">
+    <h2>Join the Community</h2>
+    <p>Ready to embark on a musical adventure? Join YourMusicHub today and become part of a community that shares your love for great tunes. Let the music unite us!</p>
+    <a href="#signup" class="btn">Sign Up Now</a>
+  </section>
+
+  <section id="contact">
+    <h2>Contact Us</h2>
+    <p>Have questions or suggestions? We'd love to hear from you. Reach out to us at <a href="mailto:[email protected]">[email protected]</a></p>
+  </section>    
+        </div>
+    </section>l-2 p-2 mt-2">
             </div>
             <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
               <span class="navbar-toggler-icon"></span>
@@ -330,7 +407,7 @@ audio {
   <div class="modal fade" id="exampleModal4" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                 <div class="modal-dialog">
                        
-                           <div class="modal-content container1">
+                           <div class="modal-content container3">
                              <div>
                                <section id="about">
         <div class="background-image">