diff --git a/r2/r2/public/static/lesswrong.css b/r2/r2/public/static/lesswrong.css
index 99cd78ef..5161c4ea 100644
--- a/r2/r2/public/static/lesswrong.css
+++ b/r2/r2/public/static/lesswrong.css
@@ -582,3 +582,93 @@ div.meta.meetup strong {
-khtml-border-radius: 4px;
border-radius: 4px;
}
+
+/* Mobile version. This overrides styles for small screens, and so needs to stay at the
+ end of the CSS. */
+@media only screen and (max-width: 750px) {
+ #header { zoom: 0.75 }
+ #sidebar {
+ width: auto;
+ float: none;
+ }
+ #side-search {
+ display: none;
+ }
+ ul#rightnav {
+ margin-top: 15px;
+ }
+ #side-login label {
+ width: 150px;
+ }
+ #side-login #recover {
+ float: none;
+ margin-left: 30px;
+ }
+ #wrapper {
+ width: 750px;
+ }
+ #content .post .post-body h2 {
+ padding-left: 34px;
+ }
+ #content .post .post-body {
+ margin-left: 5px;
+ margin-right: 5px;
+ }
+ #content .list .meta .votes {
+ margin-top: 4px;
+ }
+ #content .list h2 {
+ padding-left: 10px;
+ }
+ #content {
+ width: 690px;
+ word-wrap: break-word;
+ }
+ #comments {
+ margin-left: 5px;
+ }
+ html * {max-height:1000000px;}
+
+ /* to keep from making things look giant on tablets and narrow
+ desktop screens, only make fonts bigger if the device-width is low.
+ Phones will have a device-width of under 450px, while tablets will
+ have a device width of over 600px, so this pulls them apart pretty
+ well */
+ @media only screen and (max-device-width: 550px) {
+ #content .post .post-body .content .md {
+ font-size: 32px;
+ }
+ .md { font-size: 32px; }
+ .md h2 { font-size: 36px; }
+ .md h3 { font-size: 34px; }
+ .md h4 { font-size: 32px; }
+ ul#nav li {
+ font-size: 20px;
+ }
+ div.post div.postedby {
+ font-size: 24px;
+ line-height: 26px;
+ }
+ #content .post .post-body .post-comment-count a {
+ font-size: 24px;
+ }
+ div.footer {
+ font-size: 18px;
+ }
+ div.comment-meta span {
+ font-size: 32px;
+ }
+ #wrapper {
+ font-size: 20px;
+ }
+ #comments h2 {
+ font-size: 28px;
+ }
+ #comment-controls div.filter-inactive, #comment-controls div.filter-active {
+ font-size: 18px;
+ }
+ .comment-links {
+ zoom: 2;
+ }
+ }
+}
diff --git a/r2/r2/templates/base.html b/r2/r2/templates/base.html
index 04a1a6c5..87deed92 100644
--- a/r2/r2/templates/base.html
+++ b/r2/r2/templates/base.html
@@ -30,6 +30,12 @@
${self.Title()}
+
+
<% description = hasattr(thing, 'link') and thing.link._meta_description() %>