body {
background-color: #f2f4f5;
font-family: Arial, Verdana, sans-serif;
margin: 0 auto;
padding: 0;
color: #333333;
font-size: 14px;
background-image: url('../image-files/background.jpg');
background-position: top center;
background-repeat: repeat-x;
background-color: white;
}

/* -- H tags -- */ 
h1, h2, h3, h4, h5, h6 {
position: relative;
z-index:3;
background-color: transparent;
font-family: Arial, Verdana, sans-serif;
color: black;
}
h1 {
clear: left;
font-size: 24px;
margin: 25px 5px 20px 0px;
font-weight: bold;
padding-left: 27px;
padding-bottom: 10px;
border-bottom: 1px dotted #d6d6d6;
background-image: url('../image-files/h1triangle.jpg');
background-repeat: no-repeat;
background-position: top left;
color: #0000FF;
}
h1 em {
line-height:33px;
font-size:18px;
color:#8489AC;
}
h2 {
clear: left;
font-size: 15px;
margin: 0;
padding: 0;
}
h3 {
clear: left;
font-size: 17px;
margin-top: 30px;
}
h4 {
clear: left;
font-size: 14px;
margin-top: 25px;
}
h5 , h6 {
clear: left;
font-size: 24px;
margin: 0 0 25px 0;
font-weight: normal;
}
/* -- General Styling -- */
a:link {
color: #000099; 
text-decoration: none;
}
a:visited {
color: #000099; 
text-decoration: none;
}
a:hover {
color: #000099; 
text-decoration: underline;
}
a:link img {
border: 0;
}
img {
border: 0;
margin: 10px 30px;
}
li {
padding: 5px 0;
}
/* -- floats -- */
.ItemRight {
position: relative;
right:0;
top:0;
float: right;
margin: 10px 0 12px 10px;
clear: right;
text-align: center;
}
.ItemCenter {
margin: 10px auto 12px auto;
text-align: center;
clear: both;
}
.ItemLeft {
position: relative;
left:0;
top:0;
float: left;
padding: 5px 10px 12px 0;
clear: left;
text-align: center;
}
/* ------ Page Structure ------- */
#PageWrapper {
width: 1024px;
margin: 0 auto;
padding: 0;
border: 0;
background-color: transparent;
}
.Liner {
padding: 0;
margin:0;
}
/* ------ Header ------- */
#Header {
position: relative;
z-index:5;
top: 0;
left: 0;
width: 100%;
height: 90px;
padding-top: 10px;
background-image: url('../image-files/header.jpg');
background-repeat: no-repeat;
background-color: transparent;
background-position: top;
}
.Logo {
position: absolute;
z-index: 5;
top: 10px;
left: 27px;
width: 200px;
height: 90px;
margin: 0;
padding: 0;
}
.Logo img {
margin: 0;
}
.searchbox-top {
position: absolute;
z-index: 5;
top: 15px;
left: 237px;
width: 755px;
height: 25px;
margin: 0;
padding: 0;
float: left;
}
.searchbox-bottom {
margin: 0 auto;
padding: 0;
text-align: center;
}
.searchbox-bottom form{
margin-top: 0;
margin-bottom: 25px;
}
/* ------ Head Navigation ------- */
div.HeadNavigation {
position: absolute;
z-index: 9;
top: 40px;
left: 232px;
width: 770px;
height: 35px;
font-size: 14px;
color: white;
font-weight: bold;
}
div.HeadNavigation li.Separator {
height:35px;
width:5px;
background: url('../image-files/separator.jpg') no-repeat;
}
div.HeadNavigation li.LeftEnd {
height:35px;
width:10px;
background: url('../image-files/leftend.jpg') no-repeat;
}
div.HeadNavigation li.RightEnd {
height:35px;
width:10px;
background: url('../image-files/rightend.jpg') no-repeat;
}
div.HeadNavigation li {
float:left;
height:35px;
width:auto;
background: url('../image-files/headbutton.jpg') repeat-x;
text-align:center;
}
/* -- DropDown Menu -- */
#HeadButton
{margin: 0;
padding: 0;
z-index: 10}
#HeadButton li
{margin: 0;
padding: 0;
list-style: none;
float: left;
font: bold 13px arial}
#HeadButton li a
{display:block;
padding:13px 7px 0px 7px;
text-align:center;
width:auto;
color:black;
text-decoration:none;}
#HeadButton li a:hover
{text-decoration:underline;}
#HeadButton div
{position: absolute;
visibility: hidden;
z-index: 10;
margin: 0;
padding: 0;
background: #f1f6fc;
border: 1px solid #d6d6d6}
#HeadButton div a
{position: relative;
display: block;
z-index: 10;
margin: 0;
padding: 5px 10px;
width: auto;
white-space: nowrap;
text-align: left;
text-decoration: none;
background: #f1f6fc;
color: blue;
font: 11px arial}
#HeadButton div a:hover
{background: #49A3FF;
color: #FFF}
/* ------ Breadcrumb ------- */
#breadcrumb {
position: absolute;
z-index: 5;
top: 77px;
left: 250px;
width: 755px;
height: 20px;
font-size: 10px;
color: #d5d5d7;
}
#breadcrumb a {
color: #d5d5d7;
}
/* ------ Content ------- */
#ContentWrapper {
position: relative;
z-index: 2;
float: left;
width: 100%;
background-color: transparent;
}
#ContentColumn {
position: relative;
z-index: 3;
width: 755px;
margin: 0 12px 0 237px;
padding: 10px 20px 20px 0px;
line-height: 20px;
}
.TOC p{
clear: left;
}
.TOC p img{
margin: 5px 15px 10px 0;
float: left;
clear: left;
}
/* ------ LinkBox ------- */
#SummaryBox {
float:right;
width: 408px;
margin-left: 0px;
margin-bottom: 10px;
padding:0;
font-size: 12px;
border: 1px solid #d6d6d6;
}
#SummaryBox ul {
margin-left: 25px;
margin-top: 10px;
padding: 0;
}
#SummaryBox li {
list-style: circle;
font-style: italic;
}
#SummaryBox p {
clear:both;
}
#SummaryBox img {
margin: 10px 15px;
float: right;
}
.SummaryBox-body {
padding: 7px 20px 10px;
}
.SummaryBox-begin {
height:0;
}
.SummaryBox-end {
height:0;
}
#LinkBox {
float: right;
width: 400px;
margin-left: 10px;
margin-bottom: 10px;
padding: 0;
font-size: 12px;
}
#LinkBox ul {
margin-left: 25px;
margin-top: 10px;
padding: 0;
}
#LinkBox li {
list-style: circle;
}
#LinkBox p {
clear:both;
}
#LinkBox p img {
margin: 10px 15px;
float: right;
}
.linkbox-body {
width: 360px;
padding: 7px 20px 10px;
background-image: url('../image-files/linkbox-400.jpg');
background-repeat: repeat-y;
background-color: transparent;
}
.linkbox-begin {
width: 400px;
height: 10px;
margin: 0;
padding: 0;
background-image: url('../image-files/linkbox-400-begin.jpg');
background-repeat: no-repeat;
background-position: top center;
}
.linkbox-end {
width: 400px;
height: 10px;
margin: 0;
padding: 0;
background-image: url('../image-files/linkbox-400-end.jpg');
background-repeat: no-repeat;
background-position: top center;
}
/* ------ LinkBox Small ------- */
#LinkBox-small {
float: right;
width: 200px;
margin-left: 10px;
margin-bottom: 10px;
padding: 0;
font-size: 11px;
text-align: center;
line-height: 13px;
}
#LinkBox-small ul {
margin-left: 25px;
margin-top: 10px;
padding: 0;
text-align: left;
}
#LinkBox-small li {
list-style: circle;
text-align: left;
}
#LinkBox-small h5 {
font-size: 20px;
}
#LinkBox-small strong {
font-size: 12px;
}
#LinkBox-small b {
font-size: 12px;
}
#LinkBox-small img {
margin: 0px;
}
.linkbox-small-body {
width: 160px;
padding: 7px 20px 10px;
background-image: url('../image-files/linkbox-200.jpg');
background-repeat: repeat-y;
background-color: transparent;
}
.linkbox-small-begin {
width: 200px;
height: 10px;
margin: 0;
padding: 0;
background-image: url('../image-files/linkbox-200-begin.jpg');
background-repeat: no-repeat;
background-position: top center;
}
.linkbox-small-end {
width: 200px;
height: 10px;
margin: 0;
padding: 0;
background-image: url('../image-files/linkbox-200-end.jpg');
background-repeat: no-repeat;
background-position: top center;
}
/* ------ Navigation ------ */
#NavColumn {
position: relative;
z-index: 4;
float: left;
width: 200px;
margin-left: -997px;
float: left;  
padding: 0;
font-size: 12px;
color: #333333;
}
.NavProduct {
width: 180px;
height: 15px;
padding: 7px 10px 13px 10px;
background-image: url('../image-files/navbox-product-200.jpg');
background-repeat: no-repeat;
background-color: transparent;
text-align: center;
color: white;
}
.NavProduct a:link {
color: white; 
text-decoration: none;
}
.NavProduct a:hover {
color: white; 
text-decoration: underline;
}
.NavProduct a:visited {
color: white; 
text-decoration: none;
}
.Navigation {
width: 160px;
padding: 0 20px;
background-image: url('../image-files/navbox-200.jpg');
background-repeat: repeat-y;
background-color: transparent;
}
.NavHeader {
height: 20px;
margin: 0;
padding: 5px 0 0 0;
font-family: Verdana, Arial, sans-serif;
font-size: 11.5px;
font-weight: normal;
text-decoration: none;
color: black;
}
.Navigation ul {
list-style-type: none;
padding: 0 0 15px 0;
margin: -3px 0 0 0;
font-size: 11.5px;
}
.Navigation li {
padding: 2px 0 2px 5px;
margin: 0;
}
.Navigation a:link {
color: #0200ab; 
text-decoration: none;
}
.Navigation a:hover {
color: #0200ab; 
text-decoration: underline;
}
.Navigation a:visited {
color: #0200ab; 
text-decoration: none;
}
.navbox-end {
width: 200px;
height: 10px;
margin: 0;
padding: 0;
background-image: url('../image-files/navbox-200-end.jpg');
background-repeat: no-repeat;
background-color: transparent;
}
.NavigationTOC {
padding: 10px;
margin: -3px 7px 0 0px;
line-height:17px;
}
/* ------ Footer ------ */
#Footer {
position: relative;
z-index: 5;
width: 755px;
height: 70px;
margin-right: 12px;
margin-left: 237px; 
padding: 8px 20px 20px 0px;
background-image: url('../image-files/footer-navigation.jpg');
background-repeat: no-repeat;
background-position: top left;
background-color: transparent;
text-align: center;
font-size: 10px;
color: #333333;
clear: both;
}
.FooterLink {
width: 715px;
height: 20px;
padding: 0px 0 5px 20px;
font-size: 10px;
text-align: center;
color: gray;
}
.FooterLink a:link {
color: white; 
text-decoration: none;
}
.FooterLink a:hover {
color: white; 
text-decoration: none;
}
.FooterLink a:visited {
color: white; 
text-decoration: none;
}
/* -- Thumbnail-with-Caption Navigation -- */
.ThumbnailLink {
text-align: center;
}
.ThumbnailLink a:link {
text-decoration: none;
}
.ThumbnailLink a:hover .Caption {
text-decoration: underline;
}
/* ------ Section 6 - Boxes ------ */
.CalloutBox {
background-color: #fff;
width: 85%;
border: 1px dotted #8f8fb3;
margin: 18px auto 24px auto;
padding: 4px;
color: black;
}
div.CalloutBox p {
margin: 13px;
}
p.CalloutBox {
padding: 13px;
}
div.CalloutBox h6 {
margin: 13px 0 0 13px;
}
div.CalloutBox h5 {
margin: 13px 0 0 13px;
}
div.CalloutBox h4 {
margin: 13px 0 0 13px;
}
div.CalloutBox h3 {
margin: 13px 0 0 13px;
}
div.CalloutBox h2 {
margin: 13px 0 0 13px;
}
div.CalloutBox h1 {
margin: 13px 0 0 13px;
}
.ReminderBox {          
background-color: #ddd;
width: 24%;
border: 1px solid #8f8fb3;
margin: 0 0 12px 18px;
float: right;             /* adding float enables text to flow around it */
color: #006;
}
.ReminderBox h4 {
margin: 0;
padding: 2px;
text-align: center;
background-color: #fff;
}
.ReminderBox p {
font-size: 80%;
padding: 0 4px;
line-height: 120%;
}
.ReturnToNavBox {
border-top: 1px solid #d6d6d6;
text-align: center;
margin: 10px 0 0 0;
padding: 4px;
clear: both;
}
/* ------ Section 7 - Frequently Used Styles ------ */
.Clear {
clear: both;
}
.plainimg {
border: 0;
margin: 0;
padding: 0;
}
.Caption {
font-size: 85%;
font-weight: bold;
color: #000;
display: block;
line-height: 150%;
margin-bottom:10px;
}