diff --git a/base.css b/base.css
new file mode 100644
index 0000000..5ab032f
--- /dev/null
+++ b/base.css
@@ -0,0 +1,63 @@
+body {
+    font-family: -apple-system, BlinkMacSystemFont,
+            "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji",
+            "Segoe UI Emoji", "Segoe UI Symbol";
+    font-size: 16px;
+    line-height: 1.5;
+    color: #333;
+    background-color: #fff;
+}
+
+#container {
+    border: 2px solid #078311;
+    min-height: 103%;
+}
+
+h1 {
+    background-color: #078311;
+    color: white;
+    font-size: 2.45em;
+    margin: 0;
+    padding: .3em;
+}
+
+h2 {
+    color: #078311;
+    margin-bottom: .5em;
+}
+
+hr {
+    color: #078311;
+}
+
+#menu {
+    background-color: #00C029;
+    padding: .5em;
+    margin-bottom: .5em;
+}
+
+#menu a {
+    text-decoration: none;
+    color: blue
+}
+
+#menu a:hover {
+    text-decoration: underline
+}
+
+#menu a:visited {
+    color: blue
+}
+
+#content {
+    margin: 1em;
+}
+
+li {
+    padding-top: 0.3em;
+}
+
+.logo {
+    float: right;
+}
+
diff --git a/index.html b/index.html
index e2d120a..c2e5d10 100644
--- a/index.html
+++ b/index.html
@@ -2,36 +2,16 @@
       "http://www.w3.org/TR/html4/loose.dtd">
 <html>
 <head>
-  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
-  <title>cx_Oracle</title>
-<style>
-#container {border:2px solid #078311;
-            min-height:103%;
-           }
-h1 {background-color:#078311;
-    color:white;
-    font-size:2.45em;
-    margin:0;
-    padding:.3em;
-   }
-h2 {color:#078311;
-    margin-bottom:.5em;}
-hr {color:#078311;}
-#menu {background-color:#00C029;
-       padding:.5em;
-       margin-bottom:.5em;
-      }
-#menu a{text-decoration:none;color:blue}
-#menu a:hover{text-decoration:underline}
-#menu a:visited{color:blue}
-#content {margin: 1em;}
-li {padding-top: 0.3em;}
-</style>
+    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+    <title>cx_Oracle</title>
+    <link rel="stylesheet" href="base.css" type="text/css"/>
 </head>
 
 <body>
 <div id="container">
-<div id="header"><h1>cx_Oracle</h1></div>
+<div id="header">
+    <h1>cx_Oracle</h1>
+</div>
 <div id="menu">
     <a href="index.html">Home</a> ·
     <a href="http://cx-oracle.readthedocs.io/en/latest/index.html">Documentation</a> ·
@@ -39,6 +19,7 @@ li {padding-top: 0.3em;}
     <a href="http://lists.sourceforge.net/lists/listinfo/cx-oracle-users">Mailing list</a>
 </div>
 <div id="content">
+<img class="logo" src="logo.png"/>
 <div id="description"><h2>About cx_Oracle</h2>
 <!--Description-->
 <strong>cx_Oracle</strong> is a Python extension module that enables access to
@@ -51,8 +32,6 @@ This module is currently built against Oracle 11.2 and 12.1 and Python 2.7,
 <div id="downloads">
 <h2>Download/Install</h2>
 
-<a href="http://sourceforge.net" style="float:right;"><img src="http://sflogo.sourceforge.net/sflogo.php?group_id=84168&amp;type=2" width="125" height="37" border="0" alt="SourceForge.net Logo" /></a>
-
 <p>Version 5.2.1, released January 18, 2016</p>
 
 <p>Install by issuing the command <pre>pip install cx_Oracle</pre> (on platforms other than Windows) or download directly from <a href="https://pypi.python.org/pypi/cx_Oracle/5.2.1">PyPI</a>.</p>
diff --git a/logo.png b/logo.png
new file mode 100644
index 0000000..6d77e80
Binary files /dev/null and b/logo.png differ
