/* testbed for g5a into Style Sheet Tables - g5asst.css - 2009-12-14	*/
/* testbed for advances over g5 - applied to page issue60-opinion.html, bractcan.html */
/* based on BigBaer main */
/* WARNING this style sheet was from early CSS days and contains some bad decisions! */

body {
	margin: 0;
	padding: 0;
	color: Black;
	background-color : #ffFFff; /* test for holes colour #E9FFaF;  */
						/* sitewide Font Size datum! */
						/* px for VDUs (pt for hardcopy world - avoid) */
	/*	all other font sizes should em scale from this datum */
	/* font-size: 1em; 12px; em is ridiculously UA-dependant, unusable for now */
	/* font-size: 12px; didn't want to lock it in but can't find any other method */
	font-size: 12px;	/* of getting similar results from FFox and IE6 */					
}

#titlebar {
	/* background-color: #ddffdd; margin: 0; */
	/* padding: 0.1em 0 0.1em 0; or trigger - if neither, default background will show! */
	padding: 1px 0px 1px 0px; 
	background: url(../images/gradtbar2b100.jpg) repeat-x top /* , url(../images/TCAlogoLg.gif) top left */ ;
	/* gradtbar2 too strong, brightened, also #nav-bar 20091122	*/
	height: 62px;	/* 64px afterthought vastly improved browser consistency, even IE!
						No, it screwed up placement of h1 test too high...! See below */
}
#titlebar h1 {
	/* border: thin solid Blue; */
	margin-top: 16px;	/* only IE needs this, fixes height fix above... */
	/* padding-bottom: 20px; */
}

#tl {
	position: absolute; /* Topstyle set CSS1 until this, used by Sitepoint. Works even in IE */
	top: 4px;
	left: 2%;
	width: 38px; /* not sure why Sitepoint specify width - makes not reusable - but if it helps */
	height: 60px;
}
#weFix {
	position: absolute;
	top: 0;
	right: 0;
	width: 127px;
	height: 127px;
}
#nav-bar { /* padding: 0em 0.5em 0em 0.5em; */
	padding-bottom: 0.3em;	/* padding: 0 0 0.3em 0; back to the same! */
	background: #ffeecc;/* #c0ffc0; 20091122 was #90EE90; tried Pancon; #f1d486; #ddffdd; */
}
#nav-bar a {
	/* padding: 0.3em 6em; this padding from div.to_top no good here; see above */
	/* display: block; but infers linefeeds between h2 components */
}
#nav-bar h2 {
	margin-top: 0em; 
	margin-bottom: 0em;
}
#nav-bar h2 a { 
	font-size: smaller; 
}
#nav-bar:hover, .to-top:hover {
	background: White;
	background-color: #afeeee; /* #f1d486; 20091122 was #AFEEEE; and others...	*/
} /* NOT in IE6 ! */

#content {
/*	margin-left: 8%;  20070805 was DEFAULT MARGIN FOR ALL CONTENT   **************	 */
/*	margin-left: 4%;  20091214 was trial DEFAULT MARGIN FOR ALL CONTENT   **************	 */
/*	margin-left: 0;  20091215 removed DEFAULT MARGIN FOR ALL CONTENT ;
						added 8% to all other margin-lefts, simpler  **************	 */
/* 	border: 4px inset #c0c0c0; for checking 20070805 
	padding: 0 35px; for checking 20070805 */
	padding: 0.5em 0.5em 1.5em 0.5em; /*	*/
	background-color: White;
}
						/* new 20091214 */
#ss-table {
	display: table;	/* ref Everything You Know About CSS Is Wrong! p30	*/
	margin-left: auto;
/*	padding-left: 0px;	*/
	margin-right: auto;
	margin-top: 10px;	/* 20091218 ! */
	margin-bottom: 10px;
}
#ss-table p {
	margin-left: 0;
}
#sscol1 {
	display: table-cell;
	width: 300px;
	padding-left: 20px;
/* 	border: 1px solid Yellow;*/
}
#sscol2 {
	display: table-cell;
	width: 300px;
	padding-left: 20px;
}

html, body, h1, h3, p, ul, ol, li, input {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

h1 {
	color: #009900;
	text-align: center;
	/*font-size: 2.3em;  16pt; */
	font-size: 2.0em; 
}

h1.BlkCtrd { 	font-size: 1.2em ; }

h2 {
	color: Olive;
	margin-left :  4%; /* 2em; */
	font-size : 1.4em; 
	font-family : serif;
	font-style : italic;
}

#content h2 {
	/* margin-top: 0em;  after nav-bar, kills default top background padding of h2 */
	/* but don't need it provided there is a little padding below nav-bar */
	margin-bottom: 0.3em; /* use with p.top or h2+p to reduce space under h2 */
	margin-left : 4%; /* 20091215 was -4%; 20070805 */
	/* padding-top: 1em; 20070806 */
}

#content h3	{
	color: Gray;
	font-size: 1.1em;
	margin-left: 6%; /* 20091215 was -2%; */
	margin-bottom: 0.3em;	/* needed with h3+p to reduce space under h3 */
}

h3+p	{	/* from g5 doesn't work here unless h3 margbot reduced */
	margin-top: 0.4em;
}

/* h2 a { 	font-size: smaller; }	not used outside of nav-bar, delete? */

/* .flush { 	margin-left: 8%; } 4em 20070805 redundant? Not quite - */
.flush { 	margin-left: 0; } /* overide table default style full width */

hr {
/*	margin-left: -8%;  20070805 jeez, IE even does this differently! seldom used */
}
	
address {
	margin-left: 12em; /* 20091215 was 8em; */
}
.strike {	text-decoration: line-through;} /* undeprecate 200808 */
.tight { margin-top: 0; margin-bottom: 0;}
.padtight {
	padding-top: 0;
	padding-bottom: 0;
}
p {
	margin-left: 8%;
	margin-top: 0.7em; /* long needed reductions above & below, 2009 August 03	*/
	margin-bottom: 0.7em;
}

						/* new 20091214 */
#ss-table p {
	text-align: justify;
	text-indent: 1em;
}
#footer p {
/*	margin: 0.7em 0.7em;	 long needed reductions above & below, 2009 August 03	*/
	margin-left: 0.7em;	/* 20091215	*/
}


.margtop0	{	margin-top: 0;	}	/* durn it, ought had this from start */
.margbot0	{	margin-bottom: 0;	}	/* AAaargh - Firefox ignors it... had no semicolon? */
/*.margleft0	{	margin-left: -8%;	}	 20091206 yeah undoes #content, 20091215 superfluous */

p.next {text-align:right; font-size:1em; font-weight:bold;}
.tar {	text-align: right; /* 200508 papabaer I think */}

.tac {	text-align: center; }
.tal {	text-align: left;}
.topctr {	margin-top: 0; text-align: center;} /* 200610 frameset nav restorer */
.noborder {	border: none; }	/* hack to defeat td img - see separate table.noborder */
.tall	{						/* vertically-spread eg list items	2007 Oct but see below	*/
/*	line-height: 1.2em;	 1.5em preferable in parent, not txy in each element	*/
}
.tall li {
	padding-top: 0.4em;	/* what was really intended above	*/
}

p.tac {
/*	margin-left: 0;		 oops there was no ; 	200802 until 20080508	*/
}

#unwide p {
	width: 41em;
}

#unwide li {	/* IE7 bug decoration on bottom line of wrapped */
	width: 41em;
}


#alph { }	/* this div just to confine first-letter, below */
#alph p {
	margin-top: 0;
	margin-bottom: 0.5em;
}
#alph p:first-letter {
	font-weight: bolder;
	font-size: 1.2em; 
	/* text-indent: 0; IE does an indent by text size and ignors this */
}

.unflo {	clear: both; } /* unflow the text - had been confined to br.unflo */
.unflol { 	clear: left; }
.unflor {	clear: right; }

.hide {
	display: none;
}

table {		/* border: thin outset; */
	background-color: #c0ffc0; /* #90ee90; #99ff99; background is table border colour */
	/*margin-left: -8.5%;  new 20070807 default to full width suit existing html. IEodd */
	/* padding-left: 0;	nope, didn't reveal why; other browsers undercorrect?	*/
}	
				
/* tbody.valtop 		 removed tbody prefix 200812 */
.valtop	{	vertical-align: top;	/*	20070712	text to top of big cells - for plumguide */
}										/*  tbody (no class) happens once defined whether called or not! */

table.noborder {	background: transparent;	/* a ul without points but tidy columns! */
}		/* bad classname  */

table.flush.noborder	{	margin-left: 7%;	/* td left flush(er) rather than border flush */
}		/* horrible? where cascade? so much for semantics */

th {
	color: Black;
	font-style: italic;
	font-weight: bold;
	font-family: serif;
	font-size: 1.2em; /* 10pt; */
	background-color: #c0ffc0; /* #a8FFa8 99FF99 90EE90; 200807 and border and Panhi paled */
	padding: 0.2em 0.5em;
}
td {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; /*font-size : small;*/
	background-color: White;
	padding: 0.2em 0.5em; /* border: thin inset #ddffdd; */
}

td img {
	border: thin outset Gray;	/* see overide noborder */
}
.ovrscr	{
	border-top: 1px solid Black; /* cell overscore? */
}

table.mini {
	/* border: none;	doesn't work; use */
	background-color: White;	/* hides border */
	margin-left: 0px;	/* undo flush */
}

table.mini td	{
padding: 0em 0.5em;	/* tighten top & bot */
}

.txy {
	padding-top: 0.5em;	/* for text tables & lists, more head/foot room */
	padding-bottom: 0.5em;
}

ul.toc, ol.toc {	list-style: none;
	line-height: 135%;
	/*	padding: 10em;
	background: #ffffff;
	margin-right: 1em;
	margin-left: 1em; */
}

li {
	/* font-size: 9pt; */
	margin-left : 8%; /* 4em; removed 20070804, reworked 20091216 */
	/* line-height: 150%;
	list-style-image: url(../images/ico1.png); oops a bit too invasive */
}

li li {
/*	margin-left : -2em;  4em; dont know why this change needed, g5 better? */
	margin-left : 6em; /* 20091215 was -2em; */
	list-style-type : circle;
}

td li { 	margin-left: 5%; }	/* 20091215 was -3%; */

dl {
	border-left: thick solid #99ff99;
	margin-left: 12%;	/* 20091215 was 4%; */
}
dl.plain {
	border-left: none;
	margin-left: 12%;	/* 20091215 was 4%; */
}

dt {
	margin-left: 10%;	/* 20091215 was 2%; */
	font-style: italic;
	font-weight: bold;
	color: #009900;
}
dl.plain dt {
	margin-left: 8%;	/* 20091215 was 0; */
	font-style: normal;
	font-weight: normal;
	color: black;
}

dd	{	margin-left: 18%; }	/* 20091215 was 10%; */
dl.plain dd {
	margin-left: 14%;	/* 20091215 was 6%; */
}

/* ************ link ************** */

a {
	text-decoration: none;
	color: #990000;
	font-weight: bold;
}

a:hover {	color: Red; text-decoration: underline;}
a:focus {	color : Yellow;}
a:active {	color : Yellow;}
a:visited {	color: #993399;} /* re-enable later? */
a img { border-style: none; } /*no blue or other link-indicating border */

.ctr {	text-align: center;}	/* img in p (autopadded), div, span... = .tac ? */

.ctr0 {						/* serious usage: <table class="ctr0"... */
	margin-left: auto; 	/* it doesn't centre cells in IE6 or FFox */
	margin-right: auto;	/* http://theodorakis.net/tablecentertest.html */
}	/* because we have default wider left margin, this is not quite centred - */
.rauto {		margin-right: auto;	}
.lauto {
	margin-left: auto;
}
/*.fullwide {				  use div.fullwide, true centred content eg using ctr0 */
/*	margin-left: -8%;  0; 20070807  
}*/

.bar {
	margin-right: 0; /* block align right */
	margin-left: auto;
}

.old_boxl {	/* DONT USE - SEE BELOW	20091215	*/
	float: left; /* margin-top : 20px; opera overwrote with wrapped text  */
	margin-right: 1em;	/* 20091215 was too much at 2em; */
	margin-bottom: 1em;	/* 20091215 was too much at 2em; */
	/* border-bottom: 10px; study why nogo someday... */
}	
.old_boxr {
	float : right;
	margin-top : 0.5em; /* 20px; opera OK then FFox 20091210 overwrote with wrapped text */
	margin-left : 1em;	/* 20091214 was too much at 2em; */
	margin-bottom : 1em;	/* 20091214 was too much at 2em; */
}

.boxl {
	float: left; 
	padding: 12px;
}	

.boxr {
	float : right;
	padding: 12px;
}
/* .floati {
	200912 eg. table avoid padding because becomes fat border	
	float: inherit;
	margin: 12px;
}*/
.icol {
	float: left;
	width: 41px;	/* seems to help IE7	*/
	height: 60px;
	margin-top: -30px;	/* -20px */
/*	margin-left: -7%;	20091215	*/
	margin-left: 1%;	/* 8-7=1% 20091215 */
}
a:hover img.icol {
	background-color: #AFEEEE;
	border: thin solid;
	border-color: Aqua;
}
div.to-top {
	background-color: #ddffdd; /* padding moved to div.to-top a */
/*	margin-left: -8%;  overide content left margin, bar close to page left; but see below */
}

img.icol+div.to-top, a+div.to-top, td div.to-top {	/* .icol different if logo is a link	*/
/* NB for IE NO WHITESPACE in html after icol before div.to-top ... else this fails!
#logo+div.to-top, #treehome+div.to-top { treehome+ specific, a+ too wild	*/ 
	margin-left: 8%;	/* 20091215 was 0px; reinstate content left margin, room for logo	*/
}
div.to-top a {
	padding: 0.3em 2em 0.3em 8%; /* 0.3em 6em;	20070714 from above */
	display: block;	/* increases clickable area otherwise a href default in-line txt only */
}

div.figc {
	/* float: none; */
	margin-left: auto;
	margin-right: auto;
	/* text-align: center; */
	width: 360px;	/* width of photo; else 40% -FIND A BETTER METHOD! */
	border: thin silver solid;
	padding: 1em 0.5em;
}
div.figr {
  float: right;
 /* width: 75%; */
  border: thin silver solid;
  margin: 1em;
  padding: 1em 0.5em;
}
div.figl {
	float: left;
/*	width: 75% */
  border: thin silver solid;
  margin: 1em 1em 1em 2em; /* left-marg compromise between IE and FFox rendering */
  padding: 1em 0.5em;
}
div.figl p, div.figc p, div.figr p {
	text-align: center;
	font-style: normal;
	font-size: smaller; /* text-indent: 0; */
	margin: 0; /* to over-ride my p left margin.  But in figc, p screws right margin? */
	/* margin-left: 0; no better */
}
img.scaled {  width: 100%; 
}

.smalltxt{
	font-family: sans-serif; /* font-size: 0.8em;6pt; */
	font-size: smaller;
}

.loud {
	color : Red;
	/* font-size : large; */
	font-weight : bold;
}

.warn {
	color : #FF9900;
	font-weight : bold;
}

.endorse {
	color : #009900;
	font-weight : bold;
}

.pencil {
	color : Silver;
}

.pencil a	{
	color: #FA8072;
}

.pencil a:visited	{
	color: #FA71ED;
}

.Panbod {
	background-color: White;
	padding-bottom: 2pt; /*great pads the panel below the text*/
	/* padding-left: 2%; bugger, this pads the text not the panel*/
}

.Panold {
	background-color : #EEEEEE;
}

.Panlo {
	background-color: #bbddaa;
}  

.Panhi {
	background-color : #ddffdd;	/* 99FF99 toning down 20080715 */
}

.Pancon {
	background-color: #FFFFCC;
	padding: 0.1em 2em; /* vertically 1em or none... */
}

.Panbod img {
	padding: 1em;
} 
 
#footer img {/*, inherit boxl, boxr !
	margin: 1em;
	border: 1px dotted Teal; */
}

.SmallCtrd {
	font-family : serif;
	color : Black;
	background-color : transparent;
	font-size : 9pt;
	text-align : center;
}

.SmallLeft {	/* 200812 */
	font-family : serif;
	color : Black;
	background-color : transparent;
	font-size : 9pt;
}

p.SmallCtrd {	/* yeah, its different to the above... */
/*	margin-left: 0;	*/
}

.BlkCtrd {
	color: Black;
	background-color : transparent;
	text-align:	center;
	font-weight: bolder;
}

.BlkEmph {
	color : Black;
	background-color : transparent;
	font-style : italic;
	font-weight : bolder;
	font-family : serif;
	font-size : 125%;
}

#footer {
	padding: 0.5em 2% 0.2em 2%;
	background: #ddffdd;
	margin: 0; 
}


fieldset {	/*	 REF. Art & Science CSS book FORMS	*/
	float: left;
	clear: left;
	width: 100%; /* 99.5% 100% was too wide? */
	margin: 0 0 1.5em -4%;	/* marg rt compromise #content stuck with width 100-8=92% ? */
	padding: 0;
	border-color: #ddffdd; /* #90EE90#ddffdd#99FF99 */
	border-style: solid;
	border-width: thick;
}
legend {
	margin-left: 1em;
	color: #000000;
	font-weight: bold;
}
fieldset ol {
	padding: 0.2em 0.5em 0 5em; /*  */
	list-style: none;
}
fieldset table {
	width: 100%;	/* works well, disable while designing table contents */
	/* padding: 0; */
	/* margin: 0.5em 0 0 0; applies to every table in each fieldset */
	 /* padding: 0.2em 0.5em 0 0.5em; unfortunately takes on table background colour */
	/* border: none; */
	/* background-color: #ddffdd; as fieldset colour */
}
fieldset td{
	/* padding: 1em; */
}

fieldset li {
	float: left;
	clear: left;
	width: 100%;
	padding-bottom: 0.5em;
}
li label {		/* li prefixed so label unfazed elsewhere 200812 */
	float: left;
	width: 50%;	/* 25em22em unwelcome committment, longest label */
	margin-right: 1em;
	text-align: right; /*  omit for left align */
}
label.disabled {
	color: silver;
}
fieldset.submit {
	float: none;
	width: auto;
	border: 0 none #FFF; 
	/* padding-left: 28em;	needed if no label for submit? */
}

