background-color: #000;
color: #DDD;
}
+
+input.tabhandle { display: none; }
+.tabcontent { display: none; }
+input.tabhandle:checked ~ .tabcontent { display: inline-block; }
+
a {
color: #EEE;
}
padding-top: .125em;
}
-.panel .filter, .panel .quicklinks,
+.panel .quicklinks,
.footer .newtag, .footer input[type=submit] {
display: inline-block;
vertical-align: top;
.panel .help {
display: block;
}
-.panel .filter select, .panel .filter .help,
.footer .newtag select, .footer .newtag .label{
display: block;
width: 10em;
display: block
}
+.panel .filter {
+ vertical-align: top;
+ border: solid 1px; border-radius: .25em;
+ padding: .25em .5em;
+ margin: 0 0 1em 0;
+}
+.panel > label.tabhandle {
+ display: inline-block;
+ text-align: right;
+ width: 4em;
+ margin-left: 4em;
+}
+.panel > .tabhandle + label { display: none; }
+.panel > .tabhandle + label + .tabcontent { display: none; }
+.panel > .tabhandle:checked + label.tabhandle + .tabcontent { display: inline-block; }
+.panel > .tabhandle:checked + label.tabhandle + .tabcontent + .tabhandle + label{ display: inline-block; }
+.panel > .tabhandle:checked + label.tabhandle + .tabcontent + .tabhandle:checked + label{ display: none; }
+.panel .filter .tabcontainer {
+ position: relative;
+ width: 16em;
+}
+.panel .filter .category.tabhandle {
+ display: block;
+}
+.panel .filter input:checked + .category.tabhandle {
+ background: #FFF;
+ color: #000;
+}
+.panel .filter .category.tabcontent {
+ position: absolute;
+ top: 0; right: 0;
+ width: 10em;
+ height: 100%;
+ min-height: 4em;
+}
+
+.panel .filter.final {
+ display: inline-block;
+ width: 16em;
+ margin-left: 1em;
+}
+
#thumblist {
width: 100%;
padding: .5em 0 3em 0;
margin-top: .3em;
}
+#tagger { display: none; }
+#tagger:target { display: block; }
.footer {
position: fixed;
min-height: 2em;
bottom: 0px;
+ width: 100%;
border-style: solid none none none;
}
display: block;
}
#videoview .videoinfo {
- display: inline-block;
width: 39%;
margin-top: 2em;
}
#videoview .videoinfo h2 {
display: inline;
}
-#videoview .videoinfo a.meta:after {
+#videoview .videoinfo .meta:after {
content: "\A";
white-space: pre;
}