/* 
=========================================================================================== CREDITS
Copyright              2008 JPL Productions
Author                 Larry Daughenbaugh
=========================================================================================== PAGE STRUCTURE
    #bg-container     | all content is stored here, centered on the page, contains swirl bg graphic
    #header-container | logo, navigation
    #content          | main content
    #footer           | footer content
=========================================================================================== BEGIN CSS
*/													
body  {
	margin: 0px;
	padding: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 13px;
	text-align: center;
	color: #57585B;
	background: #F9F0C6 url(/general/img/bg.gif) repeat-x;
}
#bg-container {
	width: 100%; /* the auto margins center the page */
	text-align: left; /* overrides text-align: center on the body element. */
	padding: 0px;
	margin: 0px auto;
	background: url(/general/img/bg-swirl.gif) no-repeat left top;
}
p { padding: 0px 0px 5px 0px; }
/* ======================================================================================== HEADER CONTENT */
#header-container {
	width: 960px;
	margin: 0px auto; /* the auto margins center the page */
	padding: 0px;
	text-align: left; /* overrides text-align: center on the body element. */
} 
#header-content {
	margin: 0px;
	padding: 0px;
	display: block;
	height: 109px;
	background: url(/general/img/header-bg.gif) no-repeat center bottom;
}
#header-container img, #header-content img {
 margin: 0px;
 padding: 0px;
 border: none;
	float: left;
}
.nav-pad-left {
	margin: 0px;
	padding: 0px;
	height: 50px;
	width: 108px;
	display: block;
	float: left;
}
/* ======================================================================================== MAIN CONTENT */
#home-repeat {
	width: 960px;
	margin: 0 auto; /* the auto margins center the page */
	padding: 0px;
	text-align: left; /* overrides text-align: center on the body element. */
	background: url(/social-responsibility/img/bg-repeat.jpg) repeat-y center top;
} 
#home {
	margin: 0px;
	padding: 0px 0px 3px 0px;
	background: url(/social-responsibility/img/bg.jpg) no-repeat center top;
	width: 960px;
	display: block;
}
.container-2column {
 margin: 0px 20px 0px 11px; /* give sides a margin so the bg border shows through */
	padding: 0px;
	display: block;
}
#left-column { /* content (2 cols) wid: 960 (left: 292 | right: 668) */
 margin: 0px;
	padding: 0px;
	float: left;
	display: block;
	width: 292px;
}
#right-column-introduction { /* used on introduction page only */
 margin: 0px;
	padding: 18px 60px 0px 45px;
	float: left;
	display: block;
	width: 532px; /* wid: 668 (- 31px margin on container & - 105 padding = 532) */
}
#right-column {
 margin: 0px;
	padding: 0px 0px 0px 45px;
	float: left;
	display: block;
	width: 592px; /* wid: 668 (- 31px margin on container & - 45 padding = 592) */
}
/* ======================================================================================== PAGE TEXT CONTENT */
.page-content {
	margin: 0px 55px 0px 0px;
	padding: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 13px;
	color: #333333;
}
.page-content ul { list-style-type: square; margin: 15px 5px 5px 30px; padding: 0px; }
.page-content ul li { padding: 3px 0px 3px 3px; }
.page-content a:link, .page-content a:visited {
	text-decoration: underline;
	color: #333333;
}
.page-content a:active, .page-content a:hover {
	text-decoration: none;
	color: #4D0000;
}
/* ======================================================================================== DID YOU KNOW */
.did-you-know {
	margin-top: -45px;
	padding: 5px 5px 185px 300px;
	position: relative;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 13px;
	color: #FFFFFF;
	display: block;
	height: 97px;
}
.did-you-know-header {
	font-size: 14px;
	line-height: 45px;
	font-weight: bold;
	color: #FFFFFF;
}
/* ======================================================================================== FOOTER CONTENT */
#footer-container {
	width: 960px;
	margin: 0 auto; /* the auto margins center the page */
	padding: 0px;
	text-align: left; /* overrides text-align: center on the body element. */
	background: url(/social-responsibility/img/bg-footer.gif) no-repeat center top;
} 
#footer {
	margin: 0px;
	padding: 18px 20px 0px 11px;
	width: 929px;
	display: block;
	text-align: right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #969E9C;
}
a.privacy:link, a.privacy:visited {
	font-size: 11px;
	font-weight: bold;
	color: #4D0000;
	text-decoration: none;
	border : none;
}
a.privacy:active, a.privacy:hover {
	font-size: 11px;
	font-weight: bold;
	color: #7D7D7D;
	text-decoration: none;
	border : none;
}
/* ======================================================================================== FLASH CONTENT */
#flash-content-home {
	margin: 0px 20px 0px 11px; /* give sides a margin so the bg border shows through */
	padding: 0px;
	width: 929px;
	height: 530px;
	z-index: 100;
}
#flash-content-home .flash-alert {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #4D0000;
	padding: 30px 0px 0px 100px;
}
#flash-content-sub {
	margin: 0px;
	padding: 0px;
	width: 292px;
	height: 644px;
	z-index: 100;
}
#flash-video-player { margin: 10px 0px 13px 0px; }

#bumper-content {
 margin: 0px;
	padding: 0px;
 width: 292px;
	height: 380px;
	z-index: 100;
}
#flash-content-sub .flash-alert {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #FFFFFF;
	padding: 30px 35px 20px 10px;
}
#flash-content-sub .flash-alert a:link,
#flash-content-sub .flash-alert a:visited {
	color: #FFFFFF;
 text-decoration: none;
}
#flash-content-sub .flash-alert a:active,
#flash-content-sub .flash-alert a:hover {
	color: #FFFFFF;
 text-decoration: underline;
}
/* ======================================================================================== PAGE TITLES */
.site-title {
 margin: 0px 20px 0px 11px; /* give sides a margin so the bg border shows through */
	padding: 0px;
	height: 40px;
	display: block;
	background-color: #8B964F;
}
/* ======================================================================================== GENERAL LINKS */
a:link, a:visited {
	color: #4D0000;
 text-decoration: none;
	border : none;
}
a:active, a:hover {
	color: #7D7D7D;
 text-decoration: none;
	border : none;
}

/* ====================================================================================================== MODALS */

.share-video {
	margin: -136px 0px 0px -256px;
	width: 512px; 
	height: 272px;
	display: none; 
	position: absolute;  
	top: 50%;  
	left: 50%;  
	padding: 0px;  
	text-align: left;  
	z-index: 1001;
	background: #C08C29;
	border: 1px solid #FFF;
	color: #000;
}
#overlay {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 500;
	background-color: #333;
	-moz-opacity: 0.8;
	opacity:.80;
	filter: alpha(opacity=80);
}

/* [id] is used keep modal positioning static, IE doesn't use this and the scrollbars are hidden */
#overlay[id], .share-video[id] { position: fixed; } 

/* ====================================================================================================== MODALS */

.share-video p { margin: 0px; padding: 0px 20px 18px 20px; }
.share-video p.small { margin: 0px; padding: 0px 20px 6px 20px; }
.share-video a { color: #000; text-decoration: underline; }
.share-video a:hover { color: #000; }
.form-share-video { margin: 24px 0px 0px 0px; padding: 0px; list-style-type: none; }
.form-share-video li { padding: 0px 0px 18px 20px; width: 235px; float: left; }
.form-share-video li label { display: block; padding-bottom: 5px; color: #FFF; }
.form-share-video li input { padding: 2px; border: 1px solid #FFF; width: 195px; }
.form-submit { text-align: center; }

/* ============================================================================================================================= NOTICES */

.notice_message { 
	margin: 0px 0px 13px 0px; 
	padding: 13px 13px 0px 30px; 
	border: 1px solid #009933; 
	background: #CCE0CF url(/social-responsibility/img/icons/notes.gif) 7px 12px no-repeat; 
	color: #009933; 
	font-weight: bold;
}
.notice_message p { margin: 0px; padding: 0px 0px 13px 0px; }

.notice_errors { 
	margin: 0px 0px 13px 0px; 
	padding: 13px 13px 0px 30px; 
	border: 1px solid #990000; 
	background: #FAEAEA url(/social-responsibility/img/icons/warning.gif) 7px 12px no-repeat; 
	color: #990000; 
	font-weight: bold;
}
.notice_errors p { margin: 0px; padding: 0px 0px 13px 0px; }

/* ======================================================================================== FLOAT CONTENT */

.float-left { float: left; }
.float-right { float: right; }
.clearfloat { clear:both;  height:0; font-size: 1px; line-height: 0px; }
