/* Header adjustments */

#header
{
  overflow: hidden;
  min-width: 600px;
  margin: 0;
  padding: 0;
}

#header h1
{
  width: 525px;
  margin-top: 11px;
}

#header h1 span
{
  left: 12px;
  width: 525px;
}

.crumbtrail li
{
  white-space: nowrap;
}

/* Author info */

#topicauthors, #mapauthors
{
  background: #fff;
  border-color: #cad6e8;
  border-style: solid;
  border-width: 0 1px 1px 1px;
  float: left;
  font-size: 0.77em;
  line-height: 1.5;
  margin: -4em 0 1.5em 0;
  padding: 2px 9px;
  position: relative;
}

#topicauthors ul, #mapauthors ul
{
  display: inline;
  margin: 0;
  padding: 0;
}

#topicauthors li, #mapauthors li
{
  display: inline;
}

a.contriblink
{
  text-decoration: none;
  color: #555;
  cursor: default;
}

a.contriblink:after
{
  content: ':';
}

/* Ad banner at the top */

#adzbanner
{
  float: right;
  margin: 0 12px 0 0;
  padding: 0;
  height: 88px;
  width: 500px;
}

/* mainpanelcontainer additional container div */
#mainpanelcontainer
{
  background: #fbfcfd;
  border: 1px solid #c0d0e0;
  border-right-style: solid;

  float: left;
  overflow: hidden;
  width: 100%;
}

/* rightcol */
div#rightcol	{
	width: 14%;
	min-width: 130px;
	float: right;
	padding: 3px;
}

/* leftcol */
div#leftcol	{
	width: 14%;
	float: left;
	padding: 3px;
}


* html #mainpanelcontainer
{
  display: inline-block;
}

/* Side column for ads */
#advertscolumn
{
  float: right;
}

/* Side column for W3C Links */
#w3clinkscolumn
{
	padding: 4px;
}

/* Side column for LiveSupport */
#livesupport
{
  background-color: #fffaf0;
  border: 2px solid green;
  padding: 5px;
  margin-bottom: 15px;
}
#livesupport img
{
  float: right;
}
#chatinvite
{
  padding: 5px;
}

/* Side column for Technologies */
#technologies
{
  float: right;
  border: 1px solid blue;
}
.product
{
  background-color: #FFFAF0;
  border: 1px solid #730;
  font-size: 77%;
  margin-bottom: 2em;
  padding: 1em;
  position: relative;
}

.product .boxdescription
{
  background: transparent url(/images/bulletr-br.gif) no-repeat right center;
  color: #ccb4a2;
  font-size: 12px;
  margin: 0;
  overflow: hidden;
  padding: 2px 1.5em 5px 0.5em;
  position: absolute;
  right: -1px;
  top: -13px;
}

.product h3
{
  font-size: 1.5em;
  margin-top: 0;
}

.product h3 a:link, .product h3 a:visited
{
  color: #CA1400;
}

.productshot
{
  text-align: center;
}

.download
{
  background: url(/images/pdf.gif) no-repeat left top;
  font-weight: bold;
  margin-bottom: 0.5em;
  padding: 0 0 0% 36px;
}

.product .download a:link, .product .download a:visited
{
  color: #730;
}

/* Main panel adjustments */

#mainpanel
{
  background: #fff;
  border-left: 1px solid #c0d0e0;
  border-bottom: 1px solid #c0d0e0;
  margin-bottom: -1px;
  overflow: hidden;
  width: 55%;
  padding: 2% 2%;
  margin-left: 310px;
  margin-right: auto;
}

/* Search panel */

#search
{
  background: #fff;
  border-bottom: 1px solid #c0d0e0;
  text-align: center;
  padding: 1% 0;
}

#search input.text
{
  width: 8em;
}

#search input.button
{
  font-size: 0.8em;
}

/* DITA map nav bar */

#navpanel
{
	width: 60%;
	padding: 1px;
}

#navpanel h2
{
  font-size: 1.2em;
  margin: 0 0 10px 0;
}

#navpanel ul
{
  margin: 0;
  padding: 0;
}

#navpanel ul ul
{
  cursor: default;
  margin: 0 0 0 15px;
}

#navpanel ul li
{
  display: block;
  list-style-type: none;
  position: relative;
}

#navpanel ul ul li
{
  left: -99999px;
  position: absolute;
}

#navpanel ul.foldertree ul li
{
  left: 0;
  position: relative;
}

/* ul ul li visible if:
  - li.active
  - li.active li.inactive but not li.inactive li.inactive
  - li.container but not li.inactive li.container
  - li.containsactive
  - li.containsactive li.inactive, but not li.inactive li.inactive
*/
#navpanel ul ul li.active,
#navpanel ul li.active li.inactive,
#navpanel ul ul li.container,
#navpanel ul ul li.containsactive,
#navpanel ul li.containsactive li.inactive
{
  left: 0;
  position: relative;
}
#navpanel ul li.inactive li.inactive, #navpanel ul li.inactive li.container
{
  left: -99999px;
  position: absolute;
}
#navpanel ul.foldertree li.inactive li.inactive, #navpanel ul.foldertree li.inactive li.container
{
  left: 0;
  position: relative;
}

#navpanel li.active
{
  font-weight: bold;
}

#navpanel li.inactive, #navpanel li.container
{
  font-weight: normal;
}

#navpanel ul a:link, #navpanel ul a:visited,
#navpanel ul span.topichead
{
  display: block;
  padding: 1px 0 1px 15px;
}

#navpanel ul a.twisty:link, #navpanel ul a.twisty:visited
{
  background: transparent url(/static/reference/images/plus.gif) no-repeat center;
  padding: 0;
  position: absolute;
  width: 15px;
  height: 15px;
  top: 0.2em;
  left: 0;
}

#navpanel ul a.rollover:link, #navpanel ul a.rollover:visited
{
  background-image: url(/static/reference/images/minus.gif);
}

#navpanel ul li
{
  cursor: pointer;
  line-height: 1.2;
  margin: -1px 0 3px;
  position: relative;
}

#mynavpanel {
  display: block;
  width: 373px;
  background: #6295E9;
  margin-bottom: 20px;
  padding: 0;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-right: 1px solid;
  border-color: #999999;
  font-weight: bold;
}

#navindex {
  margin: 0;/*removes indent IE and Opera*/
  padding: 0;/*removes indent Mozilla and NN7*/
}

#navindex a, #navindex a:visited {
  display: block;
  height: 24px;
  line-height: 24px;/*must be equal to height. Centers the text vertically*/
  padding: 0 0 0 24px;
  border: none;
  border-top: 1px solid #99CCCC;
  border-bottom: 1px solid #3564D8;
  color: white;
  text-decoration: none;
  background: url(/images/nav.jpg) repeat-x left top;
}

#navindex a:hover {
  background-position: 0 -24px;   /* Shift background image vertically 24px, or start of the 2nd background image (on mouseover) */
  color: white;
}

#navindex #active a {
  display: block;
  background: #548BE7 url(images/bullet.jpg) no-repeat left center;
  background-position: 25px;
  padding-left: 45px;
  cursor: default;
}
/***** IMAGE REPLACEMENT *****/

h2.ir {
  position: relative;
  width: 175px;
  height: 25px;
  padding: 0;
  overflow: hidden;
}

h2.ir em {
  display: block;
  width: 175px;
  height: 25px;
  position: relative;
  background: url(/images/mainmenu.jpg) no-repeat left top;
}

#navigation a
{
color: #000;
background: #b6f0e6 url(/images/left-tab.gif) left top no-repeat;
text-decoration: none;
padding-left: 10px
}

#navigation a span
{
background: url(/images/right-tab.gif) right top no-repeat;
padding-right: 10px
}

#navigation a, #navigation a span
{
display: block;
float: left
}

/* Hide from IE5-Mac \*/
#navigation a, #navigation a span
{
float: none
}
/* End hide */

#navigation a:hover
{
color: #fff;
background: #a1c9ff url(/images/left-tab-hover.gif) left top no-repeat;
padding-left: 10px
}

#navigation a:hover span
{
background: url(/images/right-tab-hover.gif) right top no-repeat;
padding-right: 10px
}

#navigation ul
{
padding: 0;
margin: 0
}

#navigation li
{
list-style: none;
float: left;
margin: 0;
} 

/* topic header and syntax */

.topicheader
{
  border-bottom: 0px solid #c0d0e0;
  float: left;
  margin: 0 0 25px 0;
  padding: 0 0 15px 0;
  width: 100%;
}

.topicheader h1, .topicheader h2
{
  margin: 0;
  padding: 15px 0;
  float: left;
  font-size: 2.2em;
  width: 46%;
  width: auto;
}

.topicheader h2
{
  font-size: 1.6em;
}

.topicheader h1 .topictype, .topicheader h2 .topictype
{
  color: #99ACCA;
  font-size: small;
  font-style: normal;
}

.topicheader h1 code
{
  font-weight: bold;
}

.syntax
{
  color: #c88;
  font-family: "courier new", monospace;
  clear: left;
}

.syntax div div
{
  margin-left: 1em;
}

.syntax kbd, .syntax kbd a:link, .syntax kbd a:visited
{
  font-weight: bold;
  color: #209;
}

.syntax var, .syntax var a:link, .syntax var a:visited
{
  color: #a66;
  font-style: italic;
}

.syntax kbd a:hover, .syntax var a:hover,
.syntax kbd a:focus, .syntax var a:focus,
.syntax kbd a:active, .syntax var a:active
{
  color: #f60;
}

.syntax sup
{
  font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
}

/* summary/spec and support tables */
table.supportmatrix, div.summary table
{
  border: none;
  border-collapse: collapse;
  margin: 0;
}

table.fullmatrix
{
  clear: right;
  margin: 0 0 20px 20px;
  float: right;
}

div.summary table
{
  margin: 1px 0 5px 10px;
  float: right;
}

table.supportmatrix th, table.supportmatrix td,
div.summary table th, div.summary table td,
div.summary table caption
{
  font-size: 0.85em;
  color: #666;
  padding: 2px 4px;
}

.section table.fullmatrix th, .section table.fullmatrix td
{
  font-size: 1em;
  padding: 3px 6px;
  border: 1px solid #abc;
}

div.summary table caption
{
  color: #99acca;
	min-height: 15px; /* Allows for 'expand' image */
}

div.summary table caption img
{
	vertical-align: top;
}

div.summary table.browsers caption
{
	padding-left: 19px;
}

table.supportmatrix th, div.summary th
{
  text-align: right;
  vertical-align: top;
  background: #fff;
  border: 1px solid #fff;
}

div.summary table th
{
  border-top: 1px solid #c0d0e0;
}

div.summary table th, div.summary table td
{
  text-align: center;
}

table.fullmatrix th
{
  background: #f4f8fd;
}

table.supportmatrix td, div.summary td
{
  text-align: center;
  border: 1px solid #fff;
}

td.full
{
  background: #beb;
}

td.partial
{
  background: #fdb;
}

td.none
{
  background: #ccc;
}

td.buggy
{
  background: #fbb;
}

td.info
{
  background: #def;
}

/* Hide first section header */
.first .sectiontitle
{
  position: absolute;
  left: -9999em;
}

/* Topic content */

.topiccontent
{
  clear: both;
}

.topicbody ul, .topicbody ol
{
  padding-left: 3em;
}

/* format.css defines a bunch of properties for #pagecontent, but the CSS reference
   has a topic called 'content' that catches these styles. These rules remove
   those styles. */
.topicbody #content
{
  padding: 0;
  background: transparent;
  clear: none;
  margin: 0 !important; /* todo: remove !important from format.css */
  min-width: 0;
  top: auto;
  width: auto;
}

/* figures */

.fignone
{
  padding-bottom: 2em;
  position: relative;
  text-align: center;
}

.figcap
{
  bottom: 0;
  display: block;
  font-size: 85%;
  font-weight: bold;
  left: 0;
  position: absolute;
  text-align: center;
  width: 100%;
}

/* notes */
.topiccontent div.note, .topiccontent div.tip, .topiccontent div.fastpath,
.topiccontent div.important, .topiccontent div.remember,
.topiccontent div.restriction, .topiccontent div.caution,
.topiccontent div.danger
{
  background-color: #F2F2E1;
  margin: 20px 0;
  padding: 0.5em;
  padding-left: 3em;
}

.topiccontent .notetitle
{
  background-color: #EDEDDD;
  display: block;
  height: 34px;
  margin: -0.5em -0.5em -1em -3em;
  position: relative;
}

.topiccontent .notetitle span
{
  background-position: top left;
  background-repeat: no-repeat;
  display: block;
  font-family: Verdana,'Trebuchet MS',Arial,Helvetica,sans-serif;
  font-size: 1.2em;
  font-weight: bold;
  height: 2em;
  left: -3px;
  padding: 12px 0 5px 45px;
  position: absolute;
  top: -3px;
}

.topiccontent .note .notetitle span
{
  background-image: url(/static/reference/images/note.png);
}

.topiccontent .tip .notetitle span, .fastpath .notetitle span
{
  background-image: url(/static/reference/images/tip.png);
}

.topiccontent .important .notetitle span, .remember .notetitle span
{
  background-image: url(/static/reference/images/important.png);
}

.topiccontent .restriction .notetitle span, .caution .notetitle span, .danger .notetitle span
{
  background-image: url(/static/reference/images/warning.png);
}

.topiccontent .note p
{
  font-size: 90%;
  line-height: 167%;
  margin-bottom: 0;
}

/* pre code blocks */
.topiccontent pre
{
  border: 1px solid #abc;
  background: #eaecef;
  padding: 10px;
  clear: right; /* Stay clear of floated example */
  color: #333;
  font-family: "courier new", monospace;
}

/* example */
.topiccontent .example
{
  background: #f4f8fd;
  border: 1px solid #c0d0e0;
  float: right;
  font-size: 0.95em;
  margin: -26px 0 20px 20px;
  padding: 2%;
  position: relative;
  width: 40%;
  z-index: 1;
}

.wideexample /* .wide.example would be neater, but not IE6 compatible */
{
  margin-left: 0;
  width: 96%;
}

* html pre
{
  display: inline-block;
}

*+html pre
{
  display: inline-block;
}

.topiccontent .example pre
{
  margin-bottom: 1px;
  border: 1px solid #dde;
}

.topiccontent .example h2
{
  margin: 0 0 5px 0;
}

.topiccontent .example p
{
  margin: 10px 0;
}

/* related info */
* html .relinfo ul
{
  margin-left: 2em;
}
*+html .relinfo ul
{
  margin-left: 2em;
}

/* footnotes */
.footnotes
{
  clear: both;
  margin: 30px 0 0 0;
}

.footnotes h2
{
  margin: 0;
  color: #357;
}

.footnotes p
{
  font-size: 0.85em;
  margin: 5px 0 0 0;
  color: #666;
}

/* next/previous links */
.familylinks {
  text-align: center;
  font-weight: bold;
  clear: right;
}

.nextlink, .previouslink {
  display: inline;
  margin: 0 0.5em;
  white-space: nowrap;
}

.nextlink a:link, .nextlink a:visited {
  background: url(/static/reference/images/next.png) no-repeat right;
  padding-right: 14px;
}

.nextlink a:visited {
  background-image: url(/static/reference/images/next-visited.png);
}

.nextlink a:hover, .nextlink a:active, .nextlink a:focus {
  background-image: url(/static/reference/images/next-hover.png);
}

.previouslink a:link, .previouslink a:visited {
  background: url(/static/reference/images/previous.png) no-repeat left;
  padding-left: 14px;
}

.previouslink a:visited {
  background-image: url(/static/reference/images/previous-visited.png);
}

.previouslink a:hover, .previouslink a:active, .previouslink a:focus {
  background-image: url(/static/reference/images/previous-hover.png);
}

/* Back to top link */
.toplink
{
  clear: right;
  text-align: right;
}

/* user notes */
.usernotes
{
  border: 1px solid #abc;
  background: #e4e8ed;
  clear: both;
  margin: 40px 0 20px 0;
  padding: 0 0 15px 0;
}

.usernotes *
{
  margin: 0;
  padding: 0;
}

.usernotes h2
{
  margin: 0 0 15px 0;
  background: url(/static/common/images/layout/gradient4.gif) #5b82a9;
  padding: 3px 5px;
  color: #fff;
  font-size: 1.2em;
  border: 1px solid #def;
  border-bottom-color: #789;
}

.usernotes .note
{
  background: #fff;
  border: 1px solid #ccd;
  margin: 0 15px 15px 15px;
}

.usernotes p
{
  margin: 10px;
}

.usernotes p.nonotes
{
  margin: 0 15px 15px 15px;
}

.usernotes dl.noteinfo
{
  background: #d4d8dd;
  border-bottom: 1px solid #ccd;
  padding: 2px 4px;
  position: relative;
}

.usernotes dl.noteinfo dt
{
  position: absolute;
  left: -9999px;
}

.usernotes dl.noteinfo dd
{
  display: inline;
  font-size: 0.85em;
}

.usernotes dl.noteinfo dd.status
{
  display: block;
  margin: 4px 0 2px 0;
  padding: 2px 4px;
  background: #ff7;
}

.usernotes dl.noteinfo dd.actions
{
  position: absolute;
  top: 0;
  right: 3px;
}

.usernotes dl.noteinfo *
{
  color: #036;
}

.usernotes p#addnote
{
  margin: 0 15px;
}

.usernotes form#addnote
{
  margin: 0 15px;
}

.usernotes form#addnote label.comments span
{
  display: block;
  padding: 0 0 5px 0;
}

.usernotes form#addnote fieldset.buttongroup
{
  margin: 10px 0 0 0;
  text-align: right;
}

.usernotes form#addnote label.subscribe
{
  float: left;
}

.usernotes .terms
{
  font-size: 77%;
}

/* Inline elements */

pre em, code em
{
  font-style: normal;
  font-weight: bold;
}

/* Move footnote reference underline to sup */
a.fnref, a.fn
{
  text-decoration: none;
}

a.fnref sup, a.fn sup
{
  text-decoration: underline;
}

dfn
{
  font-style: normal;
  font-weight: bold;
}

* html code
{
  font-size: 1.1em;
}
*+html code
{
  font-size: 1.1em;
}

/* Search results */

#searchresults li, #searchresults p
{
  padding-top: 0;
}

/* Draft comments must be garish */

.draft-comment
{
  background-color: red;
  border: 6px double green;
  color: white;
  margin: 1em 0;
  padding: 0.5em;
}
