media query for phones

public/app.css

@@ -12,17 +12,23 @@ th {
 tbody tr:nth-child(even) td{
 	background:#eeeeee;
 }
-main {
+
+@media (min-width: 900px){
+
+	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 {
+
+	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; }
 
-#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; }