/*
 * nutrition iQ CSS Core
 */

/*
===========================================================
	TABLE OF CONTENTS
===========================================================
	1. GLOBAL
	2. FOUNDATION
	3. HEADER
	4. BODY
	5. FOOTER
	6. HELPERS
	7. UTILITIES
		7.1. Clear Fix
		7.2. FIR

===========================================================
	COLOR PALLETE
===========================================================

	#87CC0C - Primary Green
	#787878 - Default Text
	#939393 - Footer Text
	#2CADDA - Blue Link

*/

/*********************************************************
	1. GLOBAL
**********************************************************/

html, body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

html, body, input {
	color: #787878;
}

body {
	background-color: #fff;
}

a {
	color: #2cadda;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

p {
	line-height: 16px;
}

strong {
	font-weight: bold;
}

/*********************************************************
	2. FOUNDATION
**********************************************************/

#outer-container {
	background-color: #87cc0c;
	border-bottom: 1px solid #51b848;
}

#inner-container {
	width: 902px;
	margin: 0 auto;
	padding: 16px 0 19px 0;
}

/*********************************************************
	3. HEADER
**********************************************************/

#hd {
	background-color: #ffffff;
	position: relative;
}

#hd .body {
	height: 244px;
}

	/*********************************************************
		3.1. HEADER | Logo
	**********************************************************/
	
	#logo {
		background: transparent url(/content/components/corporate/img/type/niq_logo.gif) no-repeat left top;
		height: 259px;
		width: 253px;
		position: absolute;
		top: 31px;
		left: 56px;
	}
	
	/*********************************************************
		3.2. HEADER | Intro
	**********************************************************/
	
	#intro {
		width: 570px;
		position: absolute;
		top: 0;
		left: 332px;
	}
	
	#intro h2 {
		background: transparent url(/content/components/corporate/img/type/intro.gif) no-repeat left top;
		height: 95px;
		width: 320px;
		margin: 31px 0 16px 0;
	}
	
	#intro h3, #intro p {
		margin-left: 36px;
	}
	
	#intro h3 {
		font-size: 12px;
		font-weight: bold;
	}
	
	#intro p {}
	
	#intro p.first {
		width: 320px;
	}
	
	#intro p.second {
		font-size: 9px;
		width: 482px;
		margin-top: 17px;
	}
	
		/*********************************************************
			3.2.#. HEADER | Intro | Tags
		**********************************************************/
	
		#tags {
			position: absolute;
			top: -9px;
			right: -5px;
		}

/*********************************************************
	4. BODY
**********************************************************/

#bd {
	height: 548px;
	margin: 17px 0 0 0;
}

	/*********************************************************
		4.1. BODY | Information Body
	**********************************************************/
	
	#bd-info {
		width: 283px;
		float: left;
	}
	
		/*********************************************************
			4.1.1. BODY | Information Body | Contributors
		**********************************************************/

		#contributors {}
		
		#contributors .body {
			height: 330px;
			padding: 0 21px;
		}
		
		#contributors h2 {
			background: transparent url(/content/components/corporate/img/type/headers.gif) no-repeat 0 -82px;
			height: 12px;
			margin: 14px 0 9px 0;
		}
		
		#contributors .hr {
			margin: 0 0 8px 0;
		}
		
			/*********************************************************
				4.1.1.1. BODY | Information Body | Contributors | List
			**********************************************************/
			
			#contributor-list {
				margin: 10px 0 0 0;
			}
			
			#contributor-list li {
				line-height: 14px;
				margin: 0 0 12px 0;
			}
			
			#contributor-list .name {
				font-weight: bold;
				display: block;
			}
			
			#contributor-list .title {
				font-size: 10px;
				display: block;
			}
			
			#contributor-list a {
				display: block;
			}
			
				/************************************************************************
					4.1.1.1.1. BODY | Information Body | Contributors | List | Bio Window
				*************************************************************************/
			
				#contributor-list .bio {
					width: 654px;
					display: none;
				}
			
				#contributor-list .bio h3 {
					background: transparent url(/content/components/corporate/img/type/headers.gif) no-repeat 0 -156px;
					height: 17px;
					width: 312px;
				}
				
				#contributor-list .bio .close {
					float: right;
					margin: -16px 0 0 0;
				}
			
				#contributor-list .bio .hr {
					margin: 16px 0;
				}
				
				#contributor-list .bio .photo {
					font-size: 10px;
					width: 100px;
					margin: 0;
					position: absolute;
				}
				
				#contributor-list .bio .name {
					font-size: 16px;
					font-weight: bold;
					display: block;
				}
			
				#contributor-list .bio .title {
					font-size: 14px;
					display: block;
				}
			
				#contributor-list .bio p {
					margin: 0 0 23px 118px;
				}
				
				#contributor-list .bio .jScrollPaneContainer {
					margin: 0 0 0 118px;
				}
				
				#contributor-list .bio .jScrollPaneContainer .scroller {
					margin: 0;
				}
				
				#contributor-list .bio .scroller {
					width: 450px;
					margin: 0 0 0 118px;
				}
				
				#contributor-list .bio .scroller p {
					margin: 0 0 23px 0;
				}
				
				#contributor-list .navigation {
					float: right;
					margin: -6px 0 0 0;
				}
				
				#contributor-list .navigation li {
					float: left;
				}
				
				#contributor-list .navigation li.prev {
					border-right: 1px solid #2cadda;
					padding: 0 9px 0 0;
				}
				
				#contributor-list .navigation li.next {
					padding: 0 0 0 9px;
				}
				
				#contributor-list .bio .top {
					background: transparent url(/content/components/corporate/img/backgrounds/overlay.png) no-repeat 0 0;
					height: 24px;
				}
			
				#contributor-list .bio .body {
					background: transparent url(/content/components/corporate/img/backgrounds/overlay.png) repeat-y -654px 0;
					height: auto;
					padding: 10px 41px;
				}
			
				#contributor-list .bio .bottom {
					background: transparent url(/content/components/corporate/img/backgrounds/overlay.png) no-repeat 0 -25px;
					height: 27px;
				}
		
		/*********************************************************
			4.1.2. BODY | Information Body | Find Stores
		**********************************************************/

		#find-niq {
			margin: 19px 0 0 0;
		}
		
		#find-niq .body {
			height: 114px;
			padding: 0 22px;
		}
		
		#find-niq h2 {
			background: transparent url(/content/components/corporate/img/type/headers.gif) no-repeat 0 -43px;
			height: 12px;
			margin: 12px 0 12px 0;
		}
		
		#find-niq .hr {
			margin: 0 0 7px 0;
		}
		
		#find-niq-button {
			margin: 19px 0 0 -4px;
			outline: none;
		}
		
			/**********************************************************
				4.1.2.1. BODY | Information Body | Find Stores | Window
			***********************************************************/
		
			#find-niq-window {
				display: none;
			}
			
			#find-niq-window h3 {
				background: transparent url(/content/components/corporate/img/type/headers.gif) no-repeat 0 -200px;
				height: 17px;
				width: 311px;
			}
			
			#find-niq-window .close {
				float: right;
				margin: -16px 0 0 0;
			}
		
			#find-niq-window .top {
				background: transparent url(/content/components/corporate/img/backgrounds/overlay.png) no-repeat 0 0;
				height: 24px;
			}
	
			#find-niq-window .body {
				background: transparent url(/content/components/corporate/img/backgrounds/overlay.png) repeat-y -654px 0;
				height: auto;
				padding: 10px 41px;
			}
	
			#find-niq-window .bottom {
				background: transparent url(/content/components/corporate/img/backgrounds/overlay.png) no-repeat 0 -25px;
				height: 27px;
			}
			
			#find-niq-window .hr {
				margin: 16px 0;
			}
			
			#find-niq-unavailable {
				display: block;
				margin: 15px 0;
			}
			
				/*******************************************************************************
					4.1.2.1.1. BODY | Information Body | Find Stores | Window | Available Stores
				********************************************************************************/
				
				#find-niq-available {
					margin: 26px 0;
				}
				
				#find-niq-available li {
					float: left;
				}
				
				#find-niq-available li a {
					display: block;
				}
				
				#find-niq-available .abs{
					background: transparent url('/content/components/corporate/img/stores/abs.gif') no-repeat 0 0;
					height: 20px;
					width: 128px;
				}
				
				#find-niq-available .cub{
					background: transparent url('/content/components/corporate/img/stores/cub.gif') no-repeat 0 0;
					height: 37px;
					width: 61px;
				}
				
				#find-niq-available .acme{
					background: transparent url('/content/components/corporate/img/stores/acme.gif') no-repeat 0 0;
					height: 29px;
					width: 64px;
				}	
				
				#find-niq-available .farmfresh{
					background: transparent url('/content/components/corporate/img/stores/farm_fresh.gif') no-repeat 0 0;
					height: 51px;
					width: 76px;
				}
		/*********************************************************			
				#find-niq-available .hornbachers{
					background: transparent url('/content/components/corporate/img/stores/hornbachers.gif') no-repeat 0 0;
					height: 18px;
					width: 148px;
				}

				#find-niq-available .shaws{
					background: transparent url('/content/components/corporate/img/stores/shaws.gif') no-repeat 0 0;
					height: 42px;
					width: 88px;
				}
	**********************************************************/				
	/*********************************************************
		4.2. BODY | Main Body
	**********************************************************/
	
	#bd-main {
		width: 602px;
		float: left;
		margin: 0 0 0 17px;
	}
	
		/*********************************************************
			4.2.1. BODY | Main Body | News Room
		**********************************************************/

		#newsroom {
			position: relative;
		}
		
		#newsroom .body {
			height: 508px;
			padding: 0 25px;
		}
		
		#newsroom .body .hr {
			margin: 0 0 24px 0;
		}
		
		#newsroom h2 {
			background: transparent url(/content/components/corporate/img/type/headers.gif) no-repeat 0 0;
			height: 17px;
			margin: 9px 0 9px 0;
		}
		
			/************************************************************
				4.2.1.1. BODY | Main Body | News Room | Filter Navigation
			*************************************************************/
			
			#filters {
				display: none;
				position: absolute;
				top: 18px;
				left: 361px;
			}
			
			.has_script #filters {
				display: block;
			}
			
			#filters strong {
				float: left;
				margin: 2px 0 0 0;
			}
			
			#filters ul {
				float: left;
				margin: 0 0 0 9px;
			}
			
			#filters li {
				float: left;
			}
			
			#filters a {
				background: transparent url(/content/components/corporate/img/icons/main.gif) no-repeat 0 0;
				height: 22px;
				width: 30px;
				display: block;
				margin: 0 11px 0 0;
				outline: none;
			}
			
			a#filters-all {
				background-position: 0 0;
			}
			
			#filters-all.active {
				background-position: -30px 0;
			}
			
			a#filters-pdf {
				background-position: 0 -22px;
			}
			
			#filters-pdf.active {
				background-position: -30px -22px;
			}
			
			a#filters-link {
				background-position: 0 -44px;
			}
			
			#filters-link.active {
				background-position: -30px -44px;
			}
			
			a#filters-img {
				background-position: 0 -66px;
			}
			
			#filters-img.active {
				background-position: -30px -66px;
			}
			
				/**********************************************************************
					4.2.1.1.1. BODY | Main Body | News Room | Filter Navigation | Hints
				***********************************************************************/
				
				#pdf-hint, #link-hint, #img-hint {
					color: #fff;
					font-size: 9px;
					text-align: center;
					background: transparent url(/content/components/corporate/img/backgrounds/hints.png) no-repeat;
					display: none;
					position: absolute;
				}
				
				#pdf-hint p, #link-hint p, #img-hint p {
					line-height: 12px;
				}
				
				#pdf-hint {
					height: 48px;
					width: 178px;
					padding: 13px 16px 0 16px;
					top: -64px;
					left: 11px;
				}
				
				#link-hint {
					background-position: 0 -61px;
					height: 47px;
					width: 169px;
					padding: 13px 14px 0 14px;
					top: -63px;
					left: 65px;
				}
				
				#img-hint {
					background-position: 0 -121px;
					height: 36px;
					width: 142px;
					padding: 13px 0 0 0;
					top: -50px;
					left: 131px;
				}
			
			/*********************************************************
				4.2.1.2. BODY | Main Body | News Room | Media Items
			**********************************************************/
			
			#media-items {
				height: 412px;
			}
			
			#media-items ul {}
			
			#media-items li {
				height: 47px;
				border-bottom: 1px dashed #b7b7b7;
				padding: 13px 0 0 0;
				position: relative;
			}
			
			#media-items li .type {
				background: transparent url(/content/components/corporate/img/icons/main.gif) no-repeat 0 0;
				height: 22px;
				width: 30px;
				float: left;
				margin: 0 20px 12px 0;
			}
			
			#media-items li .type.pdf {
				background-position: -30px -22px;
			}
			
			#media-items li .type.link {
				background-position: -30px -44px;
			}
			
			#media-items li .type.img {
				background-position: -30px -66px;
			}
			
			#media-items li p {
				width: 355px;
				float: left;
			}
			
			#media-items li .date {
				display: block;
			}
			
			#media-items li .arrow-link {
				font-size: 10px;
				float: left;
				margin: 12px 0 0 0;
			}
			
			/*********************************************************
				4.2.1.3. BODY | Main Body | News Room | Need Help
			**********************************************************/
			
			#need-help {
				margin: 24px 0 0 0;
			}

/*********************************************************
	5. FOOTER
**********************************************************/

#ft {
	background-color: #fff;
	height: 125px;
	width: 902px;
	margin: 0 auto;
	position: relative;
}

#ft h2 {
	background: transparent url(/content/components/corporate/img/type/headers.gif) no-repeat 0 -120px;
	height: 11px;
	margin: 23px 0 9px 0;
}

#ft a {
	font-weight: bold;
}

	/*********************************************************
		5.1. FOOTER | SuperValu Program
	**********************************************************/
	
	#svu-program {
		background: transparent url(/content/components/corporate/img/type/svu.gif) no-repeat 0 0;
		height: 29px;
		width: 76px;
		position: absolute;
		top: -2px;
		right: 0;
	}

/*********************************************************
	6. HELPERS
**********************************************************/

	/*********************************************************
		6.1. HELPERS | Fonts
	**********************************************************/
	
	.lower {
		text-transform: lowercase;
	}
	
	.upper {
		text-transform: uppercase;
	}

	/*********************************************************
		6.2. HELPERS | Container
	**********************************************************/
	
	.container {
		background-color: #fff;
	}
	
	.container .top, .container .bottom {
		background-image: url(/content/components/corporate/img/backgrounds/containers.gif);
		background-repeat: no-repeat;
		height: 15px;
	}
	
	.container .body {}
	
		/*********************************************************
			6.2.1. HELPERS | Container | Small
		**********************************************************/
		
		.container.small {
			width: 283px;
		}
		
		.container.small .top {
			background-position: 0 -32px;
		}
		
		.container.small .bottom {
			background-position: 0 -48px;
		}
		
		/*********************************************************
			6.2.2. HELPERS | Container | Medium
		**********************************************************/
		
		.container.medium {
			width: 602px;
		}
		
		.container.medium .top {
			background-position: -300px -32px;
		}
		
		.container.medium .bottom {
			background-position: -300px -48px;
		}
		
		/*********************************************************
			6.2.3. HELPERS | Container | Large
		**********************************************************/
		
		.container.large {
			width: 902px;
		}
		
		.container.large .top {
			background-position: 0 0;
		}
		
		.container.large .bottom {
			background-position: 0 -16px;
		}
		
		/*********************************************************
			6.3. HELPERS | Horizontal Rule
		**********************************************************/
		
		div.hr {
			background: transparent url(/content/components/corporate/img/icons/main.gif) repeat-x 0 -147px;
			height: 3px;
		}
		
		div.hr hr {
			display: none;
		}
		
		/*********************************************************
			6.4. HELPERS | Links
		**********************************************************/
		
		.arrow-link {
			font-weight: bold;
			background: transparent url(/content/components/corporate/img/icons/main.gif) no-repeat 0 -110px;
			padding: 0 0 0 11px;
		}
		
		.find-store {
			background: transparent url(/content/components/corporate/img/buttons/main.gif) no-repeat 0 0;
			height: 25px;
			width: 93px;
			display: block;
		}

/*********************************************************
	7. UTILITIES
**********************************************************/

	/*********************************************************
		7.1. UTILITIES | Clear Fix
	**********************************************************/
	
	.clearfix:after {
		line-height: 0;
		height: 0;
		display: block;
		visibility: hidden;
		clear: both;
		content: ".";
	}

	.clearfix {
		display: inline-block;
	}

	html[xmlns] .clearfix {
		display: block;
	}

	* html .clearfix {
		height: 1%;
	}
	
	/*********************************************************
		7.2. UTILITIES | FIR
	**********************************************************/
	
	.fir span, .fir-list li span , .fir-link-list li a span {
		display: block;
		text-indent: -500em;
	}
	
	/*********************************************************
		7.3. UTILITIES | Scroller
	**********************************************************/
	
	.scroller {
		overflow: auto;
	}
	
	/*********************************************************
		7.4. UTILITIES | Modal Window
	**********************************************************/
	
	.jqmOverlay {
		background-color: #51b848;
	}
	
	.jqmWindow {
		width: 654px;
		display: none;
		margin-left: -300px;
		padding: 12px;
		position: fixed;
		top: 50%;
		left: 50%;
	}
	
	/*********************************************************
		7.5. UTILITIES | Scroller
	**********************************************************/
	
	.jScrollPaneContainer {
		position: relative;
		overflow: hidden;
		z-index: 1;
	}

	.jScrollPaneTrack {
		background: transparent url(/content/components/corporate/img/buttons/scrollbar.gif) repeat-y -11px 0;
		position: absolute;
		cursor: pointer;
		right: 0;
		top: 0;
		height: 100%;
	}
	.jScrollPaneDrag {
		position: absolute;
		background: #87cc0c url(/content/components/corporate/img/buttons/scrollbar.gif) no-repeat scroll 0 50%;
		cursor: pointer;
		overflow: hidden;
		height: 13px;
		border-right: 2px solid #000;
	}
	.jScrollPaneDragTop {
		position: absolute;
		top: 0;
		left: 0;
		overflow: hidden;
	}
	.jScrollPaneDragBottom {
		position: absolute;
		bottom: 0;
		left: 0;
		overflow: hidden;
	}
	a.jScrollArrowUp {
		background: transparent url(/content/components/corporate/img/buttons/scrollbar.gif) no-repeat 0 0;
		display: block;
		position: absolute;
		z-index: 1;
		top: 0;
		right: 0;
		text-indent: -2000px;
		overflow: hidden;
		height: 11px;
	}
	a.jScrollArrowUp:hover {
		/*background-color: #f60;*/
	}

	a.jScrollArrowDown {
		background: transparent url(/content/components/corporate/img/buttons/scrollbar.gif) no-repeat 0 -489px;
		display: block;
		position: absolute;
		z-index: 1;
		bottom: 0;
		right: 0;
		text-indent: -2000px;
		overflow: hidden;
		height: 11px;
	}
	a.jScrollArrowDown:hover {
		/*background-color: #f60;*/
	}
	a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
		/*background-color: #f00;*/
	}