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

body  {
	font: 100% Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	background: #44697D url(../images/common/bkgd.gif) center top no-repeat;
}
p {
	font-size: 12px;
	line-height: 17px;
	color: #666666;
	padding: 0;
	margin: 0;
}
a { color: #A8B400; } /* The normal link color is #A8B400, alternate link colors are attached to their IDs */
a:hover { color: #000000; } /* The normal link:hover color is #000000, alternate link colors are attached to their IDs */
h1, h2, h3, ul, li { /* Clear the spacing around standard text elements to avoid layout problems */
	padding: 0;
	margin: 0;
}
strong {
	font-weight: bold;
	color: #000000;
}
table {
	border: 1px solid #CCC;
	border-collapse: collapse;
}
th {
	background-color: #44697D;
	padding: 5px;
	color: #FFF;
	font-size: 12px;
	font-weight: normal;
	border: 1px solid #CCC;
	text-align: left;
}
td {
	padding: 5px;
	border: 1px solid #CCC;
	vertical-align: top;
}

/* Define the width of the site, background color and alignment */
#container {
	width: 900px;
	background: #FFF;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}

/* Create the header for the site */
#header {
	padding: 0;
	background: #a8b400 url(../images/common/header_bkgd.gif) no-repeat;
	height: 120px;
	position: relative;
}
#header .logo {
	position: absolute;
	top: 23px;
	left: 20px;
	visibility: hidden;
}
#header .logoPrint {
	position: absolute;
	top: 23px;
	left: 20px;
	
}
#header .titleText {
	position: absolute;
	top: 93px;
	left: 340px;
	visibility: hidden;
}
#header .titleTextPrint {
	position: absolute;
	top: 93px;
	left: 340px;
}
#header .sectionPhoto {
	position: absolute;
	left: 571px;
}

/* Define the navigation area and Search form */
#navigation {
	background: #000000;
	padding: 0 20px 3px 20px;
	height: 18px; /* Set explicit height to force IE to show the full navigation bar */
	position: relative;
}
#navigation form { visibility: hidden; }


/*	Define the breadcrumb area	*/
#breadcrumb {
	color: #555;
	font-size: 9px;
	margin-bottom: 10px;
	padding: 7px 0 0 20px;
	clear: both;
}
#breadcrumb a { color: #A8B400; } 
#breadcrumb a:hover { color: #000000; }

/* Define the Footer */
#footer {
	padding: 10px 20px;
	background:#E4E8EB;
	font-size: 11px;
	color: #555;
}
#footer a { color: #333333; }

/* Define the style for copyright javascript */
#copyright {
	width: 900px;
	margin: 0 auto;
	text-align: right;
	font-size:10px; 
	color:#a4b8d0;
	padding: 16px 0;
}

/*	This section defines the panels for the layouts
	There are special instances where the width of a panel may differ for a
	particular page. The special instances are documented below.
*/

/*	The singlePanel definition is common for all multi-panel layouts and will be used for
 	for the left-most panel for all layouts and for every panel in a 4-panel layout. */
.singlePanel {
	width: 200px;
	padding-left: 20px;
	float: left;
}
.singlePanel h1 {
	font-size: 15px;
	line-height: 20px;
}
.singlePanel p { margin-bottom: 12px; }
.introTextPanel { 
	margin-left: 220px; 
	padding: 0 20px; 
	width: 420px;
}
.introTextPanel p { font-size: 15px; }
.homeIntroTextPanel { /* The .homeIntroTextPanel differs from the .introTextPanel width settings. */
	padding: 0 20px; 
	width: 640px;
}
.homeIntroTextPanel p { font-size: 15px; }
#siteMapPanel { 
	margin-left: 220px; 
	padding: 0 20px; 
	width: 420px;
}
#siteMapPanel ul {
	line-height: 30px;
	list-style-type: none;
}
#siteMapPanel ul ul {
	margin-left: 20px;
	font-size: 14px;
	line-height: 20px;
	list-style-type: none;
}
#homeLinksBox {
	float: right;
	width: 309px;
	height: 148px;
	padding: 12px 20px 0 0;
	background: url(../images/home-page/links-bkg.jpg) top no-repeat;
}
#homeLinksBox ul { list-style-type: none; }
#homeLinksBox li {
	margin-left: 150px;
	font-size: 13px;
	line-height: 16px;
}
#homeLinksBox a { color: #FFFFFF; }
#homeLinksBox a:hover { color: #000000; }
.relatedLinksPanel {
	padding-right: 20px;
	width: 200px;
	float: right;
}
.relatedLinksPanel ul { list-style-type: none; }
.relatedLinksPanel li {
	font-size: 12px;
	line-height: 16px;
}

/*	The following panels should be used in conjunction with the singlePanel 
	class define above. */
.twoPanelRight {
	margin-left: 220px;
	padding-left: 20px;
}
.twoPanelRight img {
	float: left;
	padding: 0 20px 20px 0;
}
.twoPanelRight object {
	float: left;
	padding: 0 20px 20px 0;
}
.twoPanelRight p { margin-bottom: 12px; }
.twoPanelRight h1 {
	font-size: 14px;
	line-height: 16px;
}
.twoPanelRight ul {
	padding: 0;
	margin: 0 0 0 15px;
}
.twoPanelRight li {
	color: #555;
	font-size: 12px;
	line-height: 17px;
	margin: 0;
	padding: 0;
}
.twoPanelRightPadded { /*This is a special case for Brand Strategy Overview page */
	margin-left: 220px;
	padding: 0 20px;
}
.twoPanelRightPadded ul{ 
	padding: 0;
	margin: 0 0 0 15px;
}
.twoPanelRightPadded li{
	color: #555;
	font-size: 12px;
	line-height: 17px;
	margin: 0;
	padding: 0;
}

/*	Set up for special image layoutsID Elements - Imagery, Color Palette and Patterns. 
	Image padding and floats must be set with specific classes.	*/
.twoPanelImageGrid { 
	margin-left: 220px;
	padding-left: 20px;
}
.twoPanelImageGrid h3 { /*This is a special case for small text on the color palette page */
	font-size: 11px;
	line-height: 16px;
	padding-left: 20px;
	margin: 3px 0 8px 0;
	font-weight: Normal;
}
.twoPanelRightPadded p { margin-bottom: 12px; }
.columnText {
	width: 200px; 
	float: left;
}
.columnText img { padding: 0; float: none;}
.copyImageBlock { float: left; }
.copyImageBlock img { float: none; }
.landingPageText { /* This class is similar to the columnText class, but increases the width of the div */
	width: 300px; 
	float: left;
}
.landingPageText p {
	margin-bottom: 0;
	line-height: 14px;
}
.landingPageText a { 
	color: #000000;
	text-decoration: none;
}
.landingPageText a:hover { text-decoration: underline; }
.singleWideText {
	width: 650px; 
	padding-left: 20px;
}
.singleWideText p {
	margin-bottom: 12px;
}
.singleWideText h1 {
	font-size: 15px;
	line-height: 20px;
}
.brandOverviewBigText {
	font-size: 20px;
	line-height: 24px;
	color: #44697D;
}
/* Setup for page printing  */
.noPrint { visibility: visible; }
.print {visibility: hidden; }

/* Additional styles for floating, clearing, separators and image padding */
.fltrt {
	float: right;
}
.fltlft {
	float: left;
}
.clearFloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.separatorLine {
	margin:7px 20px 17px 20px;
	border-top:1px solid #777;
}
.separatorNoLine {
	margin:5px 20px;
	border-top:1px solid #FFF;
}
.imagePadding { 
	padding: 0 0 20px 0; 
}
.floatRightImage { /* This class is used in conjunction with the .twoPanelImageGrid class */
	padding: 0 20px 20px 0;
	float: right;
}
.floatLeftImage { /* This class is used in conjunction with the .twoPanelImageGrid class */
	padding: 0 20px 20px 0;
	float: left;
}
.swatchPadding { /* This class is used in conjunction with the .twoPanelImageGrid class */
	padding: 0 20px 0 0;
}
.linkImagePadding {
	padding-bottom: 5px;
}

/* Set print visibility */
.noPrint { visibility: hidden; }
.print { visibility: visible; }