﻿/*======================================================================
	THOMAS SCIENTIFIC: Base Layout
	--------------------------------------------------------------------
	Grid: 	16 column / 940px (gutters spill to 960px)
	Column:	40px;
	Gutter: 20px;
	
	Color Palette:
	Black:          #2c2c2c;
	Dark Gray:      #373737;
	Medium Gray:    #555;
	
	Dark Red:       #780011;
	Medium Red:     #9a042a;
	
	Dark Gray-Blue: #484b4c;
	Medium Blue:    #2e5f97;
	Light Blue:     #4999f2;
	
	Medium Shading: #ececec;
	Light Shading:  #f3f3f3;

	Z-index:
	1000: Interface
	2000: Content
	3000: Modal
	4000: Secondary Nav
	5000: Primary Nav
	6000: Zoom
	9999: WebLinc Toolbar
	
----------------------------------------------------------------------*/
* { margin: 0; padding: 0; }

body
{
	font: 75% Arial, Verdana, Helvetica, Sans-serif;
	color: #373737;
	background-color: #fff;
}

/*======================================================================
	HEADINGS
----------------------------------------------------------------------*/
h1
{
	margin: 0 0 0.5em;
	font-size: 1.5em;
	font-weight: normal;
	color: #780011;
}

h2
{
	margin: 0 0 0.5em;
	font-size: 1.333em;
	font-weight: bold;
	color: #780011;
}

h3
{
	margin: 0 0 1em;
	font-size: 1em;
	font-weight: bold;
	color: #484b4c;
}

h4
{
	margin: 1em 0;
	font-size: 1.167em;
	font-weight: bold;
	color: #373737;
}

h5
{
	margin: 1em 0;
	font-size: 0.833em;
	font-weight: bold;
	font-style: normal;
	text-transform: uppercase;
	color: #373737;
}

h6
{
	margin: 1em 0;
	font-size: 1em;
	font-weight: normal;
	font-style: normal;
	color: #373737;
}


/*======================================================================
	LINKS
----------------------------------------------------------------------*/
a
{
	overflow: hidden;
	text-decoration: none;
	color: #2e5f97;
}

a:hover
{
	color: #4999f2;
	text-decoration: underline;
}

	a img,
	a:visited img
	{
		padding: 0;
		border: none;
	}


/*======================================================================
	PARAGRAPHS
----------------------------------------------------------------------*/
p 
{
	margin-bottom: 1em;
	line-height: 1.6;
}

/*======================================================================
	LISTS
----------------------------------------------------------------------*/
ul
{
	margin: 1em 0 1em 2em;
	list-style: disc;
}
	
	ul li
	{
		margin: 0.5em 0;
	}
	
ol
{
	margin: 1em 0 1em 2em;
	list-style: decimal;
}
	
	ol li
	{
		margin: 0.5em 0;
	}
	
dl
{
	margin: 1em 0;
}

	dt 
	{
		font-weight: bold;
	}
	
		dd
		{
			margin-left: 1em;
		}


/*======================================================================
	MISC ELEMENTS
----------------------------------------------------------------------*/
address
{
	font-size: 1em;
	font-style: normal;
}

	address .address-group-name,
	address .address-group-address,
	address .address-group-location,
	address .address-group-country
	{
		display: block;
	}

abbr,
acronym 
{ 
	border-bottom: 1px dotted #333; 
	cursor: help; 
}  

blockquote
{
	margin: 1em;
	padding: 1em;
	background-color: #f1f1f1;
	border-left: 1px solid #dadada;
}

cite
{
	margin-left: 1em;
	font-style: italic;
}

.price-original
{
	text-decoration: line-through;
	color: #666;
}

	.price-original span
	{
		text-decoration: none;
	}

.grid-overlay
{
	position: absolute;
	left: 32px;
	top: 0;
	display: none;
}

/*---------------------------------
	HIGHLIGHTING
---------------------------------*/
span.highlight-wrapper 
{}

	span.highlight
	{
		background-color: #fffcd3;
		border-bottom: 1px dashed #ccc;
	}
	
/*---------------------------------
	FILE FORMAT ICONS
---------------------------------*/
.file-format
{
	display: block;
	padding-top: 2px;
}

	.file-format span.icon
	{
		display: block;
		position: relative;
		left: 0;
		top: -2px;
		margin-right: 5px;
		width: 16px;
		height: 16px;
		float: left;
		background-color: transparent;
		background-position: 0 0;
		background-repeat: no-repeat;
	}
	.file-format-excel span.icon { background-image: url(../../../../_global/images/icons/silk/png/page_white_excel.png); }
	.file-format-html span.icon { background-image: url(../../../../_global/images/icons/silk/png/page_white_code.png); }
	.file-format-pdf span.icon { background-image: url(../../../../_global/images/icons/silk/png/page_white_acrobat.png); }
	.file-format-text span.icon { background-image: url(../../../../_global/images/icons/silk/png/page_white_text.png); }
	.file-format-word span.icon { background-image: url(../../../../_global/images/icons/silk/png/page_white_word.png); }
	.file-format-zip span.icon { background-image: url(../../../../_global/images/icons/silk/png/page_white_zip.png); }

/*======================================================================
	FORMS
----------------------------------------------------------------------*/
/*---------------------------------
	GENERAL ELEMENTS
---------------------------------*/
label
{
	vertical-align: middle;
}

input.input-text,
input.input-password,
textarea
{
	padding: 2px 4px;
	font-size: 1em;
	font-family: inherit;
	vertical-align: middle;
	color: #373737;
	background: #fff url(../../images/layout/bg_input.png) 0 0 no-repeat;
	border: 1px solid #999;
}	

	textarea
	{
		vertical-align: top;
	}
	
	/*include JS-applied classes for IE, which doesn't support pseudo-selectos */
	input.focused,
	input.input-text:focus,
	input.input-password:focus,
	textarea.focused,
	textarea:focus
	{
		background: none;
		background-color: #f1f1f1;
		border-color: #4999f2;
	}

/* TODO: Convert these to classes instead of pseudo-selectors for IE */
input[type="radio"],
input.input-radio
{
	margin-right: 5px;
	vertical-align: middle;
}

input[type="checkbox"],
input.input-checkbox
{
	margin-right: 3px;
	vertical-align: middle;
}

select
{
	padding: 1px;
	vertical-align: top;
	font-family: inherit;
	font-size: 0.917em;
}

	select option
	{
		padding: 0 2px 2px 4px;
	}

/*---------------------------------
	VALIDATION ERRORS
---------------------------------*/
.validation-errors
{
	margin: 1em 0;
	padding: 12px;
	font-weight: bold;
	color: #f00;
	background-color: #fff1f1;
	border: 1px solid #f00;	
}

	.validation-errors ul
	{
		margin: 1em 0 0 30px;
		list-style: disc;	
	}
	
		.validation-errors ul li
		{
			margin: 0.3em 0;
			font-weight: normal;
			color: #4a4a4a;	
		}

/*---------------------------------
	PAIRING LISTS
---------------------------------*/
div.pairinglist
{}
	
	ul.pairings
	{
		margin: 0;
		padding: 0;
		list-style-type: none;
	}
	
		li.pairing
		{
			margin: 0 0 1em;
			background: none;
		}
		
			li.pairing label.primary
			{}
		
			li.pairing div.pairing-controls
			{
				overflow: hidden;
			}

		/*-- PAIRING LIST VERTICAL --*/
		li.pairing-vertical label.primary
		{
			display: block;
			margin-bottom: 0.2em;
		}
	
				li.pairing-vertical label.primary span.required,
				li.pairing-vertical label.primary span.optional
				{
					font-size: 0.917em;
					font-weight: normal;
					font-style: italic;
					color: #666;
				}
		
				li.pairing-vertical label.primary span.pairing-note
				{
					font-size: 0.917em;
					font-weight: normal;
					color: #999;
				}
		
		/*-- PAIRING LIST HORIZONTAL --*/
		li.pairing-horizontal label.primary
		{
			margin-right: 5px;
			float: left;
		}

		li.pairing-horizontal .pairing-content
		{
			float: left;	
		}

			li.pairing-horizontal .pairing-content select option
			{
				font-size: 1.1em;
				padding: 0 2px 0 4px;
			}

/*---------------------------------
	ACTION LISTS
---------------------------------*/
div.actionlist
{
	padding-top: 1em;
	border-top: 1px dashed #d7d7d7;
}

	ul.actions
	{
		margin: 0;
		padding: 0;
		list-style: none;
	}

		ul.actions li.action
		{
			margin-right: 12px;
			float: left;
			background: none;
		}
			
			/* presumes primary action is a button and secondary action is text */
			ul.actions li.action-secondary
			{
				margin-right: 6px;
				padding-top: 9px;
			}

/*---------------------------------
	ADVANCED SELECTORS
---------------------------------*/
ul.advanced-selector
{
	margin: 0;
	list-style: none;	
}

	ul.advanced-selector li
	{
		margin: 0 20px 0 0;
		padding-bottom: 14px;
		float: left;
	}
	* html ul.advanced-selector li { width: 1%; }
	
		ul.advanced-selector li.mod-3
		{
			/*clear: left;*/	
		}
	
		ul.advanced-selector li dl.item
		{
			margin-bottom: 0;
			padding: 6px;
			width: 166px;
			min-height: 100px;
			color: #666;
			border: 1px solid #3e728b;
		}
		* html ul.advanced-selector li dl.item { height: 100px; }
		
			ul.advanced-selector li dl.item dt.item-term .input-radio
			{
				float: left;
			}
		
			ul.advanced-selector li dl.item dt.item-term label
			{
				display: block;
				margin-left: 20px;
				font-weight: bold;	
			}
			
				ul.advanced-selector li dl.item dd.item-definition
				{
					margin-left: 20px;
					padding: 0;
				}
				
					ul.advanced-selector li dl.item dd.item-definition dl
					{
						margin: 0.3em 0;
					}
					
						ul.advanced-selector li dl.item dd.item-definition dt
						{
							display: inline;
							font-weight: bold;	
						}
						
							ul.advanced-selector li dl.item dd.item-definition dd
							{
								display: inline;	
							}
					
		/*-- HOVER --*/
		ul.advanced-selector li.hover dl.item
		{
			cursor: pointer;
			background-color: #dde8ef;	
		}
		
			ul.advanced-selector li.hover dl.item label,
			ul.advanced-selector li.hover dl.item input.input-radio
			{
				cursor: pointer;
			}
		
		/*-- SELECTED --*/
		ul.advanced-selector li.selected dl.item
		{
			padding: 4px;
			color: #333;
			background-color: #dde8ef;
			border: 3px solid #3e728b;
		}
		
		/*-- ACTIONS --*/
		ul.advanced-selector .actionlist
		{
			padding-top: 0;
			border: none;
		}
		
		
/*======================================================================
	MESSAGES (system)
----------------------------------------------------------------------*/
.messagelist ul.messages
{
	margin: 0.5em 0;
	list-style: none;	
}

	.messagelist ul.messages li.message
	{
		margin: 0.5em 0;
		padding: 1em 44px;
		font-size: 1.167em;
		background: none;
	}
	
		.messagelist ul.messages li.message span
		{
			font-weight: bold;
		}

		/*-- INFORMATION --*/
		.messagelist ul.messages li.message-information
		{
			color: #032e4e;
			background: #d8e6f0 url(../../../../_global/images/icons/icon_shoppe/disco/24/comment.png) 10px center no-repeat;
			border: 3px double #fff;
		}
		/*-- AUTHENTICATION REQUIRED --*/
		.messagelist ul.messages li.message-authenticationrequired
		{
			padding: 0.6em 28px;
			font-size: 0.917em;
			color: #333;
			background: #f3f4f5 url(../../../../_global/images/icons/icon_shoppe/disco/16/locked.png) 6px center no-repeat;
			border: 1px solid #bfcbd4;
		}
		/*-- CONFIRMATION --*/
		.messagelist ul.messages li.message-confirmation
		{
			color: #333;
			background: #f1f1f1 url(../../../../_global/images/icons/icon_shoppe/disco/24/minus.png) 10px center no-repeat;
			border: 2px solid #757575;
		}
		/*-- WARNING --*/
		.messagelist ul.messages li.message-warning
		{
			color: #333;
			background: #fff0e3 url(../../../../_global/images/icons/icon_shoppe/disco/24/alert.png) 10px center no-repeat;
			border: 2px solid #f8891f;
		}
		/*-- ERROR --*/
		.messagelist ul.messages li.message-error
		{
			color: #000;
			background: #fef2f1 url(../../../../_global/images/icons/icon_shoppe/disco/24/!.png) 10px center no-repeat;
			border: 2px solid #b61a1a;
		}
		/*-- SUCCESS --*/
		.messagelist ul.messages li.message-success
		{
			color: #333;
			background: #f3ffe9 url(../../../../_global/images/icons/icon_shoppe/disco/24/check.png) 10px 10px no-repeat;
			border: 2px solid #65a63e;	
		}
		/*-- BLANK --*/
		.messagelist ul.messages li.message-blank
		{
			color: #333;
			background: #f1f1f1 10px center no-repeat;
			border: 2px solid #757575;
		}

	/*---------------------------------
		SUBMESSAGES
	---------------------------------*/
	.messagelist ul.messages ul.submessages
	{
		margin: 0 0 0 1em;
	}

		.messagelist ul.messages ul.submessages li.submessage
		{
			padding-left: 22px;
			list-style: none;
			background: none;
			background-color: transparent;
			background-position: 0 0;
			background-repeat: no-repeat;
		}

			/*-- INFORMATION --*/
			.messagelist ul.messages ul.submessages li.submessage-information
			{
				background-image: url(../../../../_global/images/icons/icon_shoppe/disco/16/comment.png);
			}
			/*-- AUTHENTICATION REQUIRED --*/
			.messagelist ul.messages ul.submessages li.submessage-authenticationrequired
			{
				background-image: url(../../../../_global/images/icons/icon_shoppe/disco/16/locked.png);
			}
			/*-- CONFIRMATION --*/
			.messagelist ul.messages ul.submessages li.submessage-confirmation
			{
				background-image: url(../../../../_global/images/icons/icon_shoppe/disco/16/minus.png);
			}
			/*-- WARNING --*/
			.messagelist ul.messages ul.submessages li.submessage-warning
			{
				background-image: url(../../../../_global/images/icons/icon_shoppe/disco/16/alert.png);
			}
			/*-- ERROR --*/
			.messagelist ul.messages ul.submessages li.submessage-error
			{
				background-image: url(../../../../_global/images/icons/icon_shoppe/disco/16/!.png);
			}
			/*-- SUCCESS --*/
			.messagelist ul.messages ul.submessages li.submessage-success
			{
				background-image: url(../../../../_global/images/icons/icon_shoppe/disco/16/check.png);
			}

/*======================================================================
	ORDER DATA (order review, confirmation, history)
----------------------------------------------------------------------*/
/*---------------------------------
	SHIPMENTS (single & multiple)
---------------------------------*/
.order-data .shipments
{}

	.order-data .shipments h4
	{
		font-weight: bold;
		color: #333;	
	}
	
		.order-data .shipments .info h4 span
		{
			font-size: 0.765em;
			font-weight: normal;
			color: #999;
		}
		
	.order-data .shipments .info dl
	{
		margin: 0.333em 0 0.667em;
	}
	
		.order-data .order-details dl dt,
		.order-data .order-details label.primary,
		.order-data .shipments .info dl dt
		{
			font-size: 0.917em;
			font-weight: bold;
		}
		
			.order-data .order-details li.pairing label.primary span.optional
			{
				display: none;
			}
			
			.order-data .order-details li.pairing .pairing-controls a
			{
				margin-left: 3px;
				padding-left: 3px;
				border-left: 1px dotted #d7d7d7;
			}
	
		.order-data .order-details dl dd,
		.order-data .order-details li.pairing .pairing-controls,
		.order-data .shipments .info dl dd
		{
			margin-left: 0;
			color: #858585;
		}
	
	/* TODO: This needs some cleanup */
	.order-data .shipments .info .address .address-group-name,
	.order-data .shipments .info .address .address-group-company,
	.order-data .shipments .info .address .address-group-address,
	.order-data .shipments .info .address .address-group-location,
	.order-data .shipments .info .address .address-group-country
	{
		display: block;
	}
	
	.order-data ol.shipmentlist
	{
		margin: 0;
		list-style: none;	
	}
	
		.order-data ol.shipmentlist li.shipment
		{
			margin: 0;	
			background: none;
		}

	.order-data .shipments .items ul.statuses
	{
		display: block;
		clear: both;
	}
	
	.order-data .shipments .items .order-note
	{
		margin-top: 5px;
		padding: 5px;
		font-weight: bold;
		background-color: #f1f1f1;
	}
	
		.order-data .shipments .items .order-note span
		{
			display: block;
			padding-top: 5px;
			font-weight: normal;
		}

/*---------------------------------
	SINGLE SHIPMENTS
---------------------------------*/
* html .order-data .shipments-single ol.shipmentlist { float: left; }

.order-data .shipments-single h2,
.order-data .shipments-single h3
{
	display: none;
}
	
.order-data .shipments-single .info
{
	margin-bottom: 2em;	
}
	.order-data .shipments-single .order-details h4 span,
	.order-data .shipments-single .info h4 span
	{
		font-size: 0.786em;
		font-weight: normal;
		color: #999;
	}

	.order-data .order-details,
	.order-data .shipments-single .info .address,
	.order-data .shipments-single .info .method,
	.order-data .shipments-single .info .meta
	{
		padding: 0 20px 1em;
		width: 185px;
		min-height: 160px;
		float: left;
		border-left: 1px solid #ccc;
	}
	
	.order-data .order-details
	{
		border: none;
		border-top: 1px solid #ccc;
	}
	
	* html .order-data .shipments-single .info .address,
	* html .order-data .shipments-single .info .method,
	* html .order-data .shipments-single .info .meta { height: 140px; }
	* html .order-data .shipments-single .info .meta { padding-right: 0; }

	.order-data .shipments-single .items
	{
		position: relative;
		*left: -225px; /*fixes IE6 & IE7*/
		width: 904px;
		_width: auto; /*fixes IE6*/
	}

/*---------------------------------
	MULTIPLE SHIPMENTS
---------------------------------*/
.order-data .shipments-multiple ol.shipmentlist
{
	margin-bottom: 2em;	
}

	.order-data .shipments-multiple ol.shipmentlist li.shipment
	{
		margin-bottom: 1em;
		padding-top: 1em;
		clear: both;
		border-top: 1px dashed #999;
	}

	.order-data .shipments-multiple ol.shipmentlist li.shipment-last
	{
		border-bottom: 2px solid #999;
	}
		
		/*-- INFO --*/
		.order-data .shipments-multiple .info
		{
			position: relative;
			margin-right: 20px;
			width: 230px;
			float: left;	
		}
		
			.order-data .shipments-multiple .info h3
			{
				position: absolute;
				left: -5px;
				top: 0;
				margin: 0;
				padding: 0;
				font-size: 50px;
				font-style: normal;
				line-height: 26px;
				color: #dadada;	
				z-index: 1;
			}
			
				.order-data .shipments-multiple .info h3 span
				{
					display: none;
				}
			
			.order-data .shipments-multiple .info h4
			{
				margin: 0;	
			}
			
			.order-data .shipments-multiple .info .address,
			.order-data .shipments-multiple .info .method,
			.order-data .shipments-multiple .info .meta
			{
				position: relative;
				margin-bottom: 1em;	
				margin-left: 25px;
				z-index: 2;
			}
			
		/*-- ITEMS --*/
		.order-data .shipments-multiple .items
		{
			width: 670px;
			float: right; 
		}	
		
			.order-data .shipments-multiple .items .u-shipment-items
			{
				margin-bottom: 0;
			}
			
		/*-- SHIPMENT TOTALS --*/
		.order-data .shipments-multiple .u-miscellaneous-totalstable
		{
			width: 670px;
			clear: right;
			float: right;
		}

/*---------------------------------
	TENDERS
---------------------------------*/
.order-data .tenders
{
	margin-bottom: 1.333em;
	border-bottom: 8px solid #dde8ef;	
}

	.order-data .tenders h2 span
	{
		font-size: 0.688em;
		font-weight: normal;
		color: #999;
	}

	.order-data .tenders table.base
	{
		margin-bottom: 2px;	
	}

/*---------------------------------
	ORDER TOTALS
/--------------------------------*/
.order-data .totals
{
	margin-bottom: 1em;	
}

	.order-data .totals h2
	{
		margin: 0;
		padding: 0 9px 0.5em 0;
		width: 291px;
		float: right;
		text-align: right;
		border-bottom: 1px solid #d5d5d5;
	}

	.order-data .totals .u-miscellaneous-totalstable
	{
		clear: both;
		border: none;
	}
		
		.order-data .totals .u-miscellaneous-totalstable table
		{
			margin-top: 0;
			width: 300px;
			float: right;
		}

/*======================================================================
	CSS BUTTONS
	--------------------------------------------------------------------
	Tricky stuff here. Lots of positioning and negative margins to 
	allow the use of shadows and rounded corners with full alpha 
	transparency using a single image each for normal and hover state.
	This markup is generated by a custom.NET control.
	--------------------------------------------------------------------
	html>body selectors block IE6, who apparently repeated 2nd grade
	only to fail 3rd grade for poor computational and communication 
	skills.
----------------------------------------------------------------------*/
/*---------------------------------
	BUTTON
---------------------------------*/
.button 
{
	position: relative;
	display: block;
	padding: 8px;
	float: left;
	font-size: 1em;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	color: #fff;
	cursor: pointer;
}
* html .button { background-color: #8c0101; }
	
	html>body .button * 
	{
		position: relative;
		display: block;
		font-style: normal;
		background-image: url(../../images/buttons/button.png);
		background-repeat: no-repeat;
	}
	/*-- TOP LEFT --*/
	html>body .button i 
	{
		position: absolute;
		left: 0;
		top: 0;
		margin-bottom: -8px;
		width: 8px;
		height: 8px;
		background-position: top left;
	}
	/*-- BOTTOM LEFT --*/
	html>body .button span 
	{
		left: -8px;
		margin-bottom: -8px;
		padding: 0 0 8px 16px;
		min-width: 103px;
		background-position: bottom left;
	}
	/*-- BOTTOM RIGHT --*/
	html>body .button span i 
	{
		position: absolute;
		left: 100%;
		top: 0;
		margin-bottom: 0;
		width: 16px;
		height: 100%;
		background-position: bottom right;
	}
	/*-- TOP RIGHT --*/
	html>body .button span span 
	{
		position: absolute;
		right: -16px;
		top: -8px;
		margin-left: 16px;
		min-width: 0;
		height: 0;
		background-position: top right;
	}
	/*-- HOVER --*/
	.button:hover,
	.button:focus
	{
		text-decoration: none;
		color: #fff;
	}
		
		html>body .button:hover *,
		html>body .button:focus *  
		{
			background-image: url(../../images/buttons/button-hover.png);
		}

/*---------------------------------
	ALTERNATE BUTTON
---------------------------------*/
* html .button-alt { background-color: #0e2a4a; }

html>body .button.alt * 
{
	background-image: url(../../images/buttons/button-alt.png);
}

	html>body .button.alt:hover *,
	html>body .button.alt:focus *  
	{
		background-image: url(../../images/buttons/button-alt-hover.png);
	}

/*---------------------------------
	SMALL BUTTON
---------------------------------*/
.button.small
{
	padding: 4px;
	font-size: 0.833em;
	font-weight: normal;
}
* html .button.small { background-color: #0e2a4a; }

	html>body .button.small * 
	{
		background-image: url(../../images/buttons/button-alt.png);
	}
	
	/*-- TOP LEFT --*/
	html>body .button.small i 
	{
		margin-bottom: -4px;
		width: 4px;
		height: 4px;
	}
	/*-- BOTTOM LEFT --*/
	html>body .button.small span 
	{
		left: -4px;
		margin-bottom: -4px;
		padding: 0 0 4px 8px;
		min-width: 0;
	}
	/*-- BOTTOM RIGHT --*/
	html>body .button.small span i 
	{
		margin-bottom: 0;
		width: 8px;
		height: 100%;
		
	}	
	/*-- TOP RIGHT --*/
	html>body .button.small span span 
	{
		right: -8px;
		top: -4px;
		margin-left: 8px;
	}	
	/*-- HOVER --*/
	html>body .button.small:hover *,
	html>body .button.small:focus *  
	{
		background-image: url(../../images/buttons/button-alt-hover.png);
	}
	
/*---------------------------------
	MEDIUM BUTTON
---------------------------------*/
.button.medium
{
	padding: 11px;
}
	
	/*-- TOP LEFT --*/
	html>body .button.medium i 
	{
		margin-bottom: -11px;
		width: 11px;
		height: 11px;
	}
	/*-- BOTTOM LEFT --*/
	html>body .button.medium span 
	{
		left: -11px;
		margin-bottom: -11px;
		padding: 0 0 11px 22px;
		min-width: 141px;
	}
	/*-- BOTTOM RIGHT --*/
	html>body .button.medium span i 
	{
		margin-bottom: 0;
		width: 22px;
		height: 100%;
		
	}	
	/*-- TOP RIGHT --*/
	html>body .button.medium span span 
	{
		right: -22px;
		top: -11px;
		margin-left: 22px;
	}
	
/*---------------------------------
	BUTTON DESTRUCTIVE / SMALL ALT
---------------------------------*/
html>body .button.destructive *,
html>body .button.small.alt * 
{
	background-image: url(../../images/buttons/button.png);
}

	html>body .button.destructive:hover *,
	html>body .button.destructive:focus *,
	html>body .button.small.alt:hover *,
	html>body .button.small.alt:focus *
	{
		background-image: url(../../images/buttons/button-hover.png);
	}
/*======================================================================
	TABLES
----------------------------------------------------------------------*/
/*---------------------------------
	BASE TABLE
---------------------------------*/
table.base
{
	margin-bottom: 1.2em;
	width: 100%;
	font-size: 0.917em;
	border-collapse: collapse;   
}

	table.base input.input-text, 
	table.base input.input-password, 
	table.base textarea
	{
		font-size: 1em;
	}
	
	table.base th
	{
		font-weight: bold;
		text-align: left;
	}
	
		table.base thead th
		{
			padding: 1.667em 10px 0.833em;
			color: #fff;
			background-color: #3e728b;
		}
	
	table.base td
	{
		padding: 1.1em 10px;
		text-align: left;
		vertical-align: top;
		border-bottom: 1px solid #dde8ef;
	}
	
		table.base th.numeric,
		table.base td.numeric
		{
			text-align: right;
		}
	
	table.base div.actionlist
	{
		padding: 0;
		border: 0 none;
	}
		table.base  ul.actions li.action
		{
			margin-top: 0;
			margin-bottom: 3px;
			padding-top: 0;
		}
	

/*---------------------------------
	LINE ITEM TABLE
	cart, order review, 
	confirmation & history
	-------------------------------
	always inherits from table.base
---------------------------------*/
table.lineitems
{
	margin-bottom: 1px;
}

	table.lineitems ul
	{
		margin: 0;
		list-style: none;	
	}
	
		table.lineitems ul li
		{
			margin-top: 0;
		}

		table.lineitems ul dl
		{
			margin: 0 0 0.5em;
		}
		
			table.lineitems ul dt
			{
				display: inline; 	
				font-weight: bold;
			}

				table.lineitems ul dd
				{
					display: inline; 	
					margin: 0;
				}
				
	table.lineitems	ul.actions li.action-secondary
	{
		padding-top: 0;
	}

	table.lineitems td.column-product .product-image
	{
		margin: 0 10px 10px 0;
		float: left;	
	}

	table.lineitems  td.column-product span.product-fulfillmentsystemid,
	table.lineitems  td.column-product span.product-manufacturercode
	{
		display: block;
		/*white-space: nowrap;*/
		color: #858585;
	}	
	
	table.lineitems th.column-quantity,
	table.lineitems td.column-quantity
	{
		text-align: left;
	}


/*---------------------------------
	GRID TABLE
---------------------------------*/
table.grid
{
	margin: 1.2em 0;
	width: 100%;
	border-collapse: collapse;   
	background-color: #fff;
	border: 1px solid #ccc;
}

	table.grid tbody th
	{
		padding: 0.5em 4px;
		font-size: 1em;
		font-weight: bold;
		text-align: center;
		background-color: #f1f1f1;
		border: 1px solid #ccc;
	}
	
		table.grid th span
		{
			display: block;
			font-weight: normal;
			font-size: 0.917em;	
		}
	
	table.grid td
	{
		padding: 0.5em 4px;
		text-align: left;
		vertical-align: top;
		border: 1px solid #ccc;
	}

/*---------------------------------
	STRIPED TABLE
	-------------------------------
	always inherits from existing 
	table classes
---------------------------------*/
table.striped
{}

	table.striped td
	{
		background-color: #fff;
	}

	table.striped tr.alt td
	{
		background-color: #f1f1f1;
	}

/*---------------------------------
	ROW HIGHLIGHTING
---------------------------------*/
table.base tr.highlight td,
table.striped tr.highlight td,
table.striped tr.alt.highlight td
{
	background-color: #fffcd3;
}

/*======================================================================
	TABS
	--------------------------------------------------------------------
	jQuery UI
----------------------------------------------------------------------*/
.ui-tabs-nav
{
	position: relative;
	bottom: -1px;
	margin: 0 0 0 16px;
	list-style: none;
	zoom: 1;
}
* html .ui-tabs-nav { height: 1%; }

	.ui-tabs-nav li
	{
		margin: 0;
		padding-left: 5px;
		float: left;
	}
	
		.ui-tabs-nav li a
		{
			display: block;
			padding: 10px 16px 5px 11px;
			font-size: 1.083em;
			color: #373737;
			outline: none;
		}
			
			.ui-tabs-nav li a:hover
			{
				color: #2e5f97;
			}
	
	.ui-tabs-nav li.ui-tabs-selected
	{
		background: transparent url(../../images/layout/sprite_tabs-sliders.png) -664px -328px no-repeat;
	}
	
		.ui-tabs-nav li.ui-tabs-selected a
		{
			font-weight: bold;
			color: #2e5f97;
			background: transparent url(../../images/layout/sprite_tabs-sliders.png) right -328px no-repeat;
		}
		
			.ui-tabs-nav li.ui-tabs-selected a:hover
			{
				text-decoration: none;
			}

.ui-tabs-panel
{
	padding: 20px 30px;
	clear: both;
	background: #fff url(../../images/layout/bg_tab-panel-gradient-fade.jpg) left bottom repeat-x;
	border: 1px solid #b7b7b7;
	zoom: 1;
}
* html .ui-tabs-panel { height: 1%; background: none; }

.js .ui-tabs-hide
{
	display: none;
}

/*======================================================================
	MODAL DIALOGS
	--------------------------------------------------------------------
	jQuery UI
----------------------------------------------------------------------*/
.ui-dialog
{
	width: 600px;
	background-color: #fff;
	border: 5px solid #dde8ef;
}

	.ui-dialog-titlebar
	{
		background-color: #dde8ef;
	}
	
		.ui-dialog-titlebar .ui-dialog-title
		{
			display: none;
		}
	
		.ui-dialog-titlebar a.ui-dialog-titlebar-close
		{
			display: block;
			padding: 0 2px 5px;
			font-size: 0.8em;
			text-align: right;
			text-transform: uppercase;
			text-decoration: underline;
			color: #373737;
		}
		
			.ui-dialog-titlebar a:hover.ui-dialog-titlebar-close
			{
				color: #000;
				text-decoration: none;
			}
		
	.ui-dialog-content
	{
		padding: 5px;
	}
		
		.ui-dialog-content img
		{
			display: block; 
			margin: 4px auto 0;
		}


/*======================================================================
	CAROUSEL WIDGET
	--------------------------------------------------------------------
	jCarousel Lite
----------------------------------------------------------------------*/
.widget-carousel
{
	position: relative;
}

/*---------------------------------
	CONTROLS
---------------------------------*/
.widget-carousel .carousel-controls a
{
	display: block;
	position: absolute;
	top: 0;
	width: 20px; 
	height: 135px;
	font-size: 1px;
	text-indent: -9999px;
	background: transparent url(../../images/layout/sprite_tabs-sliders.png) 0 -328px no-repeat;
	outline: none;
	z-index: 1001;
}

	.widget-carousel .carousel-controls a.prev
	{
		left: 0;
	}
	
		.widget-carousel .carousel-controls a:hover.prev
		{
			background-position: -40px -328px;
		}

	.widget-carousel .carousel-controls a.next
	{
		right: 0;
		background-position: -120px -328px;
	}
	
		.widget-carousel .carousel-controls a:hover.next
		{
			background-position: -160px -328px;
		}

/*---------------------------------
	CONTENT
---------------------------------*/	
.widget-carousel .carousel-content
{
	margin: 0 19px;
	width: 211px;
	height: 133px;
	list-style: none;
	border: 1px solid #cacaca;
}

	.widget-carousel .carousel-content ul
	{
		margin: 0;
		list-style: none;
	}

		.widget-carousel .carousel-content ul li
		{
			margin: 0;
			width: 211px;
			height: 133px;
		}

/*======================================================================
	CLEARFIX
----------------------------------------------------------------------*/
.clearfix:after
{
	content: ".";
	display: block;
	height: 0.1px;
	clear: both;
	font-size: 0;
	visibility: hidden;
}
.clearfix
{
	display: inline-table;
}
html>body .clearfix
{
	display: block;
}
/* \*/
* html .clearfix
{
	height: 1%;
}
.clearfix
{
	display: block;
	zoom: 1;
}
/* */

/*======================================================================
	WEBLINC DEVELOPER TOOLBAR
	--------------------------------------------------------------------
	this can be removed in live	client environments.
----------------------------------------------------------------------*/
.weblinc-developer-toolbar
{
	position: fixed;
	z-index: 9999;
	bottom: 0;
	left: 0;
	width: 48px;
	min-height: 25px;
	background: transparent url(../../../_default/images/developerbar/bg_dev-bar.png) bottom left no-repeat;
	color: #fff;
}
	
	.weblinc-developer-toolbar a.weblinc-developer-toolbar-anchor
	{
		display: block;
		position: absolute; 
		bottom: 0;
		left: 0;
		width: 25px;
		height: 25px;
		font-size: 1px;
		text-indent: -9999px;
		background: transparent url(../../../_default/images/developerbar/dev-bar-open-close.png) 0 -2px no-repeat;
		outline: none;
	}
		
		.weblinc-developer-toolbar a:hover.weblinc-developer-toolbar-anchor
		{
			background-position: -36px -2px;
		}
		
		.weblinc-developer-toolbar.open a.weblinc-developer-toolbar-anchor
		{
			background-color: transparent;
			background-position: 0 -26px;
		}
		
		.weblinc-developer-toolbar.open a:hover.weblinc-developer-toolbar-anchor
		{
			background-color: transparent;
			background-position: -36px -26px;
		}

	.weblinc-developer-toolbar.open
	{
		width: 100%;
		background-color: #666;
		border-top: 5px solid #f10303;
	}
		.weblinc-developer-toolbar .weblinc-developer-toolbar-content
		{
			display: none;
			padding: 0.5em;
			padding-left: 60px;
		}
		.weblinc-developer-toolbar.open .weblinc-developer-toolbar-content
		{
			display: block;
		}
			.weblinc-developer-toolbar-group
			{
				float: left;
				margin-top: 0.5em;
				margin-right: 0.5em;
				border: 1px solid #fff;
				padding: 0.25em;
			}
			.weblinc-developer-toolbar-group-right
			{
				float: right;
				margin-left: 0.5em;
				margin-right: 0;
			}
				.weblinc-developer-toolbar-group-label
				{
					float: left;
					position: relative;
					margin-top: -1em;
					padding: 0 0.5em;
					background-color: #666;
					font-size: 0.9em;
				}
			.weblinc-developer-toolbar-group-content
			{
				clear: both;
				padding: 0.25em;
				padding-right: 0;
			}
				.weblinc-developer-toolbar-group-item
				{
					float: left;
					margin-right: 0.25em;
				}
				.weblinc-developer-toolbar-group-content .weblinc-developer-toolbar-linkbutton
				{
					display: block;
					padding: 0.25em 0.5em;
					background-color: #f10303;
					border: 1px solid #a00303;
					border-left-color: #ff0303;
					border-top-color: #ff0303;
					color: #fff;
					text-decoration: none;
					font-weight: bold;
				}