redesign countdown

styles/styles.css

@@ -110,6 +110,11 @@
 	--layout-switch-icon: var(--wide-layout-switch-icon)
 }
 
+@font-face {
+	font-family: doto;
+	src: url("doto.ttf");
+}
+
 html {
 	background-color: var(--bg-color);
 	min-height: calc(100% - 32px);
@@ -209,8 +214,22 @@ header * {
 .countdown {
 	font-family: monospace;
 	font-weight: bold;
-	font-size: 48px;
+	font-size: 2.5em;
 	text-align: center;
+	margin: 1.5em auto;
+	padding: 0 .5em;
+	outline: 1px dotted black;
+	font-family: doto, monospace;
+	background-color: var(--fg-color);
+	color: var(--bg-color);
+	width: fit-content;
+	font-weight: bold;
+}
+
+@media only screen and (min-width: 50rem) {
+	.countdown {
+		font-size: 4em;
+	}
 }
 
 nav {
@@ -302,6 +321,10 @@ figcaption {
 	font-style: italic;
 }
 
+.poster {
+	margin: 0 !important;
+}
+
 nav ul {
 	width: 100%;
 	height: 100%;
@@ -394,4 +417,3 @@ nav ul li a:visited {
 		display: none;
 	}
 }
-