@charset "utf-8";
/* CSS Document */

	body {

		text-align:center;
		margin:0px;
		padding:0px;
		margin-left:0px;
		background-color: #895e96;
		font-family: Verdana, Helvetica, Arial, sans-serif;
 		font-size: .75em; 
	  	line-height: 150%;
		}

	#Outerframe {
		margin:0px;
		width:982px;
		margin-right:auto;
		margin-left:auto;
		margin-bottom: -11px;
		padding:0px;
		text-align:center;
		}
	#CenterIamge{
		float:left;
		margin-top: 100px; /* Change for top margin*/
		padding:0px;
		width: 600px;
		height: 400px;
		background-image:url(../Images/center.png);
		background-repeat:no-repeat;
		}
	#RightIamge{
		float:right;
		
		margin-top: 350px;  /* Change for side margin*/
		padding:0px;
		width: 100x;
		height: 100x;

		}
	#OuterframeFooter a { color: #ffffff;}

	#About {
		float:left;
		margin-top: 85px;
		padding:0px;
		width: 59px;
		height: 59px;
		}
		
		
#AboutRoll
{
			float:left;
		margin-top: 85px;
		
  display: block;
  width: 59px;
  height: 60px;
  background: url("../Images/about-roll.png") no-repeat 0 0;

}

#AboutRoll:hover
{ 
  background-position: 0 -60px;
}

#AboutRoll span
{
  display: none;
}

#ArchiveRoll
{
  float:left;
  margin-top: 265px;
  margin-left: -30px;
  display: block;
  width: 59px;
  height: 60px;
  background: url("../Images/archviet-roll.png") no-repeat 0 0;

}

#ArchiveRoll:hover
{ 
  background-position: 0 -60px;
}

#ArchiveRoll span
{
  display: none;
}


#ContributorsRoll
{
  float:left;
  margin-top: 80px;
  margin-left: 280px;
  display: block;
  width: 59px;
  height: 60px;
  background: url("../Images/contributors-roll.png") no-repeat 0 0;

}

#ContributorsRoll:hover
{ 
  background-position: 0 -60px;
}

#ContributorsRoll span
{
  display: none;
}


#EventsRoll
{
  float:left;
  margin-top: 0px;
  margin-left: 0px;
  display: block;
  width: 59px;
  height: 60px;
  background: url("../Images/events-roll.png") no-repeat 0 0;

}

#EventsRoll:hover
{ 
  background-position: 0 -60px;
}

#EventsRoll span
{
  display: none;
}

#BooksRoll
{
  float:left;
  margin-top: 85px;
  margin-left: -59px;
  display: block;
  width: 59px;
  height: 60px;
  background: url("../Images/books-roll.png") no-repeat 0 0;

}

#BooksRoll:hover
{ 
  background-position: 0 -60px;
}

#BooksRoll span
{
  display: none;
}

#SkyRoll
{
	float:left;
 	margin-top: 10px;
 	margin-left: 190px;
  display: block;
  width: 76px;
  height: 76px;
  background: url("../Images/sky-rolll.png") no-repeat 0 0;

}

#SkyRoll:hover
{ 
  background-position: 0 -76px;
}

#SkyRoll span
{
  display: none;
}

#landRoll
{
	float:left;
 	margin-top: 5px;
 	margin-left: 90px;
  display: block;
  width: 76px;
  height: 76px;
  background: url("../Images/land-roll.png") no-repeat 0 0;

}

#landRoll:hover
{ 
  background-position: 0 -76px;
}

#landRoll span
{
  display: none;
}

#seaRoll
{
	float:left;
 	margin-top: 70px;
 	margin-left: 69px;
  display: block;
  width: 76px;
  height: 76px;
  background: url("../Images/sea-roll.png") no-repeat 0 0;

}

#seaRoll:hover
{ 
  background-position: 0 -76px;
}

#seaRoll span
{
  display: none;
}






		
	#Innerframe {
		float: none; display: block;
		margin:0px;
		width:898px;
		margin-right:auto;
		margin-left:auto;
		padding-top:2px;
		text-align:center;	 	
		}
		
	#Contentframe {
		float: none; display: block;
		margin:0px;
		width:874px;
		margin-right:auto;;
		margin-left:auto;
		padding-top:2px;
		padding-bottom: 2px;
		text-align:center;	 	
		}
		
	#ContentframeSmall {
		float: none; display: block;
		margin:0px;
		width:500px;
		margin-right:auto;;
		margin-left:auto;
		padding 5px;
		text-align:center;	 	
		}				

	p.beta { font-size:14px; margin-top: 2px; margin-bottom: 2px; }
			
	#topMidframe {background: url("../Images/MidFrame/top.gif") 0% 0%  no-repeat; text-align:left;}
	#bottomMidframe {background: url("../Images/MidFrame/bottom.gif") 100% 100% no-repeat;  text-align:left }
	#sideMidframe { background: url("../Images/MidFrame/sides.gif") repeat-y;  text-align:left }	
	
	#topInnerframe {background: url("../Images/innerFrame/top.gif") 0% 0%  no-repeat; text-align:left;}
	#bottomInnerframe {background: url("../Images/innerFrame/bottom.gif") 100% 100% no-repeat;  text-align:left }
	#sideInnerframe { background:url("../Images/innerFrame/mid.gif") repeat-y;  text-align:left }
	
	#topContentframe {background: url("../Images/ContentBoxs/top.gif") 0% 0%  no-repeat; text-align:left;}
	#bottomContentframe {background: url("../Images/ContentBoxs/bottom.gif") 100% 100% no-repeat;  text-align:left }
	#sideContentframe { background:url("../Images/ContentBoxs/sides.gif") repeat-y;  text-align:left }	
	
	#topContentframeSmall {background: url("../Images/ContentframeSmall/top.png") 0% 0%  no-repeat; text-align:left;}
	#bottomContentframeSmall  {background: url("../Images/ContentframeSmall/bottom.png") 100% 100% no-repeat;  text-align:left }
	#sideContentframeSmall { background:url("../Images/ContentframeSmall/sides.png") repeat-y;  text-align:left }		

#ButtonContainerSingleButton { width:500px; margin-top: 0px; margin-bottom:5px;  text-align:left; height: 50px; vertical-align:bottom; padding-bottom: 0px;} 
#ButtonContainer2 { width:898px; margin-top: 20px; margin-bottom:5px;  text-align:left; height: 60px; vertical-align:bottom; padding-bottom: 5px;} 
#ButtonContainer { width:898px; margin: 0px 0px 0px 0px; text-align:left; height: 40px; vertical-align:bottom; padding-bottom: 1px;}  /* change hieght and margin */

#smallButtonContainer {width:100px; margin-left: 30px;  height: 25px; margin-top: 2px;} 


#topButton {float:left; margin-top: 10px;}
#topButtonText { padding-top: 6px; font-size:14px; text-align:center;  }
#topButtonText  a { text-decoration: none; color: #000000;}
#ButtonloginHelpText { padding-top: 2px; font-size:10px; text-align:center; text-decoration: none; }
#ButtonloginHelpText a { text-decoration: none; color: #000000;}

#LeftSide {background: url("../Images/GreenBox/LeftSide.gif") 0% 0%  no-repeat; height: 92px; text-align:left}
#RightSide {background: url("../Images/GreenBox/RightSide.gif") 100% 0% no-repeat; height: 92px; text-align:left }
#MidGreen { background: url("../Images/GreenBox/Mid.gif") repeat-x; margin-left: 0px; margin-right: 0px;  text-align:left } 


#hiTrustLogo{float:left; background: url("../Images/HiTrustLogo.png") no-repeat; height: 47px; width:113px; margin-top: 24px; margin-left:10px;}
#nCircleLogo {float:left; background: url("../Images/nCircleLogo.png") no-repeat; height: 48px; width:261px; margin-top: 24px; margin-left:10px;}

#welcomeContainer  {float:left; width:279px; margin-left: 20px; text-align:left; height: 60px; } 
#LeftSideWelcome {background: url("../Images/welcomeBox/left.png") 0% 0%  no-repeat; height: 60px; text-align:left}
#RightSideWelcome{background: url("../Images/welcomeBox/right.png") 100% 0% no-repeat; height: 60px; text-align:left }
#MidGreenWelcome{ background: url("../Images/welcomeBox/mid.png") repeat-x;  margin-left: 0px; margin-right: 0px; text-align:left;} 

/* change 29px to 5px */
#LeftSideButton {background: url("../Images/buttons/leftSide.png") 0% 0%  no-repeat; height: 31px; text-align:left; margin-top: 5px;}
#LeftSideButton:hover  {background: url("../Images/buttons/leftSide-roll.png") 0% 0%  no-repeat; height: 31px; text-align:left; margin-top: 5px;}
#RightSideButton {background: url("../Images/buttons/rightSide.png") 100% 0% no-repeat; height: 31px; text-align:left;}
#RightSideButton:hover  {background: url("../Images/buttons/rightSide-roll.png") 100% 0% no-repeat; height: 31px; text-align:left;}
#MidButton { background: url("../Images/buttons/Mid.png") repeat-x;  margin-left: 0px; margin-right: 10px; text-align:left; margin-top: 5px;} 
#MidButton:hover  { background: url("../Images/buttons/Mid-roll.png") repeat-x;  margin-left: 0px; margin-right: 10px; text-align:left; margin-top: 5px;} 

#loginBox {float:right; width:100px; margin-right: 30px;  height: 60px; margin-top: 10px; } 
#smallButtonContainer {width:100px; margin-left: 30px;  height: 25px; margin-top: 5px;} 
#LeftSmallButton {background: url("../Images/smallButtons/left.gif") 0% 0%  no-repeat; height: 25px; }
#LeftSmallButton:hover {background: url("../Images/smallButtons/left-roll.gif") 0% 0%  no-repeat; height: 25px; }
#RightSmallButton {background: url("../Images/smallButtons/right.gif") 100% 0% no-repeat; height: 25px;  margin-right: -7px}
#RightSmallButton:hover  {background: url("../Images/smallButtons/right-roll.gif") 100% 0% no-repeat; height: 25px;  margin-right: -7px}
#MidSmallButton { background: url("../Images/smallButtons/mid.gif") repeat-x;  margin-left: 7px; margin-right: 20px;  } 
#MidSmallButton:hover { background: url("../Images/smallButtons/mid-roll.gif") repeat-x;  margin-left: 7px; margin-right: 20px;  } 



.welcomeContainerText { padding-top: 3px; padding-left: 20px; font-size:10px; text-align:left;  }

h1 {margin-top: 5px; font-weight: normal; font-size: 1.50em; line-height: 120%; color: #f90;padding-left: 5px; text-align:left;}
	

h2 {margin: 0; padding: 1em 0  1em; font-size: 1.25em; line-height: 120%; color: #f90; padding-left: 5px; text-align:left;}	
	
p { padding-left: 10px; padding-right: 10px; padding-top: 5px; text-align:left; font-size:12px;}	

#topButton {width:200px; }
.clear {font-size: 1px; height: 1px}