1 files changed, 104 insertions, 0 deletions
diff --git a/source/css/theme.css b/source/css/theme.css
index 01b666d4..9b43397f 100644
--- a/source/css/theme.css
+++ b/source/css/theme.css
@@ -1,3 +1,19 @@
+/*** Webfonts ***/
+
+/* icon font from fontello */
+@font-face {
+  font-family: 'fontello';
+  src: url('../fonts/fontello.eot');
+  src: url('../fonts/fontello.eot?#iefix') format('embedded-opentype'),
+       url('../fonts/fontello.woff') format('woff'),
+       url('../fonts/fontello.ttf') format('truetype'),
+       url('../fonts/fontello.svg#fontello') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+
+/*** Main theme ***/
+
 body {
     color: #000;
     font-family: Times, "Times New Roman",
@@ -275,3 +291,91 @@ noscript a {
     font-family: fontello;
     font-size: 95%;
 }
+
+/*** Wide screen ***/
+
+@media screen and (min-width: 1441px) {
+    .content, .content-separator, .footer {
+        width: 50%;
+    }
+}
+
+/*** Narrow screen ***/
+
+@media screen and (max-width: 1023px) {
+    body {
+        margin: 40px 0 100px 0;
+    }
+
+    .nav {
+        position: static;
+        width: 100%;
+        height: 150px;
+        margin: 20px 0;
+    }
+
+    .nav-icon {
+        width: 150px;
+        height: 150px;
+        line-height: 150px;
+    }
+
+    .nav-icon:before {
+        font-size: 54px;
+    }
+
+    .nav-title, .nav-author {
+        height: 0;
+        width: 0;
+        visibility: hidden;
+        pointer-events: none;
+    }
+
+    .content, .content-separator, .footer {
+        width: 80%;
+    }
+}
+
+/*** Ultranarrow screen ***/
+
+@media screen and (max-width: 500px) {
+    .content, .content-separator, .footer {
+        width: 90%;
+    }
+
+    .blog-index-yearly-index {
+        margin-left: 0;
+    }
+
+    .blog-index-post-date {
+        width: 4em;
+    }
+}
+
+/*** Print ***/
+
+@media print {
+    body {
+        margin: 5% 0;
+        font-size: 12px;
+    }
+
+    sup {
+        font-size: 0.5em;
+        top: -1em;
+    }
+
+    pre {
+        -webkit-print-color-adjust: exact;
+    }
+
+    .content, .content-separator, .footer {
+        width: 90%;
+    }
+
+    .nav, .rss-icon, .atom-icon, .cc-icon {
+        width: 0;
+        height: 0;
+        visibility: hidden;
+    }
+}