/* general styles */

code, tt {font-family: monospace;}
hr {display: none;}

/* main page style */

h4 {margin-bottom: 0.125em;}
ul {margin-top: 0;}
p#credits {font-style: italic; text-align: right; margin-bottom: 0.25em; margin-top: 1em;}
div#copyright {text-align: right; margin-top: 0.25em; font-size: smaller;}

/* title styles */

h1 {margin-bottom: 0; font-size: 300%;}
h1 span {font: bold 1em sans-serif; letter-spacing: 0.1em; text-transform: lowercase; background: #FFB; border: 1px solid navy; border-width: 1px 0;}
span#one {border-width: 1px 0 1px 1px; padding-left: 0.5em;}
span#two {background: #FF6;}
span#three {border-width: 1px 1px 1px 0; padding-right: 0.5em;}

p#leadin {margin: 0.25em 1.5em; font: italic 1em sans-serif;}

/* input form style */

h3 {margin: 0; background: #CCC; color: black; font-family: sans-serif;}
form h3 {background: white; margin-top: 1em;}
form h3 span {background: #CCC; padding: 0 0.66em 0 0.33em; border: 1px solid gray;}
form {padding: 0 1em; margin: 2em 0;}
textarea, input[type="text"] {font-family: monospace; width: 99%; background: #FFFFF6; margin: 0;}
form, div#results {border: 3px solid #CCC;}
div#submit {margin: 1em 0 0 0; background: #DDD; text-align: center;}

/* output styles */

div.selector {margin: 0; padding: 0.5em; border-top: 1px solid #999; background: #F4F4F4; font-weight: bold;}
div.selector span.pprint {font-family: monospace; font-weight: normal;}
div#results p {margin-left: 2em; margin-bottom: 0;}
div#results ul {margin-left: 4em; margin-top: 0;}

p.translation, p.warning {margin-left: 2em; margin-right: 0.5em; margin-top: 0.33em; line-height: 1.33em;}
span.combinator {font-style: italic; padding: 0 0.25em;}
span.element-name {font-weight: bold;}
span.element-name code {background: #FFC; padding: 0 0.25em;}
span.pseudo-cl, span.pseudo-el {color: maroon;}

span.or-clause {display: block; margin: 0 1em; padding: 0.25em; font-weight: bold; font-style: italic; letter-spacing: 1px;}

p.warning {color: red; font-weight: bold; margin-top: 0.25em; margin-bottom: 0;}

p.timer {margin-top: 0; background: #CCC; text-align: right; padding-right: 5px; font-size: smaller;}