/* ----------------- Sheet Outline ----------------- 

Import chapter_numbers.css

HTML Element

Headers

Lists
  | Item Lists
  | Definition Lists
  | Inline Lists
  
Paragraphs

Block Quotes

Tables

Coding
  |Inline HTML Coding
  |Inline CSS Coding
  |Inline JavaScript Coding
  |Code Examples

Graphics
  |Example Links

References to Chapters and Appendices

General Styling

First Letter

Chapter Links

*/
/* ----------------- Import chapter_numbers.css ----------------- */

@import url('./chapter_numbers.css');

/* ----------------- HTML Element ----------------- */

html{
	line-height:2;
	font-size:12pt;
	background:#fff;
	color:#000;
}
/* ----------------- Headers ----------------- */

h1, h2, h3, h4, h5, h6{
	text-align:center;
	line-height:1.3;
	border-color:black;
}

h1, h2, h3{font-family:"Copperplate Gothic Light", serif;}

h1, h2 span{border-style:double;}

h1{border-width:0 0 5px;}

*.chapter h1:before, *.appendix h1:before{
	display:block;
	text-align:center;
}

*.chapter h1:before{content:'Chapter ' counter(chap_num) ':';}

*.appendix h1:before{content:'Appendix ' counter(app_num, upper-alpha) ':';}

h2 span{border-width:0 0 3px;}

h3, h5 span{border-style:solid;}

h3{
	border-color:black;
	border-style:solid;
	border-width:1px 0;
}

h4, h5, h6{font-variant:small-caps;}

h4{font-size:2em;}

h5 span{
	border-width:1px;
	padding:5px 100px 5px 100px;
	display:inline-block;
}

/* ----------------- Lists ----------------- */

/* --- Item Lists --- */
ol, ul{
	margin:0 0 16px 40px;
	padding:0;
}


ol.choices{list-style-type:upper-alpha;}

li.list_header{
	list-style-type:none;
	font-weight:bold;
	margin-left:-20px;
	padding:0;
	text-decoration:underline;
	font-variant:small-caps;
	font-style:normal;
}

ol{list-style-type:decimal;}

ol ol{list-style-type:lower-alpha;}

ol ol ol{list-style-type:lower-roman;}

ol.alter_count, ol.array{list-style-type:none;}
ol.array{counter-reset:index -1;}
ol.alter_count li{counter-increment:list_counter;}
ol.array li{counter-increment:index;}

ol.alter_count li:before, ol.array li:before{
	display:inline-block;
	text-indent:-25px;
}
ol.alter_count li:before{content:counter(list_counter) '.\0000A0';}
ol.array li:before{content:'[' counter(index) ']\0000A0\0000A0';}


/* --- Definition Lists --- */

dt{
	margin:40px 40px 0 40px;
	font-weight:bold;
}

dt.subseq_term{margin-top:0;}

dd{margin:0;}

dl{
	margin:10px 0 10px 30px;
	border-left:1px solid black;
	padding-left:10px;
}

/* ----------------- Paragraphs ----------------- */

p{
	margin-top:0;
	margin-bottom:0;
	text-indent:30px;
}

dd p, p.continued{
	margin:0;
	text-indent:0;
}

/* ----------------- Block Quotes ----------------- */

blockquote{
	margin:5px 50px 5px 50px;
	padding:10px;
	border:1px dotted gray;
}

/* ----------------- Tables ----------------- */

table{
	counter-increment:tbl_num 1;
	margin-bottom:2em;
}

table, td, th{
	border:blue solid 1px;
	padding:5px;
	border-collapse:collapse;
	text-align:center;
}

table.css_values{
	width:100%;
	border:0;
	counter-increment:none;
}

caption{
	font-size:0.8em;
	font-weight:bold;
}

caption:before{content: 'Table ' counter(chap_num) '.' counter(tbl_num) ': ';}

table[id|='Appendices'] caption:before{content: 'Table ' counter(app_num, upper-alpha) '-' counter(tbl_num) ': ';}

table td.empty{background:#ccf;}

table.css_values td, table.css_values th{
	vertical-align:top;
	border:0;
}

table.css_values td, td.text{text-align:left;}

table.css_values th{
	text-align:right;
	width:150px;
	padding-right:10px;
}
table.css_values p{text-indent:0;}



/* ----------------- Language Classes ----------------- */

*.foreign_phrase{font-style:italic;}

*:lang(en){quotes:'\00201C' '\00201D' '\002018' '\002019' ;}

*:lang(fr), *:lang(el){quotes:'\0000AB' '\0000BB' '\002039' '\00203A';}

*:lang(ru){quotes:'\0000AB' '\0000BB' '\00201E' '\00201C';}

*:lang(de){quotes:'\00201E' '\00201C' '\00201A' '\002018';}

/* ----------------- Coding ----------------- */

/* --- Inline HTML Code --- */

*.el_name,
*.file_name,
dl.el_names > dt,
*.el_names > li
{font-style:italic;}


*.el_name{
	font-family:monospace;
	font-variant:normal;
}

*.el_name:before,
*.el_names > li:before,
dl.el_names > dt:before,
*.tag:before
{content:"<";}

*.el_name:after,
*.el_names > li:after,
dl.el_names > dt:after,
*.tag:after
{content:">";}

dl.code_steps > dt{font-weight:normal;}
*.tag *.el_name:before,
*.tag *.el_name:after,
*.el_names *.list_header:before,
*.el_names *.list_header:after{display:none;}
*.author_code_comment{
	background-color:rgb(200, 220, 220);
	border:thin blue solid;
	margin:10px;
	padding:10px;
	font-style:italic;
}

dl.el_names > dt,
dl.att_names > dt,
dl.declarations > dt,
dl.selectors > dt,
dl.css-properties > dt,
dl.css-values > dt,
*.selectors > li,
*.el_names > li,
*.att_names > li,
*.declarations > li,
*.properties > li,
*.css-values > li,
*.declaration
{font-family:monospace;} 

*.el_names *.list_header{
	font-family:inherit;
	font-style:inherit;
}

dl.att_names > dt, *.att_names > li, *.att_name, *.attribute{
	font-family:monospace;
	text-decoration:underline;
}

/* --- Inline CSS Coding --- */

*.default_css_value{font-weight:bold; text-decoration:underline;}


/* --- Inline JavaScript Coding --- */

var{color:blue;}

*.javascript{
	padding:5px 10px;
	background:rgb(200, 220, 220);
}

*.property, dl.properties > dt{color:rgb(0, 74, 0);}

var,
*.bool,
*.event,
*.events > dt,
*.events > li,
*.procedure,
*.procedures > li,
*.procedures > dt,
*.javascript,
*.keyword,
*.node,
*.object,
*.property,
*.uri,
*.form_el{font-family:monospace;}

*.procedure:after, *.procedures > li:after, *.procedures > dt:after{
	content:'()';
	color:black;
}

*.sample *.procedure:after, 
*.javascript *.procedure:after, 
*.procedure.w-value:after, 
*.procedures > li.w-value:after, 
*.procedures > dt.w-value:after
{display:none;}

*.procedure span.proc_param, 
*.procedure > li span.proc_param, 
*.procedures > dt span.proc_param
{color:black;}

*.keyword, *.string{color:purple;}

*.regex{color:rgb(192,70,0);}
						

*.object, *.form_el{color:navy;}

*.procedure, *.procedures > li, *.procedures dt{color:maroon;}

*.bool, *.event, *.events > dt, *.events > li{color:rgb(0, 96, 96);}

*.node{color:rgb(64, 64, 0);}

*.uri, *.event, *.comment, *.form_el, *.foreign, *.events > dt, *.events > li{font-style:oblique;}

/* --- Code Examples --- */

div.code{
	counter-increment:ex_num 1;
	counter-reset:line ex_subnum;
	margin-top:2em;
}

div.code div.code_header,
div.code div.code_notes,
div.code div.code_subheader{
	font-family:"Copperplate Gothic Bold", serif;
	text-align:center;
	display:block;
	font-size:1em;
	font-variant:small-caps;
}
div.code div.code_subheader{counter-increment:ex_subnum;}

div.code div.code_header{font-size:1.2em;}

div.code_header:first-child:before{content: 'Example ' counter(chap_num) '.' counter(ex_num) ': ';}

div.code_subheader:before{content: 'Ex. ' counter(chap_num) '.' counter(ex_num) '-' counter(ex_subnum, lower-alpha) ': ';}

div.code_header.no_num{counter-increment:none;}

div.code_header.no_num:before{display:none;}

div.code_header code.el_name{font-size:110%;}


div.code div.sample{
	display:block;
	margin:10px 30px 10px 30px;
	background:rgb(245, 245, 245);
	padding:20px;
	font-family:monospace;
	font-size:13pt;
}

div.code_sample{
	font-style:italic;
	color:#44f;
	font-weight:bold;
	margin:10px;
}

div.alt{
	font-style:italic;
	text-decoration:underline;
}

div.indent1{margin-left:40px;}

div.indent1:before{left:-40px;}

div.indent2{margin-left:80px;}

div.indent2:before{left:-80px;}

div.indent3{margin-left:120px;}

div.indent3:before{left:-120px;}

div.indent4{margin-left:160px;}

div.indent4:before{left:-160px;}

div.indent5{margin-left:200px;}

div.indent5:before{left:-200px;}

div.indent6{margin-left:240px;}

div.indent6:before{left:-240px;}

*.hilite_b{font-weight:bold;}

*.hilite_u{text-decoration:underline;}

*.hilite_i{font-style:oblique;}

div.absent_tag{
	font-style:italic;
	color:silver;
}

div.numbered_lines div.sample div{counter-increment:line;}

div.numbered_lines div.sample div:before{
	color:#888;
	content:counter(line) ' >';
	position:relative;
	display:block;
	float:left;
	clear:left;
	width:3em;
	margin-right:2em;
	text-align:right;
	font-style:oblique;
	font-family:arial, sans-serif;
}

*.comment{
	color:rgb(0, 96, 0);
	font-style:oblique;
}

div.sample *.tag_name{color:blue;}
div.sample *.att_name{
	color:rgb(200, 70, 0);
	text-decoration:none;
}
div.sample *.att_value{color:purple;}
div.sample *.doctype, div.sample.doctype{
	color:rgb(165, 42, 42);
	font-style:italic;
}
div.sample *.char_ref{color:maroon;}

div.sample *.xml_dec, div.sample.xml_dec{
	color:rgb(42, 42, 242);
	font-style:italic;
}

div.sample *.selector{color:rgb(230,0,0);}

div.sample *.css_prop{color:rgb(0,0,180);}

div.sample *.css_val{color:rgb(0,80,80);}
/* ----------------- Graphics ----------------- */

div.graphic{margin:10px 0px 10px 30px;}

img{border:none;}

*.bordered img{border:3px double black;}

div.graphic, ul.graphic_list, ul.sbs_graphics, dl.labelled_graphics, dl.described_graphics{
	counter-increment:fig_num 1;
	counter-reset:fig_subnum 0;
	list-style-type:none;
}

ul.graphic_list li, 
ul.sbs_graphics li, 
dl.labelled_graphics dd, 
dl.described_graphics div{counter-increment:fig_subnum 1;}

ul.graphic_list li, ul.sbs_graphics li:first-child{float:left;}

ul.sbs_graphics li:first-child + li{float:right;}

ul.graphic_list li{
	margin-right:40px;
	margin-bottom:70px;
	padding:0;
}
ul.graphic_list img{display:block;}


div.graphic:before,
div.graphic:after,
ul.graphic_list li:before,
ul.graphic_list li:after,
ul.sbs_graphics li:before,
ul.sbs_graphics li:after,
dl.labelled_graphics dd:before,
dl.labelled_graphics dd:after,
dl.described_graphics div:before,
dl.described_graphics div:after
{
	display:block;
	font-size:0.8em;
	font-style:italic;
}

ul.sbs_graphics > li:first-child + li:before,
ul.sbs_graphics > li:first-child + li:after
{text-align:right;}


div.graphic:before,
ul.graphic_list li:before,
ul.sbs_graphics li:before,
dl.labelled_graphics dd:before,
dl.described_graphics div:before
{
	font-variant:small-caps;
	font-weight:bold;
}


ul.graphic_list li:before,
ul.sbs_graphics li:before,
dl.labelled_graphics dd:before,
dl.described_graphics div:before
{content:'Figure ' counter(chap_num) '.' counter(fig_num) counter(fig_subnum, lower-alpha);}

ul.sbs_graphics img{display:block;}
ul.sbs_graphics li:first-child + li{text-align:right;}

ul.sbs_graphics li:first-child + li img{float:right;}

ul.sbs_graphics li:first-child + li:after{clear:right;}


ul.graphic_list:after, ul.sbs_graphics:after{
	clear:both;
	content:'\A0';
	display:block;
	font-size:0em;
	height:0;
	margin:0;
	padding:0;
}

div.graphic:before{content:'Figure ' counter(chap_num) '.' counter(fig_num);}

div.graphic:after,
dl.labelled_graphics dd:after,
ul.sbs_graphics li:after,
ul.graphic_list li:after,
dl.described_graphics div:after
{content: attr(title);}

dl.described_graphics div{
	margin:20px 0 0 30px;
	padding:10px 0;
}
/* --- Example Links --- */

div.graphic a,
dl.labelled_graphics a,
ul.sbs_graphics a,
ul.graphic_list a,
dl.described_graphics a
{
	text-decoration:none;
	font-weight:normal;
}

a.eg_link:hover:after,
*[id|="JS"] a.no_js.eg_link:hover:after
{
	content: 'Click image to view example page.';
	padding:0.5em;
	margin:0 2em;
	font-size:80%;
	color:#000;
	border:0;
	border:1px solid black;
	background:rgb(255, 255, 230);
}

*[id|="JS"] a.eg_link:hover:after{content: 'Click image to view example page (Requires JavaScript)';}

a.eg_link[title]:hover:after,
*[id|="JS"] a.no_js.eg_link[title]:hover:after
{content: 'Click image to view example page (' attr(title) ')';}

*[id|="JS"] a.eg_link[title]:hover:after{content: 'Click image to view example page (Requires JavaScript.  ' attr(title) ')';}


ul.sbs_graphics a:hover:after{
	margin:1em 0;
	display:block;
	width:20em;
	text-align:left;
}
div.graphic a:hover:after, dl.labelled_graphics a:hover:after, dl.described_graphics a:hover:after{display:inline-block;}

ul.sbs_graphics li:first-child + li a:hover:after{
	clear:right;
	float:right;
}
ul.graphic_list a:hover:after{
	width:20em;
	display:block;
	position:relative;
	margin:0 0 -66px 0;
	top:30px;
}
/* ----------------- References to Chapters and Appendices ----------------- */

*.chap_title_ref, *.app_title_ref{font-style:oblique;}

*.chap_title_ref:before, 
*.chap_title_ref:after, 
*.app_title_ref:before, 
*.app_title_ref:after
{font-style:normal;}

*.chap_title_ref:before{content:'Chapter ' counter(chap_ref) ' (';}

*.chap_title_ref_parenth:before{content:'Chapter ' counter(chap_ref) ': ';}

*.app_title_ref:before{content:'Appendix ' counter(app_ref, upper-alpha) ' (';}

*.app_title_ref_parenth:before{content:' Appendix ' counter(app_ref) ': ';}

*.chap_title_ref:after, *.app_title_ref:after{content:')';}

*.chap_num_ref:after{content:' (Chapter ' counter(chap_ref) ') ';}

*.app_num_ref:after{content:' (Appendix ' counter(app_ref, upper-alpha) ')';}

/* ----------------- General Styling ----------------- */

em.extra{font-weight:bold;}

em.more{
	font-size:1.2em;
	color:red;
	border-bottom:medium double;
	text-transform:uppercase;
}

*.underline{text-decoration:underline;}

*.left{float:left;}

*.right{float:right;}

*.clear{clear:both;}

*.clear:before, *.clear:after{display:none;}

*.center{text-align:center;}

*.greek_letter{font:110% "Euclid", serif;}

strong.plural, dt strong{text-decoration:underline;}

div + p:before{
	display:block;
	border-top:1px solid #777;
	margin:30px 200px;
	height:1px;
	content:" ";
}

div.code + p:before, div.graphic + p:before{
	display:none;
}

/* ----------------- First Letter And First Line ----------------- */

div.chap_intro > p:first-child:first-letter{
	display:block;
	float:left;
	font-size:3em;
	line-height:1em;
	font-family:"Times New Roman", serif;
	text-indent:0px;
	padding:10px 10px 5px 5px;
}

div.chap_intro > p:first-child{text-indent:0px;}

div.chap_intro > p:first-child + *{clear:left;}
*.entity{
	text-decoration:blink;
	color:red;
}

/*

p.chap_links{display:none;}
a{color:black;text-decoration:none;}

/**/


/* ----------------- Warning ----------------- */
body[id] p:not([class]):not([id]),
body[id] ul:not([class]):not([id]),
body[id] ol:not([class]):not([id]),
body[id] li:not([class]):not([id]),
body[id] dl:not([class]):not([id]),
body[id] dd:not([class]):not([id]),
body[id] dt:not([class]):not([id])
{
	color:red;
	text-decoration:blink;
	border:red 2px solid;
	background:#fdd;
}