﻿/* Common styling */
/* Use this class for common/shared styling e.g. generic fonts (such as titles, sub titles, standard font), 
		generic borders, shared images etc. */
		
body
{	
	font-family: Arial, Helvetica, Tahoma, Geneva, sans-serif;
	margin:0px 0px 0px 0px;
	background: #fff url(images/body_backgr.png) left top repeat-x;
	font-size:62.5%;
	line-height:1.2;
	color:#727374;
}

/* Main titles such as page headings, with short text */
h1
{
	font-size: 1.8em;
	font-weight: bold;
	line-height:1.223;
	color: #0f87e4;
	margin-top:-3px;
	margin-bottom:0.223em;
}

/* Main titles such as page headings (like h1), only with longer text e.g. relatively 
		short paragraph describing the page contents */
h2
{
	font-size: 1.4em;
	font-weight: bold;
	line-height:1.286;
	color: #0f87e4;
	margin-top:0;
	margin-bottom:0.929em;
}

/* Standard small title. Used for side bar titles, product alert text etc. */
h3
{
	font-size: 1.2em;
	font-weight: bold;
	line-height:1.5;
	color: #1b5920;
	margin-bottom:0.334em;
}

img
{
	border: 0px;
}

input[type=text],
input[type=password],
input.textbox
{
	border:1px solid #aaabac;
	width:150px;
}

p {
	font-size:1.2em;
	line-height:1.5;
	margin:0 0 1.334em 0; 
}

a
{
	color:#0f87e4;
	font-size:12px;
}

a:hover 
{
	text-decoration:none;
}

/* Links to product/event information, but the link contains text regarding the product or event title/description */
a .TitleLink
{
	font-size: 1.4em;
	font-weight: bold;
	line-height:1.286;
	color: #1b5920;
	margin-bottom:0.358em;
}

table
{
	border-style: none !important;
} 

tr th, 
td
{
	border-style: hidden !important;
	border-collapse:collapse;
	text-align:left;
}

/* Used for our label/caption class styling*/

.fieldrow
{
	clear:both;
	overflow:hidden;
	margin-bottom:10px;
}

.fieldlabel
{
	float:left;
	margin-right:5px;
	min-width:220px;
	font-size:1.2em;
}

.fieldcapture
{
	overflow:hidden;
	text-align:left;
}

/*styling for error placeholders*/
.ErrorSummary
{
 color:Red;
 clear:both;
}

.ErrorSymbol
{
 font-size:1.2em;
 color:Red;
}

/* Styles for page container */
.PageContainer
{
	position:relative;
	width:741px;
	min-height:200px;
	margin-top:-1px;
	padding: 10px 20px 13px 21px;
	background-color:#f8f7f7;
	border:solid 1px  #ddd;
	border-bottom:none;
 }
	
.PageContainer-Title
{
	width:744px;
	height:37px;
	padding: 0px 20px 0px 20px;
	margin-top: 0px;
	background:url(images/infobox-toptab-blue.png) left top no-repeat;
}

#SimpleArticle.Green .PageContainer-Title /* This is technically styling for the customer templates but shares the styling of the PageContainer-Title */
{
	background:url(images/infobox-toptab-green.png);
}

#SimpleArticle.Green h1.SimpleArticleTitle
{
	color:#3d7d31;
}

.PageContainer-Title h1,
#SimpleArticle h1.SimpleArticleTitle /* This is technically styling for the customer templates but shares the styling of the PageContainer-Title */
{
	font-size:1.4em;
	font-weight:bold;
	position:relative;
	top: 10px;
	color: White;
	left: 0px;
}

#SimpleArticle h1.SimpleArticleTitle /* This is technically styling for the customer templates but shares the styling of the PageContainer-Title */
{
	position:absolute;
	*margin-top: 10px; /*hack for IE7 and below*/
	top:-55px;
	left:-2px;
}

/* Tab controls styling */
#tabs 
{
	position:relative;
	width:780px;
	height:38px;
	margin-top:2px;
	z-index:20;
	overflow:hidden;
}

#tabs ul 
{
	list-style-type:none;
}

#tabs ul li {
	float:left;
	height:38px;
	padding: 0 0 0 10px;
	background:url(images/tabs-backgr.png) left top no-repeat;
	overflow:hidden;
}

#tabs a {
	display:block;
	min-width:42px;
	height:38px;
	line-height:38px;
	padding:0 40px 0 30px;
	background:url(images/tabs-backgr.png) right top no-repeat;
	font-size:14px;
	font-weight:bold;
	color:#9e9e9e;
	text-decoration:none;
	border:none;
	outline:none;
	text-align:center;
	/* ie6 hack */
	_width:42px !important;
}

#tabs a:hover {
	color:#0f87e4;	
}

#tabs ul li.ui-state-active {
	background-position:left -38px;	
}

#tabs ul li.ui-state-active a {
	color:#0f87e4;
	background-position:right -38px;	
}

.ui-tabs-hide 
{
	display:none;	
}

/* Styling for the page container footer*/
.PageContainer-Footer,
.PageContainer-Footer-NoBorder
{
	width:784px;
	min-height:10px;
	background-image:url(images/infobox-bottom.png);
	background-position:left bottom;
	background-repeat:no-repeat;
	overflow:hidden;
}

.PageContainer-Footer
{
	border-top:solid 1px #ddd;
}

.PageContainer-Footer .share
{
	display: none;
	overflow:hidden;
	float:right;
	margin-top:20px;
}

.PageContainer-Footer .buttonContainer
{
	padding: 20px 20px 20px 20px;
	float: left;
}

.PageContainer-Footer .share ul
{
	width:163px;
	list-style-type: none;
	margin-right: 20px;
}

.PageContainer-Footer .share ul li
{
	float:left;
}

.PageContainer-Footer .share ul h3
{
	float:left;
	font-size:12px;
	color:#666666;
	margin-bottom:0px;
	padding-right:15px;
	margin-top: 10px;
}

.PageContainer-Footer .share ul a
{
	display:block;
	margin-right:8px;
	margin-top:13px;
	background-position:left top;
	background-repeat:no-repeat;
	text-indent:-9999px;
}

.PageContainer-Footer a .share-delicious
{
	width:14px;
	height:14px;
	background-image:url(images/share-delicious.png);
}

.PageContainer-Footer a .share-digg
{
	width:16px;
	height:14px;
	background-image:url(images/share-digg.png);
}

.PageContainer-Footer a .share-facebook
{
	width:14px;
	height:14px;
	background-image:url(images/share-facebook.png);
}

.PageContainer-Footer a .share-readit
{
	width:17px;
	height:14px;
	background-image:url(images/share-readit.png);
}

.PageContainer-Footer a .share-stumble
{
	width:13px;
	height:14px;
	background-image:url(images/share-stumble.png);
}

.PageContainer-Footer div.button span 
{
	background:url(images/button-blue-backgr.png) left top no-repeat;
}

.PageContainer-Footer div.button a, div.button button 
{
	background:url(images/button-blue-backgr.png) right top no-repeat;
}

.PageContainer-Footer div.button:hover a, div.button button 
{
	color:#fff;
}

/* Styles for PageContainers */
.PageContainer-Top
{
	position:relative;
	width:783px;
	height:10px;
	background:url(images/page-container-top.png) left top no-repeat;
	overflow:hidden;
	top: 0px;
	left: 0px;
	z-index:1;
}

/* Styles for the sub-content containers */
.subcontainer-container {
	position:relative;
	width:741px;
	margin: 16px 16px 8px 0;
	background:url(images/subcontainer-middle.png) left top repeat-y;
	top: 0px;
	left: 0px;
}

.subcontainer-container .subcontainer {
	width:741px;
	background:url(images/subcontainer-gradient-bottom.png) left bottom no-repeat;	
}

.subcontainer .subcontainer-content 
{
	min-height:130px;
	padding: 10px 1px 10px 1px;
	background:url(images/subcontainer-top.png) left top no-repeat;
	overflow:hidden;
}

#SimpleArticle .subcontainer .subcontainer-content 
{
	padding: 10px 10px 10px 10px;
	/*ie6 hacks*/
	_height:100%;
}

.SubContainerSeperator
{
	clear:both;
	width:741px;
	height: 7px;
	background:url(images/subcontainer-separator.png) no-repeat;	
	margin-left: -1px;
}

/* Used for button style anchor tags. e.g. series links, similar product links etc. */
.buttonContainer
{
	overflow:hidden;
}

div.button {
	float:left;
	overflow:hidden;
	margin-right:10px;
}

div.button.right {
	float:right;	
}

div.button span {
	float:left;
	width:5px;
	height:30px;
	overflow:hidden;
	background:url(images/button-green-backgr.png) left top no-repeat;
}

div.button.selected span 
{
	background-position:left bottom;
}

div.button a, div.button button {
	float:left;
	height:30px;
	line-height:30px;
	padding:0 10px 0 5px;
	background:url(images/button-green-backgr.png) right top no-repeat;
	font-size:14px;
	font-weight:bold;
	color:#fff;
	text-decoration:none;
	overflow:hidden;
}

div.button.selected a, div.button.selected button 
{
	background-position:right bottom;
	color:#3d7d31;
}

div.button:hover span {
	background-position:left bottom;	
}

div.button.selected:hover span {
	background-position:left top;	
}

div.button:hover a, div.button:hover button {
	background-position:right -30px;
	color:#3d7d31;
	text-decoration:none;
}

div.button.selected:hover a, div.button.selected:hover button {
	background-position:right 0px;
	color:#fff;
}

div.button button {
	overflow:visible;
}

div.button a.small-button {
	height:24px;
	line-height:24px;
	font-size:12px;	
	background: url(images/button-small-green-backgr.png) right top no-repeat;
}

div.button span.small-button {
	float:left;
	width:5px;
	height:24px;
	line-height:24px;
	overflow:hidden;
	background: url(images/button-small-green-backgr.png) left top no-repeat;
}

div.button:hover span.small-button {
	background-position:left bottom;	
}

div.button.selected:hover span.small-button {
	background-position:left top;	
}

div.button:hover a.small-button {
	background-position:right -24px;
	color:#3d7d31;
	text-decoration:none;
}

/*=======================================================================================================================================*/
/* Styling for the ajax loading panes */
/*=======================================================================================================================================*/

.LoadingBackground
{
	width:100%;
	height:100%;
	position:fixed;
	top:0px;
	left:0px;
	background-color:white;
	z-index:100000 !important;
	-moz-opacity:.70;
	filter:alpha(opacity=70);
	opacity:.70;	
	
	/*ie6 hacks*/
	_display:none !important;
}

.LoadingContent
{
	position:fixed;
	background-color:White;
	border:solid 1px gray;
	width:25%;
	height:100px;
	top:37.5%;
	left:37.5%;
	z-index:100001 !important;
	padding-top:60px;
	padding-left:50px;
	/*ie6 hacks*/
	_display:none !important;
}

.LoadingContent .LoadingImage
{
	background-image:url(images/ajax-loader.gif); 
	background-repeat:no-repeat; 
	height:32px; 
	width:32px; 
	float:left;
}

.LoadingContent .LoadingText
{
	padding-top:10px;
}

/* Wizard Navigation styling */
.buttonContainer.StartNavigation,
.buttonContainer.StepNavigation,
.buttonContainer.FinishNavigation
{
}

.buttonContainer.StartNavigation .button.NavigateNext,
.buttonContainer.StepNavigation .button.NavigateNext,
.buttonContainer.FinishNavigation .button.NavigateFinish
{
	margin-right:10px;
	float:right;
}

.buttonContainer.StepNavigation .button.NavigateBack,
.buttonContainer.StartNavigation .button.NavigateBack
{
	margin-left:10px;
	float:left;
}

/* ********* GENERIC LISTS ********* */

ul.list1
{
	list-style-type: none;
	
}

ul.list1 {
	padding-left:20px;
	margin-bottom:1em;
	font-size:1.2em;
}

ul.list1 li {
	padding-left:11px;
	line-height:1.5;
	padding-bottom:0.334em;
	background: url(images/bullet.png) left 0.584em no-repeat;
}

ul.list1 li a {
	vertical-align:top;
	line-height:1.4;
}

ul.list1.green li {
	background-image:url(images/bullet.png);	
}

ul.list1 ul {
	margin-top:-0.084em;
	margin-bottom:0.084em;
	padding-left:6px;
}

ul.list1 ul li {
	line-height:1.334;
	padding-bottom:0;
	background-image:url(../images/bullet-dash.png);
}

ul.list1.green ul li {
	background-image:url(../images/bullet-dash-green.png);	
}

ol {
	padding-left:0px;
	margin-bottom:1em;
	font-size:1.2em;
}

ol li {
	padding-left:20px;
	line-height:1.5;
	padding-bottom:0.334em;
	list-style-type: decimal;
	list-style-position:inside;
}

/* Compatibility for Folens product data html */
.bold
{
	font-weight: bold;
}

.italic
{
	font-style: italic;
}

.red
{
	color: Red;
}

.DataDriven h2
{
	padding: 10px 0px 10px 0px;
}

.DataDriven p 
{
	padding: 6px 0px 6px 0px;
}

.DataDriven ul
{
	PADDING-RIGHT: 0px; 
	PADDING-LEFT: 0px; 
	PADDING-BOTTOM: 16px; 
	MARGIN-LEFT: 20px; 
	COLOR: #727374; 
	PADDING-TOP: 0px; 
	LIST-STYLE-TYPE: none
}

.DataDriven ul li
{
	BACKGROUND-POSITION: left 0.6em; 
	PADDING-LEFT: 17px;
	FONT-SIZE: 12px; 
	BACKGROUND-IMAGE: url(images/bullet.gif); 
	PADDING-BOTTOM: 5px; 
	LINE-HEIGHT: 1.5; 
	BACKGROUND-REPEAT: no-repeat; 
	color: #727374;
}

/*=======================================================================================================================================*/
/* Styling for the modal popup */
/*=======================================================================================================================================*/

.PopupBackground
{
	background-color:White;
	-moz-opacity:.50; 
	filter:alpha(opacity=50); 
	opacity:.50;
}

.PopupContentContainer
{
	width:784px;	
	/*ie6 hacks*/
	_position:absolute !important;
	_top:0px !important;
	_left:0px !important;
}

.PopupContentHeader
{	
	height:37px;
	padding: 0px 20px 0px 20px;
	margin-top: 0px;
	background:url(images/infobox-toptab-blue.png) left top no-repeat;
	text-align:left;
}

.PopupContentHeader h1
{
	color:White;
	position:relative;
	font-size:1.4em;
	top:10px;
}

.PopupContentBody
{
	border-left:#ddd 1px solid;
	border-right:#ddd 1px solid;
	padding: 10px 10px 10px 10px;
	background-color:#f8f7f7;
}

.PopupContentFooter
{
	padding: 20px 20px 20px 20px;
	border-top:solid 1px #ddd;
	background:url(images/infobox-bottom.png) left bottom no-repeat;	
	text-align:left;
}

.button.OpenButton.SubmitButton,
.PopupContentFooter .OKButton,
.PopupContentFooter .CancelButton
{
	background-image:url(images/button-blue-backgr-fixed.png);
	background-position:top;
	width:110px;
	height:30px;
	background-repeat:no-repeat;
	font-size:14px;
	font-weight:bold;
	color:#fff;
	text-decoration:none;
	border:solid 0px white;
	margin-right:10px;
}

.button.OpenButton.SubmitButton:hover,
.PopupContentFooter .OKButton:hover,
.PopupContentFooter .CancelButton:hover
{
	background-position:bottom;
	cursor:pointer;
}
