diff --git a/404.html b/404.html
index 19914e9..ffa5a09 100644
--- a/404.html
+++ b/404.html
@@ -4,77 +4,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Nirmal Kumar R</title>
-    <style>
-      * {
-        margin: 0;
-        padding: 0;
-        box-sizing: border-box;
-      }
-
-      body {
-        font-family: verdana;
-        font-size: 13px;
-        max-width: 46em;
-      }
-
-      header {
-        margin: 1em 1em 1em 9em;
-      }
-
-      nav {
-        display: flex;
-        flex-direction: column;
-        align-items: start;
-        margin-left: 1em;
-        float: left;
-      }
-
-      nav a {
-        background-color: #BF1717;
-        font-family: verdana;
-        color: white;
-        font-size: 0.8rem;
-        text-shadow: 0px 0px 1px #cccccc;
-        min-width: 70px;
-        padding: 0.3em 0.5em;
-        text-decoration: none;
-        box-shadow: 1px 2px 2px #dfb7b7 inset;
-        border-bottom: 4px solid #992727;
-        border-right: 3px solid #f29595;
-        border-left: 2px solid #b77272;
-        border-top: 1px solid #ac3e3e;
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-        text-rendering: optimizeLegibility;
-      }
-
-      p {
-        margin: 2em 0;
-      }
-
-      .home,
-      .content-wrapper {
-        margin-left: 9em;
-      }
-
-      .content-wrapper {
-        margin-top: 1em;
-      }
-
-      .contact {
-        background-color: #ffcc33;
-        padding: 0.6em;
-      }
-
-      footer {
-        color: #cccccc;
-        margin: 3em 0 3em 9em;
-      }
-
-      footer hr {
-        margin-bottom: 1em;
-      }
-    </style>
+    <link rel="stylesheet" href="style.css">
   </head>
   <body>
     <header>
@@ -84,7 +14,9 @@
     </header>
     
     <section class="content-wrapper">
-      <div class="content-title"><img src="https://ik.imagekit.io/mysticmode/home/404-not-found.png" alt="404 Not Found"></div>
+      <div class="content-title">
+	<h2>404 Not Found</h2>
+      </div>
       <div class="content">
         <p>Rumi said - "What you seek is seeking you"</p>
         <p>This page has no content, but don't worry - All was good, All is well and All's gonna be fine.</p>
@@ -94,7 +26,7 @@
 
     <footer>
       <hr>
-      © Nirmal Kumar R
+      © Nirmal Kumar R. All original text, is licensed under a <a href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>. Source code of this website can be found <a href="https://github.com/mysticmode/mysticmode.github.io">here</a>.
     </footer>
   </body>
 </html>
diff --git a/index.html b/index.html
index f7895f1..8a45b22 100644
--- a/index.html
+++ b/index.html
@@ -5,89 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="icon" type="image/png" href="https://ik.imagekit.io/mysticmode/home/favicon.png">
     <title>Nirmal Kumar R</title>
-    <style>
-      * {
-        margin: 0;
-        padding: 0;
-        box-sizing: border-box;
-      }
-
-      body {
-        font-family: sans-serif;
-        font-size: 14px;
-	line-height: 1.4;
-        max-width: 30em;
-      }
-
-      header {
-        margin: 1em;
-      }
-
-      nav {
-        display: flex;
-        align-items: start;
-	justify-content: center;
-      }
-
-      nav a {
-	background-color: #BF1717;
-	font-family: sans-serif;
-	color: white;
-	font-size: 0.8rem;
-	text-align: center;
-	text-shadow: 0px 0px 1px #cccccc;
-	min-width: 70px;
-	padding: 0.3em 0.5em 0.2em;
-	text-decoration: none;
-	box-shadow: 1px 2px 2px #eba2a2 inset;
-	border-bottom: 4px solid #992727;
-	border-right: 2px solid #992727;
-	border-left: 1px solid #992727;
-	border-top: 1px solid #ac3e3e;
-	-webkit-font-smoothing: antialiased;
-	-moz-osx-font-smoothing: grayscale;
-	text-rendering: optimizeLegibility;
-      }
-
-      p {
-        margin: 1em 0;
-      }
-
-      .home {
-	margin-top: 1em;
-      }
-
-      .home,
-      .content-wrapper {
-        margin-left: 1em;
-      }
-
-      .home img {
-	display: block;
-      }
-
-      .content-title {
-        color: #663333;
-        font-weight: bold;
-        margin-left: 1em;
-      }
-
-      .contact {
-        background-color: #ffcc33;
-        padding: 0.6em;
-	font-size: 0.8rem;
-      }
-
-      footer {
-        color: #cccccc;
-        margin: 3em 0 3em 1em;
-	font-size: 0.8rem;
-      }
-
-      footer hr {
-        margin-bottom: 1em;
-      }
-    </style>
+    <link rel="stylesheet" href="style.css">
   </head>
   <body>
     <header>
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..8681dbe
--- /dev/null
+++ b/style.css
@@ -0,0 +1,80 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: sans-serif;
+  font-size: 14px;
+  line-height: 1.4;
+  max-width: 30em;
+}
+
+header {
+  margin: 1em;
+}
+
+nav {
+  display: flex;
+  align-items: start;
+  justify-content: center;
+}
+
+nav a {
+  background-color: #BF1717;
+  font-family: sans-serif;
+  color: white;
+  font-size: 0.8rem;
+  text-align: center;
+  text-shadow: 0px 0px 1px #cccccc;
+  min-width: 70px;
+  padding: 0.3em 0.5em 0.2em;
+  text-decoration: none;
+  box-shadow: 1px 2px 2px #eba2a2 inset;
+  border-bottom: 4px solid #992727;
+  border-right: 2px solid #992727;
+  border-left: 1px solid #992727;
+  border-top: 1px solid #ac3e3e;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-rendering: optimizeLegibility;
+}
+
+p {
+  margin: 1em 0;
+}
+
+.home {
+  margin-top: 1em;
+}
+
+.home,
+.content-wrapper {
+  margin-left: 1em;
+}
+
+.home img {
+  display: block;
+}
+
+.content-title {
+  color: #663333;
+  font-weight: bold;
+}
+
+.contact {
+  background-color: #ffcc33;
+  padding: 0.6em;
+  font-size: 0.8rem;
+}
+
+footer {
+  color: #cccccc;
+  margin: 3em 0 3em 1em;
+  font-size: 0.8rem;
+}
+
+footer hr {
+  margin-bottom: 1em;
+}
