html, body,
h1, h2 {
	margin: 0;
	padding: 0;
}

h3 {
	margin-top: 2pt;
	margin-bottom: 2pt;
}

ul {
	margin: 1ex;
	margin-left: 1.5em;
	padding: 0;
}

hr {
	border-style: none;
	color: #cccccc;
	background-color: #cccccc;
	height: 1px;
}

div.header {
	position: fixed;
	height: 4em;
	background-color: white;
	width: 100%;
	margin: 0;
	padding: 0.5ex;
	border-bottom: 1px solid black;
	top: 0;
	left: 0;
	z-index: 1;
}

div.header h1 {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

div.main {
	margin-top: 5em;
	margin-left: 1ex;
	margin-right: 1ex;
	margin-bottom: 1ex;
}

div.main a[name] {
	display: block;
	position: relative;
	top: -5em;
}

div.outset {
	padding: 1ex;
	margin-top: 1ex;
	margin-bottom: 1ex;
}

div.inset {
	background-color: white;
	margin-top: 1ex;
	margin-bottom: 1ex;
	padding: 0.5ex;
}

div.indent {
	margin-left: 1em;
}

div.methods {
	background-color: #fcaf3e;
}

div.method {
	border: 1px solid #f57900;
}

div.signals {
	background-color: #729fcf;
}

div.signal {
	border: 1px solid #3465a4;
}

div.properties {
	background-color: #ad7fa8;
}

div.property {
	border: 1px solid #75507b;
}

div.tpproperties {
	background-color: #999999;
}

div.tpproperty {
	border: 1px solid #333333;
}

div.contact-attributes {
	background-color: #ccccff;
	border: 1px solid #9999cc;
}

div.contact-attribute {
	border: 1px solid #9999cc;
}

div.handler-capability-tokens {
	background-color: #339933;
	border: 1px solid #228822;
}

div.handler-capability-token {
	border: 1px solid #228822;
}

div.client-interests {
	background-color: #729fcf;
}

div.client-interest {
	border: 1px solid #204a87;
}

div.types {
	background-color: #e9b96e;
}

div.type {
	border: 1px solid #c17d11;
}

div.errors {
	background-color: #ef2929;
}

div.error {
	border: 1px solid #cc0000;
}

div.access {
	font-weight: bold;
	margin-left: 1ex;
}

div.summary, div.legal {
	padding: 0.5ex;
	background-color: #eeeeec;
	border: 1px solid #d3d7cf;
}

div.legal ul {
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}

table.summary {
	margin: 1ex;
	font-size: small;
}

table.summary td {
	padding-right: 1ex;
}

li.chapter {
	margin-top: 1ex;
	font-weight: bold;
}

li.causes-havoc {
	font-style: italic;
}

li.deprecated,
li.deprecated a,
table.summary tr.deprecated td,
table.summary tr.deprecated td a {
	color: gray;
}

div.requires,
div.docstring {
	margin: 1ex;
}

div.annotation {
	border-left: 2px solid;
	margin: 1ex;
	padding-left: 1ex;
}

div.annotation span.version, span.warning, span.note {
	font-weight: bold;
}

div.added {
	border-left-color: #4e9a06;
}

div.added span.version {
	color: #4e9a06;
}

div.changed {
	border-left-color: #8f5902;
}

div.changed span.version {
	color: #8f5902;
}

div.deprecated,
div.havoc {
	border-left-color: #a40000;
}

div.deprecated span.version,
div.deprecated.no-version,
span.warning {
	color: #a40000;
}

div.connection-parameter {
	border-left-color: #0000a4;
}

div.connection-parameter .note {
	color: #0000a4;
}

div.emits-changed {
	border-left-color: #17BBC3;
}

div.immutable {
	border-left-color: #02598f;
}

div.no-reply {
	border-left-color: #9C11A1;
}

div.requestable {
	border-left-color: #598f02;
}

div.rationale {
	border: 1px solid gray;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin: 1ex;
	padding: 0 1ex;
}

div.rationale h5 {
        /* This'll be un-done if we have Javascript; it's just clutter unless
         * we have Javascript, in which case it acts as the thing for
         * expanding/collapsing rationales.
         */
        display: none;

        /* And all this only matters if the script has un-hidden us. */
        margin: 0;
        text-height: 12px;
        cursor: pointer;
}

/* The class names used for the expander icons, and the technique of using a
 * fixed-size background image, offset into a grid of icons, is pinched from
 * jQuery-UI, along with the icon grid itself. But I only use a 10×10 square
 * out of the 16×16 icons, and didn't use their CSS, because jQuery-UI was
 * overkill here.
 */
span.ui-icon {
        text-decoration: none;
        display: inline-block;
        width: 10px;
        height: 10px;
        margin-right: 0.5em;
        background-image: url(ui-icons_222222_256x240.png);
        background-repeat: no-repeat;
}

span.ui-icon-triangle-1-e {
        background-position:-35px -19px;
}

span.ui-icon-triangle-1-s {
        background-position:-67px -19px;
}

span.permalink {
	font-size: x-small;
}

div.inset span.permalink {
	float: right;
}

li.chapter span.permalink {
	font-weight: normal;
}

/* These rules make putting <p/> into <dd/> not leave ugly whitespace at the
 * top and bottom of the <dd>, which looks particularly stupid when some <dd>s
 * have <p>s in them and some just have text.
 */
p {
	margin: 0.5em 0 0 0;
}

p:first-child {
	margin-top: 0;
}

/* And since we use <pre>s pretty much only for paragraphs of code, we should
 * style it the same.
 */
pre {
	margin: 0.5em 0 0 0;
}

.docstring table {
        border: 1px solid #d3d7cf;
        background-color: #eeeeec;
        margin: 0.5em 0 0 0;
        border-collapse: collapse;
}

.docstring th,
.docstring td {
        padding: 4px;
}

.docstring th {
        border-bottom: 1px dotted #d3d7cf;
}

.docstring tr:nth-child(even) {
        background-color: #dddddc;
}