/* STANDARD TEMPLATE */
/* Clique Pattern Stylesheet
----------------------------------------------------------------------------- */


/* CLIQUE ID TAB
----------------------------------------------------------------------------- */


	div#id {

	width: 172px;
	height: 28px;
	background-repeat: no-repeat;
	padding: 5px 0 0 8px;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 20;

	}

	body div#id h3 {

	float: left;
	display: block !important;
	text-indent: -5000px;
	width: 25px;
	height: 28px;
	margin: 0 8px 0 0;
	padding: 0;
	background: url('h3-id.png') no-repeat;

	}

	div#id h4 {

	width: 119px;
	height: 10px !important;
	background-repeat: no-repeat;
	margin: 0 0 3px 0 !important;
	padding: 0;
	float: left;
	clear: none;
	overflow: hidden;
	text-indent: -5000px;
	visibility: visible !important;
	background: url('h4-signedin-70.png') 0 0 no-repeat;

	}

	div#id ul {

	margin: 0;
	padding: 0;
	list-style-type: none;
	float: left;
	width: 130px;

	}

	div#id ul li {

	list-style-type: none;
	float: left;

	}

	div#id a {

	outline: 0;
	background-repeat: no-repeat;
	display: block;
	overflow: hidden;
	text-indent: -5000px;
	border: 0 !important;

	}

	div#id a.account {

	width: 59px;
	height: 12px;
	margin-right: 8px;
	background: url('a-account.png') no-repeat;

	}

	div#id a.signout {

	width: 51px;
	height: 12px;
	background: url('a-signout.png') no-repeat;

	}

	div#id a.signin {

	position: absolute;
	top: 0;
	left: 0;
	width: 180px;
	height: 33px;
	background: url('a-signin.png') no-repeat;

	}


/* CLIQUE PANEL BACKGROUND
----------------------------------------------------------------------------- */


	div#clique {

	background-repeat: no-repeat;
	float: left;
	padding: 24px 0 0 0;

	}
	
	
/* FORM ELEMENTS
----------------------------------------------------------------------------- */

	
	div#clique label {

	width: auto;
	margin: 0 0 10px 0;
	padding: 0;
	float: left;
	position: static;	

	}
	
	div#clique label em {

	width: 100%;
	margin: 0 0 3px 0;
	padding: 0;
	float: left;
	display: block;
	color: #fff;
	font: normal 11px/20px Trebuchet MS, Arial, sans-serif;	
	text-align: left;

	}
	
	div#clique fieldset label em {
	
	width: auto;
	max-width: 85%;
	
	}
	
	div#clique input[type=text],
	div#clique input[type=password] {

	height: 16px;
	color: #000 !important;
	background-color: #fff !important;	
	margin: 0;
	padding: 0 2px;
	float: left;
	font: normal 12px/14px Trebuchet MS, Arial, sans-serif;
	border: 2px solid #fff;

	-webkit-border-radius: 0;
	-moz-border-radius: 0;

	}
	
	div#clique label select {
	
	float: left;
	margin: 0 7px 0 0;
	font: normal 12px/14px Trebuchet MS, Arial, sans-serif;

	}
	
	div#clique fieldset input {
	
	margin-top: 0;
	
	}
	
	div#clique label small {
	
	padding: 0 10px 0 5px;
	
	}
	
	
/* Fieldsets */


	div#clique fieldset {
	
	clear: both;
	padding-left: 34%;
	width: 66%;
	border: none;
	
	}
	
	div#clique fieldset label {
	
	margin: 2px 0;
	
	}
	
	div#clique fieldset em {
	
	padding: 0;
	line-height: 14px;
	
	}
	
	div#clique fieldset em span {
	
	font-weight: bold;
	
	}
	
	div#clique fieldset small {
	
	padding: 0;
	
	}
	
	div#clique fieldset input {
	
	margin-left: 0;
	
	}
	
	
/* Actions */


	div#clique a.action {
	
	font: normal 12px/12px Arial, sans-serif;	
	padding: 5px 8px 5px 40px;
	white-space: nowrap;
	color: #fff;
	text-transform: uppercase;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;

	}
	
	
/* INLINE ALERTS
----------------------------------------------------------------------------- */


/* Inputs */

		
	div#clique label.error input,
	div#clique label.error select {
	
	color: #bf0000;
	
	}
	
	
/* Messages */


	div#clique label.error strong {
	
	clear: both;
	position: static;
	color: #bf0000;
	background: url('bg-error.png') left top no-repeat !important;
	margin: 0 0 0 34%;
	padding: 10px 2% 5px;
	max-width: 62%;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	
	}
	
	* html div#clique label.error strong {
	
	width: 62%;
	
	}
	
	div#clique #newaddress label.error strong {
	
	margin: 0;
	max-width: 300px;
	padding: 10px 10px 5px;
	
	}
	
	
/* Fieldsets */
	
	
	div#clique fieldset label.error {
	
	background: #ffbaba !important;
	padding: 5px 2%;
	width: 94%;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	
	}
	
	div#clique fieldset label.error em,
	div#clique fieldset.error a,
	div#clique fieldset label.error a {
	
	color: #000;
	
	}
	
	div#clique fieldset.error strong,
	div#clique fieldset label.error strong {
	
	margin: 0;
	padding: 0;
	
	}
	

/* CLIQUE SIGN IN & PASSWORD RESET PANEL
----------------------------------------------------------------------------- */


	div#signin {

	width: 230px;
	float: left;
	padding: 0 25px 25px 25px;
	background-position: left bottom;
	background-repeat: no-repeat;

	}

	div#signin div.password {

	display: none;

	}

	div#signin div.signin,
	div#signin div.password {

	width: 230px;
	float: left;
	position: relative;

	}

	div#signin h3 {

	width: 230px !important;
	height: 66px !important;
	background-repeat: no-repeat;
	margin: 0 0 25px 0!important;
	padding: 0 !important;
	display: block !important;
	overflow: hidden;	
	text-indent: -5000px;
	border: 0 !important;

	}
	
	div#signin div.signin h3 {
	
	background-image: url('h3-signin.png');
	
	}
	
	div#signin div.password h3 {

	background-image: url('h3-password.png');

	}
	
	div#signin .addresses h3 {

	background-image: url('h3-addressbook.png');

	}
	
	div#signin .stub h3 {
	
	background-image: url('h3-partialid.png');
	
	}

	div#signin p {

	width: 230px;
	margin: 0 !important;
	padding: 0 0 15px 0 !important;
	font: normal 11px/13px Trebuchet MS, Arial, sans-serif;	

	}

	div#signin ul.actions {

	width: 230px;
	height: 22px;
	padding: 0 0 25px 0 !important;

	}

	div#signin ul.actions li {

	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 10px 0 0 !important;

	}

	div#signin ul.actions a.help,
	div#signin ul.actions a.reset {

	display: none;

	}
	
	div#signin a.action {
	
	border: 0 !important;
	
	}
	
	div#signin label {

	width: 230px;

	}
	
	div#signin label small {
	
	float: left;
	width: 122px;
	text-align: right;
	padding: 0;
	line-height: 13px;
	position: static;

	}

	div#signin small a.action {

	background: none !important;
	float: none;
	padding: 0 !important;
	display: inline !important;
	font: bold 10px/13px "Trebuchet MS", Arial, sans-serif;
	text-transform: none;

	}


/* Buttons and Fields */


	div#signin input#account_email {

	width: 222px;

	}

	div#signin input#account_postal_code,
	div#signin input#account_password {

	width: 100px;

	}

	div.signin a.reset {

	top: 189px;

	}

	div.signin a.help {

	top: 203px;

	}


/* Alert Messages */


	div#signin div.widget-alert {

	width: 175px !important;
	height: auto;
	margin: 0 0 10px 0;
	padding: 10px 15px 10px 40px !important;
	clear: left !important;
	float: left !important;
	background-color: #fff !important;
	background-position: 5px 5px;
	background-repeat: no-repeat;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	position: static;

	}

	div#signin div.widget-alert h3 {

	width: auto !important;
	height: auto !important;
	padding: 0 !important;
	margin: 0 !important;
	font: bold 12px/14px Trebuchet MS, Arial, sans-serif !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-align: left !important;
	text-indent: 0 !important;
	border: 0 !important;
	background-image: none !important;

	}
	
	div#signin div.widget-alert.info h3 {
		
	color: #1681ac;
		
	}
	
	div#signin div.widget-alert.error h3 {
		
	color: #e86b33;
		
	}
	
	div#signin div.widget-alert.success h3 {
		
	color: #6ba144;
		
	}

	div#signin div.widget-alert p {

	width: auto;
 	padding: 10px 0 !important;
 	text-align: left;

	}

	div#signin div.widget-alert p a {

	text-decoration: underline;

	}

	div#signin div.widget-alert.info {

	background-image: url('h3-message-info.png');

	}

	div#signin div.widget-alert.error {

	background-image: url('h3-message-error.png');

	}
	
	div#signin div.widget-alert.success {

	background-image: url('h3-message-success.png');

	}


/* CLIQUE SITES PANEL
----------------------------------------------------------------------------- */


	div#sites {

	color: #fff;
	width: 485px;
	float: right;
	padding: 0 25px 25px 25px;
	clear: none !important;
	background-position: right bottom;
	background-repeat: no-repeat;

	}

	div#sites h3 {

	width: 100% !important;
	height: 61px;
	background-repeat: no-repeat;
	margin: 0 !important;
	padding: 0 0 25px 0 !important;
	display: block;
	text-indent: -5000px;
	border: 0 !important;
	visibility: visible !important;

	}

	div#sites h4 {

	width: 100%;
	height: 15px;
	background-repeat: no-repeat;
	margin: 0 !important;
	padding: 0 0 25px 0 !important;
	display: block;
	text-indent: -5000px;
	border: 0 !important;
	visibility: visible !important;

	}

	div#sites strong {

	padding-bottom: 10px;
	display: block;

	}

	div#sites strong a {

	font: normal 11px/14px "Trebuchet MS", Arial, sans-serif !important;
	text-transform: uppercase;

	}

	div#sites ul.sites li {

	width: 230px;
	margin-right: 25px;
	float: left;

	}
	
	div#sites ul.sites li.alt {
	
	margin-right: 0;
	
	}

	div#sites img {

	width: 230px;
	height: 170px;
	margin: 0 !important;

	}

	div#sites ul.actions {

	margin: 0 !important;
	padding: 0 !important;
	clear: left;
	float: none;

	}

	div#sites ul.actions li {

	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	padding: 10px 10px 0 0 !important;
	float: left;

	}

	div#sites a.action {

	font: normal 10px/10px Arial, sans-serif !important;
	color: #fff !important;
	padding: 2px 8px 2px 20px;
	text-transform: uppercase;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;

	}
	
	
/* CLIQUE SIGN UP PANEL
----------------------------------------------------------------------------- */


	div#signup,
	div#newaddress {

	color: #fff;
	width: 608px;
	float: right;
	padding: 0 25px 25px 25px;
	clear: none !important;
	background-position: right bottom;
	background-repeat: no-repeat;

	}
	
	div#signup h3,
	div#newaddress h3 {

	width: 100% !important;
	height: 61px;
	background-repeat: no-repeat;
	margin: 0 !important;
	padding: 0 0 7px 0 !important;
	display: block;
	text-indent: -5000px;
	border: 0 !important;
	visibility: visible !important;

	}
	
	div#signup h3 {

	background-image: url('h3-noid.png');

	}
	
	div#signup.stub h3 {
	
	background-image: url('h3-completeid.png');
	
	}
	
	div#newaddress h3 {

	background-image: url('h3-newaddress.png');

	}
	
	div#signup .group {
	
	clear: none;
	width: 48%;
	
	}
	
	div#signup div.location {
	
	margin-right: 4%;
	
	}
	
	div#signup div.intro,
	div#signup div.legal,
	div#signup div.privacy {
	
	width: 100%;
	
	}
	
	
/* Legal */	
	
	
	div#clique div.legal,
	div#clique div.privacy {
	
	font-size: 11px;
	line-height: 13px;
	margin-bottom: 0;
	
	}
	
	div#clique div.legal fieldset {
	
	padding-left: 0;
	margin-bottom: 20px;
	
	}
	
	div#clique div.legal > p,
	div#clique div.privacy > p {
	
	width: 400px;
	
	}
	
	div#clique div.legal a,
	div#clique div.privacy a {
	
	color: #fff;
	text-decoration: underline;
	
	}
	
	div#clique div.legal div,
	div#clique div.privacy div {
	
	width: auto;
	height: 250px;
	overflow: auto;
	padding: 20px;
	color: #333;
	background: #fff;
	display: none;
	font-size: 12px;
	line-height: 16px;
	overflow-x: hidden;
	position: relative;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;

	}
	
	div#clique div.legal div a,
	div#clique div.privacy div a {
	
	color: #333;
	
	}
	
	div#clique div.legal div h3,
	div#clique div.legal div h4,
	div#clique div.privacy div h3,
	div#clique div.privacy div h4 {
	
	color: #333 !important;

	}
	
	div#clique div.legal div div,
	div#clique div.privacy div div {
	
	display: block;
	height: auto;
	overflow: visible !important;
	padding: 0;
	background: none;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	
	}
	
	div#clique div.legal div h3,
	div#clique div.privacy div h3 {
	
	float: left;
	height: auto;
	padding: 0 !important;
	margin: 10px 0 10px 0 !important;
	font: bold 14px/14px Arial, sans-serif;
	text-indent: 0;
	
	}
	
	div#clique div.legal div h4,
	div#clique div.privacy div h4 {
	
	height: auto;
	padding: 0 !important;
	margin: 0 0 10px 0 !important;
	font: normal 12px/12px Arial, sans-serif;
	text-indent: 0;
	background: none;
	border: none;
	
	}
	
	div#clique div.legal div p,
	div#clique div.privacy div p {
	
	margin: 0 0 10px 0;
	
	}

	div#signup h4,
	div#newaddress h4 {

	text-indent: -5000px;
	height: 20px;
	border-bottom: 1px solid #fff;
	visibility: visible;
	background-repeat: no-repeat;
	margin-bottom: 20px;

	}
		
	label.city + label.regions {
	
	display: block;
	
	}


/* Forms */


	div#signup label {
	
	width: 100%;
	
	}
	
	div#signup label em {
	
	width: 34%;
	white-space: normal;
	
	}
	
	div#signup label input[type=text],
	div#signup label input[type=password] {
	
	max-width: 62%;
	padding: 0 .5%;
	
	}
	
	div#signup label select {
	
	max-width: 62%;
	 
	}
	
	* html div#signup label select {
	
	width: 60%;
	
	}
	
	div#signup fieldset {
	
	padding-left: 34%;
	margin: 0 0 12px;
	
	}
	
	div#signup ul.actions {
	
	margin-bottom: 15px;
	
	}


/* Formatting Exceptions */

	
	div#signup label.month,
	div#signup label.day,
	div#signup label.year,
	div#signup label.month select,
	div#signup label.day select,
	div#signup label.year select {
	
	width: auto;
	max-width: none;
	
	}
	
	div#signup label.month {
	
	display: inline;
	float: none;
	
	}
	
	#clique div#signup .password input {
	
	width: 30%;
	
	}
	
	div#signup .year select {
	
	margin-right: 0;
	
	}
	
	div#signup fieldset.hide_password label {
	
	width: 100px;
	
	}
	
	
/* Password Helper */


	#signup label.password {
	
	position: relative;
	
	}
	
	#signup .password strong {
	
	float: left;
	font-size: 11px;
	line-height: 12px;
	padding: 4px 5px;
	color: #444;
	background: #ccc;
	width: 30%;
	max-width: 93px;
	position: absolute;
	top: 0;
	left: 66%;
	-moz-border-radius-topright: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-bottomleft: 4px;
	-webkit-border-top-right-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;

	}
	
	#signup .password strong.weak {
	
	color: #564d2c;
	background: #ffd542;
	width: auto;
	-moz-border-radius-bottomleft: 0;
	-webkit-border-bottom-left-radius: 0;
	
	}
	
	#signup .password strong.good {
	
	color: #286541;
	background: #7add86;
	width: auto;
	-moz-border-radius-bottomleft: 0;
	-webkit-border-bottom-left-radius: 0;
	
	}
	
	#signup .password strong.strong {
	
	color: #004a66;
	background: #00baff;
	width: auto;
	-moz-border-radius-bottomleft: 0;
	-webkit-border-bottom-left-radius: 0;
	
	}
	
	
/* Image Replacement */


	div#signup .about h4 {
	
	background-image: url('h4-aboutyou.png');
	
	}
	
	div#signup .location h4 {
	
	background-image: url('h4-shippingaddress.png');
	
	}

	div#clique .terms h4 {
	
	background-image: url('h4-terms.png');
	
	}
	
	div#clique .privacy h4 {
	
	background-image: url('h4-privacy.png');
	
	}
	
	
/* ADDRESS BOOK
----------------------------------------------------------------------------- */

		
/* Address Book */


	ul.addresses {
	
		float: left;
		margin: 10px 0;
	
		}
		
	ul.addresses li {
	
		position: relative;
		float: left;
		width: 184px;
		margin: 0 0 15px 0;
		padding: 10px 10px 10px 31px;
		color: #333;
		background: #fff;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		opacity: .85;

		}
		
	ul.addresses li.selected {
	
		opacity: 1;
	
		}
		
	ul.addresses h4 {
	
		color: #222;
		font: bold 13px/13px Arial, sans-serif;
		width: 100%;
		margin: 0;
		text-transform: none;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	
		}
		
	div#signin ul.addresses label {
	
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 100%;

		}
		
	ul.addresses label input {
	
		margin: 9px 0 0 9px;
	
		}
		
	ul.addresses dl {
	
		padding: 5px 0;
	
		}
		
	ul.addresses dd {
	
		padding: 2px 0;
	
		}
		
	ul.addresses dd {
	
		font-weight: normal;
		font-size: 12px;
		line-height: 14px;
		width: auto !important;
		border: none;
		margin-right: 5px;
	
		}
		
	ul.addresses dd.company {
	
		font-size: 10px;
		text-transform: uppercase;
	
		}
		
	ul.addresses dd.company,
	ul.addresses dd.street-address,
	ul.addresses dd.locality {
	
		clear: left;
	
		}
		
	ul.addresses dd.locality:after {
	
		content: ",";
	
		}
		
	div#clique ul.addresses li label em,
	ul.addresses dl,
	ul.addresses dt,
	ul.addresses dd.country-name {
	
		display: none;
	
		}
		
	
/* New Address */


	#clique #newaddress div.location {
	
		margin-top: 20px;
	
		}
		
	#newaddress h4 {

		margin-top: 25px;
		background-image: url('h4-newaddress.png');
	
		}
		
	#clique #newaddress label em {
	
		width: auto;
	
		}
		
	#clique #newaddress input,
	#clique #newaddress select {
	
		clear: left;
		margin-right: 10px;
		width: auto !important;
	
		}
		
	#newaddress .location > label + br,
	#newaddress .location > div > div > div > label:first-child + br,
	#newaddress .location > div > div > label:first-child + br + label + br {
	
		display: none;
	
		}


/* INTERNET EXPLORER 7 EXCEPTIONS
----------------------------------------------------------------------------- */


/* Wrapping Fixes */
	
	
	div#clique label.error strong {
	
	*width: 62%;
	
	}
	
	div#clique select {
	
	*width: 62%;
	
	}
	

/* INTERNET EXPLORER 6 EXCEPTIONS
----------------------------------------------------------------------------- */


/* Min/Max Dimensions */


	* html div#signin,
	* html div#sites {
	
	height: 400px;
	
	}
	
	
/* Double Margins */


	* html div#clique label.error strong {
	
	margin-left: 17%;
	
	}
	
	
/* Selectors */


	* html div#clique input {

	float: left;
	background-color: #fff !important;	

	}
	
	
/* Overflow */
	

	* html #clique #signin {
	
	overflow-x: hidden;
	
	}
	
	
/* Spacing */


	* html #clique div.signin label small {
	
	width: 110px;	
	
	}
	
	
/* PNG Replacement */


	* html div#clique label.error strong {
	
	background-image: url('bg-error.gif') !important;
	
	}