/*  
Responsible Shopper Style Sheet
*/

/* begin reset.css */

/*
Copyright (c) 2006, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 0.11.0
*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}
table{border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,th,var{font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
q:before,q:after{content:'';}

/* end reset.css */



/* begin fonts.css */

/*
Copyright (c) 2006, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 0.11.0
*/

/**
 * 84.5% for !IE, keywords for IE
 * Percents could work for IE, but for backCompat purposes, we are using keywords.
 * x-small is for IE < 6 and IE6 quirks mode.
 * 
 */
body {font:13px verdana,arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}
table {font-size:inherit;font:100%;}

/**
 * 99% for safari; 100% is too large
 */
select, input, textarea {font:99% verdana,arial,helvetica,clean,sans-serif;}

/**
 * Bump up !IE to get to 13px equivalent
 */
pre, code {font:115% monospace;*font-size:100%;}

/**
 * Default line-height based on font-size rather than "computed-value"
 * see: http://www.w3.org/TR/CSS21/visudet.html#line-height
 */
body * {line-height:1.22em;}

/* end fonts.css */


/********* Start Main Structure *********/

body {
    background-color:  #fff;
}

#container {
    width: 780px;
	background: url(/images/programs/responsibleshopper/background.jpg);
	border: solid 1px #325499;
}

#header {
	height: 162px;
	background: url(/images/programs/responsibleshopper/banner_interior.jpg);
}

#content {
	width: 615px;
	float: left;
/*	line-height: .5em;
*/}

#right-sidebar {
	width: 165px;
	float: right;
	padding-bottom: 20px;
	display: inline;
}

#footer {
    width: 780px;
	height: 30px;
	background-color: #325499;
	clear: both;
}

#sub-footer {
    width: 780px;
}

.clearfloats {
	clear: both;
	display:none;
}


/********* End Main Structure *********/


/***** Collapsible  *****/

/* Used with ehance.js to collapse and expand paragraphs wrapped with a div of class "collapsible";
the first paragraph must be h1 to h6. */

.collapsed {
	cursor: pointer;
	padding-left: 15px;
	background: url(/images/programs/responsibleshopper/triangle_collapsed.png) no-repeat;
	background-position: 0px 3px;
}

.expanded {
	cursor: pointer;
	padding-left: 15px;
	background: url(/images/programs/responsibleshopper/triangle_expanded.png) no-repeat ;
	background-position: 0px 3px;
}

/***** Common Elements *****/

a {
	color: #000;
}

a:hover {
	color: #185A2E;
} 


/* when within body of contents 
#content-center a {
	color: #185A2E;
	text-decoration: underline;
}

#content-center.a:hover {
	color: #185A2E;
	text-decoration:underline;
} 
*/

h1 {
	font-size: 369%; /* 48px */
}

h2 {
	font-size: 230%; /* 30px */
	line-height: 1.1em;
}

h3 {
	font-size: 138.5%; /* 18px */
	line-height: 1.1em;
	margin-top: .63em;
}

h4 {
	font-size: 123.1%; /* 16px */
}

h5 {
	font-size: 108%; /* 14px */
	margin-top: 4px;
}

/* Used for the "read more" with collapsed paragraphs */
h6 {
	font-weight: normal;
	font-size: 108%;
	color: #318CAB;
}
	

#content li {
	list-style-position: outside;
	list-style-type: disc;
	font-size: 108%;
	margin: 7px 0 7px 15px;
}

.green {
	color: #007E3A;
}

.dark-blue {
	color: #325499;
}

.dark-blue a {
	color: #325499;
}

.dark-blue a:hover {
	color: #007E3A;
}


/***** In the Header *****/

#coopLogo {
	position: absolute;
	top: 15px;
	left: 3px;
	clear: all;
}

#rsHeaderLogo {
	position: absolute;
	top: 18px;
	left: 200px;
	clear: all;
	width: 400px;
	height: 100px;
}

.top-left-nav {
	font-size: 77%;
	padding-top: 1px;	
	/* Changed/Added for new Green America logo and colors */
	/* 
	margin-left: 10px; 
	color: #A9C59F;
	*/
	padding-left: 10px; 
	margin-left: 1px; 
	padding-bottom: 3px;
	background-color: #5d9732; 
	color: #FFFFFF;
}

.top-left-nav a {
	text-decoration: none;
	/* Changed/Added for new Green America logo and colors */
	/*color: #A9C59F;*/
	color: #FFFFFF;
}

.top-left-nav a:hover {
	text-decoration: underline;
}

#top-right-nav {
	width: 165px;
	position: absolute;
	top: 15px;
	left: 635px;
	clear: all;
}

#top-right-nav li {
	color: #E1D494;
	font-size: 85%;
	font-weight: bold;
	margin-top: 7px;
}

#top-right-nav a {
	color: #E1D494;
	font-weight: bold;
	text-decoration: none;
}

#top-right-nav a:hover {
	text-decoration: underline;
}

#top-right-nav .form-text  {
	background: #FDFCE1;
	border: 1px solid #000;
	width: 105px;
	height: 14px;
	font-weight: bold;
	color: #6487AE;
	font-size: 77%;
	padding-top: 2px;
}

#search-form {
	margin-top: 1px;
}

#date {
	font-size: 77%;
	position: absolute;
	top: 142px;
	left: 10px;
	clear: all;
}

#bread-crumbs {
	font-size: 77%;
	position: absolute;
	top: 142px;
	left: 10px;
	clear: all;
}


/* works with the javascript file ticker.js to produce a ticker on the home page*/
#ticker {
	width: 400px;
	position: absolute;
	top: 140px;
	left: 200px;
	clear: all;
}

#read-more {
	position: absolute;
	top: 137px;
	left: 635px;
	clear: all;
}

#read-more p * {
	color: #000;
	font-size: 85%;
	line-height: .9em;
}

#read-more a {
	text-decoration: none;
}

#print {
	position: absolute;
	top: 142px;
	left: 635px;
	clear: all;
	font-size: 77%;
}

/***** In the Content Area *****/

.red-row {
	border:  solid 1px #FF6A59;
	background-color: #FF6A59;
}

.yellow-row {
	border:  solid 1px #F7E61C;
	background-color: #F7E61C;
}

.green-row {
	border:  solid 1px #8AE061;
	background-color: #8AE061;
}

.orange-row {
	border:  solid 1px #fb9900;
	background-color: #fb9900;
	/*eb7d12*/
}

.subtitle {
	margin-top: .12em;
}
.smallText {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;;
}
#content .section-heading {
	font-size: 167%; /* 22px */
	color: #325499;
	font-weight: bold;
	border-bottom: solid 2px;
	background-image: url(/images/programs/responsibleshopper/generic_bullet.gif);
	background-repeat: no-repeat;
	padding-left: 32px;
	height: 24px;
	margin-top: 18px;
}

/* same as the one above except it's for lines that wrap on 2 lines */
#content .section-heading-Tall {
	font-size: 167%; /* 22px */
	color: #325499;
	font-weight: bold;
	border-bottom: solid 2px;
	background-image: url(/images/programs/responsibleshopper/generic_bullet.gif);
	background-repeat: no-repeat;
	padding-left: 32px;
	height: 52px;
	margin-top: 18px;
}

#content .go-green-section-heading {
	font-size: 167%; /* 22px */
	color: #e3a60f;
	font-weight: bold;
	border-bottom: #007e3a solid 2px;
	background-image: url(/images/programs/responsibleshopper/green_bullet.gif);
	background-repeat: no-repeat;
	padding-left: 32px;
	height: 24px;
	margin-top: 18px;
}

.one-col-corner-image {
	float: left;
	margin-right: 10px;
}

.go-green-head {
	margin-top: 10px;
	color: #007E3A;
}

.jumpto {
	color: #318CAB;
	font-size: 108%;
}

.jumpto a {
	color: #318CAB;
}

.jumpto a:hover {
	color: #185A2E;
} 

#content p {
	font-size: 108%;
	margin: 7px 0;
}

#content .caption {
	font-size: 77%;
	margin-bottom: 10px;
}

#content .light-text {
	color: #68645B;
}

#content .light-text a {
	color: #68645B;
}

#content .light-text a:hover {
	color: #185A2E;
} 

#home-content {
	margin-left: 200px;
	padding: 20px 20px 20px 18px;
}

#content-one-column {
	margin: 12px 20px 20px;
}

.home-column {
	float: left;
/* This is necessary to fix the IE6 double-margin bug. */
	display: inline;
	width: 188px;
	margin-left: 12px;
}

.home-column p, .photo {
	padding-left: 6px;
}

#left-sidebar {
	width: 215px;
	float: left;
}

#left-sidebar li {
	color: #84B7CB;
	font-size: 93%;
	list-style-image: url(/images/programs/responsibleshopper/blue_bullet.gif);
	list-style-position: outside;
	margin: 0 0 3px 27px;
}

#left-sidebar li a {
	color: #84B7CB;
	text-decoration: none;
}

#left-sidebar .selected {
	color: #E3A60F;
	text-decoration: none;
	list-style-image: url(/images/programs/responsibleshopper/orange_bullet.gif);
}

#left-sidebar li a:hover {
	color: #84B7CB;
	text-decoration: underline;
}

#inner-left-sidebar {
	padding: 15px;
}

#content .left-sidebar-title {
	color: #84B7CB;
	font-weight: bold;
	font-size: 93%;
	margin-top: 10px;
}

#content .left-sidebar-title-selected {
	color: #E3A60F;
	text-decoration: none;
	font-weight: bold;
	font-size: 93%;
	margin-top: 10px;
}

.left-sidebar-title a {
	color: #84B7CB;
	text-decoration: none;
}

.left-sidebar-title a:hover {
	color: #84B7CB;
	text-decoration: underline;
}

#content-center {
	width: 385px;
	float: left;
	padding-right: 15px;
	margin: 12px 0;
/* The following is necessary to fix the IE duplicate characters bug */
	margin-right: -3px;}

table {
	border: 1px solid #000;
}

th, td {
	border: 1px solid #fff;
	font-size: 93%;
	padding: 8px 0;
}

#content .source {
	font-size: 77%;
}

#content .source a {
	color: #318CAB;
	text-decoration: none;
}

#content .source a:hover {
text-decoration: underline;
}

/***** In the Right Sidebar *****/

/* Both an inner and outer wrapper are necessary for the triangle image 
to protude to the left but not the background color */
#right-sidebar .title-wrapper {
	margin: 20px 0 5px 0;
}

#right-sidebar .triangle {
	float: left;
	margin-top: 5px;
}

#right-sidebar .inner-wrapper {
	margin-left: 5px;
	padding: 5px;
	background: #7cb9cd;
	/*4c78a2*/
	/* 84B7CB*/
}

#right-sidebar .sidebar-title {
	margin: 0 10px;
	font-size: 100%;
	line-height: 1.1em;
}

#right-sidebar ul {
	margin-left: 20px;
	margin-right: 8px;
	font-size: 93%;
}

#right-sidebar p {
	margin-left: 20px;
	margin-right: 8px;
	font-size: 85%;
}

#right-sidebar label {
	margin-left: 20px;
	margin-right: 8px;
	font-size: 85%;
}

#right-sidebar input {
	margin-left: 20px;
	margin-right: 8px;
	font-size: 85%;
}

.triangle-bullet li {
	list-style-image: url(/images/programs/responsibleshopper/triangle_bullet.gif);
	list-style-position: inside;
	margin-top: 8px;
}

#right-sidebar .form-text {
	margin-bottom: 10px;
	background: #FDFCE1;
	border: 1px solid #000;
	width: 125px;
	height: 16px;
}

/* The next two styles are to get the submit button to align vertically with the label. */
#right-sidebar .button-align {
	height: 30px;
}

#right-sidebar .button-align input, .button-align p {
	line-height: 30px;
	margin-left: 0;
}

#subscribe-form {
	margin: 10px 0;
}


/***** In the Footer and Sub Footer*****/

#footer p {
	font-size: 93%;
	color: #FDFCE1;
	text-align: center;
	line-height: 30px;
}

#footer p a {
	color: #FDFCE1;	
}

#footer a {
	color: #000;
	text-decoration: none;
}

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

#sub-footer p {
    width: 780px;
    margin: 10px auto;  /*  center  */
	font-size: 77%;
	text-align: center;
}

#sub-footer a {
	color: #318CAB;
	text-decoration: none;
}

#sub-footer a:hover {
text-decoration: underline;
}

/***  Documentation-specific styles ***/

#help-structure li {
	list-style-type: none;
	margin-left: 1em;
	margin-bottom: 0.5em;
}

#help-structure ol li {
	list-style-type:lower-roman;
	margin-left: 2em;
}


/* styles for the callout for email signups.  Ideally we should be able to pull this CSS out, put it in a global CSS file, and use it throughout the entire co-op america site.  SEKK July 2008 */
#emailSignup {
	background: url(/images/programs/responsibleshopper/EmailSignupBackground.gif);
	background-repeat:no-repeat;
	width:165px;
	height:125px;
	margin:10px 0px 5px 9px;
	font:Arial, Helvetica, sans-serif;
}

#emailSignup .emailInput {
	margin: 80px 0px 2px 7px;
	background: #FDFCE1;
	border: 1px solid #000;
	width: 110px;
	height: 16px;
}

.Alert {
	color:red;
	font-weight:bold;
}

#emailSignup .Submit {
	margin: 80px 0px 0px 0px;
	/*float:right;*/
}

/***** This concludes our stylesheet. Thank you and good night. *****/