

@media screen,projection{

html{
border: 0;
}

body{
background-color: #fff;
font-family: tahoma, verdana, sans-serif;
font-size: 11px;
position: absolute;
right: 0px;
left: 0px;
margin: 0;
padding: 1% 2% 1% 0%;
background: #fff no-repeat bottom right fixed;
}

p{
text-align: justify;
margin-left: 2ex;
padding-left: 40px;
padding-right: 5%;
line-height: 1.2em;
font-family: verdana, sans-serif;
}

a:link,
a:visited,
a:hover,
a:active{
background-color: transparent;
}

a:link{
text-decoration: none;
color: #215DC6;
}

a:visited{
text-decoration: none;
color: #800080;
}

a:hover,
a:active{
color: #428EFF;
text-decoration: underline;
}

/*Body section*/

#pageHeader h1,
#pageHeader h2,
#preamble h2{
font-size: 12px;
display: inline;
}

#pageHeader h1{
text-transform: uppercase;
}

#pageHeader h2{
margin-left: 1ex;
padding-left: 1ex;
border-left: 2px solid #333;
}

#container #pageHeader,
#container #intro h3,
#container #supportingText h3,
#container #preamble h2,
#footer{
background: transparent url("images/headline.png") no-repeat bottom left;
padding-bottom: 2px;
font-size: 11px;
padding-left: 3ex;
padding-top: 10px;
}

#quickSummary{
width: 375px;
background-position: 25px 0px;
background-color: #EEEEEE;
padding-top: 3px;
padding-bottom: 3px;
}

#intro{
padding-top:30px;
}

#preamble{
position: absolute;
top: 65px;
left: 380px;
}

#footer{
visibility: hidden;
font-weight: bold;
text-transform: uppercase;
}

/*Links bar*/

#linkList{
width: 100%;
position: absolute;
top: 0;
right: 0px;
bottom: 0;
height: 30px;
text-align: right;
}

html>body #linkList{
background: #6375D6 repeat-x top left fixed;
position: fixed;
overflow: none;
}

#linkList2{
font-size: 11px;
}

#linkList2 h3{
visibility: hidden
background: #fff url("images/barhead.png") no-repeat top right;
height: 0px;
margin: 0;
color: #215DC6;
}

#linkList2>div,
#linkList2 h3:hover{
background-image: url("images/barhead_hot.png"); /*preload?*/
}

#linkList ul{
border-width: 0px 0px 1px 0px;
border-style: solid;
padding: 10px 0px;
margin: 0px 0px 15px;
background-color: #D6DFF7;
color: #215DC6;
font-size: 11px;
list-style-type: none;
}

#linkList li{
list-style-type: none;
margin: 0;
padding: 0px 10px;
line-height: 18px;
}

#linkList2 ul{
padding-left: 20px;
}

#linkList2 ul li{
text-indent: -20px;
}

#linkList2 ul li a{
padding: 2px 0px 2px 20px;
}

#lselect ul li a{
background: transparent url("images/css.png") no-repeat;
}

#lselect ul li a.c{
padding-left: 0;
background-image: none;
}

#lselect{
background-color: #EFF3FF;
color: inherit;
}

#linkList2>div#lselect{
background-image: none;
}

#lselect ul{
background: transparent no-repeat bottom right;
white-space: nowrap;
}

#lselect h3{
visibility: hidden;
background: #245ACB url("images/sidehead.png") no-repeat top right;
height: 0px;
position: relative;
color: #fff;
}

#lselect li{
display: inline;
}

#lselect h3:hover{
background-image: url("images/sidehead_hot.png"); /*preload?*/
}

#lselect h3 span{
background: transparent url("images/sideheadcorner.png") no-repeat top left;
height: 0px;
position: absolute;
bottom: 0;
color: #fff;
padding-left: 35px;
padding-top: 4px;
}

html>body #lselect h3 span{
padding-top: 10px;
}

#lresources, #larchives {
visibility: hidden;
}

/*Content Generation*/
#footer a:before{
content: "["
}
#footer a:after{
content: "]"
}

}

/*Printer friendliness*/
@media print{

body{
background-color: #fff;
color: #000;
font-family: Thesis, "Times New Roman", Times, serif;
}

h1,h2,h3,h4{
font-family: Gulliver, "trebuchet ms", sans-serif;
}

h1,h2,h3,h4{
page-break-after: avoid;
}

ul,ol{
page-break-before: avoid;
}

a:link,
a:visited,
a:hover,
a:active{
background-color: #fff; 
color: #000; 
text-decoration: none;
}

a[href]:after {
content: " (" attr(href) ")";
}

acronym {
border: 0;
}

acronym:after {
content: " (" attr(title) ")";
}


#footer,
#linkList{
display: none;
}


}

/*For the aural browsers..*/
@media aural{

acronym{speak: spell-out;}

h1,h2,h3{stress: 20;richness: 90;}

h1{pitch: x-low;pitch-range: 90;}

h2{pitch: x-low;pitch-range: 80;}

h3{pitch: low;pitch-range: 70;}

li{pitch: medium;richness: 60;}

}

/*

[2]
I manage to add  the sidebar  header image.  It works great  in IE 6 and
Firebird 0.6,  but  partially in  Opera 7.1.  Somehow the  sidebar image
disappears when you scroll down the page. Odd.

[1]
During the making of  this design, I accidentally  found two bugs, one
in Firebird 0.6 and another in Opera 7.1

1. When I implement a fixed/non-fixed  background image to the body tag,
the whole  page slows  down using  Firebird on  both Win98SE  and WinXP.
Might be a conflict with the background  image assigned to the html tag.
Rendering problems?

2. In  Opera, the  fixed  navbar  with  overflow:auto  doesn't  show the
scrollbar when you resize the window  smaller than the nav bar. At first
I thought Opera  cannot read  overflow:auto, but when  I reload the page
(still in smaller window), the scrollbar  appears. I try to maximize the
window, the  scrollbar  stays  there.  Reloaded the  page again  (in max
window), the scrollbar disappears. Huh?

*/