diff --git a/kioslave/info/kio_docfilter.css b/kioslave/info/kio_docfilter.css
new file mode 100644
index 00000000..6980f8c7
--- /dev/null
+++ b/kioslave/info/kio_docfilter.css
@@ -0,0 +1,96 @@
+/*
+ * This is the common CSS styling for the various documentation filter
+ * KIO Slaves (incl. kio_man, kio_info, kio_perldoc, etc.)
+ *
+ * It is designed to mimic the look of the kde.org website (although the css
+ * for the website has since drifted itself...)
+ *
+ * Unfortunately at this point to get the proper effect you cannot use XHTML
+ * STRICT (as was used in kio_info).
+ */
+
+body {
+    /* If you specify a background color you should also specify a regular color */
+    background-color: white;
+    color: black;
+    padding: 0px;
+}
+
+#header {
+    width: 100%;
+    color: #535353;
+    background: #eeeeee;
+    border-bottom: #bcbcbc 1px solid;
+}
+
+#header_top {
+    margin: 0 auto;
+    padding: 0;
+    width: 60em;
+    min-width: 770px;
+    max-width: 45em;
+    vertical-align: middle;
+    color: #ffffff;
+    background-repeat: repeat-x;
+    background-position: bottom;
+    background-color: #0057ae;
+}
+
+/*
+ * The header_top div div stuff seems to automatically setup the images but
+ * I'm not sure that it's actually any better than just manually creating a
+ * sequences of non-nested divs and setting an image that way.
+ */
+#header_top div {
+    margin: 0 auto;
+    padding: 0;
+    background-repeat: no-repeat;
+    background-position: bottom left;
+}
+
+#header_top div div {
+    margin: 0 auto;
+    padding: 0;
+    vertical-align: middle;
+    text-align: left;
+    font-size: 1.7em;
+    font-weight: bold;
+    background-repeat: no-repeat;
+    background-position: bottom right;
+}
+
+/*
+ * If the generated HTML does not use an <img> tag in the div div header
+ * sequence then the text will be aligned wrong due to the missing margin
+ * provided by the image.
+ */
+#header_top div div img {
+    margin:8px 0px 9px 18px;
+    vertical-align: middle;
+}
+
+#header_bottom {
+    margin: 0 auto;
+    padding: 0.1em 0em 0.3em 0;
+    width: 60em;
+    min-width: 770px;
+    max-width: 45em;
+    vertical-align: middle;
+    text-align: right;
+    background: #eeeeee;
+}
+
+/* Used for the text and footer area at the bottom. */
+#footer {
+    width: 100%;
+    background-color: #eeeeee;
+    padding-top: 12pt;
+    padding-bottom: 12pt;
+    border-top: #bcbcbc 1px solid;
+    margin-top: 12pt;
+}
+
+#footer_text {
+    text-align:center;
+    vertical-align: middle;
+}