/* Robin's HTML 4.0 Conformance Test styles */

@media print {
	/* no background or color for hard copy */
	html, body {
		color: black;
		background-color: white;
	}
}

@media screen, tv, projection {
	html, body {
		/* but don't waste blue ink in print */
		color: black;
		background-color: #F9F9FF;
	}
	body {
		/* make room for navbar */
		padding: 1.5em 4pt 0 4pt;
		/*height:100%; /* work around IE/Win brokenness */
	}
}

body {
	font-family: "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Verdana, Univers, "Zurich BT", Geneva, Lucida, Arial, Helvetica, sans-serif;
	font-size: medium;
	line-height: 1.3;
}

h1 { margin-top: .5em }
h1, h2 {
	/* Prefer Tekton or some clone */
	font-family: "Tekton Pro", "TektonPro-Regular", Tekton, Architect, Technical, QTTechtone, /*"Graphite Light",*/ "GeoSlab703 Lt BT", "Lucida Bright", serif;
	text-shadow: gray;
}

h3 { color: #900; }

div.illo h3 {
	color: #330;
	font-size: medium;
	font-weight: bold;
	text-decoration: underline;
}

div.illo h4 {
	color: #330;
	font-size: inherit;
	font-weight: normal;
}

#foreword a, div.bodytext a, div.blockcode a, pre.blockcode a, pre.blocksamp a,
#navbar a, #browserver a, #footer a { text-decoration: inherit }

/*em { font-weight: bold; }*/

dfn {
	font-style: normal;
	font-weight: bold;
}

pre, code, samp, tt,
div.example {
	font-family: "Andale Mono", /* f/k/a */ "Monotype.com", "Courier New", Courier, monospace;
	-xv-voice-pitch-range: low; /* CSS3 draft */
	/* speak: literal-punctuation; /* CSS3 draft */
	/* speak-punctuation: code; */
	/* speech-rate: faster; */
}

address { font-style: normal; }

#foreword, div.bodytext, div.note {
	margin-left: auto;
	margin-right: auto;
	max-width: 7in;
}

div table,
div form,
div blockquote { margin-left: 0; margin-right: 0 }


/* Examples */
div.illo {
	color: black;
	background-color: white;
	margin-left: .33in; /* was .25in */
	margin-right: .33in;
	/* max-width: 7in; */
	clear: both;
	padding: 6px;
	border: 2px solid #069; /* was #cc0 */
	border-radius: 1em;
	-moz-border-radius: 1em;
}

div.indent  { margin-left: 2em }

div.blockcode,
pre.blockcode,
pre.blocksamp,
div.results { 
	margin-left: .33in; 
	margin-right: .33in;
	clear: both;
}

div.blockcode:before,
pre.blockcode:before,
pre.blocksamp:before {
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: larger;
	text-align: center;
	font-weight: bold;
	color: white;
	background-color: #069;
	clear: both;
}
div.blockcode:before,
pre.blockcode:before {
	content: "<code>";
	color: white;
	background-color: #A52A2A;
	overflow: visible;
	margin-bottom: .5em;
}
div.blockcode,
pre.blockcode {
	border: 1px solid #A52A2A;
	max-height: 472px;
	max-width: 80em;
	overflow: auto;
	color: black;
	background-color: #F8F8F8;
	font-size: smaller;
	padding-bottom: .5em;
}
pre.blocksamp:before {
	content: "<samp>";
	color: white;
	background-color: #008080;
	overflow: visible;
	margin-bottom: .5em;
}
pre.blocksamp {
	border: 1px solid #008080;
	max-height: 472px;
	overflow: auto;
	color: black;
	background-color: #F8F8F8;
	font-size: smaller;
	padding-bottom: .5em;
}

div.blockcode,
div.blockcode a:link,
div.blockcode a:visited { color: #A52A2A; }

em.html,
em.html a:link,
em.html a:visited {
	font-style: normal;
	color: #002;
}

em.entity {
	font-style: italic;
	color: inherit;
}

em.html4,
em.html4 a:link,
em.html4 a:visited {
	font-style: normal;
	color: #026;
}

strong.tested,
strong.tested a:link,
strong.tested a:visited,
span.tested,
span.tested a:link,
span.tested a:visited { 
	/* font-weight: normal; */
	color: #026;
}

div.results a {
	color: blue;
	background-color: inherit;
	text-decoration: underline;
	border-style: none;
}
div.results a:link {
	/* CSS3 specifiers */
	color: HyperlinkText;
	background-color: Hyperlink;
}
div.results a:visited { 
	color: VisitedHyperlinkText;
	background-color: VisitedHyperlink;
}

samp {
	color: #008080;
}

button ul { margin-left: 0 }
  
div.note, p.note, p.sugg, span.note,
p.footnote	{ font-size: x-small; /* margin-left: 1em; text-indent: -1em */ }
/* Annotated list (revision history, links) */
div.annlist h3 {
	font-size: 100%;
	margin-left: 0;
	margin-bottom: 0.2em;
	margin-top: 0.4em;
	font-weight: normal;
}
div.annlist p {
	margin-left: 2em;
	margin-top: 0.2em;
	margin-bottom: 0.2em;
}


/* browser icons */
p.bugzilla:before,
p.mozilla:before {
	content: url(/images/icons/mozilla16.png);
	height: 16px; width: 16px; margin-right: 4pt;
	vertical-align: middle;
}
p.kde:before,
p.safari:before {
	content: url(/images/icons/safari16.png);
	height: 16px; width: 16px; margin-right: 4pt;
	vertical-align: middle;
}
p.msie:before {
	content: url(/images/icons/msie16.png);
	height: 16px; width: 16px; margin-right: 4pt;
	vertical-align: middle;
}
p.opera:before {
	content: url(/images/icons/opera16.png);
	height: 16px; width: 16px; margin-right: 4pt;
	vertical-align: middle;
}
p.firefox:before {
	content: url(/images/icons/firefox16.png);
	height: 16px; width: 16px; margin-right: 4pt;
	vertical-align: middle;
}
p.netscape:before {
	content: url(/images/icons/netscape16.png);
	height: 16px; width: 16px; margin-right: 4pt;
	vertical-align: middle;
}
p.icab:before {
	content: url(/images/icons/icab16.png);
	height: 16px; width: 16px; margin-right: 4pt;
	vertical-align: middle;
}


/* Navigation link bar */
#navbar {
	clear: both;
	color: white;
	background-color: #006;
	margin: 0;
	padding: 1ex;
	font-size: small;
	min-height: 16px;
	position: absolute;
	top: 0;
	left: 0;
	height: auto;
	width: 99%;
}
#navbar * {
	display: inline;
}

#navbar #breadcrumbs:before {
	content: url(/images/icons/htmltest.png);
	height: 16px;
	width: 16px;
	margin-right: 4pt;
	float: left;
	vertical-align: middle;
}
#navbar #breadcrumbs {
	/* crumbs on left side of navbar */
	float: left;
	text-align: left;
	font-size: inherit;
	font-family: inherit;
	font-style: inherit;
	font-weight: bold;
	margin-top: 0;
	margin-bottom: 0;
	/*width: 59%; */
}

#navbar ul, #navbar li {
	margin: 0;
	padding: 0;
}
#navbar li ul:before {
	content: "\2009\2192\2009";
}
#navbar ul.nl {
	/* other links on right side of navbar */
	float: right;
	text-align: right;
	font-size: inherit;
	font-weight: bold;
	color: white;
	background-color: #006;
	width: auto; /* 23em; 28ex; Home|<First <Prev Next> */
	margin-right: 0.5em;
}
#navbar li a strong {
	/* accesskey highlight */
	text-decoration: underline;
}

#navbar a {
	border-bottom: 1px solid #555;
	text-decoration: none;
}
#navbar a:link, #navbar a:visited {
	color: white;
	background-color: #006;
	border-bottom: 1px solid #555;
	text-decoration: none;
}
#navbar a:hover {
	color: yellow;
	background-color: #006;
	border-bottom: 1px solid yellow;
	text-decoration: none;
}

/*div.illo abbr, div.illo acronym { 
  border-bottom-style: dotted; 
  border-bottom-width: thin;
}*/


/* ToC */
ul.nl {
	list-style-type: none;
}

#contents {
	clear: right;
	float: right;
	color: black;
	background-color: #BBB;
	border: 1px solid #006;
	font-size: smaller;
	padding: 1em;
	margin: 0 0 0 1em;
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 1em;
	-moz-border-radius: 0 0 1em 1em;
}
#contents.h2 {
	display: none;
}
#contents ul.nl {
	margin: 0;
	padding: 0;
}
#contents ul.nl ul.nl {
	margin: 0 0 0 0.5em;
}
#contents li {
	margin: 0;
	padding-left: 1em;
	text-indent: -1em;
}
#contents span.label {
	font-size: larger;
	font-weight: bold;
}


/* entities */
.element,
.attribute,
.entity,
.style_description	{ color: #A52A2A; }

.HTML2,
.HTML32		{ background-color: #C0FFC0; }
.HTMLsymbol	{ background-color: #C0C0FF; }
.HTMLspecial	{ background-color: #FFFFC0; }

.unicode,
colgroup.centered	{ text-align: center; }
colgroup.uncentered	{ text-align: left; }

/* lead-ins */
strong.minor {
	font-style: normal;
	color: #900;
}
strong.bug {
	font-style: normal;
	color: #900;
}
strong.downgrade {
	font-style: normal;
	color: #909;
}
strong.bugfix {
	font-style: normal;
	color: #009;
}
em.correction {
	font-style: normal;
	font-weight: normal;
	color: #009;
}

em.browser, em.version {
	font-style: normal;
	font-weight: normal;
	color: #040;
}

/* results */
#results_key {
	margin: 0;
}
#results_key table { 
	border: thin solid;
	float: right;
	font-size: smaller;
	background-color: white;
	border-collapse: collapse;
}
#results table {
	clear: both;
	margin-top: 1em;
	margin-left: auto;
	margin-right: auto;
	font-size: smaller;
	overflow: auto;
	border-collapse: collapse;
}

#results td[title]:hover,
#results object[title]:hover {
	cursor: help;
}

td.field {
	text-align: left;
	vertical-align: top;
	padding-left: 2em;
}
#results th[axis=section],
#results th.section {
	text-align: left;
}
#results th[axis=feature],
#results th.feature { 
	text-align: left;
	background-color: #EE9; /*was #EEE8D6;*/
	padding-left: 2em;
}
#results th[axis=subfeature],
#results th.subfeature { 
	text-align: left;
	background-color: #EEA;
	padding-left: 3em;
}
#results th[axis=subsubfeature],
#results th.subsubfeature { 
	text-align: left;
	background-color: #EEA;
	padding-left: 4em;
}
#results th.elsewhere {
	background-color: #BBB;
	font-style: italic;
}
.agent		{ background-color: #E0E080; }
.good		{ text-align: center; background-color: #80FF80; }
.soso		{ text-align: center; background-color: #FFFF80; }
.degrades	{ text-align: center; background-color: #00FFFF; }
.should		{ text-align: center; background-color: #FF80FF; }
.bad		{ text-align: center; background-color: #FF8080; font-weight: bold; }

tr.scores {
	font-weight: bold;
	text-align: center;
}

span.beta	{ font-style: italic; }

col.highlight	{ font-weight: bold; border-left: dashed; border-right: dashed; }
th.highlight	{ background-color: #FFFF00 }

/* amazon.com buy-this-book ad */
.amazon { 
	float: right;
	margin: 0;
	border: none;
}
iframe.amazon	{ 
	width: 120px;
	height: 240px;
}

/* quotation marks for a few languages */
:lang(en),
:lang(es){ quotes: "\201C" "\201D" "\2018" "\2019" }
:lang(fr){ quotes: "\AB\2009" "\2009\BB" "\201C" "\201D" "\2018" "\2019" }
:lang(de){ quotes: "\201E" "\201C" "\201A" "\2018" }
:lang(it){ quotes: "\AB" "\BB" "\2039" "\203A" }

/* don't try to italicize kanji */
:lang(ja)	{ font-style: normal; }

#updates {
	font-size: smaller
}
#updates ins {
	/* leave default <ins>/<del> formatting in Edit test */
	text-decoration: none;
}
#updates span.person {
	color: #550;
}

#footer {
	clear: both;
	margin-top: 0.5em;
	margin-bottom: 0;
	font-size: smaller;
	border-top: 2pt solid;
	padding-top: .5em;
}
#footer p, #footer address {
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0.5em;
}

/* browser version footer */
#browserver h2 {
	display: block;
	font-weight: bold;
	text-align: center;
	color: white;
	background-color: black;
	margin-top: 0;
}
#browserver {
	background-color: #BBB;
	font-size: 12px;
	margin-top: 1em;
	margin-left: .5in;
	margin-right: .5in;
	border: thin solid;
	padding: 6px;
	clear: both;
	border-radius: 1em;
	-moz-border-radius: 1em;
}

@media static, grid, print {
	#buttons, #navbar object {
		display: none;
		speak: none;
	}
}
@media interactive, screen, tv {
	#buttons h2 {
		display: none;
	}
	#buttons {
		float: right;
		width: 80px;
		font-size: xx-small;
		margin: 0 0 0 0.5em;
		border: 0;
		padding: 0;
		speak: none;
	}
	#buttons a {
		border-style: none;
	}
	#buttons img,
	#buttons object {
		display: block;
		border-style: none;
		width: 80px;
		height: 15px;
	}
}

/* dynamic font matching info */

@font-face {
	font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande";
	panose-1: 2 11 6 2 3 5 4 2 2 4;
	units-per-em: 2048;
	ascent: 1604;
	bbox: -1259, -901, 2835, 2344;
}

@font-face {
	font-family: "Tekton Pro", Tekton;
	panose-1: 2 15 4 3 2 2 8 2 9 4;
}

@font-face {
	font-family: "Geoslab703 Lt BT";
	panose-1: 2 6 4 3 2 2 5 2 4 3;
}

@font-face {
	font-family: "Andale Mono";
	panose-1: 2 11 5 9 0 0 0 0 0 4;
}

@font-face {
	font-family: "Courier New";
	panose-1: 2 7 3 9 2 2 5 2 4 4;
}


