115 lines
1.9 KiB
CSS
115 lines
1.9 KiB
CSS
body {
|
|
font-family: monospace;
|
|
margin: 0;
|
|
background: #080e08;
|
|
color: #f6f6f6;
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
h1, h2 {
|
|
color: #4af626;
|
|
}
|
|
|
|
footer {
|
|
padding: 10px;
|
|
max-width: 800px;
|
|
width: 100%;
|
|
background: #3a7920;
|
|
color: #f6f6f6;
|
|
|
|
margin: auto auto 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
a:link {
|
|
color: #2cacb0;
|
|
}
|
|
|
|
a:visited {
|
|
color: #b4778f;
|
|
}
|
|
@media (prefers-color-scheme: light) {
|
|
body {
|
|
background: #fcfffc;
|
|
color: #211c1b;
|
|
}
|
|
|
|
h1, h2 {
|
|
color: #4c982a;
|
|
}
|
|
|
|
a:link {
|
|
color: #1f7b7e;
|
|
}
|
|
|
|
a:visited {
|
|
color: #7c5263;
|
|
}
|
|
}
|
|
|
|
header {
|
|
background: linear-gradient(
|
|
90deg,
|
|
rgba(255, 0, 0, 1) 0%,
|
|
rgba(255, 154, 0, 1) 10%,
|
|
rgba(208, 222, 33, 1) 20%,
|
|
rgba(79, 220, 74, 1) 30%,
|
|
rgba(63, 218, 216, 1) 40%,
|
|
rgba(47, 201, 226, 1) 50%,
|
|
rgba(28, 127, 238, 1) 60%,
|
|
rgba(95, 21, 242, 1) 70%,
|
|
rgba(186, 12, 248, 1) 80%,
|
|
rgba(251, 7, 217, 1) 90%,
|
|
rgba(255, 0, 0, 1) 100%
|
|
);
|
|
min-height: 50px;
|
|
display: flex;
|
|
color: black;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#header-content {
|
|
max-width: 800px;
|
|
margin: auto;
|
|
width: 100%;
|
|
align-content: center;
|
|
flex-direction: row;
|
|
display: flex;
|
|
padding: 10px;
|
|
}
|
|
#header-content h1 {
|
|
color: black;
|
|
margin: auto auto auto 1rem;
|
|
}
|
|
|
|
#header-content img {
|
|
display: inline;
|
|
}
|
|
|
|
main {
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
padding: 10px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
|
|
span.copyleft {
|
|
display: inline-block;
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
footer a:link, footer a:visited {
|
|
text-decoration: none;
|
|
font-weight: bold;
|
|
color: white;
|
|
}
|
|
|
|
footer a:hover {
|
|
text-decoration: underline;
|
|
}
|