diff --git a/ssmain/jinja2/ssmain/base.html b/ssmain/jinja2/ssmain/base.html
index 3158ea1..4f9fdc7 100644
--- a/ssmain/jinja2/ssmain/base.html
+++ b/ssmain/jinja2/ssmain/base.html
@@ -21,46 +21,20 @@
 {% block head %}
 	{{ super() }}
 	
-	<style type="text/css">
-		.masthead.segment {
-			{% if request.resolver_match.view_name == 'index' %}
+	<link rel="stylesheet" type="text/css" href="{{ static('ssmain/main.css') }}">
+	
+	{% if request.resolver_match.view_name == 'index' %}
+		<style type="text/css">
+			.masthead.segment {
 				min-height: 700px;
-			{% endif %}
-			padding: 1em 0em;
-		}
-		.masthead h1.ui.header {
-			{% if request.resolver_match.view_name == 'index' %}
+			}
+			
+			.masthead h1.ui.header {
 				margin-top: 3em;
 				margin-bottom: 0em;
-			{% else %}
-				margin-top: 0.5em;
-				margin-bottom: 0.5em;
-			{% endif %}
-			font-size: 4em;
-			font-weight: normal;
-		}
-		
-		.ui.vertical.stripe {
-			padding: 8em 0em;
-		}
-		
-		.footer.segment {
-			padding: 5em 0em;
-		}
-		
-		.ui.card .description {
-			line-height: 1.5;
-		}
-		
-		textarea {
-			font-family: Lato,'Helvetica Neue',Arial,Helvetica,sans-serif;
-		}
-		
-		/* Fix nested selectable tables */
-		.ui.table.selectable tr > td.selectable:hover {
-			background: initial !important;
-		}
-	</style>
+			}
+		</style>
+	{% endif %}
 {% endblock %}
 
 {% block body %}
diff --git a/ssmain/jinja2/ssmain/semantic_base.html b/ssmain/jinja2/ssmain/semantic_base.html
index 58b2023..0b036be 100644
--- a/ssmain/jinja2/ssmain/semantic_base.html
+++ b/ssmain/jinja2/ssmain/semantic_base.html
@@ -38,4 +38,4 @@
 			<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.3.2/dist/semantic.min.js" integrity="sha256-/P4bJXh+K+kZ7M5aKUKxAcvN8105oYfKkQ2cgwVZ8r4=" crossorigin="anonymous"></script>
 		{% endblock %}
 	</body>
-</html>
\ No newline at end of file
+</html>
diff --git a/ssmain/static/ssmain/main.css b/ssmain/static/ssmain/main.css
new file mode 100644
index 0000000..6cb5eb4
--- /dev/null
+++ b/ssmain/static/ssmain/main.css
@@ -0,0 +1,71 @@
+/*
+    Society Self-Service
+    Copyright © 2018-2019  Yingtong Li (RunasSudo)
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+.masthead.segment {
+	padding: 1em 0em;
+}
+.masthead h1.ui.header {
+	margin-top: 0.5em;
+	margin-bottom: 0.5em;
+	font-size: 4em;
+	font-weight: normal;
+}
+
+.ui.vertical.stripe {
+	padding: 8em 0em;
+}
+
+.footer.segment {
+	padding: 5em 0em;
+}
+
+.ui.card .description {
+	line-height: 1.5;
+}
+
+textarea {
+	font-family: Lato,'Helvetica Neue',Arial,Helvetica,sans-serif;
+}
+
+/* Fix nested selectable tables */
+.ui.table.selectable tr > td.selectable:hover {
+	background: initial !important;
+}
+
+@media print {
+	.ui.container > .ui.grid {
+		display: block; /* Firefox doesn't like printing flex */
+	}
+	
+	.ui.container > .ui.grid > [class*="four wide column"] {
+		display: none;
+	}
+	
+	.ui.container > .ui.grid > [class*="twelve wide column"] {
+		display: block;
+		width: 100% !important;
+	}
+	
+	.masthead.segment {
+		display: none;
+	}
+	
+	.ui.vertical.stripe {
+		padding: 0;
+	}
+}