2018-10-07 18:16:10 +00:00
|
|
|
body {
|
|
|
|
|
background-color: black;
|
|
|
|
|
color: white;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
}
|
|
|
|
|
|
2018-10-08 22:51:57 +00:00
|
|
|
#time-left {
|
|
|
|
|
font-family: monospace;
|
|
|
|
|
font-size: 110px;
|
|
|
|
|
color: grey;
|
|
|
|
|
}
|
|
|
|
|
|
2018-10-07 18:16:10 +00:00
|
|
|
.container {
|
|
|
|
|
max-width: 900px;
|
|
|
|
|
margin-left: auto;
|
|
|
|
|
margin-right: auto;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.quest {
|
|
|
|
|
display: grid;
|
|
|
|
|
grid-template-columns: 64px auto;
|
|
|
|
|
grid-column-gap: 12px;
|
|
|
|
|
margin-top: 36px;
|
|
|
|
|
margin-bottom: 36px;
|
|
|
|
|
|
|
|
|
|
.progress {
|
|
|
|
|
grid-row-start: 1;
|
|
|
|
|
grid-row-end: 4;
|
|
|
|
|
grid-column: 1;
|
|
|
|
|
|
|
|
|
|
i {
|
|
|
|
|
display: block;
|
|
|
|
|
padding-top: 8px;
|
|
|
|
|
font-size: 64px;
|
|
|
|
|
color: yellow;
|
|
|
|
|
|
|
|
|
|
&.todo {
|
|
|
|
|
color: rgba(255, 255, 0, 0.2);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&.done {
|
|
|
|
|
color: rgba(255, 255, 0, 1);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
h2 {
|
|
|
|
|
grid-row: 1;
|
|
|
|
|
grid-column: 2;
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
margin-bottom: 4px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.description {
|
|
|
|
|
grid-row: 2;
|
|
|
|
|
grid-column: 2;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
form {
|
|
|
|
|
grid-row: 3;
|
|
|
|
|
grid-column: 2;
|
|
|
|
|
}
|
|
|
|
|
}
|
