/******************************************
  GLOBAL HTML STYLES
 ******************************************/

/* Set everything's font size to the size of its parent.
   Remove all margins & borders and redefine them later */
* {
  font-size: 100%;
  border: 0;
  margin: 0;
  padding: 0;
}

body {
  font-family: Trebuchet, Trebuchet MS, Arial, Helvetica, sans-serif;
  color: #EFEFEF;
  font-size: 80%;
  background-color: #002244;
  text-align: center;
  min-width: 100px;
}

/*jfong - changed the color of the links so you can distinguish them within the text*/
a { 
  text-decoration: none;
  color: #6699ee;
}

a:link, a:visited {
  color: #6699ee;
}

a:hover, a:active {
  text-decoration: underline;
}

/*a:hover img { 
  opacity: .75;
  filter:alpha(opacity=75);
}

a:hover object {
  opacity: .75;
  filter:alpha(opacity=75);
}*/

h1, h2, h4 {
  font-size: 100%;
  padding: .5em;
}

h1 {
  font-weight: bold;
  text-align: center;
  color: #002244;
  font-size: 200%;
}

h2 {
  font-weight: bold;
  color: 
}

h3 {
  text-align: center;
  background-image: url("../images/hrline.gif");
  background-position: center left;
  background-repeat: repeat-x;
  margin: 1em;
}

h3 span {
  text-transform: uppercase; 
  background-color: white;
  color: #000066;
  padding-left: 1em;
  padding-right: 1em;
}

h5 {
  font-weight: bold;
  color: #23476B;
  text-align: left;
  font-size: 130%;
}

hr {
  width: 100%;
  height: 1px;
  color: #8D9BC6; 		/* for ie */
  background-color: #8D9BC6;	/* for ff */
  text-align: center;
  margin: 3px 0;
}

.clear {
  clear: both;
}

hr.blue {
  margin: 5px 0px;
  color: #000066;
  background-color: #000066;
  border-top: none;
  border-bottom: none;
  border-left: 1em solid white;
  border-right: 1em solid white;
}

/* correct for ie6 png transparency issue */
img {
  behavior: url(../scripts/iepngfix.htc);
} 

input.button { 
  padding: .25em;
  border: 1px outset;
}

input.text {
  padding: .25em;
}

p { 
  padding: .75em;
  color: #EFEFEF;
}

textarea { 
  font-family: Trebuchet, Trebuchet MS, Arial, Helvetica, sans-serif;
  padding: .25em;
}

ul, ol { 
  margin-left: .75em;
  padding-left: 1.25em;
}

li {
  margin-top: .25em;
  margin-bottom: .25em;
}

.listNoBullet ul {
  list-style: none;
  margin-left: 0;
}

.style1 {	
  font-size: 9px;
  font-style: italic;
}

.style2 {
  font-size: 9px
}

/*jfong - added April 2009*/
blockquote {
  padding-top: 0.75em; 
  padding-right: 3.0em; 
  padding-bottom: 0.75em; 
  padding-left: 3.0em;
}

/******************************************
  GLOBAL STYLES
 ******************************************/

.alignLeft {
  text-align: left;
}

.alignCenter {
  text-align: center;
}

.alignRight {
  text-align: right;
}

.back2top {
  padding: 1em;
}

.bkgd_bluegray {
  background-color: #adbccf;
}

.bkgd_gradient1 {
  background-image: url('../images/bg_grad_003377-002244.png');
  background-repeat: repeat-x;
}

.bkgd_gradient2 {
  background-image: url('../images/bg_grad_003377-002244.png');
  background-repeat: repeat-x;
  background-position: 0px -100px;
}

.bkgd_gradient3 {
  background-color: #003377;
  background-image: url('../images/bg_grad_003377-002244.png');
  background-repeat: repeat-x;
  background-position: bottom;
}


.hidden {
  display: none;
}

.pad4 {
  padding: 4px;
}


/******************************************
  GLOBAL LAYOUT STYLES
 ******************************************/

div.base {
  clear: both;
  height: 0;
}

div.pageContainer {
  text-align: left;
  width: 960px; /* column1 + column2wide + 16px margin */
  margin: 10px auto;
}

div.columnExpand {
  width: 960px;
  float: left;
  min-height: 300px;
  height: auto !important;
  height: 300px;
}

div.column1 {
  clear: left;
  float: left;
  width: 228px;
  min-height: 500px;
  height: auto !important;
  height: 500px;
}

div.column2, div.column2wide {
  float: right;
}

div.column2 {
  width: 472px;
}

div.column2wide {
  width: 716px; /* column2 + column3 + 16px margin */
  }

div.column3 {
  float: right;
/* 081009 cc - somewhere along the line we introduced an extra pixel to either column2 or column3, causing things to shift.  this is my TEMPORARY workaround */
/* 081017 cc - GEEZ.  somehow we lost two more pixels in IE 6/7. */
/*  margin-left: 16px;*/
  margin-left: 13px;
  width: 228px;
}
html>body div.column3 { 
  margin-left: 16px; 
}

div.column2a, div.column2b {
  width: 331px;
  padding: 16px 8px;
}

div.column2a {
  float: left;
}

div.column2b {
  float: right;
}

div.column2ab {
  width: 690px;
  float: right;
  padding: 1em;
  padding-top: 1em;
  position: relative;
}

div.mainContent {
/* ie does not honor min-height.  
   fortunately, it treats height as min-height, so it doesn't have the potential 
   text overrun problem.  there are lots of versions of this hack, but i like 
   this one as it requires no changes to html, nor any additional css styles */
  min-height: 300px;
  height: auto !important;
  height: 300px;
  margin: 8px 0 0 0;
}

div.mainLower {
            PADDING-RIGHT: 0.5em; PADDING-LEFT: 0.5em; WIDTH: 464px;
            MIN-HEIGHT: 250px; 
            HEIGHT: auto !important; 
            HEIGHT: 250px; 
            mac-height: 250px;
        }

.mainLower div.splitcol1 {
  float: right;
}

.mainLower img {
/*  margin: 10px 0 0 0;*/
}

div.feature {
  float: left;
  margin: 8px 0px 8px 16px;
  padding: 0;
  width: 136px;
  display: inline;
  position: relative;
}

img.feature { 
/*  border: 1px solid #FFFFFF; */
  float: left;
}

div.subFeature, div.splitCol1, div.splitCol2 { 
  border: none;
  background-color: transparent;
  width: 228px;
  margin: 8px 0 0 0;
}

div.divHeader h2, div.divHeader h2 a:link, div.divHeader h2 a:visited  {
  text-transform: uppercase;
  color: #FFCD05;
  font-size: 14px;
  padding-left: 0;
  padding-top: 0;
}

div.photoCredit {
  text-align: right;
  padding: 0 5px;
  color: #666666;
  font-size: 80%;
}

div.moreLink {
  text-align: right;
  vertical-align: bottom;
  padding: 20px;
  font-size: 14px;
  font-weight: bold;
  color: #FFCD05;
  text-transform: lowercase;
}

div.moreLink a:link, div.moreLink a:visited {
  color: #FFCD05;
}

img.imageHeader {
  border-bottom: medium solid #FFFFFF;
}

div.research {
  text-align: center; 
  background-color: #adbccf;
  width: 100%;
}

/*All changes from here made by jfong. Last changes made May 2009.*/
/*For Newsletter photos*/
div.newsImage {
  float: left;
  margin: 0 0 1 8px;
}

/*For frontpage news stories*/
div.newsImage2 {
  float: right;
  margin: 0 0 1 8px;
}

/*For Newsletter photos*/
img.newsPhoto {
  float:left;
  margin-top:10px;
  margin-right:10px;
  border: 1px solid black;
}

img.newsPhotoborderless {
  float:left;
  margin-top:10px;
  margin-right:10px;
  border: 0px solid black;
}

/*For Newsletter photos*/
div.photoCaption {
  text-align: left;
  color: #666666;
  font-size: 80%;
}

/*For frontpage news stories*/
div.photoCaption2 {
  text-align: left;
  color: #ffffff;
  font-size: 80%;
  margin: 0 0 1 8px;
}

img.floatright {
	float:right;
	padding: 0.5em;
}

img.floatleft {
	float: left;
	padding: 0.5em;
}

img.border {
  margin-right:10px;
  margin-bottom:10px;
  padding: 5px;
  background-color:#ffffff;
}

/******************************************
  WHITE BACKGROUND STUFF
 ******************************************/

div.whiteBkgd {
  background-color:#FFFFFF;
  padding: 8px;
}

div.whiteBkgd {
  color: #333333;
}

div.whiteBkgd a {
  color: #2266BB;
  font-weight: bold;
}

div.whiteBkgd a:visited {
  color: #2266BB;
  font-weight: bold;
}

div.whiteBkgd a:hover {
  text-decoration: underline;
}

div.whiteBkgd p {
  color: #333333;
}

div.featureBottom {
  width: 100%;
  line-height: 5px;
  background-image: url('../images/featureBottom.png');
  behavior: url(../scripts/iepngfix.htc); 
}

div#BL {
  width: 50%;
  float: left;
  background-position: bottom left;
}

div#BR {
  width: 50%;
  float: right;
  background-position: bottom right;
}

a.dark {
  color: #95002F;
}

h6, h6 a:link, h6 a:visited {
  text-transform: uppercase;
  color: #002244;
  font-size: 16px;
  padding-left: 0;
  padding-top: 0;
}

/******************************************
  NEWS FEATURE STUFF
 ******************************************/

.newsFeature a:link, .newsFeature a:visited {
  color: #333333;
}

.newsFeature h1 {
  text-align: left;
  color: #333333;
  margin: 0;
  padding: .5em 0;
  font-family: Georgia, "Times New Roman", Times, serif;
}

.newsFeature h4 {
  color: #899AAB;
  padding: 0 0 10px 0;
  font-size: 120%;
}

.newsFeature h5 {
  color: #999999;
  padding: 5px 5px 10px 0;
  padding: 4px 0;
  margin: 5px 5px 1em 0;
  border-top: 1px solid #333333;
  border-bottom: 1px solid #333333;
}

.newsFeature hr {
  width: 100%;
  clear: both;
  margin-top: 10px;
}

.newsFeature img {
  padding: 0;
  margin: 0;
}

.newsFeature p {
  padding: 0 0 .75em 0; 
  color: #333333;
}

.newsFeature div.preview { 
  color: #333333;
  padding-top: 1em;
  clear: both;
  position: relative;
}

.newsFeature .preview img { 
  margin-right: 10px;
  margin-bottom: 5px;
  float: left;
}

.newsFeature .preview h4 img { 
  margin: 0;
  float: none;
}

.newsFeature .preview p { 
  padding-bottom: 5px;
  margin-bottom: 0;
  position: relative;
}

.newsFeature div.headlines {
  float: left;
  width: 220px; /* 716 - 16(div pad) - 8(img pad) - 472(img) */
}

.newsFeature div.featureMenuBar {
  clear: both;
  width: 200x; /* 220 - 4(margin) - 16(pad) */
  min-height: 20px;
  height: auto !important;
  height: 20px;
  padding: 8px;
  margin: 2px;
  background-color: #E8E8E8;
  text-align: center;
}

.newsFeature div.featureMenuBar div {
  float: left;
  width: 92px; /* 200/2 - 8(pad) */
  padding: 2px 4px;
}

.newsFeature div.mainImage {
  float: right;
  width: 472px;
  margin: 0px 0px 8px 8px;
  background-color: #E8E8E8;
}

.mainImage .mainCaption {
  color: #333333;
  margin: 0 5px 10px 5px;
}

div.mainCaption {
  position: relative;
}

.newsFeature div.feature_left {
  margin: 0px 8px 8px 3px;
  padding: 8px;
  float: left;
  max-width: 220px;
  /* another IE hack */
  width: expression(this.width > 220 ? 220: true);
  background-color: #E8E8E8;
}

.newsFeature .feature_left ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

.newsFeature .feature_left li {
  margin-left: 0;
  padding-left: 0;
}

.newsFeature .featureAuthor {
  font-style: italic;
  text-align: right;
}


/******************************************
  SPOTLIGHT STUFF
 ******************************************/

div.spotlight {
 text-align: left;
}

.spotlight h2 {
  display: inline;
  float: left;
}

.spotlight h4 {
  padding: .5em .25em 0 .75em;
}

.spotlight .hide {
  display: none;
}

.spotlight .show {
  display: inline;
}

.spotlight div.spotlightMenu {
  display: inline;
  float: right;
  vertical-align: top;
  padding-right: 10px;
  padding-top: 0px;
}

.spotlight .spotMenuHigh {
  font-size: 110%;
  font-weight: bold;
}

.spotlight .spotMenuNorm {
  font-size: 90%;
  font-weight: normal;
} 

/*The styles for spotlights on second level pages.*/
div.spotlight1 {
  clear: both;
  text-align: left;
  padding: 0em 0em 1.5em 0em;
}

.spotlight1 h2 {
  display: inline;
}

.spotlight1 img {
  padding: 5px;
}


/******************************************
  PAGE TAB STUFF
 ******************************************/

#tabText {
  float: left;
  background-color: #FFFFFF;
  height: 2.2em;
  padding: 0em .4em;
}

#tabText h1 {
  font-family: "Times New Roman", Times, serif;
  font-size: 160%;
  text-transform: uppercase;
  color: #002244;
  margin-top: -.4em;
  margin-bottom: -1em
}

#tabR {
  float: left;
  width: 30px;
  height: 2.2em;
  background-image: url('../images/tab.png');
  behavior: url(../scripts/iepngfix_v2.htc);
  background-position: bottom right;
  background-repeat: no-repeat;
}

#tabL {
  float: left;
  width: 30px;
  height: 2.2em;
  background-image: url('../images/tab.png');
  behavior: url(../scripts/iepngfix_v2.htc);
  background-position: bottom left;
  background-repeat: no-repeat;
}xd

