Fix issues with startpage

startpage/style.css

@@ -43,27 +43,30 @@
 	--outline: var(--blue);
 }
 
-body {
+html {
-	background: var(--bg1);
+	background: var(--bg1) !important;
 	color: var(--fg0);
 	font-size: 1.5em;
-	display: flex;
+  min-height: 100vh;
-	align-items: center;
-	justify-content: center;
-	height: 100vh;
-	margin: 0;
 }
 
-#content {
+body {
-	width: 40em;
+  background: transparent;
-  max-height: 100vh;
+  min-height: 100vh;
   margin: 1em;
+  display: flex;
+}
+
+#content {
+	width: min(40em, 100%);
+  height: 100%;
+  margin: auto;
 }
 
 #cards {
 	display: grid;
-	gap: 1rem;
+	gap: 0.75rem;
-	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
+	grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
 	grid-auto-rows: 1fr;
 }
 
@@ -75,12 +78,12 @@ body {
   grid-column: 1 / 1;
 }
 
-#cards > *:first-child{
+#cards > :first-child{
   grid-row: 1 / 1;
   grid-column: 1 / 1;
 }
 
-#cards > * {
+#cards > a {
 	color: inherit;
 	text-decoration: none;
 	display: flex;
@@ -94,22 +97,22 @@ body {
   transition: 0.25s transform;
 }
 
-#cards > * > * {
+#cards > a > * {
   color: white;
   display: inline;
 	height: 1em;
 }
 
-#cards > :hover, #cards > :focus {
+#cards > a:hover, #cards > a:focus {
 	outline-width: 2px;
 	outline-color: var(--outline);
 }
 
-#cards > :focus {
+#cards > a:focus {
   background: var(--highlight);
   transform: translateY(-0.25rem);
 }
 
-#cards > :hover *, #cards > :focus * {
+#cards > a:hover *, #cards > a:focus * {
 	font-size: 1.0625em;
 }