html {overflow: scroll} /*force scrollbars to show in all browsers*/

	BODY {
		padding: 0px;
		margin: 0px;
		height:100%;
		width:100%;
		background: url('/images/home/background.gif') repeat-y #E8E8E8;
	}
	
	H1, H2, H3, H4, H5, H6 {
		margin: 0px;
		padding: 0px;
	}
	
	.dispBlock {
		display: block;
	}
	
	/*	
	*	to make it work, the text must be inside the container, but outside of the span 
	*	such as:
	*
	*	<div class="hiddenText" id="testImgText">
	*		<span><!-- --></span>
	*		This is the hidden text
	*	</div>
	*
	*	The class hiddenText is defined below and the id testImgText will be defined later
	*/
	/*this is the container around the span*/
	.hiddenText {
		/*allows position: absolute to reference the top corner of this element as (0,0)*/
		position: relative;
		/*hides the text if the font size is increased too much*/
		overflow: hidden;
	}
	/*this is the span*/
	.hiddenText span {
		/*position the span on top of its container*/
		position: absolute;
		top: 0px; left: 0px;
		z-index: 1;
		/*must be set to display block or it won't hold height and width properly*/
		display: block;
	}
	/*
	*	The styling for hiddenText and the span are provided, however additional info is required.
	*	Height and width must be set on the span and the container and the image must be set 
	*	on the span.  So a convention as follows would be good:
	*	
	*	#testImgText {
	*	}
	*	#testImgText span {
	*		background: url('/images/home/getflash.gif') no-repeat;
	*	}
	*	#testImgText, #testImgText span {
	*		width: 207px;
	*		height: 59px;
	*	}
	*
	*	SEE EXAMPLE BELOW FOR USING A TAGS INSTEAD OF DIVS
	*/
	
	#getflashlink {
	}
	#getflashlink span {
		background: url('/images/home/getflash.gif') no-repeat;
		cursor: pointer;
	}
	#getflashlink, #getflashlink span {
		width: 207px;
		height: 59px;
	}
	
	#archerLogo {
		float: left;
		margin-left: 302px;
		display: inline;
	}
	#archerLogo span {
		background: url('/images/home/logo.gif') no-repeat;
	}
	#archerLogo, #archerLogo span {
		width: 364px;
		height: 89px;
	}
	
	#addressInfo {
		float: left;
		margin-top: 99px;
	}
	#addressInfo span {
		background: url('/images/home/address.gif') no-repeat;
	}
	#addressInfo, #addressInfo span {
		width: 717px;
		height: 19px;
	}
	
	#loginLink {
		float: left;
		line-height: 19px;
	}
	#loginLink span {
		background: url('/images/home/button_login.gif') no-repeat;
		cursor: pointer;
	}
	#loginLink, #loginLink span {
		width: 63px;
		height: 19px;
	}
	
	
	#link_container {
		padding: 56px 0px 0px 660px; 
		clear: both;
	}
	/*	define the container element(s)	*/
	#link_container a {
		position: relative;
		overflow: hidden;
	}
	/*	define the span(s) to display the image */
	#link_container a span {
		position: absolute; 
		top: 0px; 
		left: 0px;
		display: block;
		z-index: 1;
		margin: 0px;
		padding: 0px;
		cursor: pointer;
	}
	
	/* 
	*	set the heights, widths and images
	*	the a tag hover state should be used for mouseover rather than script
	*	The only caveat is that the image for the on state and over state
	*	need to be the same image.  See an image below for an example
	*/
	#L1_102723, #L1_102723 span {width: 234px; height: 36px; }
	#L1_102723 span {background: url(/images/home/L1_1.gif) no-repeat;}
	#L1_102723:hover span {background-position: 0px -36px;}
	
	#L1_102724, #L1_102724 span {width: 234px;height: 43px;}
	#L1_102724 span { background: url(/images/home/L1_2.gif) no-repeat; }
	#L1_102724:hover span {background-position: 0px -43px;}
	
	#L1_102725, #L1_102725 span {width: 234px;height: 49px;}
	#L1_102725 span { background: url(/images/home/L1_3.gif) no-repeat;}
	#L1_102725:hover span {background-position: 0px -49px;}
	
	#L1_102726, #L1_102726 span {width: 234px;height: 49px;}
	#L1_102726 span { background: url(/images/home/L1_4.gif) no-repeat;}
	#L1_102726:hover span {background-position: 0px -49px;}
	
	#L1_102727, #L1_102727 span {width: 234px;height: 42px;}
	#L1_102727 span { background: url(/images/home/L1_5.gif) no-repeat;}
	#L1_102727:hover span {background-position: 0px -42px;}
	
	#L1_102728, #L1_102728 span {width: 234px;height: 35px;}
	#L1_102728 span { background: url(/images/home/L1_6.gif) no-repeat;}
	#L1_102728:hover span {background-position: 0px -35px;}