diff --git a/CSS/style.css b/CSS/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..2ebda1307a5ade96c24ac5a8b4cfe6432be74f53
--- /dev/null
+++ b/CSS/style.css
@@ -0,0 +1,242 @@
+body{
+font:15px/1.5 Arial,helvetica,sans-serif;
+padding: 0;
+margin: 0;
+background-color: #f4f4f4;
+}
+/*Global */
+.container{
+ width:80%;
+ margin: auto;
+ overflow: hidden;
+}
+ul{
+ margin: 0;
+ padding: 0;
+}
+.button_1{
+ height: 38px;
+ background: #e8491d;
+ border: 0;
+ padding-left: 20px;
+ padding-right: 20px;
+ margin-right: 400px;
+ color: #ffffff;
+}
+.dark{
+ padding: 15px;
+ background: #35424a;
+ color: #ffffff;
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+/*header **/
+header{
+ background: #35424a;
+ color: #ffffff;
+padding-top: 30px;
+min-height: 70px;
+border-bottom: #e8491d 3px solid;
+}
+header a{
+ color: #ffffff;
+ text-decoration: none;
+ text-transform: uppercase;
+ font-size: 16px;
+ }
+
+header li{
+ float: left;
+ display: inline;
+ padding: 0 20px 0 20px;
+}
+
+header #branding{
+ float:left;
+}
+
+header #branding h1{
+ margin : 0;
+}
+
+header nav{
+ float: right;
+ margin-top: 10px;
+}
+
+header .highlight, header .current a{
+ color:#e8491d !important;
+ font-weight: bold;
+}
+
+header a:hover{
+ color: #cccccc;
+ font-weight: bold;
+
+}
+
+/*showcase*/
+#showcase{
+ min-height: 400px;
+ background:url('../Images/showcase.jpg'), no-repeat,0 200px;
+text-align: center;
+color: #ffffff;
+}
+#showcase h1{
+ margin top: 100px;
+ font-size: 55px;
+ margin-bottom: 18px;
+}
+#showcase p{
+ font-size: 20px;
+}
+/* Newsletter*/
+#newsletter p{
+ padding: 15px;
+ color: #ffffff;
+ background:#35424a;
+}
+#newsletter h1{
+ float: left;
+}
+#newsletter form{
+ float: right;
+ margin-top: 15px;
+
+}
+#newsletter input[type="email"]{
+ padding: 4px;
+ height: 25px;
+ width: 250px
+}
+/* Boxes */
+#boxes{
+ margin-top: 20px;
+ }
+
+ #boxes .box{
+ float: left;
+ text-align: center;
+ width: 30%;
+ padding: 10px;
+ }
+ #Boxes .box img {
+ width: 90px;
+ }
+ /* Sidebar*/
+ aside#sidebar{
+ float:right;
+ width: 30%;
+ margin-top: 10px;
+ }
+ aside#sidebar .quote input, aside#sidebar .quote textarea{
+ width:90%;
+ padding:5px;
+ }
+ /* Main-col */
+ article#main-col{
+ float: left;
+ width: 65%;
+
+ }
+ /* Services*/
+ ul#services li{
+ list-style: none;
+ padding: 20px;
+ border: #cccccc solid 1px;
+ margin-bottom: 5px;
+ background:#e6e6e6;
+ }
+
+ footer{
+ padding: 20px;
+ margin-top: 20px;
+ color: #ffffff;
+ background-color: #e8491d;
+ text-align: center;
+ }
+/*login **/
+
+.login-page {
+ width: 60%;
+ padding: 7% 0 0;
+ margin: auto;
+}
+.form {
+ position: relative;
+ z-index: 1;
+ background: #FFFFFF;
+ max-width: 468px;
+ margin: 60px auto 100px;
+ padding: 45px;
+ text-align: center;
+ box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
+
+
+}
+.form input {
+ font-family: "Roboto", sans-serif;
+ outline: 0;
+ background: #f2f2f2;
+ width: 100%;
+ border: 0;
+ margin: 0 0 15px;
+ padding: 15px;
+ box-sizing: border-box;
+ font-size: 14px;
+}
+.form button {
+ font-family: "Roboto", sans-serif;
+ text-transform: uppercase;
+ outline: 0;
+ background: #e8491d;
+ width: 100%;
+ border: 0;
+ padding: 15px;
+ color: #FFFFFF;
+ font-size: 14px;
+ -webkit-transition: all 0.3 ease;
+ transition: all 0.3 ease;
+ cursor: pointer;
+}
+.form button:hover,.form button:active,.form button:focus {
+ background: #cccccc;
+}
+.form .message {
+ margin: 15px 0 0;
+ color: #b3b3b3;
+ font-size: 12px;
+}
+.form .message a {
+ color: #e8491d;
+ text-decoration: none;
+}
+.form {
+ border-top: 20px;
+}
+form p {
+ float: left;
+ margin-bottom: 30px;
+}
+form #role{
+ background: #f2f2f2;
+float: left;
+margin-top: 6px;
+ font-family: "Roboto", sans-serif;
+ margin-left: 5px;
+}
+form label{
+ font-family: "Roboto", sans-serif;
+ margin-left: 6px;
+}
+
+/*signup **/
+.signup{
+ padding-top: 7%;
+}
+/*articles shown in admins dashboard**/
+table {
+ font:15px/1.5 Arial,helvetica,sans-serif;
+ border-collapse: collapse;
+ width: 100%;
+}
diff --git a/Images/Financial-Technology-1-696x378.jpg b/Images/Financial-Technology-1-696x378.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f8de5dcf63248f90a2164107680567a7f115678a
Binary files /dev/null and b/Images/Financial-Technology-1-696x378.jpg differ
diff --git a/Images/Meditation-PNG-Image.png b/Images/Meditation-PNG-Image.png
new file mode 100644
index 0000000000000000000000000000000000000000..d0081f7f8f7401c250bdc76d4696966abdde1d8f
Binary files /dev/null and b/Images/Meditation-PNG-Image.png differ
diff --git a/Images/cooking.png b/Images/cooking.png
new file mode 100644
index 0000000000000000000000000000000000000000..febf95ed74957e7e34e77bdd81191c7971449a9c
Binary files /dev/null and b/Images/cooking.png differ
diff --git a/Images/fitness_PNG41.png b/Images/fitness_PNG41.png
new file mode 100644
index 0000000000000000000000000000000000000000..ecb54100ee31c4a608ddc8ff2a4f2a8f4a1a2e91
Binary files /dev/null and b/Images/fitness_PNG41.png differ
diff --git a/Images/football.jpg b/Images/football.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..09ba081de93325d47cb7aeff95fac7d725f56e07
Binary files /dev/null and b/Images/football.jpg differ
diff --git a/Images/football.png b/Images/football.png
new file mode 100644
index 0000000000000000000000000000000000000000..c64810b6b4125c67b3a3c5e50f16a0521445d999
Binary files /dev/null and b/Images/football.png differ
diff --git a/Images/pollution.jpg b/Images/pollution.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..d6c35345afc701a1f469c548d09294a1782b92e2
Binary files /dev/null and b/Images/pollution.jpg differ
diff --git a/Images/rb-tlds-profession.png b/Images/rb-tlds-profession.png
new file mode 100644
index 0000000000000000000000000000000000000000..ad20b45b9cd41dc84851f4ee0b2c069aae9f961e
Binary files /dev/null and b/Images/rb-tlds-profession.png differ
diff --git a/Images/showcase.jpg b/Images/showcase.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..a1b6dc5c2cd58c8ba2627b60010570dacd2780c4
Binary files /dev/null and b/Images/showcase.jpg differ
diff --git a/Project Description.pdf b/Project Description.pdf
new file mode 100644
index 0000000000000000000000000000000000000000..d9686082b456d5c82a7f4e35770b2b8f96be210e
Binary files /dev/null and b/Project Description.pdf differ
diff --git a/Read it.txt b/Read it.txt
new file mode 100644
index 0000000000000000000000000000000000000000..8eae9895c995d14ae9141a9154a03b07d4541824
--- /dev/null
+++ b/Read it.txt
@@ -0,0 +1,32 @@
+the website is almost done ....but if you want to make it compatible to mobile devices then add the following
+codes at the end of footer in style.css
+/* Media Queries */
+@media(max-width: 768px){
+header #branding,
+header nav,
+header nav li,
+#newsletter h1,
+#newsletter form,
+#boxes .box
+article#main-col,
+aside#sidebar{
+float:none;
+text-align:center;
+width:100%;
+}
+header{
+padding-bottom:20px;
+}
+#showcase h1{
+margin-top:40px;
+}
+#newsletter button, quote button{
+display:block;
+width:100%
+}
+#newsletter form input[type="email"], .quote input, quote textarea{
+width:100%
+margin-bottom:5px;
+
+}
+}
\ No newline at end of file
diff --git a/about.html b/about.html
new file mode 100644
index 0000000000000000000000000000000000000000..1b0ec713dfa4afa77d4ed9386aa498e8e55bff88
--- /dev/null
+++ b/about.html
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Published Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| About</title>
+ <link rel="stylesheet" href="./css/style.css">
+ </head>
+ <body>
+<header>
+ <div class="container">
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li ><a href="index.html">Home</a></li>
+ <li class="current"><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+
+
+ <section id="newsletter">
+ <div class="container">
+ <h1>Subscribe to our Blogs</h1>
+ <form>
+ <input type="email" placeholder="Enter Username....">
+ <button type="submit" class="button_1">Subscribe</button>
+ </form>
+
+ </div>
+
+ </section>
+
+ <section id="main">
+<div class="container">
+ <article id="main-col">
+ <h1 class="page-title">About Us</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec aliquet, enim tincidunt tristique lacinia, ex sapien ultrices nulla, nec rhoncus sem sapien ac risus. Sed dignissim est quis mi molestie mattis. Integer sollicitudin pellentesque lorem, id sollicitudin arcu dapibus vitae. Pellentesque sit amet dolor sed odio euismod ultrices vel in diam. Nullam euismod lectus non ex auctor pulvinar. Praesent a lorem pharetra, vestibulum lacus in, luctus diam. Mauris nibh odio, mollis in tincidunt ac, lobortis quis mi. Pellentesque vestibulum venenatis felis eu condimentum. Praesent enim nulla, eleifend sit amet mauris in, luctus aliquet dolor. Nullam vulputate mattis imperdiet. Vestibulum augue nisi, aliquet in lectus sit amet, tincidunt tempus diam. Vivamus ac magna nunc. Sed sit amet pellentesque risus. Mauris sodales in eros mattis egestas.
+</p>
+<p class="dark">
+Pellentesque est tortor, tempus quis erat sit amet, dictum interdum arcu. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce fermentum interdum venenatis. Etiam ac nisi libero. Suspendisse est magna, vulputate eu efficitur sit amet, ullamcorper vitae ex. Donec hendrerit eros nunc, sed vulputate leo pellentesque sed. Vestibulum rutrum bibendum lacus sit amet dictum. Proin eget lorem vel felis feugiat accumsan. Nam et lobortis velit.
+</p>
+
+
+ </article>
+ <aside id="sidebar">
+<div class="dark">
+<h3>What We Do</h3>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec aliquet, enim tincidunt tristique lacinia, ex sapien ultrices nulla, nec rhoncus .
+ </p>
+ </div>
+ </aside>
+ </div>
+
+ </section>
+
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
+
+
+
+ </body>
+</html>
diff --git a/adminPanel.html b/adminPanel.html
new file mode 100644
index 0000000000000000000000000000000000000000..97959e53ca8b3a7ab74b9c1699758c527889c37a
--- /dev/null
+++ b/adminPanel.html
@@ -0,0 +1,34 @@
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+</head>
+<body>
+<header>
+<div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+<body>
+ <ul>
+ <li ><a href="Articles.html">Articles</a></li>
+
+ </ul>
+</body>
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
diff --git a/articles.html b/articles.html
new file mode 100644
index 0000000000000000000000000000000000000000..0c6da03d33ad604aa2de8b6a26681a2f20925343
--- /dev/null
+++ b/articles.html
@@ -0,0 +1,72 @@
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+</head>
+<body>
+<header>
+<div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+<body>
+ <h2>HTML Table</h2>
+
+ <table>
+ <tr>
+ <th>Article</th>
+ <th>Date</th>
+ <th>Edit</th>
+ </tr>
+ <tr>
+ <td>Alfreds Futterkiste</td>
+ <td>Maria Anders</td>
+ <td>Germany</td>
+ </tr>
+ <tr>
+ <td>Centro comercial Moctezuma</td>
+ <td>Francisco Chang</td>
+ <td>Mexico</td>
+ </tr>
+ <tr>
+ <td>Ernst Handel</td>
+ <td>Roland Mendel</td>
+ <td>Austria</td>
+ </tr>
+ <tr>
+ <td>Island Trading</td>
+ <td>Helen Bennett</td>
+ <td>UK</td>
+ </tr>
+ <tr>
+ <td>Laughing Bacchus Winecellars</td>
+ <td>Yoshi Tannamuri</td>
+ <td>Canada</td>
+ </tr>
+ <tr>
+ <td>Magazzini Alimentari Riuniti</td>
+ <td>Giovanni Rovelli</td>
+ <td>Italy</td>
+ </tr>
+ </table>
+
+
+
+</body>
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
diff --git a/cooking.html b/cooking.html
new file mode 100644
index 0000000000000000000000000000000000000000..77eaa150e6a983be907de31060c6f02976ae0f9a
--- /dev/null
+++ b/cooking.html
@@ -0,0 +1,30 @@
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+</head>
+<header>
+ <div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+<body>
+
+</body>
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
diff --git a/fitness.html b/fitness.html
new file mode 100644
index 0000000000000000000000000000000000000000..b76caaa533483f7e622af957df447019927b317e
--- /dev/null
+++ b/fitness.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+</head>
+<body>
+<header>
+<div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+
+ <p>To get started, I want to start with the idea of ​​the all-rounder among the fitness blogs. These blogs are about different fitness topics. They all have a focus, but are relatively broad in content. On this site, every fitness enthusiast can find something suitable.
+</p>
+ </body>
+
+ <h1>1) Fitvolution</h1>
+
+ <body>
+ <p2>Yes, this is a fitness blog. So, if you've landed here on Google search and you do not know our blog yet, then check out here. Fitvolution is the fitness blog for busy people. Here we have made it our mission to help you with little time to optimize your training and get your diet under control. In our Blog Categories strength training , cardiovascular training , sports motivation , fitness nutrition and fitness accessories you'll surely one or other useful items for you
+ </p2>
+ </body>
+ <footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+ </footer>
+
+</html>
diff --git a/football.html b/football.html
new file mode 100644
index 0000000000000000000000000000000000000000..34cbd04aaaeead22ef59a29e3cf2fc5d9ad00d35
--- /dev/null
+++ b/football.html
@@ -0,0 +1,27 @@
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+</head>
+<header>
+ <div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
diff --git a/index.html b/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..bd3bc39f38d56618adf51d55d24a2c71f8c217da
--- /dev/null
+++ b/index.html
@@ -0,0 +1,110 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+ </head>
+ <body>
+<header>
+ <div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+
+ <section id="showcase">
+ <div class="container">
+ <h1>Publish your desired Articles</h1>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tristique odio ac tortor consectetur, nec luctus ipsum mollis. Aenean id maximus lorem. </p>
+ </div>
+ </section>
+
+ <section id="newsletter">
+ <div class="container">
+ <h1>Subscribe to our Blogs</h1>
+ <form>
+ <input type="email" placeholder="Enter Article Name....">
+ <button type="submit" class="button_1">Search</button>
+ </form>
+ </div>
+ </section>
+
+ <section id="boxes">
+<div class="container">
+ <div class="box">
+ <a href="fitness.html"target="_blank"><img src="./Images/fitness_PNG41.png"></a>
+ <h3>Fitness</h3>
+ <i><h4>by Saif Ali on 22-4-19</h4></i>
+ <p>To get started, I want to start with the idea of ​​the all-rounder among the fitness blogs.</p>
+ </div>
+ <div class="box">
+ <a href="meditation.html"target="_blank">
+ <img src="./Images/Meditation-PNG-Image.png">
+ </a>
+ <h3>Meditation</h3>
+ <i><h4>by Saif Ali on 22-4-19</h4></i>
+ <p>If you’re brand new to meditation, this is a great place to start.</p>
+</div>
+ <div class="box">
+<a href="profession.html"target="_blank">
+ <img src="./Images/rb-tlds-profession.png" alt="">
+</a>
+ <h3>Professions</h3>
+ <i><h4>by Saif Ali on 22-4-19</h4></i>
+ <p>The definition of professionalism is widespread and unique to whomever you may ask about it.</p>
+ </div>
+ <div class="box">
+ <a href="football.html"target="_blank"><img src="./Images/football.png" alt="">
+ </a>
+ <h3>Football</h3>
+ <i><h4>by Saif Ali on 22-4-19</h4></i>
+ <p>We at the Fanatic love for football recognize the many great football blogs and websites .</p>
+</div>
+ <div class="box">
+ <a href="pollution.html"target="_blank"><img src="./Images/pollution.jpg" alt="">
+ </a>
+ <h3>Pollution</h3>
+ <i><h4>by Saif Ali on 22-4-19</h4></i>
+ <p>Short-lived climate pollutants like blackcarbons and methane aren't as well-known.</p>
+</div>
+ <div class="box">
+ <a href="cooking.html"target="_blank"><img src="./Images/cooking.png" alt="">
+ </a>
+ <h3>Cooking</h3>
+ <i><h4>by Saif Ali on 22-4-19</h4></i>
+ <p>Well-tested interesting recipes, food science, techniques, equipment, and even food histories.</p>
+
+ </div>
+
+ </div>
+
+ </div>
+ </div>
+
+ </section>
+
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
+
+
+
+
+
+
+</body>
+</html>
diff --git a/login.html b/login.html
new file mode 100644
index 0000000000000000000000000000000000000000..37fc6892d9b3d5eca9c6c03862a63b10173d0e58
--- /dev/null
+++ b/login.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+
+</head>
+<body>
+ <header>
+ <div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li class="current"><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+ </header>
+ <div class="login-page">
+ <div class="form">
+ <form class="login-form">
+ <form >
+ <p>
+ <label>Login as</label><br>
+ <select id = "role">
+ <option value = "1">Admin</option>
+ <option value = "2">Author</option>
+ <option value = "3">User</option>
+ </select>
+ </p>
+</form>
+ <input type="text" placeholder="username"/>
+ <input type="password" placeholder="password"/>
+ <a href="adminPanel.html">
+ <button>login</button>
+ </a>
+
+ <p class="message">Not registered? <a href="signup.html">Create an account</a></p>
+ </form>
+ </div>
+</div>
+
+
+
+ </body>
+</html>
diff --git a/meditation.html b/meditation.html
new file mode 100644
index 0000000000000000000000000000000000000000..b42bfa25409c9452a442552f4df45df7c9533de8
--- /dev/null
+++ b/meditation.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+ </head>
+ <body>
+<header>
+ <div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
diff --git a/pollution.html b/pollution.html
new file mode 100644
index 0000000000000000000000000000000000000000..34cbd04aaaeead22ef59a29e3cf2fc5d9ad00d35
--- /dev/null
+++ b/pollution.html
@@ -0,0 +1,27 @@
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+</head>
+<header>
+ <div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
diff --git a/profession.html b/profession.html
new file mode 100644
index 0000000000000000000000000000000000000000..fc462557573555f6dd98bcac1334ee9317e960bf
--- /dev/null
+++ b/profession.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+ </head>
+ <body>
+<header>
+ <div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li class="current"><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+</header>
+
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
diff --git a/services.html b/services.html
new file mode 100644
index 0000000000000000000000000000000000000000..2fb739637c3d1319eb75fb239e64358a9f7495f1
--- /dev/null
+++ b/services.html
@@ -0,0 +1,101 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width"
+ <meta name="description" content="Articles and Published Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| About</title>
+ <link rel="stylesheet" href="./css/style.css">
+ </head>
+ <body>
+<header>
+ <div class="container">
+ <div id="branding">
+ <h1><span class="highlight">Services</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li ><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li class="current"><a href="Services.html">Services</a></li>
+ <li><a href="login.html">Login</a></li>
+
+ </ul>
+ </nav>
+ </div>
+</header>
+
+
+ <section id="newsletter">
+ <div class="container">
+ <h1>Subscribe to our Blogs</h1>
+ <form>
+ <input type="email" placeholder="Enter Username....">
+ <button type="submit" class="button_1">Subscribe</button>
+ </form>
+
+ </div>
+
+ </section>
+
+ <section id="main">
+<div class="container">
+ <article id="main-col">
+ <h1 class="page-title">Services</h1>
+ <ul id="services">
+ <li>
+ <h3>Website Design</h3>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec aliquet, enim tincidunt tristique lacinia, ex sapien ultrices nulla, nec rhoncus sem sapien ac risus. Sed dignissim est quis mi molestie mattis. Integer sollicitudin pellentesque lorem, id sollicitudin arcu dapibus vitae. </p>
+<p>pricing : 1,000$-3,000$
+</p>
+ </li>
+ <li>
+ <h3>Website Maintenace</h3>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec aliquet, enim tincidunt tristique lacinia, ex sapien ultrices nulla, nec rhoncus sem sapien ac risus. Sed dignissim est quis mi molestie mattis. Integer sollicitudin pellentesque lorem, id sollicitudin arcu dapibus vitae. </p>
+<p>pricing : 240$ per month
+</p>
+ </li>
+ <li>
+ <h3>Website Hosting</h3>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec aliquet, enim tincidunt tristique lacinia, ex sapien ultrices nulla, nec rhoncus sem sapien ac risus. Sed dignissim est quis mi molestie mattis. Integer sollicitudin pellentesque lorem, id sollicitudin arcu dapibus vitae. </p>
+<p>pricing : 25$ per month
+</p>
+ </li>
+ </ul>
+
+
+ </article>
+ <aside id="sidebar">
+<div class="dark">
+<h3>Get a Quote</h3>
+ <form class="quote">
+ <div>
+ <label>Name</label><br>
+ <input type="text" placeholder="Name">
+ </div>
+ <div>
+ <label>Email</label><br>
+ <input type="Email" placeholder="Email Adress">
+ </div>
+ <div>
+ <label>Message</label><br>
+ <textarea placeholder="Message"></textarea>
+ </div>
+<button class="button-1" type="submit">Send</button>
+ </form>
+ </div>
+ </aside>
+ </div>
+
+ </section>
+
+<footer>
+ <p>Tech-Science Blog, Copyright © 2019</p>
+</footer>
+
+
+
+ </body>
+</html>
diff --git a/signup.html b/signup.html
new file mode 100644
index 0000000000000000000000000000000000000000..9e68d5996bcaff2902ccdd79b6ea5841ff2b8bc9
--- /dev/null
+++ b/signup.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width-device-width">
+ <meta name="description" content="Articles and Blogs">
+ <meta name="keywords" content="web design, fitness , meditation , professional, others">
+ <meta name="author" content="Saif Ali">
+ <title>Blogs| Welcome</title>
+ <link rel="stylesheet" href="./css/style.css">
+
+</head>
+<body>
+ <header>
+ <div class="container" >
+ <div id="branding">
+ <h1><span class="highlight">Articles</span> and Blogs</h1>
+ </div>
+ <nav>
+ <ul>
+ <li><a href="index.html">Home</a></li>
+ <li><a href="About.html">About</a></li>
+ <li><a href="Services.html">Services</a></li>
+ <li class="current"><a href="login.html">Login</a></li>
+ </ul>
+ </nav>
+ </div>
+ </header>
+
+ <div class="signup">
+<div class="form">
+ <form class="register-form">
+ <form >
+ <p>
+ <label>Sign up as</label><br>
+ <select id = "role">
+
+ <option value = "2">Author</option>
+ <option value = "3">User</option>
+ </select>
+ </p>
+</form>
+ <input type="text" placeholder="name"/>
+ <input type="password" placeholder="password"/>
+ <input type="text" placeholder="email address"/>
+ <button>create</button>
+ <p class="message">Already registered? <a href="login.html">Sign In</a></p>
+ </form>
+</div>
+</div>
+</body>