﻿/*======================================================================
	SKELETON: Base
	--------------------------------------------------------------------
	GRID: 	12 column / 960px;
	COLUMN:	60px
	
	COLOR PALLETE:
		#000: Black
		#333: Dark
		#666: Medium
		#999: Light
	
		#ff9933: Accent

	Z-INDEX RANGES:
		1000: Layer Order Override
		2000: Content
		3000: Modal/Zoom
		4000: Secondary Navigation
		5000: Primary Navigation
		6000: Modal / Dialog / Overlay
	
----------------------------------------------------------------------*/

* { margin: 0; padding: 0; }

/*======================================================================
	HEADINGS
----------------------------------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6
{
	margin: 0 0 1em;
	font-size: 1em;
	font-weight: bold;
	font-style: normal;
}

h1 {
	margin: 0 0 0.5em;
	letter-spacing: -0.03em;
	color: #999;
}

h2 {
	margin: 0 0 0.8em;
	color: #363636;
	font-size: 1.667em;
}
    h2 .servicemark {
        font-size: 0.4em; 
        font-weight: normal;
        *vertical-align: top;
    }

h3 {
	margin: 0 0 1em;
	font-size: 1em;
	font-weight: bold;
	color: #555555;
}
h4 {
	margin: 0 0 1em;
	font-size: 1.167em;
	font-weight: bold;
}

/*======================================================================
	LINKS
----------------------------------------------------------------------*/
a
{
	overflow: hidden;
	text-decoration: none;
	color: #007dc3;
}

a:hover
{
	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-company,
	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;
}

span.highlight-wrapper 
{}

	span.highlight
	{
		background-color: #f00;
		color: #fff;
	}
	
/*======================================================================
	MISC STYLES
----------------------------------------------------------------------*/	
.wl-visuallyhidden {
	position: absolute;
	left: -9999px;
	top: -9999px;	
}
    
/*======================================================================
	FORMS
----------------------------------------------------------------------*/
/*---------------------------------
	GENERAL ELEMENTS
---------------------------------*/
label
input,
select,
textarea
{
	font-family: inherit;
	font-size: 1em;
}

label,
input
{
	vertical-align: middle;
}

select,
textarea
{
	vertical-align: top;
}

input.input-text,
input.input-password,
textarea
{
	padding: 4px;
	font-size: 0.917em;
	border: 1px solid #d6d6d6;
}	
	
	/*include JS-applied classes for IE, which doesn't support these pseudo-selectos */
	input.focused,
	input.input-text:focus,
	input.input-password:focus,
	textarea.focused,
	textarea:focus
	{
		background-color: #fafafa;
	}

/* TODO: Convert these to classes instead of pseudo-selectors for IE */
input[type="radio"],
input.input-radio
{
	margin-right: 5px;
}

input[type="checkbox"],
input.input-checkbox
{
	margin-right: 3px;
	*margin-right: 0; /* IE has margins baked-in */
}

select option
{
	font-size: 1.1em;
	padding: 2px 2px 2px 4px;
}

/*---------------------------------
	VALIDATION ERRORS
---------------------------------*/
.validation-errors
{
    margin-bottom: 1em;
    padding: .75em .85em 0;
	font-weight: bold;
	color: #000;
    border: 1px solid #d6d6d6;
    background: url(../images/layout/bg_alert.jpg) repeat-x #fffdfd;
}

	.validation-errors ul
	{
		margin: 1em 0 .75em 2em;
		list-style: disc;	
	}
	
		.validation-errors ul li
		{
			margin: 0.3em 0;
			font-weight: normal;
			color: #4a4a4a;	
		}
		
/*---------------------------------
    wl-alert
---------------------------------*/
.wl-alert {
    margin-bottom: 1em;
    padding: .75em .85em 0;
    border: 1px solid #d6d6d6;
    background: url(../images/layout/bg_alert.jpg) repeat-x #fffdfd;
}
    .wl-alert ul {
    	margin: 1em 0 .75em 2em;
    	list-style: disc;	
    }
        .wl-alert ul li {
    		margin: 0.3em 0;
    		font-weight: normal;
    		color: #4a4a4a;	
    	}
	
    .wl-alert p {
        margin-bottom: .75em;
        font-weight: bold;
        font-size: 1.167em;
    }

/*---------------------------------
	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
		{
			float: left;
			clear: both;
		}
		
			li.pairing-horizontal label.primary
			{
				margin-right: 5px;
				float: left;
			}

			li.pairing-horizontal .pairing-content
			{
				float: left;	
			}

				li.pairing-horizontal .pairing-content select option
				{
					padding: 0 2px 0 4px;
					font-size: 1.1em;
				}

/*---------------------------------
	ACTION LISTS
---------------------------------*/
div.actionlist
{
	padding-top: 1em;
}

	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: 4px;
			}

div.actionlist-independent
{
	border-top: none;
}

/*---------------------------------
	ADVANCED SELECTORS
---------------------------------*/
ul.advanced-selector
{
	margin: 0;
	list-style: none;	
}

	ul.advanced-selector li
	{
		_display: inline;
		margin: 0 20px 0 0;
		padding-bottom: 14px;
		float: left;
	}
	/* is this needed? */
	* html ul.advanced-selector li { width: 1%; }
		/* remove this logic from back-end code */
		ul.advanced-selector li.mod-3
		{
			/*clear: left;*/	
		}
	
		ul.advanced-selector li dl.item
		{
			margin-bottom: 0;
			padding: 6px;
			width: 166px;
			min-height: 100px;
			_height: 100px;
			color: #666;
			border: 1px solid #666;
		}
		
			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: #f1f1f1;	
		}
		
			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: #f1f1f1;
			border: 3px solid #333;
		}
		
		/*-- 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)
----------------------------------------------------------------------*/
.order-data
{}

	/*---------------------------------
		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 ol.shipmentlist
		{
			margin: 0;
			list-style: none;	
		}
	
			.order-data ol.shipmentlist li.shipment
			{
				margin: 0;	
				background: none;
			}

	/*---------------------------------
		SINGLE SHIPMENTS
	---------------------------------*/
	.order-data .shipments-single h2,
	.order-data .shipments-single h3
	{
		display: none;
	}
	
	.order-data .shipments-single .info
	{
		margin-bottom: 2em;	
	}

		.order-data .shipments-single .info h4 span
		{
			font-size: 0.765em;
			font-weight: normal;
			color: #999;
		}

		.order-data .shipments-single .info .address,
		.order-data .shipments-single .info .method,
		.order-data .shipments-single .info .meta
		{
			padding: 0 20px 1em;
			width: 266px;
			min-height: 140px;
			_height: 140px;
			float: left;
			border-left: 1px solid #ccc;
		}
	
		.order-data .shipments-single .info .address
		{
			border: none;	
		}	
	
	/*---------------------------------
		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: normal 50px/40px "Courier New", Helvetica, Verdana, Arial, Sans-serif;
					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 #ccc;	
	}

		.order-data .tenders table.base
		{
			margin-bottom: 2px;	
		}

	/*---------------------------------
		ORDER TOTALS
	/--------------------------------*/
	.order-data .totals
	{
		margin-bottom: 1em;	
	}

		.order-data .totals h2
		{
			margin: 0;
			padding: 0 0 0.5em 0;
			width: 300px;
			float: right;
			text-align: right;
			border-bottom: 1px dotted #999;
		}

		.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
----------------------------------------------------------------------*/
/*---------------------------------
	wl-button
---------------------------------*/
.wl-button {
    padding: 5px 7px;
    float: left;
    -moz-border-radius: 3px; /* Firefox */
    -webkit-border-radius: 3px; /* Safari, Chrome */
    border-radius: 3px; /* CSS3 */
    color: #fff;
    background-color: #007dc3;
    line-height: 1;                                    
}
	.wl-button * { display: block; text-decoration: none; }
	.wl-button:hover,
	.wl-button:focus {  text-decoration: none; }
	
	.wl-button:visited,
	.wl-button:hover,
	.wl-button:focus,
	.wl-button:active 
	{
		color: #fff;
		text-decoration: none;
	}

	.wl-button span { padding: 0; }
	.wl-button span span { padding: 0; }
    
/*---------------------------------
	SMALL BUTTON
---------------------------------*/
.button.small
{}

	.button.small span { padding: 1px 8px 1px 10px; }
	.button.small span span { padding: 0; }

/*---------------------------------
	DESTRUCTIVE BUTTON
---------------------------------*/
.button.destructive
{
	background-color: #f33;
}

/*======================================================================
	TABLES
----------------------------------------------------------------------*/
/*---------------------------------
	BASE TABLE
---------------------------------*/
table.base
{
	margin-bottom: 1.2em;
	width: 100%;
	font-size: 0.917em;
	border-spacing: 0;
	*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: #666;
		}
	
	table.base td
	{
		padding: 1.1em 10px;
		text-align: left;
		vertical-align: top;
		border-bottom: 1px solid #dadada;
	}
	
		table.base th.numeric,
		table.base td.numeric
		{
			text-align: right;
		}
		
	/*-- ACTIONS IN TABLES --*/
	table.base div.actionlist
	{
		padding: 0;
		border: none;
	}

		table.base ul.actions li.action
		{
			margin-top: 0;
		}

		table.base ul.actions li.action-secondary
		{
			padding-top: 0;
		}

	/*-- ACTIONS DIRECTLY AFTER TABLES --*/
	div.actionlist-aftertable
	{
		border-top: none;
	}

/*---------------------------------
	LINE ITEM TABLE
	cart, order review, 
	confirmation & history
	-------------------------------
	always inherits from table.base
---------------------------------*/
table.lineitems
{
	margin-bottom: 0;
}

	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 th.column-quantity,
	table.lineitems td.column-quantity
	{
		text-align: center;
	}

/*---------------------------------
	GRID TABLE
---------------------------------*/
table.grid
{
	margin: 1.2em 0;
	width: 100%;
	background-color: #fff;
	border-spacing: 0;
	*border-collapse: collapse;
	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;
	}

/*======================================================================
	CLEARFIX
----------------------------------------------------------------------*/
.wl-cf { display: block; *zoom: 1; }
.wl-cf:after { content: "."; display: block; height: 0.1px; clear: both; font-size: 0; visibility: hidden; }

/*======================================================================
	WEBLINC DEVELOPER TOOLBAR
	--------------------------------------------------------------------
	this can be removed in live	client environments.
----------------------------------------------------------------------*/
.weblinc-developer-toolbar
{
	position: fixed;
	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;
			}

/*======================================================================
	wl-callout
----------------------------------------------------------------------*/
.wl-callout {
    display: inline;
    margin-left: 20px;
    padding: 1px;
    width: 250px;
    float: left;
    border: 1px solid #d6d6d6;
    background-color: #fff;
}
    .wl-callout .inner {
        position: relative;
        padding: 18px 10px;
        min-height: 181px;
        _height: 181px;
        background: url(../images/layout/bg_calloutbox.gif) repeat-x center top transparent;
    }
        .wl-callout .icon {
            position: absolute;
            background: url(../images/layout/sprite_global.png) no-repeat;
            _background: url(../images/layout/sprite_global-IE6.png) no-repeat;
        }
        .wl-callout .label {
            position: absolute;
            top: 4px;
        }
        .wl-callout h2 {
            margin-bottom: 10px;
            color: #007dc3;
        }
        .wl-callout h3 {
            margin-bottom: 10px;
        }
        .wl-callout ul {
            margin: 0 0 0 15px;
        }
            .wl-callout ul li {
                margin: 0 0 3px;
            }
        .wl-callout p {}

/*---------------------------------
	wl-callout--finishing
---------------------------------*/
.wl-callout--finishing {}
    .wl-callout--finishing .inner {}
        .wl-callout--finishing .icon {
            right: 6px;
            top: -20px;
            height: 74px;
            width: 67px;
            background-position: -60px -20px;
        }

/*---------------------------------
	wl-callout--online
---------------------------------*/
.wl-callout--online {}
    .wl-callout--online .inner {}
        .wl-callout--online h2 {
            margin-bottom: 5px;
        }
        .wl-callout--online .icon {
            right: 10px;
            top: -15px;
            height: 82px;
            width: 75px;
            background-position: -140px -20px;
        }
        .wl-callout--online p {
            margin: 0 0 0 15px;
        }
/*---------------------------------
	wl-callout--parts
---------------------------------*/
.wl-callout--parts {}
    .wl-callout--parts .inner {}
        .wl-callout--parts h2 {}
        .wl-callout--parts .icon {
            right: -9px;
            top: -3px;
            height: 54px;
            width: 53px;
            background-position: 0 -20px;
        }
        .wl-callout--parts p {
            margin-bottom: 0;
        }

/*---------------------------------
	wl-callout--range
---------------------------------*/
.wl-callout--range {}
    .wl-callout--range .inner {}
        .wl-callout--range h2 {}
        .wl-callout--range ul {
            padding: 10px 0 0;
            margin: 0;
        }
            .wl-callout--range ul li {
                position: relative;
                margin-bottom: 10px;
                padding-left: 18px;
                width: 176px;
                float: left;
                list-style-type: none;
            }
            .wl-callout--range .icon {
                left: 0;
                top: 3px;
                height: 10px;
                width: 7px;
                background-position: -20px 0;
            }

/*---------------------------------
	wl-callout--alt
---------------------------------*/
.wl-callout--alt {
    width: 408px;
}
    .wl-callout--alt .inner {
        background-image: url(../images/layout/bg_calloutbox-alt.gif);
        background-color: #f9f9f9;
    }
    
/*======================================================================
	wl-carousel
----------------------------------------------------------------------*/
.wl-carousel {}
    .wl-carousel .mask {
        width: 100%;
        overflow: hidden;
    }
        .wl-carousel .mask ul {
            margin: 0;
            width: 99999px;
        }
            .wl-carousel .mask ul li {
                margin: 0;
                float: left;
                list-style-type: none;
            }
    .wl-carousel .controls {}
        .wl-carousel .controls .play {
            height: 15px;
            width: 13px;
            float: left;
            background: url(../images/layout/sprite_global.png) no-repeat -90px 0 transparent;
            _background: url(../images/layout/sprite_global-IE6.png) no-repeat -90px 0 transparent;
            text-indent: -9999em;
        }
        .wl-carousel .controls .pause {
            background-position: -69px 0;
        }
        .wl-carousel .controls .pagination {
            margin: 0;
            float: left;
        }
            .wl-carousel .controls .pagination li {
                float: left;
                list-style-type: none;
            }
            .wl-carousel .controls .pagination li {
                margin-right: 3px;
                float: left;
            }
                .wl-carousel .controls .pagination li a {
                    height: 16px;
                    width: 11px;
                    background: url(../images/layout/sprite_global.png) no-repeat -50px 0 transparent;
                    _background: url(../images/layout/sprite_global-IE6.png) no-repeat -50px 0 transparent;
                    float: left;
                }
                .wl-carousel .controls .pagination li.selected a {
                    background-position: -35px 0;
                }
                .wl-carousel .controls .pagination li a:hover,
                .wl-carousel .controls .pagination li a:active,
                .wl-carousel .controls .pagination li a:focus {
	                text-decoration: none;
                }
                
/*======================================================================
	cb-body
----------------------------------------------------------------------*/
.cb-body {
    margin-bottom: 20px;
    padding: 2px;
    border: 1px solid #d6d6d6;
    background: url(../images/layout/bg_contentbody.jpg) no-repeat 2px 2px #ffffff;
}

/*======================================================================
	wl-body
----------------------------------------------------------------------*/
.wl-body {
    padding: 45px 20px 45px 240px;
}
    .wl-body h3 {
        margin-bottom: .25em;
    }
    .wl-body .quality-management {
        padding: 20px 0;
    }
        .wl-body .quality-management img {
            margin-right: 3px;
            float: left;
        }
    .wl-body ul {
        margin-left: 20px;
    }
        .wl-body li {
            margin: 0;
        }
.wl-body--2col {}
    .wl-body .col {
        float: left;
    }
    .wl-body .col-1 {
        margin-right: 20px;
        width: 498px;
    }
    .wl-body .col-2 {
        width: 175px;
    }
        .wl-body .col-2 .image {
            margin-bottom: 20px;
            width: 170px;
            border: 1px solid #d6d6d6;
            background: #fff;
            padding: 2px;
        }
            .wl-body .col-2 .image img {
                float: left;
            }
/*---------------------------------
    wl-body--contact-us
---------------------------------*/
.wl-body--contact-us {
    padding: 40px 20px 20px;
    color: #000000;
}   
    .wl-body--contact-us .contact-methods {
        margin-bottom: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid #d6d6d6;
    }
        .wl-body--contact-us .contact-method {
            margin-right: 20px;
            width: 208px;
            float: left;
        }
            .wl-body--contact-us .contact-method h3 {
                margin-bottom: 10px;
                padding-left: 21px;
                font-size: 1.333em;
                color: #000000;
                background: url(../images/layout/sprite_contact.png) no-repeat 0 2px;
            }
            .wl-body--contact-us .contact-method dl {
                margin-top: 0;
            }
                .wl-body--contact-us .contact-method dd {
                    margin: 0;
                }
                .wl-body--contact-us .contact-method .note,
                .wl-body--contact-us .contact-method .hours,
                .wl-body--contact-us .contact-method .address {
                    font-size: 0.917em;
                }
        .wl-body--contact-us .email {
            width: 255px;
        }
            .wl-body--contact-us .email a {
                font-weight: bold;
            }
        .wl-body--contact-us .phone {
            width: 223px;
        }
            .wl-body--contact-us .phone h3 {
                background-position: 0 -52px;
            }
        .wl-body--contact-us .mail {
            width: 239px;
        }
            .wl-body--contact-us .mail h3 {
                background-position: 0 -34px;
            }
        .wl-body--contact-us .fax {
            margin: 0;
            width: 110px;
        }
            .wl-body--contact-us .fax h3 {
                background-position: 0 -15px;
            }
    .wl-body--contact-us p {
        margin: 0;
    }
    .wl-body--contact-us .optional {
        position: absolute;
        left: -9999em;
    }
    .wl-body--contact-us .pairinglist {
        margin-bottom: 10px;
    }
    .wl-body--contact-us .pairinglist--saved-addresses {
        display: none;
    }
        .wl-body--contact-us .pairings {}
    .wl-body--contact-us .pairinglist--inquiry {
        margin-bottom: 0;
    }
        .wl-body--contact-us .pairinglist--inquiry .pairings {}
            .wl-body--contact-us .pairinglist--inquiry .pairing {
                margin-bottom: 10px
            }
/*---------------------------------
	wl-body--commitment
---------------------------------*/
.wl-body--commitment {
    background: url(../images/layout/bg_body-commitment.jpg) no-repeat left top transparent;
}
    .wl-body--commitment ul {}
        .wl-body--commitment li {
            font-size: 1.167em;
            font-weight: bold;
        }

/*---------------------------------
	wl-body--about
---------------------------------*/        
.wl-body--about {
    background: url(../images/layout/bg_body-about.jpg) no-repeat left top transparent;
}

/*---------------------------------
	wl-body--services
---------------------------------*/        
.wl-body--services {
    background: url(../images/layout/bg_body-services.jpg) no-repeat left top transparent;
}
    .wl-body--services h3 {
        margin-bottom: 7px;
    }
    .wl-body--services h4 {
        margin-bottom: 8px;
    }
    .wl-body--services ul {
        margin: 0;
        width: 165px;
        float: left;
        list-style: none;
    }
        .wl-body--services li {
            margin-bottom: 8px;
        }
/*---------------------------------
	wl-body--finishing
---------------------------------*/
.wl-body--finishing {
    background: url(../images/layout/bg_body-finishing.jpg) no-repeat left top transparent;
}

/*---------------------------------
	wl-body--parts
---------------------------------*/        
.wl-body--parts {
    background: url(../images/layout/bg_body-parts.jpg) no-repeat left top transparent;
}
    .wl-body--parts ul {
        margin: 0 0 1em 1.667em;
    }
        .wl-body--parts li {
            width: 235px;
            float: left;
            list-style-type: disc;
        }
    .wl-body--parts .charges {
        margin-bottom: 1em;
        clear: left;
        font-size: 1.167em;
    }
        .wl-body--parts dl {
            margin: 0 0 5px 7px;

        }
            .wl-body--parts dt {
                margin: 0 5px 0 0;
                float: left;
            }
            .wl-body--parts dd {
                margin: 0;
                float: left;
            }
        .wl-body--parts .charges p {
            margin: 0 0 5px 7px;
            line-height: 1.2;
        }
/*---------------------------------
	wl-body--inquiry
---------------------------------*/
.wl-body--inquiry {
    padding: 45px 20px;
}
    .wl-body--inquiry h3 {
        font-size: 1.333em;
    }
    .wl-body--inquiry ul {
        margin-left: 0;
    }

/*---------------------------------
	wl-body--technology
---------------------------------*/
.wl-body--technology {
    background: url(../images/layout/bg_body-technology.jpg) no-repeat left top transparent;
}
    .wl-body--technology h2 {
        margin-bottom: 65px;
        text-align: center;
    }
    .wl-body--technology .wl-carousel {
        position: relative;        
    }
        .wl-body--technology .wl-carousel .mask {
            position: relative; /*IE6/7 overflow bug*/
            width: 694px;
            overflow: hidden;
        }
            .wl-body--technology .wl-carousel .mask ul {}
                .wl-body--technology .wl-carousel ul li.step {
                    width: 694px;
                }
                    .wl-body--technology .wl-carousel .info {
                        margin-right: 0;
                        width: 203px;
                        float: left;
                    }
                        .wl-body--technology .wl-carousel h3 {
                            padding-top: 20px;
                            margin-bottom: 36px;
                            font-size: 1.25em;
                            text-transform: uppercase;
                            color: #007dc3;
                        }
                        .wl-body--technology .wl-carousel .info ol {
                            margin: 0;
                        }
                            .wl-body--technology .wl-carousel .info ol li {
                                position: relative;
                                margin: 0 0 20px 0;
                                padding-bottom: 20px;
                                padding-left: 15px;
                                width: 188px;
                                float: left;
                                clear: left;
                                color: #007dc3;
                                font-weight: bold;
                                line-height: 1;
                                border-bottom: 1px dashed #d6d6d6;
                                *zoom: 1;
                            }
                            .wl-body--technology .wl-carousel .info ol li.last {
                                margin-bottom: 0;
                                padding-bottom: 0;
                                border: none;
                            }
                                .wl-body--technology .wl-carousel .info ol li .feature-alpha {
                                    position: absolute;
                                    left: 0;
                                    top: 0;
                                    font-weight: bold;
                                    overflow: hidden;
                                }
                                .wl-body--technology .wl-carousel .info ol li h4 {
                                    margin: 0;
                                    font-size: 1em;
                                }
                                .wl-body--technology .wl-carousel .info ol li .step-desc {
                                    margin: 0 10px 0 0;
                                    width: 100px;
                                    font-size: 1em;
                                    float: left;
                                    line-height: 1;
                                }
                                .wl-body--technology .wl-carousel .step-quote .info ol li.last .feature-alpha,
                                .wl-body--technology .wl-carousel .step-quote .info ol li.last .step-desc {
                                    padding-top: 20px;
                                }
                                .wl-body--technology .wl-carousel .step-quote .info ol li .step-desc {
                                    margin: 0 2px 0 0;
                                    width: 115px;
                                }
                                    .wl-body--technology .wl-carousel .info ol li .step-desc p {
                                        line-height: 1.2;
                                    }
                                    .wl-body--technology .wl-carousel .info ol li .step-desc p.note {
                                        font-weight: normal;
                                        font-style: italic;
                                    }
                                .wl-body--technology .wl-carousel .info ol li .icon {
                                    float: left;
                                    background: url(../images/layout/sprite_global.png);
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-compass {
                                    margin-left: 5px;
                                    width: 62px;
                                    height: 62px;
                                    background-position: -220px -20px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-calendar {
                                    width: 73px;
                                    height: 52px;
                                    background-position: -310px -20px; 
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-folder {
                                    margin-left: 9px;
                                    width: 55px;
                                    height: 55px;
                                    background-position: -220px -110px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-gear {
                                    width: 64px;
                                    height: 64px;
                                    background-position: -310px -110px;
                                } 
                                .wl-body--technology .wl-carousel .info ol li .icon-crate {
                                    width: 71px;
                                    height: 62px;
                                    background-position: -310px -180px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-laptop {
                                    margin-top: 8px;
                                    width: 77px;
                                    height: 47px;
                                    background-position: -310px -250px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-map {
                                    
                                    margin-left: 3px;
                                    width: 70px;
                                    height: 45px;
                                    background-position: -220px -180px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-stamp {
                                    margin-left: 12px;
                                    width: 50px;
                                    height: 67px;
                                    background-position: -220px -250px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-postit {
                                    margin-top: 5px;
                                    margin-left: 10px;
                                    width: 65px;
                                    height: 57px;
                                    background-position: -138px -110px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-people {
                                    margin-top: 6px;
                                    margin-left: 15px;
                                    width: 60px;
                                    height: 54px;
                                    background-position: -138px -180px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-glass {
                                    margin-left: 10px;
                                    width: 60px;
                                    height: 60px;
                                    background-position: -138px -250px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-cabinet {
                                    width: 75px;
                                    height: 69px;
                                    background-position: -310px -320px; 
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-pencil {
                                    width: 68px;
                                    height: 56px;
                                    background-position: -138px -320px;
                                }
                                .wl-body--technology .wl-carousel .info ol li .icon-hourglass {
                                    width: 77px;
                                    height: 70px;
                                    background-position: -220px -320px;
                                }
                    .wl-body--technology .wl-carousel .image {
                        padding: 0;
                        width: 490px;
                        float: left;
                        background-color: #fff;
                    }
                .wl-body--technology .wl-carousel li.step-orders {}
                    .wl-body--technology .wl-carousel li.step-orders .info {
                        width: 337px;
                    }
                        .wl-body--technology .wl-carousel li.step-orders .info h3 {
                            margin-bottom: 10px;
                        }

                        .wl-body--technology .wl-carousel li.step-orders .info ol li {
                            width: 322px;
                            margin-bottom: 10px;
                            padding-bottom: 10px;
                        }
                        .wl-body--technology .wl-carousel li.step-orders .info ol li.last { 
                            width: 337px;
                            padding-left: 0;
                        }
                            .wl-body--technology .wl-carousel li.step-orders .info ol li .feature-alpha {
                                height: 57px;
                                line-height: 57px;
                            }
                            .wl-body--technology .wl-carousel li.step-orders .info ol li .step-desc {
                                width: 230px;
                            }
                            .wl-body--technology .wl-carousel li.step-orders .info ol li.last .step-desc {
                                width: 245px;
                            }
                                .wl-body--technology .wl-carousel li.step-orders .info ol li .step-desc p {
                                    margin: 0;
                                    height: 57px;
                                    line-height: 57px;
                                }
                                .wl-body--technology .wl-carousel li.step-orders .info ol li .icon-map {
                                    margin-top: px;
                                }
                    .wl-body--technology .wl-carousel li.step-orders .image {
                        padding-top: 10px;
                        width: 311px;
                    }
                .wl-body--technology .wl-carousel li.step-liveorder {}
                    .wl-body--technology .wl-carousel li.step-liveorder .info {}
                    .wl-body--technology .wl-carousel li.step-liveorder .image {
                        padding-left: 5px;
                        width: 485px;
                    }
                .wl-body--technology .wl-carousel li.step-miscellaneous {}
                    .wl-body--technology .wl-carousel  li.step-miscellaneous .col {
                        display: inline;
                        float: left;
                        text-align: center;
                        color: #007dc3;
                    }
                        .wl-body--technology .wl-carousel li.step-miscellaneous .col h3 {
                            margin-bottom: 25px;
                        }
                        .wl-body--technology .wl-carousel li.step-miscellaneous .col .info {
                            padding: 30px 15px 15px;
                            width: 181px;
                            height: 339px;
                            background: url(../images/layout/Technology-col-bg.jpg) no-repeat left top transparent;
                        }
                            .wl-body--technology .wl-carousel li.step-miscellaneous .col .info p {
                                margin-bottom: 0;
                                font-weight: bold;
                            }
                            .wl-body--technology .wl-carousel li.step-miscellaneous .col .info ul {
                                margin: 0 auto;
                                width: 145px;
                            }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col .info li {
                                    display: list-item;
                                    margin: 0 0 0 25px;
                                    width: 120px;
                                    float: none;
                                    clear: none;
                                    list-style-type: disc;
                                    text-align: left;
                                }
                    .wl-body--technology .wl-carousel li.step-miscellaneous .col-quicksearch {
                        margin-right: 15px;
                        margin-left: 125px;
                    }
                        .wl-body--technology .wl-carousel li.step-miscellaneous .col-quicksearch .info {}
                            .wl-body--technology .wl-carousel li.step-miscellaneous .col-quicksearch .info p {
                                margin-bottom: 5px;
                                width: auto;
                            }
                            .wl-body--technology .wl-carousel li.step-miscellaneous .col-quicksearch .info p.image {
                                margin: 0 auto 10px;
                                width: 172px;
                                float: none;
                            }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-quicksearch .info p.image img {
                                    display: block;
                                }
                            .wl-body--technology .wl-carousel li.step-miscellaneous .col-quicksearch ul {}
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-quicksearch .info li {
                                    margin-bottom: 5px;
                                }
                    .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile {}
                        .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile .info {
                            padding-top: 55px;
                            height: 314px;
                        }
                            .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile .info li {
                                width: 100%;
                                margin: 0 0 30px;
                                list-style-type: none;
                            }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile li span {
                                    float: left;
                                }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile .ico {
                                    width: 89px;
                                    height: 50px;
                                    background: url(../images/layout/sprite_global.png) -220px -400px;
                                }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile .price .ico {
                                    margin: 0 15px;
                                    width: 59px;
                                    height: 64px;
                                    background-position: -60px -180px;
                                }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile .afterhour .ico {
                                    margin: 0 16px;
                                    width: 57px;
                                    height: 61px;
                                    background-position: -60px -110px;
                                }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile .txt {
                                    width: 80px;
                                    float: left;
                                }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile .price .txt {
                                    padding-top: 26px;
                                }
                                .wl-body--technology .wl-carousel li.step-miscellaneous .col-profile .afterhour .txt {
                                    padding-top: 15px;
                                }
        .wl-body--technology .wl-carousel .controls {
            position: absolute;
            top: -85px;
            right: 0;
        }
            .wl-body--technology .wl-carousel .controls .play {
                margin: 0 12px 0 0;
            }
            .wl-body--technology .wl-carousel .controls .pagination {}
                .wl-body--technology .wl-carousel .controls .pagination li {
                    margin-right: 5px;
                }
                    .wl-body--technology .wl-carousel .controls li a {
                        background-position: -105px 0;
                    }
/*---------------------------------
	shared-content
---------------------------------*/        
.shared-content {
    margin-left: -20px;
    margin-bottom: 30px;
}
