media query for phones

public/app.css

@@ -12,17 +12,23 @@ th {
 tbody tr:nth-child(even) td{
 	background:#eeeeee;
 }
-main {
-	height:100vh;
-	display:grid;
-	grid-template-columns: minmax(10px, 1fr), minmax(10px, 2fr), minmax(10px, 2fr);
-	grid-template-rows: repeat(2, minmax(10px, 1fr));
-}
-section {
-	overflow:auto;
-}
 
-#timer { grid-area: 1 / 1 / 3 / 2; }
+@media (min-width: 900px){
-#summary { grid-area: 1 / 2 / 3 / 3; }
+
-#category { grid-area: 1 / 3 / 2 / 4; }
+	main {
-#songs { grid-area: 2 / 3 / 3 / 4; }
+		height:100vh;
+		display:grid;
+		grid-template-columns: minmax(10px, 1fr), minmax(10px, 2fr), minmax(10px, 2fr);
+		grid-template-rows: repeat(2, minmax(10px, 1fr));
+	}
+
+	section {
+		overflow:auto;
+	}
+
+	#timer { grid-area: 1 / 1 / 3 / 2; }
+	#summary { grid-area: 1 / 2 / 3 / 3; }
+	#category { grid-area: 1 / 3 / 2 / 4; }
+	#songs { grid-area: 2 / 3 / 3 / 4; }
+
+}