
/* Because of the "challenge", I cannot use an external Styles Sheet for these styles, so I am using the Caio's hack to make sure NN4 does not see them *//*/*/
    


body {
    /* background-image : url(img/trta.gif) */;
    background-color : white;
/*    background-image : url(img/trta.gif);
    background-position : top right;
    background-repeat : no-repeat;*/
    color : #333;
    font-family : "Bitstream Vera Sans",Arial,Helvetica,sans-serif;
    font-size : 101%;
    margin-bottom : 20px;
    margin-left : 20px;
    margin-right : 20px;
    margin-top : 20px;
    padding-bottom : 0;
    padding-left : 0;
    padding-right : 0;
    padding-top : 0;
  }


h1, h2, h3 {
font-family : trebuchet, verdana, fantasy;
padding-top:1em;
padding-bottom:1em;
  }


h1 {
	font-family : Brushstroke, trebuchet, verdana, fantasy;
	font-size:2em;
	border-bottom:1px dotted #333;
  }


h2 {
	font-family : trebuchet, verdana, fantasy;
	font-size:1.8em;
	border-bottom:1px dotted #333;
  }


h3 {
	font-family : trebuchet, verdana, fantasy;
	font-size:1.6em;
  }


li,li a {
    background-position:0 50%;
    background-repeat:no-repeat;
    list-style-type:none;
    line-height:1.6em;
    min-height:1.6em;
  }


acronym {
    border-bottom:1px dotted #000;
    cursor:help;
  }


img {
    border:0;
  }


a:link,a:visited {
    color:#c30;
  }


a:hover,a:focus {
    background-color:#ffc;
    text-decoration:none;
  }


.more {
    padding-bottom:20px;
    border-top:1px solid #919191;
  }


#footer a:hover,#footer a:focus {
    color:#000;
  }


#skipto {
    margin:0 0 8px 0;
  }


#skipto a {
    font-size:.7em;
    color:#ccc;
    text-decoration:none;
  }


#skipto a:hover, #skipto a:active, #skipto a:focus {
    color:#fff;
    text-decoration:underline;
  }

/* Do *not* go shorthand with the background image here or Opera 6 won't play nice *//*/*/
    


#wrapper {
    min-width:900px;
    width:100%;
/*     background-image: url(img/bg80.png); */
    background-position:right;
    /* background-repeat:repeat-y;
    *//* background-color:#fff;
    */
/* border-top:1px solid #CCC; */
    border-bottom:3px solid #333;
    border-right:1px solid #333;
/*     border-left:1px solid #CCC; */
  }


#masthead {
    height:100px;
    border-bottom: 1px solid #333;
/* background:url(img/masterhead.png) #ffffe8; */
background-color: white;
 background:url(images/masterhead.png) #fff;
background-repeat:repeat-y;
background-position:top right;
  }


#masthead img {
    float:right;
/*     width:186px; */
  }

/* In the markup, if this DIV was right below #wrapper I would not have to declare any padding in there (only the background declaration), but with this particular order in the markup helps for the faux-columns in NN4. 
    If you do not need to support NN4, remove the padding declaration here and the negative top-margin in #TJK. BTW, the padding here is to prevent a gap between the DIVs *//*/*/
    


#inner_wrapper {
    padding-top:1px;
/*     background:url(img/left.png) repeat-y; */

/*background-image: url(images/bg_yellow_bright.gif);
background-repeat:repeat-y;*/

/* border-left:1px solid #CCC;  */
  }


#TJK {
    float:left;
    width:100%;
    padding:0;
    margin:-1px 0 0 -180px;
  }

/* display:inline is used here because IE double the margins on floats *//*/*/
    


#leftcolumn {
    display:inline;
    float:left;
    width:160px;
    padding:0 0 20px 0;
    margin:0 0 0 180px;
    font-size:0.85em;
/*     border-left:1px solid #CCC;  */
    /* background-color:transparent;
    */
/*background-image: url(img/bg_yellow_bright.gif);
background-repeat:repeat-y;*/
  }


#leftcolumn ul {
font-family : Brushstroke, fantasy;
    border-bottom:1px solid #9899B1;
    margin:0;
    padding:0;
    width:160px;
/*background-image: url(img/line_grey.gif);
background-repeat:repeat-y;*/
  }

/* If you do not use MARGIN here Opera 6 will show a gap between the List Items *//*/*/
    


#leftcolumn li {
    list-style-type:none;
    margin:0;
  }


#leftcolumn h3,#leftcolumn p {
    padding:0 9px;
    color:#ffc;
  }


#leftcolumn ul a, #leftcolumn ul a:visited {
/*     background-color:#fafada; */
    border-top:1px solid #9697B1;
    border-bottom:1px solid #4B4D65;
    color:black;
    display:block;
    padding-left:16px;
    text-decoration:none;
/*background-image: url(img/menu-bg.png);
background-repeat:repeat-y;*/
  }


#leftcolumn ul a.current,    #leftcolumn ul a:hover/*     #leftcolumn ul a:active, *//*     #leftcolumn ul a:focus   */ {
/*     background-color:#dbdbc8; */
    border-top-color:black;
    color:#0;
background-image:url(images/arrow_grey_001.gif);
background-repeat: no-repeat;
background-position:center left;
/*background-image: url(img/line_yellow_bright.gif);
background-repeat:repeat-y;*/

  }


#leftcolumn ul a.current {
/*     background-color:#fde039; */
background-image: url(images/line_yellow.gif);
background-repeat:repeat-y;
  }


#leftcolumn p {
    margin-right:10px;
    text-align:justify;
    color:#ccc;
  }


#middleCol {
    margin:0 0 0 340px;
    padding:0;
    font-size:0.9em;
    /* background-color: transparent;
    *//* background-image: url(img/bg80.png);
    */

  }


#middleCol ul {
    margin:15px;
    padding:0;
  }


#middleCol li {
/*    background-image:url(img/bullet_w.gif);
    background-position:0 0.35em;*/
    padding:0 0 0 20px;
  }


#middleCol p {
    line-height:1.5em;
    margin:0 12px;
    text-align:justify;
  }


#middleCol h1,#middleCol h2 {
    margin:16px 3px 10px 10px;
  }

/* Do NOT declare a width for #rightcolumn (IE5 would accept only auto). Sizing this element is done through the negative margin (a bigger negative value widers the sidebar) *//*/*/
    


#rightcolumn {
    font-size:0.75em;
    padding:0 0 20px 100%;
    margin:0 0 0 -170px;
/* margin-top:220px; */
/*     background-image: url(img/bg80.png); */

  }


#rightcolumn ul {
    margin:12px 0 0 0;
    padding:0;
  }


#rightcolumn li {
/*    background-image:url(img/bullet.gif);*/
    padding:0 0 0 20px;
  }


#rightcolumn p {
    margin-right:20px;
    text-align:justify;
    color:#800040;
  }

#rightcolumn a:hover {
    background-color:transparent;
}

#rightcolumn ul li a:hover {
    background-color:#eee;
}

#rightcolumn ul li {
    margin-bottom:1.5em;
	margin-top:1.5em;
}

#footer p {
    color:#CCC;
    font-size:.7em;
    margin-top:7px;
  }


#footer a {
    color:#c00
  }


#rightcolumn .UAs li {
    background-position:right center;
    text-align:right;
    margin:0 10px 0 0;
    padding:0 23px 0 0;
    color:#800040;
  }

/* I am using an image in this DIV instead of a "&nbsp;" for better results across browsers  *//*/*/
    


.clearer {
    clear:both;
    line-height:0;
    height:0;
  }


.note {
    font-size:0.8em;
  }


.js {
    display:none;
  }

ul li a {
	color:brown;
}



div.warning {
	padding:1em;
	margin:1em;
	margin-left:0;
	border:1px solid red;
}
div.warning p {
	color:red;
	font-weight:bold;
	margin-bottom:1em;
}













pre.code {
	border:1px dotted grey;
	background-color: #eeeeff;
	margin-right:2em;
overflow: auto;
}
div.section,
/* <!--  div.subsection, --> */
div.code,
div.location {
	padding-left:2em;
	padding-bottom:1em;
}
p.location-item,
p.sources-item {
	padding-left:2em;
	font-style: italic;
	background-color: #fafaff;
	margin-right:2em; 
	display:block;
}
div.location,
div.sources {
/* <!-- 	border:1px dotted grey; --> */
/* <!--	background-color: #fafaff;--> */
	margin-right:2em;
}

/* <!-- highlight --> */
div.script {
margin:0;

overflow: auto;
border:1px dotted grey;
background-color:#f2f2ff;
}

 ol.script {

	line-height: 3px;
/* 	font-size:0.9em; */
	background-color:#eaeaff;
	margin:0;
}
ol.script li {
 	margin:0; 
/* 	font-size:0.6em; */
 	margin-left:1.2em; 
/* padding:.5em 0 0 .5em; */
	background-color:#f2f2ff; list-style-type: decimal; 
}


ul.script, ul.script li {
	list-style-type: none; 
	line-height: 1.2em;
	font-size:1em;
	background-color:#fafaff;
/* 	margin:0; */
}
ul.script li {
/* 	margin:0; */
	margin-left:2em;
	background-color:#f2f2ff;
}


.hl  { 
	color:#000000; 
/* <!-- 	background-color:#fafaff; --> */
	font-size:1em;
	font-family:Courier New;
}
.num    { color:#2928ff; }
.esc    { color:#ff00ff; }
.str    { color:#ff0000; }
.dstr   { color:#818100; }
.slc    { color:#838183; font-style:italic; }
.com    { color:#838183; font-style:italic; }
.dir    { color:#008200; }
.sym    { color:#000000; }
.line   { color:#555555; }
.kwa    { color:#000000; font-weight:bold; }
.kwb    { color:#830000; }
.kwc    { color:#000000; font-weight:bold; }
.kwd    { color:#010181; }




.toggle 
{	
	background: transparent url('./images/arrow-down.gif')  .25em .25em no-repeat;
	text-indent: 20px;
	cursor:pointer;
}

.toggle.closed
{
	background: transparent url('./images/arrow-right.gif') .25em .25em no-repeat;
}

.hidden
{
	display:none;
}



div.disc  {
	padding-left:2em;
}

div.disc ul li {
	list-style-type : disc;
}



/* */
