/******************************************************************************************************/
/************************Cantonian High School  Management System*******************************/
/******************************************************************************************************/
/**************************************www.webgician.co.uk*********************************************/
/******************************************************************************************************/
* 			{
			margin: 0;
			padding: 0;
}

html		{
			font-size:100%;
}

body		{
			font-size: 1em;
			font-family: Arial, Helvetica, sans-serif;
			background:#e6e6e6 url(images/stripe.png) repeat; 
			
}

h1     
			{
			font-size: 1.1em;
			line-height:1.65em;
			font-family : Verdana, Arial, Helvetica, sans-serif;
			text-align:center;
			padding-top:0.1em;
			padding-bottom:0.1em;
			color:#335566;

}



h2     
			{
			font-size: 1em;
			font-family: Arial, Helvetica, sans-serif;
			color:#FF3322;
			padding-left:1em;
			padding-top:0.25em;
			padding-bottom:0.25em;

}

h3     
			{
			font-size: 0.8em;
			font-family: Arial, Helvetica, sans-serif;
			color:#FF3300;			
			text-align:center;
			padding-top:0.55em;
			padding-bottom:0.5em;
}

h4     
			{
			font-size: 1.25em;
			font-family: Arial, Helvetica, sans-serif;
			color:#335566;		
			text-align:center;
			padding-top:0.5em;
			padding-bottom:0.5em;
}


h5     {
			font-size: 1em;
			font-family: baskerville, 'palatino linotype', 'times new roman', serif;
			color:#FF3300;
			margin-left:5em;
}

h6     {
			font-size: 1em;
			font-family: Arial, Helvetica, sans-serif;
			color:#000000;
			padding-left:1.5em;
			padding-top:0.25em;
			padding-bottom:0.25em;
}

#canvas
 			{
 			width: 34.75em; 
			height: 27.4em;
			margin:1em;
			
}

p.mapTitle
			{
			padding:0;
			margin:0;			
			font-family: georgia, serif; 
			text-align:left;
			font-size:1.25em;
			color:#0066FF;
			padding:1em;
			padding-bottom:0;
			
			
}


a:link {
	color: #FF3300;
}
a:hover {
	color: #0033FF;
	text-decoration: none;
}
a:visited {
	color: #FF3300;
}

img 		{
			border: none;
}

#wrap
			{
			width:100%;
			position:absolute;
		 	top:0;
		 	left:0;
}

#upper-link-container	
			{
			width:100%;
			position:relative;
			background:#000099;
			border-top:0.065em solid #FFFF99;
}

#upper-link-wrap	
			{
			width:46.25em;
			margin:1em auto;
			margin-top:0;
			margin-bottom:0;
}

#header-container
			{
			width:100%;
			position:relative;
			background: #0033FF;
			border-top:0.065em solid #FFFF99;
			border-bottom:0.065em solid #FFFF99;
		
}
#header 	{
			width:46.25em;
			margin:0.25em auto;
			margin-top:0;
			margin-bottom:0;
			background: #0033FF;
		
}


#header img{
			width:46.25em;
				
}

#link-container	{
			width:100%;
			position:relative;
			background:#000099;
			border-bottom:0.065em solid #FFFF99;
}

#link-wrap	{
			width:46.25em;
			margin:0.25em auto;
			margin-top:0;
			margin-bottom:0;
}

/*******************************************Main Container (homepage)*****************************************/

.content-wrap	
			{
			width:46.25em;
			margin:1em auto;
			}


.main-module-container
			{
			width:46.25em;
			background: white url(images/upperGradient.png) top left repeat-x;

}

.bottom-border-blue
			{
			background: url(images/dot.gif) 0 100% repeat-x; width:46.25em;
			}

.main-left-half-wrap	{
			width:34%;
			float:left;
			background: #FFFFFF;			
}

.main-right-half-wrap	{
			width:24.05em;
			float:right;
}



.main-right-half-wrap img	
			{
			width:24.063em;
			height:13.125em;
			border:0.065em solid #3300FF;			
}

.outer-wrap 
			{
			
			width:42.813em;
			margin-left:1.5em;
			margin-top:0.75em;
			
}

.rules-outer-wrap 
			{
			
			width:42.813em;
			margin-left:1.5em;
			
			
}

.global-outer-wrap 
			{
			
			width:42.813em;
			margin-left:1.5em;
			margin-top:1.5em;
			
}

.ks4-outer-wrap 
			{
			
			width:42.813em;
			margin-left:1.6em;
			margin-top:1.3em;
			
}

.content-outer-wrap 
			{
			
			width:42.813em;
			margin-left:1.5em;
			margin-top:0.938em;
			
}

p.time  
			{
			padding:0;
			margin:0;			
			font-family: Arial, Helvetica, sans-serif;
			text-align:right;
			font-size:0.75em;
			line-height:1.5em;
			color:#333333;
			padding-bottom:0.75em;
			
}

p.vision	{

			font-family : Arial, Helvetica, sans-serif;
			text-align:right;
			font-size:0.75em;
			line-height:1.5em;
			color:#333333;
			padding-top:0.175em;
			
}


p.vision-welsh	{
			

			font:clear;
			font-family: Arial, Helvetica, sans-serif;
			text-align:right;
			font-size:0.75em;
			line-height:1.5em;
			color:#333333;
			padding-bottom:0.75em;
		
}

p.textred	{
			font-family : Verdana, Arial, Helvetica, sans-serif;
			text-align:justify;
			font-size:0.75em;
			line-height:1.5em;
			color:#FF3300;
}


p.text		{
			font-family : Arial, Helvetica, sans-serif;
			text-align:justify;
			font-size:0.75em;
			line-height:1.5em;
			color:#333333;
}

p.letters		{
			font-family : Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:0.75em;
			line-height:1.5em;
			color:#333333;
}

p.rules1	{
			font-family : Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:4em;
			color:#FF3300;
			
}

p.rules2	{
			font-family : Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:4em;
			color:#0099FF;
}

p.rules3	{
			font-family : Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:4em;
			color:#FFCC00;
			
}

p.rules4	{
			font-family : Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:4em;
			color:#999900;
			
}

p.rules5	{
			font-family : Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:4em;
			color:#3366FF;
			
}





p.googletext		{
			font-family : Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:0.75em;
			line-height:1.5em;
			color:#333333;
}


.sam-container
			{
					
}

.sam-container img	
			{
			width:42.813em;	
			padding-top:0.75em;		
}

.messages-image-container 
			{
			width: 43em;
			
}

.messages-image-container img 
			{
			width: 43em;
			padding-top:1.5em;
			padding-bottom:0.75em;
}

.content-outer-wrap 
			{
			
			width:42.813em;
			
			
}

.content-image-wrap
			{
			padding:0;
			margin:0;
			width:12.5em;
			height:9.375em;
			float:left;
			padding-top:0.5em;
			
			

			
}

.content-image-wrap img
			{
			border:0.0625em solid #0033FF;
}


.content-text-wrap
			{
			padding:0;
			margin:0;
			width:28em;
			float:right;
}

.content-footer
			{
			padding:0;
			margin:0;
			width:43em;
			float:clear;
			text-align:right;
}


/***********************************KS3 Pupils*********************************/

/**********************************ks3 borders*************************************/



p.ks3pupil  
			{
			font-family: Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:1.5em;
			padding-top:0.5em;
			padding-bottom:0.6em;
			color:#FF3300;
			
			
}

p.ks4pupil  
			{
			font-family: Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:2em;
			padding-top:0.5em;
			padding-bottom:0.6em;
			color:#FF3300;
			
			
}


.tks3 {background: url(images/dot.gif) 0 0 repeat-x;}
.bks3 {background: url(images/dot.gif) 0 100% repeat-x;}
.lks3 {background: url(images/dot.gif) 0 0 repeat-y;}
.rks3 {background: url(images/dot.gif) 100% 0 repeat-y;}

.blks3-left{background: url(images/blks3-left.png) 0 100% no-repeat;}
.brks3-left {background: url(images/brks3-left.png) 100% 100% no-repeat;}
.tlks3-left {background: url(images/tlks3-left.png) 0 0 no-repeat;}
.trks3-left {background: url(images/trks3-left.png) 100% 0 no-repeat;}

.blks3-mid{background: url(images/blks3-mid.png) 0 100% no-repeat;}
.brks3-mid {background: url(images/brks3-mid.png) 100% 100% no-repeat;}
.tlks3-mid {background: url(images/tlks3-mid.png) 0 0 no-repeat;}
.trks3-mid {background: url(images/trks3-mid.png) 100% 0 no-repeat;}

.blks3-right{background: url(images/blks3-right.png) 0 100% no-repeat;}
.brks3-right {background: url(images/brks3-right.png) 100% 100% no-repeat;}
.tlks3-right {background: url(images/tlks3-right.png) 0 0 no-repeat;}
.trks3-right {background: url(images/trks3-right.png) 100% 0 no-repeat;}

.blks4-left {background: url(images/blks4-left.png) 0 100% no-repeat;}
.brks4-left {background: url(images/brks4-left.png) 100% 100% no-repeat;}
.tlks4-left {background: url(images/tlks4-left.png) 0 0 no-repeat;}
.trks4-left {background: url(images/trks4-left.png) 100% 0 no-repeat;}

.blks4-right {background: url(images/blks4-right.png) 0 100% no-repeat;}
.brks4-right {background: url(images/brks4-right.png) 100% 100% no-repeat;}
.tlks4-right {background: url(images/tlks4-right.png) 0 0 no-repeat;}
.trks4-right {background: url(images/trks4-right.png) 100% 0 no-repeat;}





.pupil-left-third-wrap	{
			width:13.33em;
			float:left;
			background:#FFFF99;					
}

.pupil-middle-third-wrap	{
			width:31%;
			float:left;
			background:#CCff00;	
			margin-left:1.5em;
				
}

.pupil-right-third-wrap {
			width:31%;
			float:right;
			background:#ff99CC;			
}

.pupil-module-container
			{
			width:46.25em;
			margin:0.75em auto;
			background: #ffffff;
}

.pupil-outer-wrap 
			{
			width: 46.25em;
			
}
.pupil-inner-wrap 
			{
			width:42.813em;
			margin-left:1.6em;
			margin-top:1.25em;
}

.pupil-left-half-wrap	{
			width:48%;
			float:left;
			background: #99CCFF;			
}

.pupil-right-half-wrap	{
			width:48%;
			float:right;
			background: #FFCC99;			
}




.bbc-container
			{
						
			
}

.bbc-container img	
			{
			width:42.813em;
			padding-top:1.25em;
								
}

.flag-container	{		
			float:left;

}
.flag-container	img{		
			width:28.938em;
			height:6.375em;

}

.cluster-container	{
			float:right;
}

.cluster-container img{
			width:10em;
			height:6.625em;
}

.inner-award-wrap	{
			width:6.25em;
			float:left;
			margin-left:3.25em;
}

.inner-award-wrap img	{
			width:6.25em;
}


.award-wrap	{
			width:6.25em;
			float:left;
}

.award-wrap img	{
			width:6.25em;
}

.last-award-wrap	{
			width:6.25em;
			float:right;
}

.last-award-wrap img	{
			width:6.25em;	
}

.upper-wrap 
			{
			width: 43em;
			text-align:center;
			margin-top:1em;
}

.lower-wrap 
			{
			width: 43em;
			text-align:center;
			margin-top:1.5em;
			margin-bottom:0.5em;
}


/*****************************Skirt and Footer**************************/

#skirting 
			{
			width:100%;
			height:17em;
			background: white url(images/skirt.png) top left repeat-x;
}

#footer 
			{
			width:100%;
			height:100%;
			background:#3300FF;
			border-top:0.0625em solid #FF3300;
}
#footer p
			{
			font-family: Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:0.7em;
			color:#FFFFFF;
}

#footer a
			{
			text-decoration:none; 
			color:#FF6600;
}
.footer a:hover 
			{ 
			text-decoration:underline; 
}
#sharecontainer{
text-align:center;
}

.validator{
text-align:center;
}

.validator img{
padding-top:1.5em;
}

.learningStylesTestsContainer{
text-align:center;
}

#google-container{
text-align:center;
}

.style1 {color: #FF3300;}
.style2 {color: #0099FF}
.style3 {color: #3366FF}
.style33 {color: #3366FF}
.style4 {color: #FF33FF}
.style5 {color: #FFCC00}
.style6 {color: #660066}
.style7 {color: #999900}
.style8 {color: #333333; padding-left:1em;}
.style88 {color: #333333;}
.style9 {color: #CC0000;}
.style10 {color: #009999;}









/********************************************************************
*****************************MENUS***********************************
*********************************************************************/


/*****************************TOP***********************************/


.menutop 	{
			padding:0;
			margin:0;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 0.8em; 
			letter-spacing:0.02em;
			height:1.8em;
			list-style-type:none;
			background:#000099;
			padding-left:0.25em;
			
}

.menutop li {
			float:left; 
			padding:0;
			margin:0;
			width:14.175em; 
			height:1.8em;
			line-height:1.5em;
			position:relative;
			text-align:center;
}

.menutop li a, .menutop li a:visited 
			{
			display:block;
			text-decoration:none; 
			color:#FFFF99;
}
.menutop li a span, #menutop li a:visited span 
			{
			display:none; /* needed to trigger IE */
}
.menutop li a:hover 
			{ 
			border:0; 
}
.menutop li a:hover span 
			{
			display:block;
			width:14.175em;
			height:1.8em;
			text-align:center;
			position:absolute; 
			left:0px; 
			top:0px; 
			color:#FF3300; 
			background:#FFFF99;
			cursor:pointer;
}

.menutop li.current a
			{
			background:#FF3300;
			color:#FFFFFF;
			height:1.8em;
			border-left:0.0625em solid #FFFF99;
			border-right:0.0625em solid #FFFF99;
			
}

#menu-container
			{
			width:100%;
			background: #0033FF;
			border-top:0.0625em solid #FFFF99;
			border-bottom:0.0625em solid #FFFF99;
		
}

 /******************************about***************************/
 
  #navmenu {
  margin-top:0.15em;
  }
  
  #navmenu li {
  list-style-type:none; 
  background-color:#FFFFFF;
  font-family: Arial, Helvetica, sans-serif;
  text-align:left;
  font-size:0.9em;
  } 
  
  
  #navmenu a:link
  	 		{
  text-decoration:none;
  padding-left:0.75em; 
  padding-top:0.2em;
  color:#FF3300; 
  display:block; 
  width:16.75em; 
  height:1.7em; 
  }
  
  
 #navmenu a:hover {
  text-decoration:none;
  padding-left:0.75em;
  padding-top:0.2em;
  color:#FF3300; 
  background-color:#FFFF99; 
  border-color:#FFFF99;
  width:16.75em; 
  height:1.7em; 
  }
  
 #navmenu a:visited {
  text-align:left; 
  text-decoration:none; 
  padding-left:0.75em; 
  padding-top:0.2em;
  color:#666666; 
  display:block; 
  width:16.75em; 
  height:1.7em; 
  }
  
  
 #navmenu a:visited:hover {
  	text-decoration:underline;
}



/*****************************MIDDLE***********************************/


.menu 	{
			padding:0;
			margin:0;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 0.8em; 
			letter-spacing:0.02em;
			height:1.8em;
			list-style-type:none;
			background:#000099;
			padding-left:0.25em;
			
}

.menu li {
			float:left; 
			padding:0;
			margin:0;
			width:14.175em; 
			height:1.8em;
			line-height:1.5em;
			position:relative;
			text-align:center;
}

.menu li a, .menu li a:visited 
			{
			display:block;
			text-decoration:none; 
			color:#FFFF99;
}
.menu li a span, #menu li a:visited span 
			{
			display:none; /* needed to trigger IE */
}
.menu li a:hover 
			{ 
			border:0; 
}
.menu li a:hover span 
			{
			display:block;
			width:14.175em;
			height:1.8em;
			text-align:center;
			position:absolute; 
			left:0px; 
			top:0px; 
			color:#FF3300; 
			background:#FFFF99;
			cursor:pointer;
}

.menu li.current a
			{
			background:#FF3300;
			color:#FFFFFF;
			height:1.8em;
			border-left:0.0625em solid #FFFF99;
			border-right:0.0625em solid #FFFF99;
			
}

.tutor-left-half-wrap	{
			width:48%;
			float:left;
			background: #99FF33;			
}

.tutor-right-half-wrap	{
			width:48%;
			float:right;
			background: #FFFF99;			
}



.upper-gradient-container
			{
			width:46.25em;
			background: white url(images/upperGradient.jpg) top left repeat-x;
			}


#inside-wrap	
			{
			background: #e4e4e4;
}


#inside-wrap img
			{
			width:46.25em;
			background: #e6e6e6;	
}

#form-wrap
			{
			margin-left:2em;
			
}

#gall
			{
			width:46.25em;
			background: #e6e6e6;
}


#gall img
			
			{
			padding:0;
			margin:0;
			width: 8.975em;
}




/***********************************Navigation*********************************/




p.year12pupil  
			{
			font-family: Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:2.15em;
			color:#009966;
}

p.year13pupil  
			{
			font-family: Arial, Helvetica, sans-serif;
			text-align:center;
			font-size:2.15em;
			color:#CC6600;
}







.image-container
			{
			margin-top:0;		
						
			
}

.image-container img	
			{
			width:43.875em;	
			padding:1em;	
						
}

.google-image-container
			{
			margin-top:0;		
						
			
}

.google-image-container img	
			{
			width:43.875em;	
				
						
}


.image-container-messenger
			{
			margin-top:0;		
						
			
}

.image-container-messenger img	
			{
			width:43.125em;	
			padding-top:1em;	
			padding-left:1.6em;	
			padding-bottom:0.25em;			
}

.image-container-ab
			{
			margin-top:0;		
						
			
}

.image-container-ab img	
			{
			width:42.5em;	
			padding-top:1em;	
			padding-left:1.75em;	
			padding-bottom:0.25em;			
}


.ceop-image-container
			{
			width:42.813em;
					
			
}

.ceop-image-container img	
			{
			width:42.813em;					
}

.adobe-container
			{			
			margin-left:1em;
}



.bbc-container2
			{
			margin-top:0.1em;			
			
}

.bbc-container2 img	
			{
			width:42.183em;
			padding:2.2em;
			padding-top:0.75em;
			padding-bottom:0;					
}

.bbc-container3
			{
			margin-top:0.1em;			
			
}

.bbc-container3 img	
			{
			width:42.5em;
			padding:2em;
			padding-top:0.75em;
			padding-bottom:0;					
}



.pupil-image-wrap	
			{
			width:30%;
			float:left;
			margin-left:1em;
			padding:0.5em;			
}

.pupil-image-wrap img
			{
			width:12.5em;
			padding-top:1em;			
}


.pupil-hr-container
			{
			width:44em;
			padding-left:0.5em;
}

.ab-container	
			{
			width:52%;
			float:right;
			margin-top:0.6em;
			margin-right:0.75em;			
}

.ab-container img
			{
			width:26.25em;		
			height:2.75em;
}

.main-bottom-wrap	{
			width:93.5%;
			float:left;
			margin-left:1em;
			padding:0.5em;
			background: #FFFF99;			
}



p.baskerville 
			{
			font-size: 1em;
			font-family: baskerville, 'palatino linotype', 'times new roman', serif;
			text-align:justify;
}


.single-button-wrap
			{
			width: 46.25em;
			padding-top:0.5em;
			padding-bottom:1em;
			text-align:center;
}

.button-wrap
			{
			width: 46.25em;
			padding-top:1em;
			text-align:center;
}

.button-wrap-home
			{
			text-align:center;
			padding-top:1em;
}





p.mod-text  
			{
			margin: 0.5em auto;
			padding-top:0.5em;
			padding-right:2em;
			padding-left:2em;
			text-align: justify;
}

.image-wrap	{
			width:30%;
			float:left;
			margin-left:1em;
			padding:0.5em;			
}

.image-wrap img
			{
			width:12.5em;
			padding-top:1em;			
}

.ceop-wrap	{
			width:43.563em;
}

.ceop-wrap img
			{
			width:43.563em;
			padding-left:1.25em;
			padding-top:1em;
					
					
}

.history-banner-container{
	
}

.history-banner-container img{
	width:42.813em;
	padding-top:1em;
}

.hr-container
			{
			width:44em;
			padding-bottom:1em;
			padding-left:0.5em;
}

.hr-container img
			{
			width:44em;
}



.counter-container	{		
			width:42em;
			padding-top:1.5em;
			padding-left:2em;	
			padding-bottom:1.5em;	
}




/*******************DD dropdown panel***********************************/

.ddpanel .ddpanel{ /*CSS for "content" DIV of Drop Down Panel*/
color: #0099FF;
background: #FFFF99; /*background of Drop Down Panel*/
/*Do NOT add any "padding" or "margin" properties here! Any padding/margin should be added to your content's container within this DIV instead */
}

.ddpanel .ddpaneltab{ /*CSS for "toggle" tab DIV of Drop Down Panel*/
margin-right: 134px;
font: normal 12px Tahoma;
}

.ddpanel .ddpaneltab a{ /*"toggle" tab related CSS*/
float: right;
color: #003399;
background: #0033FF url(toggleleft.gif) no-repeat left bottom; /*background of toggle tab*/
text-decoration: none;
letter-spacing: 1px;
}

.ddpanel .ddpaneltab a span{ /*"toggle" tab related CSS*/
float: left;
display: block;
background: transparent url(toggleright.gif) no-repeat right bottom;
padding: 2px 4px 4px 8px;
cursor: pointer;
}

.ddpanel .ddpaneltab a span img.pointerimage{ /*CSS for pointer image within toggle tab*/
margin-top: 2px;
margin-left: 5px;
}

.ddpanel .ddpaneltab a:hover{ /*"toggle" tab related CSS*/
background-color: #FFFF99; /*background of toggle tab onMouseover*/
}

.ddpanel .ddpaneltab a:active, .ddpanel .ddpaneltab a:focus{ /*"toggle" tab related CSS*/
outline: 0;
}

.ddpanel .ddpaneltab a:hover span{ /*"toggle" tab related CSS*/
background-color: transparent;
}

/****************************LINKS***********************************/


/**********************************ROUNDED RECTANGLES*************************************/

.t {background: url(images/dot.gif) 0 0 repeat-x; width: 46.25em}
.b {background: url(images/dot.gif) 0 100% repeat-x}
.l {background: url(images/dot.gif) 0 0 repeat-y}
.r {background: url(images/dot.gif) 100% 0 repeat-y}
.bl {background: url(images/bl.png) 0 100% no-repeat}
.br {background: url(images/br.png) 100% 100% no-repeat}
.tl {background: url(images/tl.png) 0 0 no-repeat}
.tr {background: url(images/tr.png) 100% 0 no-repeat}

/**********************************LIGHTBOX*************************************/
#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}
	

/* Min-Width */
.lbWidth { /* most browsers */
	position: absolute;
	top: 0px; left: 0px;
	width: 100%;
	min-width: 790px;
	}

* html .lbContent { /* IE6 */
	margin-left: -790px;
	position:relative;
	}

* html .lbMinWidth { /* IE6 */
	padding-left: 790px;
	}
	
	
/* Clearfix */	
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */ 


.test-left	{
			width:48%;
			float:left;
			background: #99CCFF;			
}

.test-right	{
			width:48%;
			float:right;
			background: #FFCC99;			
}