body
	{
	margin: 0px;
	padding: 0px;
	color: #333;
	font-size: .8em;
	font-family: "Comic Sans MS", Arial, Helvetica, Verdana, sans-serif;
	height: 100%;
	background: #a7a8a0 url(./wiquox.gif) repeat;
}
	
body img {
	border: none;
	}
	
#bodyContent
	{
	position: relative;
	display: block;
	}

/* hide left border and remove padding for printable version */
@media print
	{
	#bodyContent {border-left: 0; padding-left: 0px;}
	}
	
#container
	{
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	border-top: solid 5px #2e3192;
	padding-top: 99px;
	z-index: 1;
	width: 980px;
	background-color: #ffffff;
	overflow: hidden;
	}



#LIDCuseOnly
	{
	display: none;
	height: 0px;
	overflow: hidden;
	}

#absWrapper
	{
	position: relative;
	margin-left: auto;
	margin-right: auto;
	padding: 0 0 0 0;
	width: 980px;
	}

/* shrink for printable version */
@media print
	{
	#absWrapper {width: 600px;}
	}



/* This is a workaround for I.E. 6, which doesn't float the content contained within this DIV 
correctly unless some height is specified. It doesn't seem to cause trouble for the other web browsers. */

#bodyContent
	{
	height: 100%;
	}

/* shrink for printable version */
@media print
	{
	#bodyContent {width: 600px;}
	}

/* masthead area */
#header
	{
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 0 0 0px;
	border-left: solid 25px #a43e31;
	background-color: #6e6d64;
	background-repeat: no-repeat;
	background-position: top right;
	width: 980px;
	height: 76px;
	overflow: hidden;
	float: left;
	}

/* shrink for printable version, and remove border */
@media print
	{
	#header {width: 600; height: 20px; border-left: 0;}
	}

#banner_left
	{
	position: absolute;
	top: 0;
	left: 0;
	width: 490px;
	height: 76px;
	background-image: url(./banner_left.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	}

/* for printer-friendly version, remove background image (which probably wouldn't print anyway) and reduce height} */
@media print
	{
	#banner_left {height: 20px; background-image: none;}
	}

/* Note by John Dobson: these next two styles combine to create an invisible link underlying the background image; this technique was recommended at http://www.experts-exchange.com/Web/Web_Languages/HTML/Q_21554271.html as a replacement for using the HTML image tag with the usemap attribute. The link tag must be displayed as a block, but the text inside it can be hidden using a span tag inside it. */

#banner_left a
	{
	position: absolute;
	display: block;
	left: 65px;
	top: 5px;
	width: 310px;
	height: 76px;
	}

/* for printer-friendly version, hide the dummy link */
@media print
	{
	#banner_left a {display: none;}
	}

#banner_left a span
	{
	display: none;
	}

#revealOnPrint
	{
	display: none;
	}

/* Reveal the words "Simon Fraser University Library" for printable version */
@media print
	{
	#revealOnPrint {display: inline; font-size: 1.4em;}
	}

#banner_right
	{
	position: absolute;
	margin-left: 576px;
	width: 379px;
	height: 76px;
	background-image: url(./banner_right.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	}

/* hide for printable version */
@media print
	{
	#banner_right {display: none;}
	}

#topLinks
	{
	position: absolute;
	top: 70px;
	right: 0;
	left: 0;
	margin: 0 0 0 0px;
	background-color: #B5111A;
	padding-left: 40px;
	border-left: solid 25px #cb5a60;
	width: 915px;
	z-index: 2000;
	}

/* hide for printable version */
@media print
	{
	#topLinks, #pullDowns {display: none;}
	}

#topLinks,
#pullDowns
	{
	font-size: 15px;
	color: #cb5a60;
	}

#topLinks a,
#pullDowns a
	{
	display: block;
	float: left;
	margin: 0;
	padding: 4px 0 8px 0;
	border-bottom: solid 16px #b5111a;
	background-color: #b5111a;
	color: #ffffff;
	text-decoration: none;
	}

#topLinks a:hover
	{
	border-bottom-color: #cb5a60;
	text-decoration: none;
	}

#topLinks .spacer
	{
	margin-right: 40px;
	}

#topLinks .main
	{
	font-weight: bold;
	font-size: 1em;
	line-height: 1em;
	text-transform: uppercase;
	padding-top: 6px;
	}

#pullDowns
	{
	position: relative;
	float: right;
	z-index: 2000;
	padding: 0;
	margin: 0;
	font-size: 1em;
	}

#topLinks p
	{
	width: auto;
	float: none;
	position: relative;
	clear: none;
	}

#pullDowns li
	{
	position: relative;
	display: block;
	float: left;
	}

#pullDowns li ul li
	{
	width: 200px;
	color: #FFFFFF;
	clear: both;
	}

#pullDowns li:hover ul,
#pullDowns li ul.over
	{
	display: list-item;
	position: absolute;
	margin: 0;
	z-index: 200;
	color: #ffffff;
	top: 40px;
	left: 0px;
	width: 200px;
	}

#pullDowns li:hover ul
	{
	margin-top: 5px;
	}

#pullDowns li ul,
#pullDowns li ul li a
	{
	background-color: #cb5a60;
	padding: 0px;
	}

#pullDowns li ul li a
	{
	width: 100%;
	padding: 5px;
	margin: 0px;
	border: 0;
	}

#pullDowns li ul li a:hover
	{
	background-color: #b5111a;
	text-decoration: none;
	}

.divider
	{
	display: block;
	float: left;
	padding-top: 0.1em;
	margin: 1px 7px 0 7px;
	font-weight: bold;
	font-size: 1em;
	color: #cb5a60;
	}

.search .divider
	{
	margin-top: -2px;
	margin-right: -2px;
	}

.over #AtoZ, li:hover #AtoZ
	{
	width: 160px;
	z-index: 5;
	background-color: #cb5a60;
	padding: 5px;
	}

.over #AtoZ li,
li:hover #AtoZ li
	{
	font-size: 0.75em;
	width: 20px;
	height: 1.5em;
	overflow: hidden;
	display: block;
	position: relative;
	float: left;
	padding: 0;
	margin: 0;
	text-transform: uppercase;
	clear: none;
	}

#AtoZ li
	{
	clear: none;
	background-color: #b5111a;
	}

#topLinks .search
	{
	position: relative;
	float: right;
	color: #ffffff;
	margin: 0px;
	padding: 0;
	padding: .20em 10px 0 0;
	text-align: right;
	}

#topLinks .search a
	{
	margin-top: -3px;
	}

#topLinks .search p
	{
	position: relative;
	display: block;
	float: left;
	width: 200px;
	margin: 0;
	padding: 0;
	}

#topLinks .search label
	{
	display: inline;
	height: 2em;
	margin: 0px;
	padding: 0px;
	margin-top: -4px;
	}

#topLinks .search input
	{
	position: relative;
	display: inline;
	margin: 0;
	padding: 0;
	width: 100px;
	overflow: hidden;
	}



/* footer styles */

#footer
	{
	position: relative;
	clear: both;
	width: 980px;
	margin: 0;
	margin-top: 0px;
	background: #bbbbbb;
	color: #ffffff;
	text-align: center;
	padding-top: 6px;
	padding-bottom: 6px;
	}

/* shrink for printable version */
@media print
	{
	#footer {width: 600px;}
	}

#footer a
	{
	color: #ffffff;
	text-decoration: none;
	}

#footer a:hover
	{
	text-decoration: underline;
	}



/* "Flyout" script */

.flyout, .flyout ul
	{
	list-style: none;
	overflow: visible;
	}

.flyout li
	{
	position: relative;
	}
	
.flyout li ul
	{
	position: absolute;
	top: 45px;
	left: -40px;
	display: none;
	z-index: 200;
	}

/* Styles for Menu Items */
.flyout li a,
.flyout ul li a
	{
	display: block;
	text-decoration: none;
	}

/* Fix IE. Hide from IE Mac \*/
* html .flyout li
	{
	float: left; height: 1%;
	}

* html .flyout li a
	{
	height: 1%;
	}

* html .flyout ul li
	{
	float: left; height: 1%;
	}

* html .flyout ul li a
	{
	height: 1%;
	}
/* End */

.flyout li:hover ul,
.flyout li.over ul
	{
	display: block;
	} /* The magic */
