pngs/quiz.css

207 lines
2.7 KiB
CSS
Raw Normal View History

2010-09-16 18:32:35 +02:00
body {
margin: 0 auto;
color: white;
background-color: #20203f;
text-align: center;
font-size: 200%;
font-family: sans-serif;
}
ul {
list-style-type: none;
margin: 0;
}
li {
display: inline-block;
}
p {
margin: 0;
padding: 0;
}
2011-04-23 21:41:26 +02:00
#game {
margin-top: 1em;
}
2010-09-16 18:32:35 +02:00
#players {
margin-bottom: 2em;
}
#players li {
margin: 0 0.5em;
}
#players li span {
margin: 0 0.2em;
}
2011-04-23 21:41:26 +02:00
#players .name {
color: #ddd;
2010-09-16 18:32:35 +02:00
}
2011-04-23 19:09:29 +02:00
#players .score {
font-size: 88%;
color: #fff;
2010-09-16 18:32:35 +02:00
}
.active {
color: white;
font-weight: bold;
}
#tier {
2011-04-23 19:09:29 +02:00
color: #ddd;
2010-09-16 18:32:35 +02:00
font-weight: bold;
2010-12-27 18:08:24 +01:00
font-size: 150%;
2011-04-23 19:09:29 +02:00
font-familiy: sans-serif;
2010-09-16 18:32:35 +02:00
}
#question {
2010-12-27 15:56:24 +01:00
font-size: 250%;
2011-04-23 21:41:26 +02:00
max-width: 80%;
2010-09-16 18:32:35 +02:00
margin: 0 auto;
}
2011-04-23 21:41:26 +02:00
#question p.size1 {
font-size: 50%;
}
#question p.size2 {
font-size: 100%;
}
#question p.size3 {
font-size: 200%;
}
2011-04-23 19:09:29 +02:00
#question img {
display: inline;
}
#question p {
margin: 5px 40px 30px 40px;
}
2010-12-10 18:53:59 +01:00
#nedap .url {
text-decoration: underline;
color: white;
font-weight: bold;
font-size: 200%;
}
2010-12-10 22:04:17 +01:00
#irc ul {
list-style-type: none;
font-family: monospace;
font-size: 150%;
text-align: left;
width: 40em;
}
2010-09-16 18:32:35 +02:00
#answers {
position: absolute;
2011-04-23 21:41:26 +02:00
bottom: 1em;
2010-09-16 18:32:35 +02:00
width: 100%;
}
#answers ul {
margin: 0.5em 0.5em;
text-align: center;
}
2011-04-23 19:09:29 +02:00
#answers ul li {
color: #ddd;
2011-04-23 21:41:26 +02:00
width: 40%;
2010-09-16 18:32:35 +02:00
padding: 0.1em 0.5em;
2011-04-23 19:09:29 +02:00
border: 0.15em solid #ddd;
border-radius: 0.85em 0.85em 1em 1em;
2011-04-23 21:41:26 +02:00
font-size: 125%;
}
#answers ul li.size1 {
font-size: 85%;
}
#answers ul li.size2 {
font-size: 125%;
}
#answers ul li.size3 {
font-size: 150%;
2010-09-16 18:32:35 +02:00
}
2011-04-23 19:09:29 +02:00
#answers ul li.selected {
2010-09-16 18:32:35 +02:00
background-color: #ff9600;
color: black;
}
2011-04-23 19:09:29 +02:00
#answers ul li.right {
2010-09-16 18:32:35 +02:00
background-color: #06ff00;
color: black;
}
2011-04-23 19:09:29 +02:00
#answers ul li.wrong {
background-color: #ff0600;
2010-09-21 02:07:34 +02:00
color: white;
2010-09-16 18:32:35 +02:00
}
2010-09-19 23:36:53 +02:00
form {
background-color: #30304f;
padding: 1em 0;
}
form label {
margin-right: 1em;
}
input {
color: white;
background-color: #00003f;
font-size: 100%;
2011-04-23 21:41:26 +02:00
margin: 2px 0px;
}
input#start {
margin-top: 1em;
width: 4em;
2010-09-19 23:36:53 +02:00
}
ul#tiers {
text-align: right;
float: right;
margin: 2em auto;
2011-04-23 21:41:26 +02:00
padding-right: 1em;
2010-09-19 23:36:53 +02:00
}
2011-04-23 21:41:26 +02:00
2010-09-19 23:36:53 +02:00
ul#tiers li {
display: list-item;
2010-10-16 17:19:52 +02:00
color: #777;
}
2011-04-23 21:41:26 +02:00
2010-10-16 17:19:52 +02:00
ul#tiers li.done {
font-weight: bold;
color: white;
2010-09-19 23:36:53 +02:00
}
#scoreboard dl {
width: 20em;
text-align: left;
margin: 1em auto;
2011-04-23 19:09:29 +02:00
font-size: 175%;
2010-09-19 23:36:53 +02:00
}
#scoreboard dl dd {
margin-left: 4em;
2011-04-23 19:09:29 +02:00
margin-bottom: 0.65em;
2010-10-16 02:45:16 +02:00
}
2011-04-23 19:09:29 +02:00
#scoreboard dl dd .score {
font-size: 125%;
color: #fff;
}
2010-10-16 02:45:16 +02:00
#scoreboard dl dd img {
margin-left: 0.5em;
2010-11-30 21:01:33 +01:00
}
#timer {
position: absolute;
2010-11-30 21:05:56 +01:00
top: 0;
2010-11-30 21:01:33 +01:00
right: 0;
2011-04-23 21:41:26 +02:00
margin: 0.2em 0.2em;
2011-04-23 19:09:29 +02:00
padding: 0px;
2010-11-30 21:01:33 +01:00
width: 1.6em;
2011-04-23 19:09:29 +02:00
border: 0.1em solid #ddd;
border-radius: 0.25em 0.25em 0.35em 0.35em;
2010-11-30 21:01:33 +01:00
font-weight: bold;
font-size: 300%;
text-align: center;
}
.elapsed#timer {
border-color: red;
2010-09-19 23:36:53 +02:00
}