/**************************************************************
/* pureNourishment.css
/* jpl 3/10/08
/*
/*	Styles for Pure Nourishment.
/*************************************************************/


/*------------------------------------------------------------------------------*/
/* SECTION::Global HTML Resets */

* {
	padding:				0;
	margin:					0;
}
input[type="radio"], input[type="checkbox"] {
	vertical-align:			middle;
}

html {
	padding:				0;
	margin:					0;
}

body {
	text-align:				left;
	padding:				0;
	margin:					0;
	background:				#fff 48% 0 no-repeat;
	font-family:			Arial, Tahoma, sans-serif;
	font-size:				12px;
	color:					#414042;
}

#bodyhome		{ background-image: url(../images/backgrounds/background-home.jpg); }
#bodyapproach	{ background-image: url(../images/backgrounds/background-approach.jpg); }
#bodyinterview	{ background-image: url(../images/backgrounds/background-interview.jpg); }
#bodyfreeStuff	{ background-image: url(../images/backgrounds/background-freeStuff.jpg); }
#bodyevents		{ background-image: url(../images/backgrounds/background-events.jpg); }
#bodytestimonials	{ background-image: url(../images/backgrounds/background-testimonials.jpg); }
#bodycontact	{ background-image: url(../images/backgrounds/background-contact.jpg); }

ul li {
	list-style-type:		none;
}

ol li {
	margin-left:			30px;
}


/* End SECTION::Global HTML Resets
/*------------------------------------------------------------------------------*/





/*------------------------------------------------------------------------------*/
/* SECTION::Chrome  */
	a:link		{ color: #558CCC; text-decoration: none; }
	a:visited	{ color: #558CCC; text-decoration: none; }
	a:hover		{ color: #558CCC; text-decoration: underline; }
	a:active	{ color: #558CCC; text-decoration: underline; }
	
	
a img { border: 0; }

h1 {
	color:					#530026;
	font-weight:			500;
	margin-bottom:			2px;
}

h2, .h2 {
	font-size:				20px;
	color:					#B21924;
	margin-top:				8px;
	margin-bottom:			8px;
}

hr {
	color:					#D3D3D3;
	background-color:		#D3D3D3;
	border:					none;
	height:					1px;
}

p  { padding-bottom:		16px; }


/* End SECTION::Chrome
/*------------------------------------------------------------------------------*/




/*------------------------------------------------------------------------------*/
/* SECTION::Modules, Sections and Elements  */

div.module {
	margin-bottom:			16px;
}

div.module .titleBar {
	position:				relative;
	background:				transparent url(../images/chrome/popUpTitleBarLeftEdge.png) no-repeat top left;
	height:					22px;
	font-size:				12px;
}
div.module .titleBar span.theTitle {
	background:				transparent url(../images/chrome/popUpTitleBar.png) no-repeat top right;
	display:				block;
	color:					#ffffff;
	margin-left:			11px;  /* nudge out of the BG image left edge */
	padding-top:			4px;
	padding-right:			9px;  /* ensure we don't bleed into the BG right egde */
	padding-bottom:			3px;
	overflow:				hidden;
	white-space:			nowrap;
}

.titleBodyBuffer {
	background:				#fff;
	height:					2px;
}

div.module>.body {
	border:					2px solid #fff;
	background:				#E7DAE0 url(../images/chrome/popUpBG.gif) repeat-x;
	margin:					0;
	padding:				10px;
	vertical-align:			baseline;
}


div.footer {
	height:					10px;
	background:				url(../images/chrome/moduleFooter.png) left top no-repeat;
}
div.footer div {
	margin-left:			11px;  /* nudge out of the BG image left edge */
	height:					10px;
	background:				url(../images/chrome/moduleFooter.png) right top no-repeat;
}

div.module .tightPadding {
	padding:				6px;
}

div.module .nextSection {
	display:				block;
	clear:					both;
	margin-top:				16px;
}

.nextSection {
	margin-top:				16px;
}

.nextElement {
	margin-top:				6px;
}
table.elementSet td {
	padding-bottom:			6px;
}

td.nextElement {
	margin-top:				0px;
	padding-top:			2px;
}

td.padded {
	padding:				10px !important;
}

.module a {
	color:					#6C9C31;
}
tr.highlightable a:link {
	text-decoration:		none;
}

.nextElementLine {
	padding-top:		6px;
}

/* End SECTION::Modules, Sections and Elements 
/*------------------------------------------------------------------------------*/





/*------------------------------------------------------------------------------*/
/* SECTION::Standard Inputs  */
input[type=text], input[type=password], select, textarea {
	border:				1px solid #580029;
	font-size:			11px;
}

input[type=text], input[type=password] {
	padding:			2px 3px;
	height:				13px;  /* inside border minus padding */
}

select {
	padding:			1px 0px;
	height:				19px;  /* inside border */
}

textarea {
	padding:			2px 3px;
	font-family:		helvetica, serif;
}

textarea[disabled] {
	background-color:	#f4f4f4;
	color:				#bbb;
}


/* End SECTION::Standard Inputs
/*------------------------------------------------------------------------------*/




/*------------------------------------------------------------------------------*/
/* SECTION::Page Architecture  */

#page-content {
	margin:					0px auto 0px auto;
	width:					880px;
}

	/* Header ---------------------------------------------------------------*/
	
	#page-header {
		position:				relative;
		height:					390px;
	}
	
	#page-header h1, #page-header h2 {
		position:				absolute;
		text-indent:			-10000px;
	}
	
	
	
	#page-header #top-menu {
		position:				absolute;
		top:					90px;
		right:					0px;
		padding-right:			18px;
		text-align:				right;
		text-transform:			uppercase;
		color:					#fff;
		font-size:				14px;
		font-weight:			900;
		width:					600px;
	}
	#page-header #top-menu ul {
		float:					right;
	}
	#page-header #top-menu ul li {
		display:				inline;
		float:					left;
		height:					18px;
	}
	#page-header #top-menu ul li a {
		display:				block;
		padding:				0px 8px;
		line-height:			11px;
		border-right:			2px solid #fff;
	}
	#page-header #top-menu ul li.last a {
		border-right:			none;
	}
	
	#page-header #top-menu ul li a.current {
		color:					#580029;
		cursor:					default;
	}
	#page-header #top-menu a:link		{ color: #ffffff; text-decoration: none; }
	#page-header #top-menu a:visited	{ color: #ffffff; text-decoration: none; }
	#page-header #top-menu a:hover		{ color: #580029; text-decoration: none; }
	#page-header #top-menu a:active		{ color: #580029; text-decoration: none; }
	
	
	
	#page-header-content {
		position:				absolute;
		left:					7px;
		top:					140px;
		border:					5px solid #fff;
		height:					229px;
		width:					840px;
	}
	
	#free101Ways {
		position:				absolute;
		top:					0px;
		right:					0px;
		background:				url(../images/signs/free101Ways.jpg) no-repeat;
		height:					229px;
		width:					185px;
		border-left:			#fff solid 5px;
	}
	#free101Ways .content {
		position:				absolute;
		bottom:					5px;
		left:					15px;
		width:					155px;
	}
	
	#signUpForm input.text {
		width:					150px;
		display:				block;
		margin-bottom:			6px;
	}
	#signUpForm .overTxtDiv {
		color:					#cecece;
	}
	
	
	
	#topLogo {
		position:				absolute;
		left:					10px;
		top:					0px;
		height:					168px;
		width:					240px;
		background-image:		url(../images/signs/logo.png);
	}
	#topLogo a {
		display:				block;
		height:					168px;
		width:					240px;
	}
	
	/* End Header -----------------------------------------------------------*/
	
	
	
	/* Middle ---------------------------------------------------------------*/
	#page-middle {
		position:				relative;
	}
	
	#center-content {
		position:				absolute;
		top:					0px;
		left:					192px;
		background:				transparent url(../images/panels/mainContentBG.jpg) no-repeat;
		width:					670px;
		height:					810px;
		font-size:				15px;
	}
	
	#calendar-content {
		position:				absolute;
		top:					1px;
		left:					3px;
		background:				transparent url(../images/panels/calendarContentBG.jpg) no-repeat;
		width:					856px;
		height:					709px;
		font-size:				15px;
	}
	
	#center-content .content {
		position:				absolute;
		top:					35px;
		left:					20px;
		width:					625px;
		height:					730px;
		overflow:				auto;
	}
	
	#left-content {
		position:				absolute;
		top:					6px;
		left:					6px;
		width:					170px;
	}
	
	#angelina-info {
		position:				relative;
		background:				transparent url(../images/signs/angelinaInfo.png) no-repeat;
		width:					172px;
		height:					390px;
		margin-bottom:			10px;
	}
	
	#angelina-info #socialLinks {
		margin:					8px 0;
		text-align:				center;
	}
	#angelina-info #socialLinks img {
		margin:					0px 3px;
	}
	
	#angelina-info .content {
		position:				absolute;
		top:					200px;
		left:					13px;
		width:					150px;
		height:					190px;
		overflow:				auto;
	}
	
	
	#usefulLinks {
		position:				absolute;
		top:					100px;
		right:					0px;
		background:				url(../images/panels/usefulLinks.gif) no-repeat;
		height:					630px;
		width:					220px;
	}
	#usefulLinks .content {
		position:				absolute;
		top:					20px;
		left:					15px;
		width:					200px;
		height:					590px;
		overflow:				hidden;
	}
	
	#usefulLinks li {
		margin-bottom:			6px;
		list-style-type:		disc;
		margin-left:			15px;
		padding:				4px 0 4px 0px;
	}
	#usefulLinks li a {
		margin-left:			-15px;
		font-size:				14px;
	}
	
	#freeContent {
		position:				absolute;
		top:					120px;
		left:					0px;
		width:					370px;
	}
	
	ul.freeStuff li {
		list-style-type:		disc;
		color:					#558CCC;
		margin:					4px 0 4px 30px;
		padding:				4px 0 4px 10px;
	}

	
	#usefulLinks h1, #freeContent h1 {
		font-size:				24px;
	}
	
	/* End Middle -----------------------------------------------------------*/
	
	
	
	
	
	/* Footer ---------------------------------------------------------------*/
	#footer-text {
		text-align:				right;
		color:					#fff
	}
	#footer-text a:link		{ color: #fff; text-decoration: none; }
	#footer-text a:visited	{ color: #fff; text-decoration: none; }
	#footer-text a:hover	{ color: #fff; text-decoration: underline; }
	#footer-text a:active	{ color: #fff; text-decoration: underline; }
	/* End Footer -----------------------------------------------------------*/
	
	
/* End SECTION::Page Architecture
/*------------------------------------------------------------------------------*/

	#upcomingEvents {
		position:				relative;
		background:				transparent url(../images/signs/eventsBoard.png) no-repeat;
		width:					174px;
		height:					342px;
		margin-bottom:			4px;
	}
	
	#upcomingEvents h2 {
		position:				absolute;
		top:					8px;
		left:					15px;
		color:					#fff;
		margin:					0px;
		font-size:				14px;
	}
	
	#upcomingEvents .content {
		position:				absolute;
		top:					34px;
		left:					5px;
		width:					169px;
		height:					310px;
		overflow:				auto;
	}

#upcomingEvents .singleEvent {
	cursor:					pointer;
	margin:					5px 12px;
	font-size:				13px;
	font-weight:			900;
	height:					48px;
	background:				transparent url(../images/icons/arrowRightMauve.gif) 100% 3px no-repeat;
}
#upcomingEvents .name {
	color:					#580029;
	font-size:				11px;
}

#upcomingEvents hr {
	margin:					0px 0px;
}



#downloadInterviewLink {
	position:				absolute;
	top:					165px;
	left:					0px;
	width:					175px;
	height:					65px;
}

#testimonialThumbnails { width: 625px; }

#testimonialThumbnails img {
	padding:				1px;
	border:					1px solid #deccd4;
	margin:					0px 13px 13px 0px;
	float:					left;
	cursor:					pointer;
}
#testimonialThumbnails img.current { border: 1px solid #580029; }
#testimonialThumbnails img.last { margin-right: 0px }

#testimonialPaperClip {
	position:				absolute;
	left:					180px;
	top:					207px;
	width:					194px;
	height:					206px;
	background:				transparent url(../images/testimonials/paperClip.png);
}

#testimonials h1 { font-size: 24px; }

.testimonialTop {
	position:				relative;
}

.testimonialTopContent {
	position:				absolute;
	left:					180px;
	bottom:					0px;
}

#testimonials .story {
	overflow:				auto;
	height:					330px;
}




#contactForm {
	font-size:				18px;
}

#contactForm td					{ padding:			2px 15px 8px 0px; }
#contactForm input[type="text"], #contactForm textarea, #contactForm select {
	border:					2px solid #B21924;
	margin-top:				4px;
	font-size:				18px;
}
#contactForm input[type="text"] {
	height:					22px;
}

#contactForm select {
	height:					28px;
}



/*------------------------------------------------------------------------------*/
/* SECTION::Widgets  */


#loadingMessage {
	display:			none;
	z-index:			30000;
	position:			fixed;
	top:				1px;
	right:				1px;
	border:				2px solid #6C9C31;
}
#loadingMessageInnerBorder {
	background:			#fff;
	color:				#6C9C31;
	border:				3px solid #DAE6CB;
	padding:			7px 8px;
	font-size:			14px;
}
	
	
	
	.dateLabel {
		font-size:				20px;
		font-weight:			900;
		color:					#bd0017;
	}
	
	
	
	
	.backIcon, .forwardIcon {
		background:				url(../images/icons/calendarArrowBack.gif) 50% 50% no-repeat;
		height:					20px;
		width:					20px;
		cursor:					pointer;
		margin-top:				3px;
	}
	.backIcon	{ background: url(../images/icons/calendarArrowBack.gif)	50% 50% no-repeat; }
	.forwardIcon{ background: url(../images/icons/calendarArrowForward.gif) 50% 50% no-repeat; }
	
	
	.singleEvent {
		margin-bottom:			16px;
	}
	.singleEvent h2 { margin:	0px; }
	.singleEvent .info { font-size: 16px; }
	.singleEvent p { font-size: 12px; }

	
	/* Paging -------------------------------------------------------------*/
	.pageScrollLinks {
		width:					100%;
		text-align:				right;
		padding-right:			15px;
	}
	
	.pageLink {
		color:					#558CCC;
		cursor:					pointer;
	}
	
	.pageLink-current {
		color:					#000;
		font-weight:			bold;
		cursor:					default;
	}
	/* End Paging ---------------------------------------------------------*/
	
	


/* End SECTION::Widgets
/*------------------------------------------------------------------------------*/








/*------------------------------------------------------------------------------*/
/* SECTION::Global Utility  */
	
	.red, a.red			{ color: #B21924; }
	.green				{ color: #97B24E; }
	.mauve				{ color: #580029; }
	.purple				{ color: #624C87; }
	.brightPurple		{ color: #563677; }
	
	
	.alertRed			{ color: #B7111B; }
	
	
	.superBold {
		font-size:			22px;
		font-weight:		900;
		margin-bottom:		16px;
	}
	

/* End SECTION::Global Utility
/*------------------------------------------------------------------------------*/


/*------------------------------------------------------------------------------*/
/* SECTION::Roar  */

.roar-body
{
	position:				absolute;
	font:					12px/14px "Lucida Grande", Arial, Helvetica, Verdana, sans-serif;
	color:					#fff;
	text-align:				left;
	z-index:				999;
}

.roar
{
	position:				absolute;
	width:					300px;
	cursor:					pointer;
}
.roar-bg
{
	position:				absolute;
	z-index:				1000;
	width:					100%;
	height:					100%;
	left:					0;
	top:					0;
	background-color:		#555;
	-moz-border-radius:		10px;
	-webkit-border-radius:	5px;
	-webkit-box-shadow:		0 0 5px rgba(0, 0, 0, 0.5);
}
.roar-body-ugly .roar
{
	background-color:		#333;
}
.roar-body-ugly .roar-bg
{
	display:				none;
}
.roar h3
{
	position:				relative;
	padding:				15px 10px 15px;
	margin:					0;
	border:					0;
	font-size:				13px;
	color:					#fff;
	z-index:				1002;
}
.roar p
{
	position:				relative;
	padding:				0px 10px 10px;
	margin:					-5px 0 0 0;
	font-size:				12px;
	color:					#fff;
	z-index:				1002;
}
.roar a
{
	color:					#fff;
	font-weight:			900;
	text-decoration:		underline;
}
.roar a:hover
{
	text-decoration:		none;
}
/* End SECTION::Roar
/*------------------------------------------------------------------------------*/





/*------------------------------------------------------------------------------*/
/* SECTION::Date Picker  */
/**************************************************************
/* DatePicker.css
/* jpl 9/26/08

	Styles for the DatePicker widget.

	This styling is keyed entirely on the "DatePicker".
	To create an alternate CSS theme for DatePicker object,
	copy the contents of this file entirely and replace all instances
	"DatePicker" with the "[alterateThemeName]".  Then
	supply that new name as the value of className in the options
	of the SelectInput constructor, as in:
	
	new DatePicker(container, {className: "[alterateThemeName]"};

/*************************************************************/

.DatePicker-input {
	width:					60px;
}


.DatePicker-Icon {
	background:				url(../images/icons/icon13Calendar.gif) 50% 10% no-repeat;
	width:					20px;
	height:					16px;
	display:				inline-block;
	cursor:					pointer;
}

.DatePicker-WidgetDiv {
	background:				#fff;
	padding:				10px;
	border:					1px solid #6C9C31;
}

.DatePicker-ControlDiv {
	text-align:				center;
	vertical-align:			middle;
}
.DatePicker-ControlDiv span {
	text-align:				center;
	vertical-align:			middle;
}
.DatePicker-BackButton {
	background:				url(../images/datePicker/backButton.gif) 50% 0 no-repeat;
	height:					12px;
	width:					13px;
	cursor:					pointer;
	float:					left;
	margin-top:				1px;
}
.DatePicker-BackButton:hover {
	background-position:	50% -12px;
}
.DatePicker-MonthLabel {
	font-weight:			900;
	font-size:				14px;
	text-align:				center;
	display:				block;
	margin:					0 auto 0px auto;
}
.DatePicker-ForwardButton {
	background:				url(../images/datePicker/forwardButton.gif) 50% 0 no-repeat;
	height:					12px;
	width:					13px;
	cursor:					pointer;
	float:					right;
	margin-top:				1px;
}
.DatePicker-ForwardButton:hover {
	background-position:	50% -12px;
}

.DatePicker-CanvasGrid th {
	font-size:				14px;
	text-align:				center;
	padding:				0px;
	color:					#6C9C31;
}
.DatePicker-CanvasGrid td {
	font-size:				12px;
	background:				url(../images/datePicker/validDay.gif) 50% 0 no-repeat;
	height:					21px;
	padding:				0px;
	width:					21px;
	text-align:				center;
	vertical-align:			middle;
	cursor:					pointer;
}
.DatePicker-CanvasGrid td:hover { background-position:	50% -21px; }
.DatePicker-CanvasGrid td.chosenDate { background-position:	50% -21px; }

.DatePicker-CanvasGrid td.dayToday { border: 1px solid #f00; }

.DatePicker-CanvasGrid td.DatePicker-DayOtherMonth {
	color:					#888;
	background:				url(../images/datePicker/validOtherMonthDay.gif) 50% 0 no-repeat;

}
.DatePicker-CanvasGrid td.DatePicker-DayOtherMonth:hover { background-position:	50% -21px; }


.DatePicker-CanvasGrid td.DatePicker-invalidDay {
	background:				url(../images/datePicker/invalidDay.gif) 50% 0 no-repeat;
	cursor:					default;
	color:					#BBB;
}
.DatePicker-CanvasGrid td.DatePicker-invalidDay:hover { background-position: 50% -21px; }


#clientViewInvoiceEditForm .DatePicker-input,
#clientViewInvoiceAddForm .DatePicker-input { width: 50px; }


/* End SECTION::Date Picker
/*------------------------------------------------------------------------------*/




/*------------------------------------------------------------------------------*/
/* Drop Shadow Elements for CA Pop Ups */
html>body .ds1UR { background: url(../images/chrome/ds1UR.png) right top no-repeat; }
html>body .ds1LL { background: url(../images/chrome/ds1LL.png) left bottom no-repeat; padding-top: 9px; padding-left: 9px; }
html>body .ds1M { background: url(../images/chrome/ds1M.png) bottom right; }
html>body .ds1C { position: relative; left: -9px; top: -9px; }
/*------------------------------------------------------------------------------*/




/*------------------------------------------------------------------------------*/
/* SECTION::Universal Utility  */
	
	
	.left       { float: left; }
	.right      { float: right; }
	.inline		{ display: inline; }
	
	.block		{ display: block; }
	.inline		{ display: inline; }
	.inlineBlock{ display: inline-block; }
	
	.justify	{ text-align: justify; }
	
	/* this is for using on a block-level container element */
	/* and will center contents inside the container */
	.center     { text-align: center; }
	
	/* this is for using on an inline element, such as an image */
	/* and will turn the element block, and center the element within its container */
	.centered   { display: block; margin: 0 auto 0px auto; }
	
	.verticalMiddle td, td.verticalMiddle { vertical-align: middle; }
	div.verticalMiddle { vertical-align: middle; }
	.verticalMiddle img { vertical-align: middle; }
	.verticalMiddle input[type=image] { vertical-align: middle; }
	.verticalMiddle>* { vertical-align: middle; }
	
	.baseline	{ vertical-align: baseline !important; }
	
	.relative	{ position: relative; }
	.absolute	{ position: absolute; }
	
	.hidden     { display: none; }
	.no-border  { border: none !important; }
	
	.flush-left { padding-left : 0 !important; margin-left : 0 !important }
	.flush-right{ padding-right: 0 !important; margin-right: 0 !important }
	
	.fullWidth	{ width: 100%; }
	
	.truncatedText { overflow: hidden; }
	
	.clear      { clear: both; }
	.hideOverflow {	overflow: hidden; }
	
	.clickable	{ cursor: pointer; }
	.strike		{ text-decoration: line-through; }
	.transparent{ border: none !important; background: transparent; }
	
	.bold		{ font-weight: 900 }
	
	
	.grey		{ color: #939598; }
	
/* End SECTION::Universal Utility
/*------------------------------------------------------------------------------*/