/* ---------- Main Layout Structure ----------- */

body {
padding: 0em;
font-size: 10px;
font-family: Verdana, Helvetica, Arial, sans-serif;
color: #000000;
width: 700px;
margin-left: auto;
margin-right: auto;
line-height: 14px; }

#container {
width: 700px;
position: absolute;
background-color: #ffffff;
top: 0em;
height: 100%; }

#header {
height: 86px;
position: relative;
border-left: 1px #8f8f8f solid; 
border-right: 1px #8f8f8f solid;
border-bottom: 1px #8f8f8f solid;
width: 698px;
top: 0em;
float: left; }

#mainSection {
width: 506px;
position: relative;
top: 2px;
left: 2px;
float: right; 
padding-left: 5px;
padding-right: 5px;
padding-top: 0em; }

#mainSection a {
text-decoration: none;
color: #727199;
font-weight: bold; }

#mainSection a:hover {
text-decoration: underline; }

#mainContent {
width: 682px; 
border: 1px #8f8f8f solid;
position: relative;
top: 8px;
left: 0em;
margin: 0em;
padding: 8px;
background-image: url(../sspo_imgs/dotRepeat.gif);
background-repeat: repeat-y;
float: left; }

#mainContent .libraryCurrent {
background-color: #007a8e;
color: #ffffff; }

#sideBar {
width: 160px;
top: 0px;
float: left;
margin: 0em;
padding: 0em; }

.subSideBar {
padding-top: 20px;
float: left; }

.subSideBar a {
text-decoration: none;
color: #46b1ab; }

.subSideBar a:hover {
text-decoration: underline; }

#sideInfo {
}

#topRow {
position: relative;
width: 506px;
float: left;
margin-bottom: 14px; }

#shadeSection {
position: relative;
width: 506px;
background-color: #b8d4e0;
border-top: 1px #007a8e solid;
border-bottom: 1px #007a8e solid;
float: left; }

#shadeRow {
position: relative;
width: 500px;
padding: 3px;
margin-top: 4px;
float: left; }

#baseSection {
position: relative;
width: 506px;
border-top: 1px #007a8e solid;
border-bottom: 1px #007a8e solid;
float: left; }

#siteMap {
}

#siteMap a {
text-decoration: none;
font-size: 9px;
font-family: Verdana, Helvetica, Arial, sans-serif;
background-color: #ffffff;
border: 1px #000000 solid;
display: block;
color: #000000;
font-style: normal;
font-weight: normal; }

#siteMap a:hover {
color: #ffffff;
background-color: #007a8e;
text-decoration: none; }

/* ---------- Header Styling ----------- */

#headerInfo {
position: absolute;
right: 20px;
top: 30px;
margin: 0em;
padding: 0em; }

#headerInfo a {
text-decoration: none;
color: #007a8e; }

#headerInfo a:hover {
text-decoration: underline; }

/* ---------- Image Banner Styling ----------- */

#animate {
height: 105px;
position: relative;
margin-top: 3px; 
border-top: 2px #cccccc solid;
border-bottom: 2px #cccccc solid;
padding-top: 3px;
padding-bottom: 3px;
width: 700px;
top: 0px;
float: left; }

/* ---------- Sub Menu Styling ----------- */

#subMenu {
width: 157px;
background-image: url(../sspo_imgs/subMenuHeader.gif);
background-repeat: no-repeat;
position: relative;
left: 0px;
top: 0px;
background-color: #007a8e;
padding-top: 3px;
padding-bottom: 2px;
float: left; }

#subTitle {
width: 140px;
margin-left: 6px;
position: relative;
padding-bottom: 2px;
float: left;
top: 0px;
left: 0px;
margin-top: 4px;
color: #ffffff; }

#subMenuContent {
position: relative;
width: 149px;
color: #000000;
background-color: #bfdce9;
padding-right: 4px;
padding-left: 4px;
font-size: 1em;
border-bottom: 4px #b8d4e0 groove;
padding-bottom: 2px;
padding-top: 5px;
border-top: 3px #ffffff solid;
top: 0px;
float: left;
left: 0px; }

#subMenuContent a{
text-decoration: none;
display: block;
padding-top: 0.2em;
padding-bottom: 0.2em;
padding-left: 0.3em;
color: #007a8e;
font-weight: bold; }

#subMenuContent a:hover {
background-color: #007a8e;
color: #ffffff; }

#subMenuContent .currentSub {
background-color: #007a8e;
color: #ffffff; }


/* ---------- Navigation Bar Styling ----------- */

#navigation {

background-color: #007a8e;
margin-top: 3px;
position: relative;
width: 698px;
top: 0px;
float: left;
height: 22px;
z-index: +500; }

#menu {
width: 690px;
background-color: #007a8e;
float: left;
white-space: nowrap;
height: 22px;
margin: 0em;
padding-left: 10px; }

#menu ul {
list-style: none;
margin: 0;
padding: 0;
padding-right: 14px;
float: left;
position: relative;
}

#menu a{

border-width: 1px;
border-style: solid;
border-color: #ccc #888 #555 #bbb;
margin: 0;
padding: 3px 3px 3px 3px;
border: 1px #007a8e solid;
display: block;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 10px; 
background: #007a8e;
text-decoration: none;
color: #ffffff;}


#menu a:hover {
background: #c2dae4;
color: #000000; }

#menu li {position: relative;}

#menu ul ul {
position: absolute;
z-index: 500;
width: 220px;
padding-left: 4px;
padding-top: 2px;
padding-bottom: 2px;
margin-left: -3px;
margin-top: -2px; }

#menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
}

div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}

#home {
width: 50px;
margin: 0em;
padding: 0em;
float: left; }

#about {
width: 60px;
padding: 0em;
margin: 0em;
float: left; }

#media {
width: 76px; 
margin: 0em;
padding: 0em;
float: left; }

#consumer {
width: 60px;
margin: 0em;
padding: 0em;
float: left; }

#economics {
width: 60px;
margin: 0em;
padding: 0em;
float: left; }

#environment{
width: 74px;
margin: 0em;
padding: 0em;
float: left; }

#contact {
width: 64px;
margin: 0em;
padding: 0em;
float: left; }


/*----------- Main News Section -------------*/ 

#mainNews {
float: left;
width: 506px;
margin-bottom: 14px;  }

#mainNewsPic {
float: left;
width: 208px; }

#mainNewsTxt {
float: left;
width: 294px;
padding-left: 4px; }

/*----------- Sub News Section -------------*/ 

#subNews {
float: left;
width: 250px;
margin-top: 6px;
}

#subNewsPic {
float: left;
width: 110px; }

#subNewsTxt {
float: left;
width: 136px;
padding-left: 4px; }

/*----------- Text Styling -------------*/ 

.subMenuTitle {
font-size: 12px;
font-weight: bold;
color: #ffffff; }

h1 {
font-size: 12px;
color: #007a8e;
font-weight: bold; }

h2 {
font-size: 10px;
color: #007a8e;
font-weight: bold;
}

.subHeader {
font-size: 10px;
color: #007a8e;
font-weight: bold;
}

.headerText {
padding-left: 14px;
font-size: 0.9em;
color: #007a8e; }

.boldCopy {
font-weight: bold; }

.boldCopyRight {
font-weight: bold;
text-align: right;
float: right;
font-size: 9px; }

.bodyText {
font-size: 10px;
line-height: 1.3em; }

.dates {
color: #969696;
font-size: 9px;
font-family: Verdana, Helvetica, Arial, sans-serif; }

.highLightText {
background-color: #edfff8;
width: 492px;
padding: 4px; }

.blueHighLight {
background-color: #eae8e6;
padding: 4px; }

.lightGreyHighLight {
background-color: #eae8e6;
padding: 4px; }

.darkGreyHighLight {
background-color: #dfdfdd;
padding: 4px; }

.centeredText {
text-align: center; }

.vertLine {
background-image: url(../sspo_imgs/vertLine.jpg);
background-repeat: repeat-y;
background-position: center; }

.horiLine {
background-image: url(../sspo_imgs/horiLine.jpg);
background-repeat: repeat-x;
background-position: left bottom; }

.cross {
background-image: url(../sspo_imgs/cross2.jpg);
background-repeat: no-repeat;
background-position: center bottom;
}

#mediaYear {
width: 490px;
float: left;
position: relative;
text-align: center; }

#mediaYear a{
color: #007a8e;
padding-right: 3em;
text-decoration: none;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 1.1em;
padding-left: 3em;
padding-top: 0.2em;
padding-bottom: 0.2em; }

#mediaYear a:hover {
color: #ffffff;
background-color: #007a8e;
text-decoration: none; }

#mediaYear .current {
color: #ffffff;
background-color: #007a8e;
text-decoration: none; }

#longColumns {
background-color: #eeeeee;
float: left;
width: 226px;
position: relative;
top: 0em;
margin-top: 8px;
padding-left: 6px;
padding-right: 6px;
margin-right: 8px; }

.columnHeader {
width: 230px;
height: 20px;
background-color: #007a8e;
text-align: center;
font-size: 1.2em;
font-weight: bold;
color: #ffffff;
padding-top: 6px;
}

.smallTextSections {
position: relative;
float: left;
top: 0em;
width: 220px; }

/*----------- Footer -------------*/ 

#footer {
position: relative;
background-color: #666666;
width: 700px;
text-align: center;
height: 26px;
color: #ffffff;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 10px;
float: left;
margin-top: 16px;
}

#footerContent {
margin-top: 6px; }

#footerContent a{
text-decoration: none;
color: #ffffff; }

#footerContent a:hover{
text-decoration: underline; }

#disclaimer {
position: relative;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 1em;
float: left;
width: 700px;
text-align: center; }

#disclaimer a {
color: #992b11;
text-decoration: none; }

#disclaimer a:hover {
text-decoration: underline; }