diff --git a/main.html b/main.html
index e569d5db227dbfca90128f7765539cca869fc701..af74768fdd65f1e73b4e5bac4362194ee5516b60 100644
--- a/main.html
+++ b/main.html
@@ -1,152 +1,185 @@
<!DOCTYPE html>
<html lang="en">
-<head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Sixth Sense</title>
- <!-- bootstrap core css -->
- <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
- <!-- progress barstle -->
- <!-- fonts style -->
- <link href="https://fonts.googleapis.com/css?family=Poppins:400,700|Raleway:400,600&display=swap" rel="stylesheet">
- <!-- font wesome stylesheet -->
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
- <!-- Custom styles for this template -->
- <link href="css/style.css" rel="stylesheet" />
- <!-- responsive style -->
- <link href="css/responsive.css" rel="stylesheet" />
- <!-- activity.css -->
- <link rel="stylesheet" href="css/activity_page.css">
-</head>
-<div class="top_container">
- <!-- header section strats -->
- <header class="header_section">
- <div class="container">
- <nav class="navbar navbar-expand-lg custom_nav-container ">
- <a class="navbar-brand" href="main.html">
- <span>
- Sixth Sense
- </span>
- </a>
- <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
- aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
- <span class="navbar-toggler-icon"></span>
- </button>
- <div class="collapse navbar-collapse" id="navbarSupportedContent">
- <div class="d-flex ml-auto flex-column flex-lg-row align-items-center">
- <ul class="navbar-nav ">
- <li class="nav-item active">
- <a class="nav-link" href="main.html"> Home <span class="sr-only">(current)</span></a>
- </li>
- <li class="nav-item">
- <a class="nav-link" href="alphabet.html"> Alphabets </a>
+ <head>
+ <meta charset="UTF-8" />
+ <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <title>Sixth Sense</title>
+ <link rel="icon" href="logo.PNG" type="image/PNG" />
+ <!-- Bootstrap core CSS -->
+ <link rel="stylesheet" type="text/css" href="bootstrap.css" />
+ <!-- Fonts style -->
+ <link
+ href="https://fonts.googleapis.com/css?family=Poppins:400,700|Raleway:400,600&display=swap"
+ rel="stylesheet"
+ />
+ <!-- Font Awesome stylesheet -->
+ <link
+ rel="stylesheet"
+ href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"
+ />
+ <!-- Custom styles for this template -->
+ <link href="style.css" rel="stylesheet" />
+ <!-- Responsive style -->
+ <link href="css/responsive.css" rel="stylesheet" />
+ <!-- Activity CSS -->
+ <link rel="stylesheet" href="css/activity_page.css" />
+ </head>
+ <body>
+ <div class="top_container">
+ <!-- Header section starts -->
+ <header class="header_section">
+ <div class="container">
+ <nav class="navbar navbar-expand-lg custom_nav-container">
+ <a class="navbar-brand" href="main.html">
+ <span>Sixth Sense</span>
+ </a>
+ <button
+ class="navbar-toggler"
+ type="button"
+ data-toggle="collapse"
+ data-target="#navbarSupportedContent"
+ aria-controls="navbarSupportedContent"
+ aria-expanded="false"
+ aria-label="Toggle navigation"
+ >
+ <span class="navbar-toggler-icon"></span>
+ </button>
+ <div class="collapse navbar-collapse" id="navbarSupportedContent">
+ <div
+ class="d-flex ml-auto flex-column flex-lg-row align-items-center"
+ >
+ <ul class="navbar-nav">
+ <li class="nav-item active">
+ <a class="nav-link" href="main.html"
+ >Home <span class="sr-only">(current)</span></a
+ >
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="alphabet.html">Alphabets</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="why.html">Why Us</a>
</li>
- <li class="nav-item">
- <a class="nav-link" href="why.html"> Why Us </a>
- </li>
- <li class="nav-item">
- <a class="nav-link" href="contact.html">Contact Us</a>
- </li>
- </ul>
+ <li class="nav-item">
+ <a class="nav-link" href="contact.html">Contact Us</a>
+ </li>
+ </ul>
+ </div>
</div>
- </nav>
- </div>
- </header>
- <br>
+ </nav>
+ </div>
+ </header>
- <section class="admission_section">
+ <section class="admission_section">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="admission_detail-box">
<h3>Animals</h3>
- <p>
- "Welcome to the amazing world of animals! From cuddly kittens to lions, and from tiny ants to enormous elephants, animals come in all shapes, sizes, and colors
- . So let's discover the magic of language together, both spoken and signed language!"
- </p>
<div class="image-container">
- <img src="dog.png" alt="Image">
- <div class="overlay">
- </div>
+ <img src="dog.png" alt="Image" />
+ <div class="layover"></div>
</div>
+ <p>
+ "Welcome to the amazing world of animals! From cuddly kittens
+ to lions, and from tiny ants to enormous elephants, animals
+ come in all shapes, sizes, and colors. So let's discover the
+ magic of language together, both spoken and signed language!"
+ </p>
<div class="">
- <a href="animal.html" class="call_to-btn btn_white-border">
- Start to Study
- </a>
+ <a href="animal.html" class="call_to-btn btn_white-border"
+ >Start to Study</a
+ >
+ <a href="greeting.html" class="call_to-btn btn_white-border"
+ >Play Game</a
+ >
</div>
</div>
</div>
<div class="col-md-6">
<div class="admission_img-container">
- <img src="Animals.png" alt="" height="370" width="300">
+ <img src="animals.png" alt="" height="370" width="300" />
</div>
</div>
</div>
</div>
</section>
+
<section class="why_section">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="why_img-container">
- <img src="greeting.png" alt="" height="370" width="300">
+ <img src="greeting.png" alt="" height="370" width="300" />
</div>
</div>
<div class="col-md-6">
<div class="why_detail-box">
<div class="image-container">
- <img src="welcome.png" alt="Image">
- <div class="overlay">
- </div>
+ <img src="welcome.png" alt="Image" />
+ <div class="layover"></div>
</div>
- <h3>Greeting</h3>
+ <h3>Greeting</h3>
<p>
- "Welcome to the exciting world of greetings! Greetings are how we say hello and show kindness to one another.
- Whether you're meeting someone new or saying hello to a friend, learning how to greet others is an important part of
- communication and showing respect. So let's discover the joy of saying hello, both with our words and with our hands!"
+ "Welcome to the exciting world of greetings! Greetings are how
+ we say hello and show kindness to one another. Whether you're
+ meeting someone new or saying hello to a friend, learning how
+ to greet others is an important part of communication and
+ showing respect. So let's discover the joy of saying hello,
+ both with our words and with our hands!"
</p>
<div class="">
- <a href="greeting.html" class="call_to-btn btn_white-border">
- Start to Study
- </a>
+ <a href="greeting.html" class="call_to-btn btn_white-border"
+ >Start to Study</a
+ >
+ <a
+ href="greeting_game.html"
+ class="call_to-btn btn_white-border"
+ >Play Game</a
+ >
</div>
</div>
</div>
</div>
</div>
</section>
+
<section class="determine_section">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="determine_detail-box">
<h3>Expression</h3>
- <p>
- "Welcome to the fascinating world of expressions! Expressions are how we communicate our feelings and emotions, whether through words or gestures.
- So get ready to explore the wide range of expressions we use every day,
- both in spoken language and in the language of signs!"
- </p>
<div class="image-container">
- <img src="face.png" alt="Image">
- <div class="overlay">
- </div>
+ <img src="face.png" alt="Image" />
+ <div class="layover"></div>
</div>
+ <p>
+ "Welcome to the fascinating world of expressions! Expressions
+ are how we communicate our feelings and emotions, whether
+ through words or gestures. So get ready to explore the wide
+ range of expressions we use every day, both in spoken language
+ and in the language of signs!"
+ </p>
<div class="">
- <a href="expression.html" class="call_to-btn btn_white-border">
- Start to Study
+ <a href="expression.html" class="call_to-btn btn_white-border"
+ >Start to Study</a
+ >
+ <a href="greeting.html" class="call_to-btn btn_white-border"
+ >Play Game
</a>
</div>
</div>
</div>
<div class="col-md-6">
<div class="determine_img-container">
- <img src="expression.png" alt="" height="370" width="300">
+ <img src="expression.png" alt="" height="370" width="300" />
</div>
</div>
</div>
</div>
</section>
- </div>
-</body>
-</html>
\ No newline at end of file
+ </div>
+ </body>
+</html>