diff --git a/css/style.css b/css/style.css
index 75e9841e..a9af57e5 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,8 +1,56 @@
-/**
- * Add your custom styles below
- * 
- * Remember: 
- * - Be organised, use comments and separate your styles into meaningful chunks
- *    for example: General styles, Navigation styles, Hero styles, Footer etc.
- * 
- */
+img {
+    height: 400px;
+    width: 700px;
+}
+
+header {
+    background-color: #F0F0F0;
+    padding: 20px;
+  }
+  
+  header h1 {
+    font-size: 36px;
+    margin: 0;
+  }
+  
+  header p {
+    font-size: 18px;
+    margin: 10px 0;
+  }
+  
+  /* Style for navigation bar */
+  nav {
+    background-color: #333;
+    color: #fff;
+    padding: 10px;
+  }
+  
+  /* Style for article elements */
+  article {
+    background-color: #fff;
+    padding: 20px;
+    margin-bottom: 20px;
+  }
+  
+  article h2 {
+    font-size: 24px;
+    margin-top: 0;
+  }
+  
+  article p {
+    font-size: 16px;
+    margin: 10px 0;
+  }
+  
+  article img {
+    max-width: 100%;
+  }
+  
+  /* Style for footer element */
+  footer {
+    background-color: #333;
+    color: #fff;
+    padding: 10px;
+    text-align: center;
+  }
+ 
\ No newline at end of file
diff --git a/index.html b/index.html
index 67dfc7f5..f86877c0 100644
--- a/index.html
+++ b/index.html
@@ -18,5 +18,38 @@
   <body>
     <!-- Add your HTML markup here -->
     <!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc -->
+
+      <!-- The .html page and a linked .css file applies a consistent color scheme to links and text on your page.
+
+An articles section with three articles, each including a title, summary and a link.
+
+A page footer containing info about you or the site.
+
+Proper use of the semantic HTML tags we discussed.
+
+Research the :first-child pseudo-class and use it to style the first article so that it stands out from the others.
+
+Use this website Lorem Ipsum to generate random blocks of contents to fill your website.
+
+Commit often (with good meaningful commit messages), and Push to Github regularly. -->
+      <header><h1>BEKIR</h1><p>This webpage is about Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
+        Curabitur justo lorem, bibendum in faucibus et, luctus ut diam. Sed nisi est, lacinia ac euismod eu, egestas non augue. </p></header>
+      <nav>NAVBAR</nav>
+      <body><article>
+        <h2>Google Chrome</h2>
+        <p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular web browser today!</p>
+        <img src="https://www.worldatlas.com/upload/7d/db/c3/shutterstock-1558058690.jpg" >
+        </article>
+        <article>
+          <h2>Google Chrome</h2>
+          <p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular web browser today!</p>
+          <img src="https://www.worldatlas.com/upload/7d/db/c3/shutterstock-1558058690.jpg"  >
+          </article>
+          <article>
+            <h2>Google Chrome</h2>
+            <p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular web browser today!</p>
+            <img src="https://www.worldatlas.com/upload/7d/db/c3/shutterstock-1558058690.jpg" >
+            </article></body>
+      <footer>FOOTER</footer>
   </body>
 </html>
