2020-03-22 00:18:19 +00:00
|
|
|
body {
|
2020-03-22 21:15:31 +00:00
|
|
|
font-family: sans-serif;
|
|
|
|
color: black;
|
2020-03-22 00:18:19 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.grid-lg, .grid-sm {
|
|
|
|
display: grid;
|
|
|
|
grid-template-columns: repeat(5, 1fr);
|
|
|
|
grid-template-rows: repeat(5, 2fr);
|
|
|
|
grid-column-gap: 5px;
|
|
|
|
grid-row-gap: 5px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.grid-lg a {
|
|
|
|
display: flex;
|
|
|
|
padding: 10vh;
|
|
|
|
justify-content: center;
|
|
|
|
background-color: black;
|
|
|
|
font-size: 32px;
|
|
|
|
font-weight: bold;
|
|
|
|
text-decoration: none;
|
|
|
|
transition: background-color 0.5s;
|
|
|
|
}
|
|
|
|
|
|
|
|
.grid-sm a {
|
|
|
|
display: flex;
|
|
|
|
padding: 2vh;
|
|
|
|
justify-content: center;
|
|
|
|
background-color: black;
|
|
|
|
font-size: 24px;
|
|
|
|
font-weight: bold;
|
|
|
|
text-decoration: none;
|
|
|
|
transition: background-color 0.5s;
|
|
|
|
}
|
|
|
|
|
|
|
|
.grid-lg a:visited, .grid-lg a,
|
|
|
|
.grid-sm a:visited, .grid-sm a {
|
|
|
|
color: white;
|
|
|
|
}
|
|
|
|
.grid-lg a:hover,
|
|
|
|
.grid-sm a:hover {
|
|
|
|
color: white;
|
|
|
|
background-color: darkgray;
|
|
|
|
transition: background-color 0.5s;
|
2020-03-22 21:15:31 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
|
|
body { background-color: black; color: white; }
|
|
|
|
.grid-lg a, .grid-sm a {
|
|
|
|
background-color: white;
|
|
|
|
color: black;
|
|
|
|
}
|
|
|
|
.grid-lg a:visited, .grid-lg a,
|
|
|
|
.grid-sm a:visited, .grid-sm a {
|
|
|
|
color: black
|
|
|
|
}
|
|
|
|
.grid-lg a:hover,
|
|
|
|
.grid-sm a:hover {
|
|
|
|
color: lightgray;
|
|
|
|
background-color: darkgray;
|
|
|
|
transition: background-color 0.5s;
|
|
|
|
}
|
2020-03-22 00:18:19 +00:00
|
|
|
}
|