New About Section

index.html

@@ -255,21 +255,34 @@ <h5>Nike Air Max</h5>
 
         </div>
        </section>
+
+       <div class="cont">
+        <div class="left-bar">
+            <div class="stories"><a href="https://about.nike.com/en/stories"><h1>Stories</h1></a></div>
+            <div class="impact"><a href="https://about.nike.com/en/impact"><h1>Impact</h1></a></div>
+            <div class="comp"><a href="https://about.nike.com/en/company"><h1>Company</h1></a></div>
+        </div>
+        <h1 class="about">ABOUT US</h1>
+        <h1 class="left-text">WE SERVE</h1>
+        <h1 class="change"></h1>
+        <img src="nike5.jpg" alt="nike-bg" class="nike-bg">
+        <img src="nike-text.png" alt="nike-text" class="nike-text-img" "bottom-bar">
+        <h1 class="bottom-text" "bottom-bar">JUST DO IT</h1>
+        <p class="text"> <b style="font-size: larger;"><i>WHO WE ARE</i></b> <br><br> NIKE, Inc. is a team comprised of the Nike, Jordan and Converse brands driven by a shared purpose to leave an enduring impact. <br>Nike is a global leader in sportswear, committed to innovation and inspiring athletes at all levels. Our mission is to bring performance-driven products that empower individuals to achieve their potential, while driving sustainability and creating a better future through sport. <br><br>
+        <b style="font-size: larger;"><i>WHAT DRIVES US</i></b> <br><br>
+        We are driven by a culture of innovation, collaboration, and determination. From our pioneering Nike Air technology to our commitment to pushing boundaries in design, Nike is always looking forward. We work alongside athletes, designers, and engineers to deliver products that enhance performance while minimizing environmental impact. </p>
+       </div>
+
        <footer class="footer">
         <div class="container">
-            <div class="footer-section">
-                <h3>About Us</h3>
-                <p>Nike is a global leader in sportswear, committed to innovation and inspiring athletes at all levels. Our mission is to bring performance-driven products that empower individuals to achieve their potential, while driving sustainability and creating a better future through sport.</p>
-            </div>
-
-            <div class="footer-section">
+           <div class="footer-section">
                 <h3>Quick Links</h3>
                 <ul class="links" id="link1">
 
-                       <li> <a href="https://www.nike.com/in/retail">find store</a><br></li>
-                       <li> <a href="https://www.nike.com/in/register">become a member</a><br></li>
-                       <li> <a href="https://www.nike.com/in/">send us feedback</a><br></li>
-                       <li> <a href="https://www.nike.com/in/help/a/student-discount-gs">student discount</a><br></li>
+                       <li> <a href="https://www.nike.com/in/retail">Find Store</a><br></li>
+                       <li> <a href="https://www.nike.com/in/register">Become a Member</a><br></li>
+                       <li> <a href="https://www.nike.com/in/">Send Us Feedback</a><br></li>
+                       <li> <a href="https://www.nike.com/in/help/a/student-discount-gs">Student Discount</a><br></li>
 
 
                 </ul>
@@ -279,6 +292,7 @@ <h3>Quick Links</h3>
             &copy; 2024 | Nike India
         </div>
     </footer>
+
 
 </body>
 </html>

style.css

@@ -713,4 +713,108 @@ h2 {
     transform: translate(81px, 53px);
     font-size: medium;
 }
-    }
+    }
+
+ /* ABOUT US SECTION */
+ .cont{
+    position: relative;
+    height:100%;
+}
+.left-bar{
+    display: flex;
+    position: absolute;
+    top: 5%;
+    left: 2%;
+}
+.stories,.impact, .company {
+    padding-right: 80px;
+}
+a{
+    text-decoration: none;
+    color: black;
+}
+a:hover{
+    color: #bd3627;
+}
+.nike-bg{
+    width: 100%; 
+    height: 120%; 
+
+}
+.about{
+    position: absolute;
+    top:10%;
+    left: 43%;
+    font-size: 50px;
+}
+
+.left-text{
+    position: absolute;
+    top: 5%;
+    left: 71%;
+    font-style: italic;
+}
+
+.change {
+    position: absolute;
+    top: 4%;
+    left: 83%;
+    transition: opacity 0.5s ease;
+    font-style: italic;
+  }
+
+.change::before {
+    content: "ATHLETES DREAMERS PROS"; 
+    position: absolute;
+    opacity: 1;
+    transition: opacity 0.5s; 
+    color: #bd3627;
+}
+
+.change::after {
+    content: "TEAMS REBELS BEGINNERS"; 
+    position: absolute;
+    opacity: 0; 
+    transition: opacity 0.5s; 
+    color: #bd3627;
+}
+
+.change:hover::before {
+    opacity: 0; 
+}
+
+.change:hover::after {
+    opacity: 1; 
+}
+
+.text{
+    padding-left: 10px;
+    position: absolute;
+    top: 18%;
+    line-height: 120%;
+    color: black; 
+    font-size: 24px; 
+}
+.nike-text-img {
+    position: absolute;
+    top: 55%;
+    left: 10%;
+    width: 35%;
+    height: 50%;
+    filter: brightness(80%);
+}
+.bottom-bar{
+    position: absolute;
+    display: flex;
+    top: 53%;
+    justify-content: center;
+
+}
+
+.bottom-text{
+    position: absolute;
+    top: 72%;
+    left: 45%;
+    font-size: 100px;
+}
+