Media queries for mobile devices

1 files changed, 20 insertions, 1 deletions

diff --git a/css/style.css b/css/style.css
index 825cd04..5b8aeff 100644
--- a/css/style.css
+++ b/css/style.css
@@ -35,7 +35,6 @@ header {
 }
 
 header h1 {
-	font-weight: normal;
 	font-size: inherit;
 	margin: 0;
 }
@@ -90,6 +89,26 @@ footer {
 	text-align: right;
 }
 
+@media screen and (max-width: 700px) {
+	header {
+		flex-direction: column;
+		padding: 1em 0 0 0;
+	}
+	#intro {
+		flex-direction: column;
+		align-items: center;
+	}
+	#face {
+		margin: 1em;
+	}
+}
+
+@media screen and (max-width: 320px) {
+	body {
+		font-size: 16px;
+	}
+}
+
 @font-face {
 	font-family: Alegreya;
 	src: url(../fonts/Alegreya/Alegreya-Regular.ttf);