diff --git a/sketchnotes/webdev101-css.png b/cssimg.png
similarity index 100%
rename from sketchnotes/webdev101-css.png
rename to cssimg.png
diff --git a/index.html b/index.html
index 11cd63fd..edbd02ab 100644
--- a/index.html
+++ b/index.html
@@ -3,13 +3,16 @@
 <head>
   <meta charset="UTF-8">
   <title>Web Dev for Beginners</title>
+  <link rel="stylesheet" href="styles.css";
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
   <meta name="description" content="Description">
   <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
   <link rel="icon" type="image/png" href="images/favicon.png">
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsify-themeable@0/dist/css/theme-simple.css"></head>
 <body>
+  <img src="cssimg.png" alt="img" class="img">
   <div id="app"></div>
+  <img src="cssimg.png" alt="img" class="img">
   <script>
     window.$docsify = {
       name: 'Web Development for Beginners: A Curriculum',
diff --git a/styles.css b/styles.css
new file mode 100644
index 00000000..4530ab73
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,10 @@
+* {
+    background-color: #F0F8FF;
+    
+}
+.img{
+    margin-left:18rem;
+    border-radius: 50;
+    height: 20rem;
+    width:70rem;
+}
\ No newline at end of file
