/* CSS Document */

*  {
	margin:0;
	padding:0;
}

body {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: black;
	/* decimal fontsize fixing font resizing bug in IE5/6 */
	font-size : 100.01%;
	/*background-color: #336699; */
	background: #336699 url(../images/backgrounds/mmaTop.gif) no-repeat 50% -28px; 
	min-width: 990px;


}

h1,h2,h3, h3 a, h4, h5 {
	font-family: Arial, Helvetica, sans-serif;
	color: #fff;
	font-weight : bold;
}

h3, h3 a{
	font-size:16px;
}	

 h3 a:hover {
	color: #ffCC33;
}

h1 strong,h2 strong,h3 strong {
	color: #ffcc33;
}

a {
	color: #004276;
	font-size: 10.5px;
	/*letter-spacing: -0.075em; */
	/*color: #336699; */
	font-weight: bold;
	text-decoration: none;
}

p, ul {
	font-size: 10px;
}

/* SET LEFT AND RIGHT MARGINS FOR FULL WIDTH TEXT */
p {
	margin: 0 30px 0 40px; 
}

a:hover {
	color: #ca0002;
	/*color: #336699; */
	text-decoration: none;
}

form {
	margin:10px 0 5px 0;
	padding: 5px 0 0 0 ;
}

fieldset {
	border:none;
}

form img {
	
}

input.searchField {	
	width:460px;
	margin: 0 0 5px 0 ; 

}

/*---------------------------- RULES FOR BOX -----------------------------*/


.box {
	background: #fff;
	margin: 0 0 10px 0; 
	padding: 9px 3px 10px 8px;  
	border: 1px solid #6d6c6c;
}

.box p {
/* HACK INCORPORATED TO STOP PEEKABOO BUG IN IE */
	position:relative; 
	margin-top:5px;
	margin-bottom: 8px;
}

.box h3 { 
	margin-left:0;
	margin-bottom: 20px;
	/* HACK INCORPORATED TO STOP PEEKABOO BUG IN IE */
	 position:relative; 
}

.box h4 {
	font-size: 13px;
}

.box h4 a {
/* HACK INCORPORATED TO STOP PEEKABOO BUG IN IE */
	position:relative; 
	font-size: 13px;
	/* IF YOU SET A BORDER FOR h4 and h4 a THEN THE BORDER WILL APPEAR TWICE UNLESS IN A LIST???? */ 
	line-height:12px; 
	margin:0;
}

.box h4, .box h5 {
	color: #000000;   
}

.box h5 {
	font-size: 11px;
	line-height:12px; 

	float:left; 
	vertical-align:baseline;
	margin-right:5px;
}

/* IMPORTANT: NOTE THAT IF THE COLOR OF h4 IS CHANGED FROM STANDARD a THEN HOVER SET FOR a (a:hover) NO LONGER WORKS */
.box h4 a {
	color: #336699;
	border: none; 
}

.box h4 a:hover {
	color: #ca0002;
}

/* ---------------------------- BOX LIST RULES ----------------------------------*/
.box ul  {
	
	/* CHECK WHAT font-size:12px; DOES PROBABLY NOTHING !!!*/
	font-size:12px;
	list-style-type:none;
	margin:0;
	padding:0;
	/* HACK INCORPORATED TO STOP PEEKABOO BUG IN IE */
	
	/* border: 1px solid #ff0000; */
/* USE OVERFLOW:HIDDEN TO CLEAR FLOAT SO BOX CONTAINING BOX DOESN'T COLLAPSE */
	overflow:hidden;
}

.box ul a {
	display:block; 
	background: #fff url(../images/backgrounds/checkbox2.gif) no-repeat -20px 0px ;
	/* ZEROING OF VERTICAL MARGINS STOPS THE BOXES FROM SHIFTING UPWARDS ON a:hover */
	margin: 0 5px 0 0;
	padding: 2px 4px 3px 14px;
	/* ADDITION OF HEIGHT ENABLES display:blcok TO MAKE WHOLE BOX ACTIVE IN IE6 */
	height:14px; 
	/* ADDITION OF LINE HEIGHT FIXES EXTRA PADDING IN IE6 */
	line-height:14px; 
	 
	border: 1px solid #fff;  
}

.box ul a:hover {
 border: 1px solid #CCC; 
}


.box ul a:visited {
 background-position:  0px 0px;
 /* border: 1px solid #fff; */
}

.box li {
	/* SETTING li TO display:inline REMOVES THE WHITESPACE MARGIN BUG AND REMVOVES EXTRA MARGINS
	   INSTEAD OF HAVING TO MANUALLY REMOVE WHITESPACE FROM <ul> HTML DOCUMENT */
	display:inline; 

}

	
#wrapper {
	width : 982px;
	/* MARK ADJ */
	 min-width : 800px; 
	 margin: 0 auto; 
	text-align: left;
	/* border: 1px solid #ff0000; */
}

#branding {
		position:relative;
	/*  background: transparent url(../images/backgrounds/librarytitle.gif) no-repeat 0px 12px; */
		/* border: 1px dotted #fff; */  
		 height:52px; 
		/* IMPORTANT NOTE/ISSUE: It seems to be important to specify a height for the #branding DIV
		otherwise there is a DEFAULT PADDING (?) at the bottom even though no padding exists. This
		creates a gap between the #branding DIV and the #mainNav DIV
		IT ONLY WORKS PROPERLY IF A BORDER IS SET (and made TRANSPARENT!!
		The alternative is to set a negative margin-bottom */
		
		/* HEIGHT SEEMS TO MAKE NO DIFFERENCE TO IE6 OR TO SAFARI BUT DOES TO FIREFOX */
		  
	/* Another alternative maybe to set the position of the #branding DIV RELATIVELY??? */

}

/* SPECIFIC BACKGROUND TITLE IMAGES FOR EACH SECTION */
.library #branding, .library_media_Audio #branding, .library_media_Document #branding, .library_media_Video #branding, .library_media_Image #branding, .library_media_Slideshow #branding, .library_media_Map #branding{
	background: transparent url(../images/librarytitle.gif) no-repeat 0px 12px;
}


.history #branding, .timeline_commentary_Audio #branding{
	 background: transparent url(../images/historytitle.gif) no-repeat 0px 12px; 
}

.hotwords #branding {
	 background: transparent url(../images/hotwordstitle.gif) no-repeat 0px 12px; 
}

.lessons #branding {
	 background: transparent url(../images/lessonstitle.gif) no-repeat 0px 12px; 
}

.activities #branding {
	 background: transparent url(../images/activitiestitle.gif) no-repeat 0px 12px; 
}

.e-learning #branding {
	 background: transparent url(../images/learningtitle.gif) no-repeat 0px 12px; 
}

* html #branding {
	/* margin-bottom:-27px; */
}

#branding h2 {
	width:972px;
	/* ABSOLUTELY POSTIONED IN RELATION TO #branding PARENT SET TO RELATIVE */
	position:absolute;
	left: 0px;
	top:4px;
	margin:0;
	font-size: 18px;
	line-height:20px;
	text-align:right;
	vertical-align:baseline;
/*	 border: 1px solid #fff; */
}

* html #branding h2 {
font-size: 16px;
}

#branding h1 {
	width:972px;
	position:absolute;
	left: 0px;
	top:-20px;
	font-size: 12px;
	margin-right: 10px;

	/* border: 1px solid #ccc; */  
}


#branding strong {
	/*color: #ff0000; */
}
#branding h2 strong {
	font-size: 1.3em;
}

#mainNav {
	position:relative;
	margin-bottom: 24px;
}

#mainNav ul, #secondNav ul {
	margin:0;
	padding:0;
	list-style:none;

 }
 
 #mainNav ul, #mainNav ul a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	color: #fff;  
}

* html #mainNav ul, * html #mainNav ul a {
	font-size: 12px;
}

#mainNav li, #secondNav li {
	display:inline;
	float:left;
	/*border: 1px solid #ff0000; */
	text-transform:uppercase;
}

#mainNav li em {
	text-transform:lowercase;
}

#mainNav ul a, #mainNav ul .current{
 	display:block;
	width: 100px; 
	padding-left: 18px;
	padding-right: 18px;
	padding-bottom:1px;
	padding-top:2px;
	text-align:center;
	line-height:15px;
	height:15px;
	/* padding-top: 3px; */
	margin-left:12px;
	margin-right:12px;
	
	}
	
#mainNav ul a {
	color: #a5b6c8; 
	border: 1px solid #000;
	background-color: #000;
	background: transparent url(../images/backgrounds/navButtonRollBase.gif) no-repeat -300px 0px; 
}
	
#mainNav ul .current {
	border: 1px solid #369;
	color:#336699;
	background-color: #14304F;
}

#mainNav ul a.current {
	 color:#fff; 
}

#mainNav ul a:hover{
	background-position: center top;
	color: #fff; 
	 /*border: 1px solid #00ff00;*/ 
}

#mainNav ul a.current:hover {
	 color:#fff;
	border: 1px solid #000;
	background-color: #000; 
}



#secondNav  {
	position:relative;
	/* border: 1px dotted #fff; */
	height:15px; 
}

#secondNav ul {

	margin-left:370px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #fff;
	/* border: 1px solid #ff0000;   */

}

#secondNav ul a {
	font-size: 11px;
	font-weight: bold;
	color: #000;
	background-color: #ff9900;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	 display:block; 
	width: 60px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom:2px;
	padding-top:2px;

	text-align:center;
	line-height:15px;
	height:15px;
	vertical-align:middle;
	/* padding-top: 3px; */
	margin-left:0px;
	margin:0 -1px 0 0;
}

#secondNav ul a:hover {
	/* color: #000; */
	background-color: #ff7700;
}



#contentWrap {
	/* ISSUE WITH POSTIONINING BACKGROUND IMAGE
	1. CANNOT vertically position background image if set to tile vertically using repeat-y (tile will start at 0 vertically).
	2. CANNOT vertically position a background image if DIV height not set AND/OR height of DIV is LESS THAN the height of the background image?????????????????????
	
	*/	
	margin-top:30px;
	margin-bottom:0;
 	border: 1px solid #fff;
	background: #000 url(../images/backgrounds/content_ground7.gif) no-repeat; 
	/* background-position: 4px 16px;
	/* NOT DEFINING A WIDTH ON DIV SHOULD STOP BOX MODEL PROBLEMS USING A PADDING
	LEAVE OUT FOR NOW _ USE MARGINS IN CONTENT BOXES  */
	padding: 14px 12px 8px 12px;

}

* html #contentWrap {
	background-position: 1px 1px;
}


/* ------------SEARCH NAVIGATION  ------------------*/
#searchNavigation  {
	width: 670px;
	margin:0 0 0 0;
	float:left;
	color: #000;

}

#searchNavigation h4 a {
	margin-left: 20px;
}



#searchNavigation .box {
	border: 1px solid #999; 
	height:85px;
	padding-bottom:10px;
}

#searchNavigation ul {
	padding:0;
	margin:0;
	/* border: 1px solid #000; */
	height:22px;
}

#searchNavigation .box li {
	/* border: 1px solid #ff0000; */
	display:inline;
	float:left;

}

#searchNavigation  ul a {
	/* border: 1px dotted #000; */ 
	display:inline-block;
	

}

/* ------------HEAD CONTENT  ------------------*/
#headContent {

	width: 277px;
	float:left;
	/* border: 1px dotted #000; */
	margin:0 0 0 9px;

	color: #000;
}

#headContent .box {
	height:85px;
}


#headContent h4 {	
	line-height: 14px;
	margin: 0 4px 3px 0;
	padding:0;
}


#headContent h4 a {
	font-family: Arial, Helvetica, sans-serif;
	font-size:13px;
	line-height: 14px;
	margin: 0 3px 8px 5px;
	padding:0;
}

#mainContent h4 {
	/* margin: 8px 10px 5px 0; */
}


/* -------------------- MAIN SINGLE COLUMN CONTENT ------------------------*/

#mainContent {
	clear:both;
}

/* A NEW HACK TO GIVE IE6 LAYOUT TO STOP BACKGROUNDS AND TEXT DISAPPEARING 
   SEEMS TO SOLVE IE 6 ISSUES CAN PROBABLY ALSO SET WIDHT OF BOX TO FIXED SIZE */
* html #mainContent .box{
 height:1%;
}



#mainContent img {
	border: 1px solid #bbb;
	/* padding:5px 40px 5px 40px;
	margin:10px 20px 20px 10px; */	
	padding:15px 15px 15px 15px;
	margin:10px 40px 40px 40px;
}


/* VIDEO BOX AREA */
#mainContent .vid, #mainContent .vid_240_196 {
	width: 360px;
	float: left;
	margin: 10px 40px 30px 40px;
	padding: 15px 70px 15px 70px;
	border: 1px solid #000;
	background: #fff;
}
/* NEW RULE FOR LARGER VIDEO */
#mainContent .vid_360_285, #mainContent .vid_360_286 {
	width:360px;
	float:left; 
	margin:10px 40px 30px 40px;
	padding:15px 70px 15px 70px;
	border: 1px solid #000;
	background: #fff;
}



/* -----------------------------*/

#mainContent .aud, #mainContent .doc {
	width:240px;
	height:50px;
	float:left; 
	margin:79px 30px 60px -10px;
	padding:20px 10px 0px 10px;
	border: 1px solid #000;
	background: #fff;
}
/* SPECIAL CASE FOR TIMELINE COMMENTARY AUDIO */
.timeline_commentary_Audio #mainContent .aud {
	margin:10px 30px 10px -10px;
}

#mainContent .doc {
	width:240px;
	height:175px;
	float:left;
	margin:10px 40px 60px 40px;

}

#mainContent .fla {
	float:left;
	margin:10px 40px 20px 40px;

}

#mainContent .fla img {
	margin:0 0 100px 0;
}

#mainContent .fla p {

	width:150px;
	height: 68px;
	font-size:10px;
	float:left;
	margin:0 -10px 10px 25px;
	padding:5px 10px 12px 15px;
	border: 1px solid #000;
	line-height:20px;
}

#mainContent .map {
	float:left;
	margin:10px 40px 10px 40px;
	border: 1px solid #000;
	padding:0;
}

/* THIS IS THE VIDEO REPLACEMENT IMAGE THAT WILL APPEAR WHEN QUICKTIME IS NOT PRESENT */
#mainContent .map img {
	float:none;
	margin:10px 10px 0 10px;
}

#mainContent .map p {
	text-align:center;
}

/* THIS IS THE VIDEO REPLACEMENT IMAGE THAT WILL APPEAR WHEN QUICKTIME IS NOT PRESENT */
#mainContent .vid img {
	margin:0 10px 10px 0px;
	float:none;
	padding:0;

}

/* THIS IS THE AUDIO REPLACEMENT IMAGE THAT WILL APPEAR WHEN QUICKTIME IS NOT PRESENT */
#mainContent .aud img,#mainContent .doc img {
	margin:-14px 10px 4px -3px;
	float:left;
	padding:0;

}

/* THIS IS THE VIDEO REPLACEMENT PARAGRAPH TEXT THAT WILL APPEAR WHEN QUICKTIME IS NOT PRESENT */
#mainContent .vid p {
	width: 240px;
	margin:0;
	line-height:16px;

}

/* THIS IS THE AUDIO REPLACEMENT PARAGRAPH TEXT THAT WILL APPEAR WHEN QUICKTIME IS NOT PRESENT */
#mainContent .aud p, #mainContent .doc p {
	margin:-15px 0 0 70px;
	line-height:20px;
}


#mainData {
	margin: 8px 5px 5px 8px;
}
.timeline_commentary_Audio #mainData {
	margin-top: 110px;
	margin-bottom: -20px;
}

.hotwords #mainData {
	margin:0;
	padding:0;
	border: none; 
}

.hotwords #mainData h3 {
	font-size: 20px;
	margin:15px 0 10px 0;
	padding:0;
	color:#dd0000;
}



*html .hotwords #mainData h3 {
	margin-top:25px;
}


.hotwords #mainData h4, .hotwords #mainData p, .hotwords #mainData p a, .hotwords #mainData ul, .hotwords #mainData ul a {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.hotwords #mainData h4, .hotwords #mainData p, .hotwords #mainData p a {
	font-size: 12px;
}

.hotwords #mainData ul, .hotwords #mainData ul a {
	font-size: 11px;
}

.hotwords #mainData p, .hotwords #mainData ul {
	font-weight:normal;
	color: #555;
	line-height:14px;
	/* ADDED EXTRA BOTTOM MARGIN AND PADDING TO GET NEXT LIST ITEM/IMAGE TO DROP DOWN  */
	margin:0 20px 13px 20px;
	padding:0;
}

.hotwords #mainData h4 {
	margin-bottom: 3px;
	margin-left: 20px;
}

.hotwords #mainData h5 {
	margin-left:20px;
	padding:0;
	clear:left;
}

* html .hotwords #mainData h5 {
 	margin:1px 0 0 10px;
}

.hotwords #mainContent img {
	background: #eee;
	padding:0;
	border:0;
	margin:20px 25px 25px 20px;
}

/******************** RULES SPECIFIC TO LESSONS DISPLAY PAGE ********************/
.lessons #mainContent h3 {
	font-size: 16px;
	margin: 0 0 15px 20px;
	padding:0;
	color:#fff;
}

.lessons #mainContent .box {
	background: #fff url(../images/backgrounds/boxGroundMax.jpg) no-repeat 1px 1px;
	padding: 10px;
}


.lessons #mainContent h4 {
	/*font-size: 11px; 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; */
	background: #eee;
	margin:10px 0 5px 0;
	padding:3px 15px 3px 20px;
	color:#333;
}

.lessons #headContent h4, .lessons #headContent h4 a {
	font-size:12px;
}
.lessons #headContent h4 a {
	margin-left:0;
	margin-right:0;
}

.lessons #mainContent h5 {
	float:none;
	font-style:italic;
	margin: 8px 20px 3px 20px;
}

.lessons #mainContent p, .lessons #mainContent ul, .lessons #mainContent ol {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color:#000;
	line-height:13px;
	font-size:11px;
}

.lessons #mainContent p {
	margin: 5px 20px 5px 20px;
	padding: 2px 0 2px 0;
	/* border: 1px solid #00ff00; */ 
}

.lessons #mainContent ol {
	list-style-type: decimal;
	/* border: 1px solid #00ff00; */
	padding: 0 0 0 20px;
	margin: 0 20px 5px 20px;
	color:#000;
}

.lessons #mainContent ul {
	list-style:disc;
	padding-left: 15px;
	margin: 0 20px 5px 20px;
	
	/* border: 1px dashed #ff0000; */
}

/* UNORDERED LIST EMBEDDED INSIDE ORDERED LIST */
.lessons #mainContent ol ul {

	margin:5px 0 0 0;
	font-weight:normal;
	/* border: 1px dotted #ff0000; */
}

/* EXCEPTION TO THE USUAL .box ul a STYLE WHICH IS BLOCK LEVEL WITH HOVERED BORDER AND VISITED TICK BACKGROUND*/
.hotwords #mainData ul a,.hotwords #mainData ul a:hover, .lessons #mainContent ul a, .lessons #mainContent ul a:hover {
	border:none;
	display:inline; 
	background: none ;
	margin: 0;
	padding:0;


}



.hotwords #mainData li, .lessons #mainContent li {
	display:list-item;
	padding:2px;
	margin: 0;
	
}

.hotwords #mainData ul {
	overflow:visible;
	padding-left:15px;
	list-style-type:square;
	border:none;
}
/******************** END RULES SPECIFIC TO LESSONS DISPLAY PAGE ********************/



#mainData p, #mainData p.data {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color:#000;
	margin: 5px 5px 8px 0;
	line-height:13px;
	font-size:9px;
	vertical-align:baseline;
}

blockquote {
	font-size:11px;
	margin: 0 50px 0 50px;
	}




/* --------------------------- SET FONT SIZE FOR (SMALLER) LIST GREY TEXT ---------------------*/
#mainData p.description , p.sideText {

	font-family: Arial, Helvetica, sans-serif;
	color: #919090;
	font-size:11px;
	font-weight:bold;
	line-height:13px;
	/* ADDED EXTRA BOTTOM MARGIN AND PADDING TO GET NEXT LIST ITEM/IMAGE TO DROP DOWN  */
	margin:0 5px 7px 0;
	padding:0 0 5px 0;
	/* border: 1px solid #000; */
}

p.sideText {
	 font-size:9px;
}

* html p.description {
font-size:10px;
}


/* MAKE THE FONT SIZE SMALLER FOR MAIN SECTION GREY SIDE TEXT ONLY ON WIN IE6 */
* html p.sideText {
	font-size:9px;
}
/* -----------------------------------------------------------------------------------------------*/




.box p.rightText {
	text-align:right;
	clear:both;
	margin: 0 0 0 0;
  /* border: 1px solid #6d6c6c; */
}

#searchNavigation .box {
	/* background: #fff; */
	/* background: #fff url(../images/box_ground.jpg) no-repeat 1px 1px; */
}

* html #searchNavigation .box {
	/* background-position: 2px 2px; */
}



#headContent #Audio {
	background: #fff url(../images/backgrounds/audio_ground.jpg) no-repeat 1px 1px;
}

.timeline_commentary_Audio #headContent #Audio {
	background: #fff url(../images/backgrounds/comment_ground.jpg) no-repeat 1px 1px;
}

#headContent #Video {
	background: #fff url(../images/backgrounds/video_ground.jpg) no-repeat 1px 1px;
}

#headContent #Image {
	background: #fff url(../images/backgrounds/image_ground.jpg) no-repeat 1px 1px;
}

#headContent #Document {
	background: #fff url(../images/backgrounds/doc_ground.jpg) no-repeat 1px 1px;
}

#headContent #Slideshow {
	background: #fff url(../images/backgrounds/fla_ground.jpg) no-repeat 1px 1px;
}

#headContent #Map {
	background: #fff url(../images/backgrounds/map_ground.jpg) no-repeat 1px 1px;
}

#headContent #Hotword, #headContent #Lesson{
	background: #fff url(../images/backgrounds/generic_ground.jpg) no-repeat 1px 1px;
}


#headContent #Hotword h4 {
	margin-top:30px;
}

#headContent #Hotword h4 strong{
	color: #dd0000;
}

/* NOTE: THIS EXTRA PIXEL OFFSET IS NOT REQUIRED ON THIS PAGE BUT FOR SOME REASON IN IE ON HOME PAGE IT IS */
* html #headContent #audio, * html #headContent #video, * html #headContent #image * html #headContent #document { 
	/* background-position: 2px 2px; */
}

img, #mainImage {
	/* border: 1px solid #000; */
	float:left;
	border:none;
}

/*  RIGHT MARGIN DETERMINES MARGIN FROM FLOATED IMAGES TO HEADER AND TEXT */
img {
	margin:0 12px 5px 0;
}



/* NOTE THAT IF THE COLOR OF h2 a IS CHANGED FROM a DEFAULT, THEN THE a:hover NO LONGER APPLIES */
.box h2, .box h2 a {
	/* border: 1px solid #000; */
	font-size : 19px;
	margin: 5px 0 5px 0 ;
	/* color: #004276; */
}

#secondaryContent {
	 clear:both; 
}

#mainContent h4, #secondaryContent h4 {
	 margin:5px 0 0 40px; 
	 clear:both;
	/* border: 1px solid #bbb; */

}

#mainData h4 {
	margin: 5px 0 8px 0;
	clear:none;
}


#mainData p strong {
	font-size:11px;
	font-weight:bold;
	color:#666;
}

/* A NEW HACK TO GIVE IE6 LAYOUT TO STOP BACKGROUNDS AND TEXT DISAPPEARING 
   SEEMS TO SOLVE IE 6 ISSUES CAN PROBABLY ALSO SET WIDHT OF BOX TO FIXED SIZE */
* html #secondaryContent .box{
 height:1%;
}

#secondaryContent ul {
	list-style:none;
	margin:3px 0 10px 80px;
	padding:0;
	/* border: 1px dotted #ff0000; */
		
}

#secondaryContent li {
	/* width:340px; */
	display:inline;
	/* DOESNT WORK PROPERLY WITHOUT FLOATING li */
	float:left;
	height: 80px;
	background: #eee;
	margin:4px 10px 10px 0px;
	padding:4px 4px 40px 4px;
	border: 1px solid #bbb;

 
}

#secondaryContent ul a {
	width:112px; 
	height: 58px; 
	display:block; 
	margin:0 ;
	padding:0;
	border:none;
	background:none;
	font-family: Arial, Helvetica, sans-serif;
	font-size:10px;
	word-spacing: -1px;
	line-height:11px;
	clear:both;
	/* border: 1px dotted #ff0000; */ 
}

#secondaryContent img {
	border:1px solid #ccc;
	background: #fff;
	float:none;
	margin:0;
	padding:0 25px 0 25px;
}

.library_media_Audio #secondaryContent ul a {
	width:93px; 
}

/* NEW ADDITION FOR HOTWORDS DISPLAY PAGE */

.hotwords #secondaryContent h4 {
	margin-left: 20px;

}

.hotwords #secondaryContent ul {
	margin-left: 20px;
}

.hotwords #secondaryContent li {
	padding-bottom:30px;
	margin-right:6px;
}

* html .hotwords #secondaryContent li {
	padding-bottom:0;
}

.hotwords #secondaryContent ul a {
	width:85px; 
	height: 62px;
}


.hotwords #secondaryContent img {
	/*border:0;*/
	padding:0;
	background: #999;
}

.lessons #secondaryContent ul a {
	height:62px;
}

.lessons #secondaryContent img {
	padding:0;
	background: #fff;
}

#secondaryContent p {
	clear:both;
	text-align:right;
	
}

#secondaryContent .box {
	margin:0;
}


#footer {
	text-align:right;
	clear:both;
	margin: 5px 0 5px 0;

}

#footer p {
	font-size: 9px;
	padding:0;
	margin:0;
	
}