/* 
This first set of styles define the page layout, general font specifications, 
basic background colors, etc. 

Each page has its contents held within the container DIV. This specifies 
some basic page properties. Within the container DIV are three basic areas: 
header, contents and footer.
*/

body {
background-color: #BFA9CF; 
margin: 0px; 
padding: 0px;}

#container {
width: 600px; 
margin: 15px auto; 
border: 4px solid #BFA9CF;}

p, li {
line-height: 140%;
font-family: Arial, Helvetica, sans-serif; 
font-size: 13px;
color: #222222;}

ul {
line-height: 140%;
font-family: Arial, Helvetica, sans-serif; 
font-size: 14px;
color: #222222;}

ol {
list-style-type: upper-latin;
font-family: Arial, Helvetica, sans-serif; 
font-size: 14px;
color: #222222;}

h1 {
line-height: 120%;
font-family: Arial, Helvetica, sans-serif; 
font-size: 16px;
font-weight: bold;
text-align: center;
margin-bottom: -15px;
color: #990033;}

h2 {
line-height: 110%;
font-family: Arial, Helvetica, sans-serif; 
font-size: 13px;
color: #990033;
font-style: italic;
font-weight: normal;
margin-bottom: -10px;}

h3 {
line-height: 110%;
font-family: Arial, Helvetica, sans-serif; 
font-size: 14px;
color: #990033;
font-weight: bold;
margin-bottom: -10px;}

.info {
font-family: Arial, Helvetica, sans-serif; 
font-size: 10px;
color: #555555;}

.cluster {
font-family: Arial, Helvetica, sans-serif; 
font-size: 15px;
font-weight: bold;
color: #000000;}

.path {
font-family: Arial, Helvetica, sans-serif; 
font-size: 11px;
color: #000000;}

.note {
font-family: Arial, Helvetica, sans-serif; 
font-size: 11px;
color: #990033;}

a {text-decoration:	none;}

a:link {
color: #411485;
background-color: transparent;}

a:visited {
color: #411485;
background-color: transparent;}
	
a:active {
color: #411485; 
background-color: transparent;}
	
a:hover	{
color: #411485; 
background-color: transparent; 
text-decoration: underline;}


/*
These styles partner with the hide and show JavaScript functions in the MCCE.js file 
to allow a user to click on one item to make another appear and disappear.
Different functions are used for block or inline text.
*/

.hide {display: none;}
.showinline {display: inline;}
.showblock {display: block;}


/* 
The second set of styles relates to the header and footer formatting. 
DIVs in these sections include: masthead, mainnav, footer. The present design
also include the transition-top and transition-bottom DIVs.
*/

#clusterbox {
margin: 0px;
padding: 0px;
width: 285px;
height: 320px;
float: right;}

#clusterbox p {
line-height: 15px;
margin-bottom: -10px;}

#nav {
margin: 0px;
padding: 0px;
float: left;
width: 300px;
text-align: right;
line-height: 120%;}

#nav h1, #nav h2, #nav p {
text-align: right;}

#nav p {
line-height: 5px;
margin-bottom: -10px;}


/* 
These styles designate the main content portion of the page, including 
the secondary navigation system.
*/

#content p, #content img {
margin: 10px 10px -5px 10px;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
line-height: 130%;
color: #222222;}

#content h1 {
line-height: 120%;
font-family: Arial, Helvetica, sans-serif; 
font-size: 16px;
font-weight: bold;
text-align: left;
margin: 10px 10px -5px 20px;
color: #222222;}

#content h3 {
margin: 10px 10px -11px 10px;}

#content .break {
margin: 10px 10px -17px 10px;}

#photostrip img {
width: 33px;
border: 0px solid #FFFFFF;
padding: 0px;
margin: 0px;}

#photostrip ul {
margin: 0px;
padding: 0px;
list-style: none;}

#photostrip li {
margin: 0px;
padding: 4px 1px 0px 0px;
width: 33px;
display: inline;
float: left;}

#photostrip li.agricultswap, #photostrip li.architectswap, #photostrip li.arts-avswap, 
#photostrip li.businessswap, #photostrip li.educateswap, #photostrip li.financeswap, 
#photostrip li.governswap, #photostrip li.healthswap, #photostrip li.hosptourswap,
#photostrip li.hserviceswap, #photostrip li.infotechswap, #photostrip li.manufacswap,
#photostrip li.marketswap, #photostrip li.safetyswap, #photostrip li.scienceswap,
#photostrip li.transportswap {
width: 85px;
display: none;}

#photostrip li.swap img {
width: 0px;
display: none;}

#photostrip li.first {
padding: 4px 1px 0px 4px;}

#agricult li.agricult, #architect li.architect, #arts-av li.arts-av, #business li.business, 
#educate li.educate, #finance li.finance, #govern li.govern, #health li.health, #hosptour li.hosptour,
#hservice li.hservice, #infotech li.infotech, #manufac li.manufac, #market li.market, 
#safety li.safety, #science li.science, #transport li.transport {
display: none;}

#agricult li.agricultswap, #architect li.architectswap, #arts-av li.arts-avswap, 
#business li.businessswap, #educate li.educateswap, #finance li.financeswap, 
#govern li.governswap, #health li.healthswap, #hosptour li.hosptourswap, #hservice li.hserviceswap, 
#infotech li.infotechswap, #manufac li.manufacswap, #market li.marketswap, 
#safety li.safetyswap, #science li.scienceswap, #transport li.transportswap {
width: 85px;
margin: 0px;
padding: 5px 5px 5px 5px;
display: inline;
float: left;}

#educate li.educateswap {
padding: 5px 5px 5px 9px;}

#agricult li.agricultswap img, #architect li.architectswap img, #arts-av li.arts-avswap img, 
#business li.businessswap img, #educate li.educateswap img, #finance li.financeswap img, 
#govern li.governswap img, #health li.healthswap img, #hosptour li.hosptourswap img, #hservice li.hserviceswap img, 
#infotech li.infotechswap img, #manufac li.manufacswap img, #market li.marketswap img, 
#safety li.safetyswap img, #science li.scienceswap img, #transport li.transportswap img {
width: 85px;
margin: 0px;
display: inline;
float: left;}

img.logo {
display: block; 
float: right; 
padding: 8px 10px 5px 0px;}

#hservice img.logo, #infotech img.logo, #manufac img.logo, #market img.logo, #agricult img.logo,
#transport img.logo, #safety img.logo, #science img.logo {
float: left;
margin: -38px 0px 0px 0px;
padding: 0px 0px 5px 10px;}

.menu {
color: #FFFFFF;
line-height: 18px;
font-family: Arial, Helvetica, sans-serif; 
font-size: 12px;}

.menu h1 {
line-height: 90%;
text-align: left;
color: #ffffff;
padding-bottom: 5px;
border-bottom: 1px solid #ffffff;
margin-bottom: 5px;}

#index .menu .index, #search .menu .search, #technical .menu .technical, #expert .menu .expert, 
#enrich .menu .enrich, #index .menu a.index:hover, #search .menu a.search:hover, 
#technical .menu a.technical:hover, #expert .menu a.expert:hover, #enrich .menu a.enrich:hover {
background-image: url(../images/arrow1.gif);
background-repeat: no-repeat;
color: #FFFFFF;}

.menu a:link, .menu a:visited, .menu a:active {
color: #FFFFFF;}

.menu a:hover {
color: #411485;
text-decoration: none;
background-image: url(../images/arrow2.gif);
background-repeat: no-repeat;}

img.corner {
margin: 0px 0px 0px 0px;}

.sans9 {  font-family: Arial, Helvetica, sans-serif; font-size: 9px}
.sans8 {  font-family: Arial, Helvetica, sans-serif; font-size: 8px}
.sans10 {  font-family: Arial, Helvetica, sans-serif; font-size: 10px}
.sans11 {  font-family: Arial, Helvetica, sans-serif; font-size: 11px}
.sans12 {  font-family: Arial, Helvetica, sans-serif; font-size: 12px}
.sans13 {  font-family: Arial, Helvetica, sans-serif; font-size: 13px;}
.sans14 {  font-family: Arial, Helvetica, sans-serif; font-size: 14px;}
.sans15 {  font-family: Arial, Helvetica, sans-serif; font-size: 15px; font-weight: normal}

.serif10 {  font-family: "Times New Roman", Times, serif; font-size: 10px}
.serif11 {  font-family: "Times New Roman", Times, serif; font-size: 11px}
.serif12 {  font-family: "Times New Roman", Times, serif; font-size: 12px}

.serif13 {  font-family: "Times New Roman", Times, serif; font-size: 13px; font-weight: bold}
.serif14 {  font-family: "Times New Roman", Times, serif; font-size: 14px; font-weight: bold}
.serif15 {  font-family: "Times New Roman", Times, serif; font-size: 15px; font-weight: bold}
.serif17 {  font-family: "Times New Roman", Times, serif; font-size: 17px}

.treb15 {  font-family: Trebuchet MS, Trebuchet, Arial, Helvetica, sans-serif; font-size: 15px}
.treb17 {  font-family: Trebuchet MS, Trebuchet, Arial, Helvetica, sans-serif; font-size: 17px}
.treb20 {  font-family: Trebuchet MS, Trebuchet, Arial, Helvetica, sans-serif; font-size: 20px}
.treb13 {  font-family: Trebuchet MS, Trebuchet, Arial, Helvetica, sans-serif; font-size: 13px}

