14Muhammad · moizkhan66 · Apr 2, 2019 · Apr 5, 2019 · Apr 9, 2019 · Apr 9, 2019
diff --git a/.idea/encodings.xml b/.idea/encodings.xml
diff --git a/.idea/misc.xml b/.idea/misc.xml
diff --git a/.idea/modules.xml b/.idea/modules.xml
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
diff --git a/.idea/wad.iml b/.idea/wad.iml
diff --git a/lec 03/images/background.jpg b/lec 03/images/background.jpg
diff --git a/lec 03/index.html b/lec 03/index.html
@@ -2,13 +2,16 @@
 <html>
 <head>
     <title>Pet Shop</title>
+    <link rel="stylesheet" href="style.css">
 </head>
 <body>
 <header>
     <h1>
         Pet Shop
     </h1>
-    <a href="newpage.html">New Page</a><br>
+    <button>    <a href="newpage.html">New Page</a>
+    </button>
+    <br>
     <a href="register.html">Register</a>
 </header>
 <hr>

diff --git a/lec 03/register.html b/lec 03/register.html
@@ -2,6 +2,8 @@
 <html>
 <head>
     <title>Register</title>
+    <link rel="stylesheet" href="style.css">
+
 </head>
 <body>
 <h1>
@@ -13,7 +15,10 @@ <h1>
     Email: <input type="email" name="email"><br>
     Password: <input type="password" name="password" minlength="5"><br>
     Birthday: <input type="date" name="birthday"><br>
-    Gender:<br>
+
+
+   <span>Gender</span> <br>
+
     <input type="radio" name="gender" value="Male">Male<br>
     <input type="radio" name="gender" value="Female">Female<br>
     <input type="radio" name="gender" value="Other">Other<br>

diff --git a/lec 03/style.css b/lec 03/style.css
@@ -0,0 +1,11 @@
+
+
+h1{
+    background: chocolate;
+    color: aqua;
+
+
+
+}
+body{
+}
diff --git a/lec 05/about.html b/lec 05/about.html
@@ -24,8 +24,8 @@ <h1>
     </h1>
 </header>
 <hr>
-<main>
-    <p> Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC,
+<main id="content">
+    <p class="error highlight_text"> Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC,
         making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia,
         looked up one of the more obscure Latin words, consectetur,
         from a Lorem Ipsum passage, and going through the cites of the word in classical literature,
@@ -34,7 +34,7 @@ <h1>
         very popular during the Renaissance.
         The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32.
     </p>
-    <p> Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC,
+    <p > Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC,
         making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia,
         looked up one of the more obscure Latin words, consectetur,
         from a Lorem Ipsum passage, and going through the cites of the word in classical literature,
@@ -74,7 +74,7 @@ <h1>
 <hr>
 <footer>
     <p>Developed by <a href="https://muhammadalimakhdoom.com/">Muhammad Ali Makhdoom </a></p>
-    <address>
+    <address class="error">
         University of Central Punjab, Lahore
     </address>
     <p> Copyrights &copy; 2019 All rights reserved. </p>

diff --git a/lec 05/css/style.css b/lec 05/css/style.css
@@ -9,11 +9,12 @@ https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Cascade_a
 
 body {
     background-image: url(../images/crossline-lines.png);
+    background-repeat: repeat;
     /*background-size: cover;
     background-repeat: no-repeat;
     background-position: center;*/
 }
-h1 {
+h1:hover{
     color: #3C2B74;
     text-align: center;
     border-style: solid;
@@ -27,6 +28,28 @@ header li {
     display: inline-block;
 }
 
+.error{
+    background-color: aqua;
+    cursor: grabbing;
+
+}
+.highlight_text{
+
+   font-size: medium;
+    font-family: "Arial Black";
+    mso-bidi-font-style: italic;
+
+}
+
+#content{
+
+    border: 5px solid black;
+    border-radius: 5px;
+}
+
+
+
+
 /*
 p {
     color: blue;

diff --git a/lec 05/stateCss.html b/lec 05/stateCss.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>CSS STATES ON HOVER</title>
+    <style>
+
+        .image:hover{
+            box-shadow: 3px 4px 12px 9px black;
+            border: 5px black;
+            border-radius: revert;
+
+
+        }
+        body{
+
+            background-color:lightgreen;
+        }
+
+
+
+
+
+    </style>
+</head>
+<body>
+
+<h1>
+    My Pet Page With css State
+</h1>
+
+<span class="image" >
+
+    <img src="">
+
+</span>
+
+</body>
+</html>
diff --git a/lec 07/css/style.css b/lec 07/css/style.css
@@ -11,11 +11,17 @@
 
 .highlight {
     font-size: 150%;
-    word-spacing: 10px;
+    color: antiquewhite;
+    word-spacing: 12px;
     line-height: 50px;
     text-decoration: underline;
     font-weight: bold;
     font-style: italic;
-    font-family: 'Caveat', cursive;
+    font-family: "Agency FB";
     letter-spacing: 5px;
-}
+}
+.highlight:hover{
+
+    color: black;
+    cursor: pointer;
+}
diff --git a/lec 07/index.html b/lec 07/index.html
@@ -7,7 +7,8 @@
     <link href="https://fonts.googleapis.com/css?family=Caveat" rel="stylesheet">
 </head>
 <body>
-<h1> Cascading Style Sheet </h1>
+<h1> MOIZ KHAN </h1>
+<h2>Tom and jerry series</h2>
 <div class="box">A</div>
 <div class="box">B</div>
 <div class="box">C</div>

diff --git a/lec 08/css/style.css b/lec 08/css/style.css
@@ -23,31 +23,4 @@ https://static.pexels.com/photos/133459/pexels-photo-133459.jpeg
 
 https://static.pexels.com/photos/50988/ape-berber-monkeys-mammal-affchen-50988.jpeg
 */
-body {
-    margin: 0;
-}
-h1 {
-    font-family: "High Tower Text";
-    font-size: 3em;
-    border-bottom: 2px solid gray;
-    border-right: 2px solid gray;
-    width: 600px;
-    text-align: center;
-    box-shadow: 4px 4px 4px #888888;
-    margin-top: 10px;
-}
-.container {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-}
-img {
-    width: 450px;
-    height: 300px;
-    margin: 10px;
-    transition: all 1s;
-}
-
-img:hover {
-    transform: scale(1.1);
-}
+
diff --git a/lec 08/index.html b/lec 08/index.html
@@ -1,19 +1,19 @@
 <!DOCTYPE html>
-<html lang="en">
+ <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>CSS</title>
     <link rel="stylesheet" href="css/style.css">
 </head>
 <body>
 <h1> Animals Life on the Planet </h1>
-<div class="container">
-    <img src="https://static.pexels.com/photos/52500/horse-herd-fog-nature-52500.jpeg">
-    <img src="https://static.pexels.com/photos/66898/elephant-cub-tsavo-kenya-66898.jpeg">
-    <img src="https://static.pexels.com/photos/213399/pexels-photo-213399.jpeg">
-    <img src="https://static.pexels.com/photos/158471/ibis-bird-red-animals-158471.jpeg">
-    <img src="https://static.pexels.com/photos/133459/pexels-photo-133459.jpeg">
-    <img src="https://static.pexels.com/photos/50988/ape-berber-monkeys-mammal-affchen-50988.jpeg">
+<div class="Content">
+<img src="https://static.pexels.com/photos/52500/horse-herd-fog-nature-52500.jpeg">
+<img src="https://static.pexels.com/photos/66898/elephant-cub-tsavo-kenya-66898.jpeg">
+<img src="https://static.pexels.com/photos/213399/pexels-photo-213399.jpeg">
+<img src="https://static.pexels.com/photos/158471/ibis-bird-red-animals-158471.jpeg">
+<img src="https://static.pexels.com/photos/133459/pexels-photo-133459.jpeg">
+<img src="https://static.pexels.com/photos/50988/ape-berber-monkeys-mammal-affchen-50988.jpeg">
 </div>
 </body>
 </html>
diff --git a/lec 09/robot/style.css b/lec 09/robot/style.css
@@ -5,9 +5,7 @@ h1 {
 
 .robots {
     display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-}
+
 
 .head,
 .left_arm,
@@ -67,7 +65,7 @@ h1 {
     /* This is another useful property. Hmm what do you think it does?*/
     margin: 0 auto;
     display: flex;
-}
+
 
 .left_leg, .right_leg {
     width: 40px;