CodeYourFuture · HarounAlarabi · Jan 25, 2023
diff --git a/css/style.css b/css/style.css
@@ -6,3 +6,76 @@
  *    for example: General styles, Navigation styles, Hero styles, Footer etc.
  * 
  */
+ body {
+   background-color: #f6f6f6;
+   font-family: Arial, sans-serif;
+   margin: 0;
+   padding: 5px 30px;
+ }
+
+ header {
+
+   display: flex;
+   flex-direction: column;
+   justify-content: center;
+   align-items: center;
+
+ }
+
+ #logo {
+
+   float: left;
+   width: 150px;
+   height: 150px;
+   border: 0px;
+   border-radius: 50%;
+ }
+
+ nav ul {
+   list-style-type: none;
+   margin: 0;
+   padding-top: 50px;
+   overflow: hidden;
+   float: right;
+ }
+
+ nav li {
+   float: left;
+ }
+
+ nav a {
+   display: block;
+   color: black;
+   text-align: center;
+   padding: 14px 16px;
+   text-decoration: none;
+ }
+
+ nav a:hover {
+   background-color: #ddd;
+   color: black;
+ }
+ #title{
+   display: flex;
+   justify-content: center;
+   padding-top: 10px;
+ }
+ main{
+   width: 70%;
+   margin-left: auto;
+   margin-right: auto;
+ }
+ section{
+  padding: 60px 100px;
+
+  display: block;
+  justify-content: center;
+  align-items: center;
+ }
+ img{
+   width: 90%;;
+ }
+ div p{
+   display: flex;
+   justify-content: center;
+ }
diff --git a/food.webp b/food.webp
diff --git a/index.html b/index.html
@@ -1,22 +1,113 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta
-      name="viewport"
-      content="width=device-width, initial-scale=1, shrink-to-fit=no"
-    />
-    <title>My Blog</title>
-    <link
-      href="//fonts.googleapis.com/css?family=Roboto:400,500,300"
-      rel="stylesheet"
-      type="text/css"
-    />
-    <link rel="stylesheet" href="css/style.css" />
-    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
-  </head>
-  <body>
-    <!-- Add your HTML markup here -->
-    <!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc -->
-  </body>
-</html>
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+  <title>My Blog</title>
+  <link href="//fonts.googleapis.com/css?family=Roboto:400,500,300" rel="stylesheet" type="text/css" />
+  <link rel="stylesheet" href="css/style.css" />
+  <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
+</head>
+
+<body>
+  <!-- Add your HTML markup here -->
+  <!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc -->
+  <header>
+
+      <img id="logo" src="logo.png">
+
+
+
+    <nav>
+      <ul class="nav-menu">
+        <li><a href="#home">Home</a></li>
+        <li><a href="#sport">Sport</a></li>
+        <li><a href="#sleep">Sleeping</a></li>
+      </ul>
+    </nav>
+  </header>
+  <main>
+    <h1 id="title">Healthy life</h1>
+    <section id="home">
+      <h1>Healthy Eating</h1>
+      <p>Confused by all the conflicting nutrition advice out there? These simple tips can show you how to plan, enjoy,
+        and stick to a healthy diet.</p>
+      <img src="food.webp">
+      <article >
+        <h2>What is a healthy diet?</h2>
+        <p>Eating a healthy diet is not about strict limitations, staying unrealistically thin, or depriving yourself of
+          the foods you love. Rather, it’s about feeling great, having more energy, improving your health, and boosting
+          your mood.
+
+          Healthy eating doesn’t have to be overly complicated. If you feel overwhelmed by all the conflicting nutrition
+          and diet advice out there, you’re not alone. It seems that for every expert who tells you a certain food is
+          good for you, you’ll find another saying exactly the opposite. The truth is that while some specific foods or
+          nutrients have been shown to have a beneficial effect on mood, it’s your overall dietary pattern that is most
+          important. The cornerstone of a healthy diet should be to replace processed food with real food whenever
+          possible. Eating food that is as close as possible to the way nature made it can make a huge difference to the
+          way you think, look, and feel.
+
+          By using these simple tips, you can cut through the confusion and learn how to create—and stick to—a tasty,
+          varied, and nutritious diet that is as good for your mind as it is for your body.</p>
+        <h2>Making the switch to a healthy diet</h2>
+        <p>
+          Switching to a healthy diet doesn't have to be an all or nothing proposition. You don't have to be perfect,
+          you don't have to completely eliminate foods you enjoy, and you don't have to change everything all at
+          once—that usually only leads to cheating or giving up on your new eating plan.
+
+          A better approach is to make a few small changes at a time. Keeping your goals modest can help you achieve
+          more in the long term without feeling deprived or overwhelmed by a major diet overhaul. Think of planning a
+          healthy diet as a number of small, manageable steps—like adding a salad to your diet once a day. As your small
+          changes become habit, you can continue to add more healthy choices.</p>
+      </article>
+    </section>
+
+
+    <section id="sport">
+      <h1>The Health And Fitness Benefits Of Sport</h1>
+      <img src="sport.jpg">
+      <p>For sure, playing sports is a generally a fantastic way to improve your fitness and health. Many of us may not
+        feel at home pounding away on a treadmill or working up a sweat in the gym, but we’ll happily chase a ball
+        around endlessly while playing a game of some sort.
+
+        For most people, taking part in sport will improve your general health and wellbeing. There are plenty of
+        reasons why you should become involved in sport with reduced body fat, bone strengthening, improved stamina and
+        flexibility being some of the reasons why you should take up a sport.
+
+      </p>
+
+    </section>
+    </article>
+    <article>
+      <section id="sleep">
+        <h2>Sleeping</h2>
+
+        <h3>How to Sleep Better</h3>
+        <img src="sleep.jpg">
+        <p>How can I get a better night's sleep?
+          Sleeping well directly affects your mental and physical health. Fall short and it can take a serious toll on
+          your daytime energy, productivity, emotional balance, and even your weight. Yet many of us regularly toss and
+          turn at night, struggling to get the sleep we need.
+
+          Getting a good night’s sleep may seem like an impossible goal when you’re wide awake at 3 a.m., but you have
+          much more control over the quality of your sleep than you probably realize. Just as the way you feel during
+          your waking hours often hinges on how well you sleep at night, so the cure for sleep difficulties can often be
+          found in your daily routine.
+
+          Unhealthy daytime habits and lifestyle choices can leave you tossing and turning at night and adversely affect
+          your mood, brain and heart health, immune system, creativity, vitality, and weight. But by experimenting with
+          the following tips, you can enjoy better sleep at night, boost your health, and improve how you think and feel
+          during the day.</p>
+      </section>
+    </article>
+  </main>
+  <footer>
+    <div id="rights">
+      <p>Copy Right &copy; for Healthy Life</p>
+  </div>
+
+  </footer>
+</body>
+
+</html>
diff --git a/logo.png b/logo.png
diff --git a/sleep.jpg b/sleep.jpg
diff --git a/sport.jpg b/sport.jpg