style: adding three new pages

index.html

@@ -256,6 +256,9 @@ <h3>Beyond Numbers</h3>
                   <p class="card-text">
                     Beyond Numbers takes children on an enchanting journey through the cultural significance of numbers in Indian traditions, myths, and festivals. From the Trimurti (3 Gods) and Panchabhutas (5 Elements) to the Dashavatara (10 Avatars of Vishnu), each number holds a deeper meaning. By blending math with culture, it inspires curiosity and helps children discover the profound wisdom hidden in numbers.
                   </p>
+                  <button class="main_content" onclick="window.location.href='pages/beyond_num.html'"  style="display: block; /* Makes it a block-level element */
+                    margin: 10px auto; /* Auto centers horizontally */
+                    text-align: center;">View More Content</button>
                   <button class="read-more">Read More</button>
                 </div>
                 <!-- Roadmap Card 2 -->
@@ -265,6 +268,9 @@ <h3>Cultural Colors</h3>
                   <p class="card-text">
                     Colors in Indian culture are rich with symbolism, each carrying deep meanings. Red represents strength and passion, as seen in Goddess Durga, while yellow symbolizes knowledge, celebrated in Goddess Saraswati. Blue embodies divinity and calmness, reflected in Lord Krishna. Learn how these colors connect to spiritual and cultural values, bringing vibrancy to Indian traditions.
                   </p>
+                  <button class="main_content" onclick="window.location.href='pages/cultural_colors.html'"  style="display: block; /* Makes it a block-level element */
+                    margin: 10px auto; /* Auto centers horizontally */
+                    text-align: center;">View More Content</button>
                   <button class="read-more">Read More</button>
                 </div>
                 <!-- Roadmap Card 3 -->
@@ -274,6 +280,9 @@ <h3>Heritage Map</h3>
                   <p class="card-text">
                     Embark on a virtual journey across India's diverse regions and explore its rich heritage. From ancient temples to monumental landmarks, the Heritage Map offers an interactive way for children to discover historical sites and learn about their cultural and spiritual significance. Dive into the fascinating stories behind each iconic place and understand India’s glorious past.
                   </p>
+                  <button class="main_content" onclick="window.location.href='pages/heritage_map.html'"  style="display: block; /* Makes it a block-level element */
+                    margin: 10px auto; /* Auto centers horizontally */
+                    text-align: center;">View More Content</button>
                   <button class="read-more">Read More</button>
                 </div>
               </div>
@@ -289,6 +298,9 @@ <h3>Festival Journey</h3>
                   <p class="card-text">
                     Explore the magic of India’s festivals, where every celebration has a unique story. From Diwali’s lights to Holi’s colors, learn about the customs, values, and traditions behind each festival. Interactive activities and virtual celebrations make this journey both educational and enjoyable, bringing the spirit of India’s festivals to life.
                   </p>
+                  <button class="main_content" onclick="window.location.href='pages/festival.html'"  style="display: block; /* Makes it a block-level element */
+                    margin: 10px auto; /* Auto centers horizontally */
+                    text-align: center;">View More Content</button>
                   <button class="read-more">Read More</button>
                 </div>
                 <!-- Roadmap Card 5 -->
@@ -298,6 +310,9 @@ <h3>Sanskrit Stories</h3>
                   <p class="card-text">
                     Step into the world of Sanskrit through enchanting stories from the Panchatantra and Hitopadesha. As children explore these timeless tales, they’ll learn basic Sanskrit words and phrases, unlocking the wisdom of ancient India. Interactive exercises make the learning process fun, allowing children to engage with language while appreciating its cultural importance.
                   </p>
+                  <button class="main_content" onclick="window.location.href='pages/sanskrit.html'"  style="display: block; /* Makes it a block-level element */
+                    margin: 10px auto; /* Auto centers horizontally */
+                    text-align: center;">View More Content</button>
                   <button class="read-more">Read More</button>
                 </div>
                 <!-- Roadmap Card 6 -->
@@ -307,6 +322,9 @@ <h3>Yoga for Kids</h3>
                   <p class="card-text">
                     Introduce kids to yoga with simple, fun asanas and breathing exercises! Each pose is paired with a story from Indian mythology, such as Hanuman’s leap or the serpent Vasuki, making the practice both enjoyable and meaningful. Kids will build flexibility, focus, and mindfulness while connecting with ancient Indian wellness traditions.
                   </p>
+                  <button class="main_content" onclick="window.location.href='pages/yoga.html'"  style="display: block; /* Makes it a block-level element */
+                    margin: 10px auto; /* Auto centers horizontally */
+                    text-align: center;">View More Content</button>
                   <button class="read-more">Read More</button>
                 </div>
               </div>

pages/beyond_num.css

@@ -0,0 +1,166 @@
+*{
+    text-align: center;
+    background-color: #ffffff;
+    font-family: 'poppins', sans-serif;
+    color:rgb(218, 128, 76);;
+}
+nav{
+    position: fixed;
+    width: 100%;
+    background-color: white;
+    top: 0;
+    /* box-shadow: 0px 0px 1px black; */
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    gap: 5px;
+    margin-bottom: 10px;
+    padding: 10px 30px;
+    align-items: center;
+
+}
+nav a{
+    text-decoration: none;
+    color:black;
+}
+.logo {
+    font-size: 30px;
+    font-weight: bold;
+    color: black;
+    flex: 1;
+    text-align: left;
+    text-decoration: none;
+    cursor: pointer;
+    transition: color 0.3s ease;
+  }
+
+  .logo:hover {
+    color: rgb(106, 97, 97);
+  }
+
+  .nav-links {
+    list-style: none;
+    display: flex;
+    align-items: center;
+    margin: 0;
+    padding: 0;
+    flex: 1;
+    justify-content: flex-end;
+    margin-right: 7px;
+    font-size: 15px;
+  }
+
+  .nav-links li {
+    margin: 0 20px;
+    position: relative;
+  }
+
+  .nav-links a {
+    text-decoration: none;
+    color: black;
+    font-weight: bolder;
+    position: relative;
+    transition: color 0.3s ease;
+  }
+
+  .nav-links a::after {
+    content: "";
+    position: absolute;
+    left: 0;
+    bottom: -3px;
+    width: 0;
+    height: 2px;
+    background-color: #e5a186;
+    transition: width 0.3s ease;
+  }
+
+  .nav-links a:hover {
+    color: #e5a186;
+  }
+
+  .nav-links a:hover::after {
+    width: 100%;
+  }
+
+  .nav-links .dropdown {
+    position: relative;
+  }
+
+  .nav-links .dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: white;
+    min-width: 160px;
+    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
+    z-index: 1;
+    list-style: none;
+    padding: 0;
+  }
+
+  .nav-links .dropdown-content a {
+    color: black;
+    padding: 12px 16px;
+    text-decoration: none;
+    display: block;
+  }
+
+  .nav-links .dropdown:hover .dropdown-content {
+    display: block;
+  }
+
+  .nav-links .dropdown-content a:hover {
+    background-color: #f1f1f1;
+  }
+
+  .menu-toggle {
+    display: none;
+}
+.data1{
+    margin-top: 40px;
+    padding: 40px;
+    color: black;
+}
+.data{
+    margin-top: 20px;
+    color: black;
+}
+.data p,.data1 p{
+  animation: fade-in 6s ease;
+  color: black;
+}
+h2{
+    text-decoration: wavy;
+    /* text-decoration: underline; */
+    font-family: Georgia, 'Times New Roman', Times, serif;
+    background-color: #e5a186;
+    color: white;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    padding-right: 2px;
+    padding-left: 2px;
+    border-radius: 10px;
+    animation: fade-in 2s ease;
+}
+.data1 h2{
+  background-color: #e5a186;
+  color: white;
+  padding-right: 2px;
+  padding-left: 2px;
+
+}
+img{
+    border: 2px solid black;
+    border-radius: 15px;
+    box-shadow: 0px 2px 10px rgb(231, 125, 59);
+}
+
+@keyframes fade-in{
+    from{
+        opacity: 0;
+        transform: translateY(20px);
+    }
+    to{
+        opacity: 1;
+        transform: translateY(0);
+    }
+}

pages/beyond_num.html

@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="beyond_num.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
+    <link
+      rel="icon"
+      href="DALL·E 2024-08-28 12.19.31 - A clean and moderately detailed logo for a Sanskrit education website. T.webp"
+    />
+    <style>
+        /* Scroll to Top Button */
+        #scrollToTopBtn {
+            display: none;
+            position: fixed;
+            bottom: 132px;
+            right: 30px;
+            height: 55px;
+            width: 55px;
+            background-color: rgb(218, 128, 76);
+            color: white;
+            border: none;
+            border-radius: 50%;
+            padding: 10px;
+            cursor: pointer;
+            font-size: 15px;
+        }
+        #scrollToTopBtn:hover {
+            background-color: rgb(218, 128, 76);
+        }
+    </style>
+
+</head>
+<body>
+    <nav class="appbar">
+        <!-- Wrap the logo text in an anchor tag -->
+        <a href="#hero" class="logo">मातृबोधः</a>
+        <ul class="nav-links">
+            <li><a href="../index.html">Home</a></li>
+            <li><a href="about-page.html">About</a></li>
+            <li class="dropdown">
+                <a href="#">Content</a>
+                <ul class="dropdown-content">
+                    <li><a href="../countingpage.html">Counting</a></li>
+                    <li><a href="#">Days</a></li>
+                    <li><a href="../activities.html">Activities</a></li>
+                    <li><a href="../feedback.html">Feedback</a></li>
+                </ul>
+            </li>
+            <li id="loginlist" ><a href="../login.html">Login</a></li>
+            <li id="profilelist"><a  href="../profile.html">Profile</a></li>
+            <li><a href="../faq.html">FAQ</a></li>
+            <li><a href="../contact.html" >Contact</a></li>
+        </ul>
+        <div class="toggle-menu">☰</div>
+    </nav>
+    <br>
+    <div class="data1">
+        <H1 style="text-decoration: underline;">Beyond Numbers: Unraveling the Magic of Ancient Times</H1>
+        <img src="../images/numerals-cover.jpg" title="Beyond Numbers" alt="Beyond Numbers" width="500" border-radius="10px">
+        <p>Numbers are more than just mathematical symbols—they carry deep cultural, spiritual, and philosophical significance. In ancient Indian traditions, numbers are woven into myths, festivals, and cosmic principles, revealing profound wisdom. Beyond Numbers takes children on a fascinating journey through these connections, helping them discover the magic hidden within numerical patterns. By blending mathematics with cultural heritage, this approach not only nurtures curiosity but also instills a deeper appreciation for the timeless knowledge embedded in numbers.
+
+            <h2>The Cultural Significance of Numbers</h2>
+
+            Each number holds unique meaning in Indian philosophy and traditions. For instance, the number 3 represents the Trimurti, the three supreme deities—Brahma (the Creator), Vishnu (the Preserver), and Shiva (the Destroyer). This divine trinity signifies the cosmic cycle of creation, preservation, and destruction, demonstrating the balance that governs the universe. Similarly, the concept of Panchabhutas—the five great elements—earth, water, fire, air, and space—forms the foundation of life, emphasizing harmony between nature and existence.
+
+
+            <h2>Numbers in Myths and Epics</h2>
+
+            Indian epics like the Ramayana and Mahabharata are rich with numerical symbolism. The number 7 appears frequently, such as the Sapta Rishis (Seven Sages) who guide human wisdom and the Saptapadi (Seven Steps) in Hindu weddings, representing the vows that bind two souls together. The Dashavatara, or 10 avatars of Vishnu, symbolizes different stages of evolution, from the aquatic form of Matsya (fish) to the enlightened Krishna and Kalki. These avatars illustrate the cycle of change and adaptation, linking mythology to philosophical thought.
+
+
+            <h2>Numbers in Festivals and Traditions</h2>
+
+            Festivals in India also celebrate numerical themes. The 9 nights of Navaratri honor the nine forms of Goddess Durga, each representing different aspects of strength and devotion. Similarly, the 108 beads of a prayer mala hold spiritual significance, as the number 108 is considered sacred in Vedic mathematics and cosmology. It is believed to represent the wholeness of existence, with connections to the Sun, Moon, and Earth’s celestial rhythms.
+
+
+            <h2>Teaching Math Through Culture</h2>
+
+            By exploring numbers in this way, children develop an intuitive understanding of mathematical concepts while also appreciating their cultural roots. Learning about zero, for example, reveals how ancient Indian mathematicians revolutionized the number system, shaping the way we understand mathematics today. The Fibonacci sequence, which appears in nature, also finds mention in ancient Indian architecture and temple designs, demonstrating the harmony between numbers and the universe.
+
+
+            <h2>Inspiring Curiosity and Wonder</h2>
+
+            Through Beyond Numbers, children not only learn about numbers but also uncover stories, traditions, and philosophies that make math more engaging and meaningful. When they see how numbers connect to history, mythology, and nature, they develop a holistic perspective—one that encourages both analytical thinking and cultural awareness.
+
+            By blending ancient wisdom with modern learning, Beyond Numbers transforms mathematics into an adventure, showing children that numbers are more than calculations—they are the language of the universe, filled with meaning, mystery, and magic.</p>
+    </div>
+</body>
+</html>