/* 
	Document:				sp.css
	Creation date:			27 November 2007
	Created by:				Gemma Leigh
	This version:			*** Commented for development ***
	Deployment version:		Sitename/css/sp.css
	Notes:					Styles for service pages
	-----------------------------------------------------------------
	Contents of this file:
	-----------------------------------------------------------------
	
	Service Pages
	-Haeder variations
	-Navigation
	
	- Email me
	- Store locator
	- Stockists
	- About McQueen
	- Returns
	- Terms / Help
	- Size guides
	- Contact us
	
*/

/* =Service pages
-----------------------------------------------------------------------------*/
/* Typography: Reset heading spacing or font size/colour variations */
h2.underline		{ padding-top: 23px; margin-bottom: 36px;}

.service-page, 
.returns,
.size-guide,
.care-guide         { border-top:2px solid #D6D6D6;}
.service-page a 	{ font-size: inherit !important; border-bottom:2px solid #CCCCCC;}

/* Navigation*/
/* Set navigation to be the same as the main nav*/
.navigation				{ width: 960px; float: left; overflow: hidden; margin: 21px 0 20px 0; border-bottom: 2px solid #FFF;}

.navigation ul			{ width: 960px; float: left;}
.navigation ul li		{ float: left; background: url(../images/header-bullet.gif) 100% 36% no-repeat;}
.navigation ul li		{ padding: 0 30px 15px 0;}
.navigation ul li.last 	{ padding-right: 0; background: none;}

.primary-nav,
.secondary-nav,
.tertiary-nav				{ margin: 0; padding: 2px 0 2px 0;}

.tertiary-nav li.active a,
.navigation .primary-nav li.active a	{ display: block; font-size: 1.909em; letter-spacing: 2px; position: relative; top: -10px; margin-bottom: -20px;}

.navigation .primary-nav 			{ padding: 5px 0 8px 0; margin-bottom: 8px;}
.navigation .primary-nav li 		{ background: url(../images/header-bullet.gif) 100% 38% no-repeat; }

.navigation .tertiary-nav			{ padding: 0 0 1px 0;}
.navigation .tertiary-nav li.active	{ background: url(../images/header-bullet.gif) 100% 45% no-repeat; }

/* =Email me
-----------------------------------------------------------------------------*/
.email-me .two-col-layout .first-col	{ width: 480px; float: left;}
.email-me .two-col-layout .second-col	{ width: 445px; float: left; padding-left: 30px;}
.email-me .two-col-layout .hide-border	{ height: 75px;}

.email-me h2.primary					{ padding-top: 24px; padding-bottom: 1px;}
.email-me h3.primary					{ margin-top: -3px; color: #FFF;}
.email-me h3							{ padding-bottom: 2px;}

.email-me-info							{ width: 460px; float: left; padding-top: 20px;}
.email-me-info .email-me-image			{ width: 240px; float: left; }
.email-me-info .email-me-image img		{ padding-left: 20px; padding-right: 10px;}
/*.email-me-image .img-glow-blue			{ display: block;background: url(../images/bg-img-glow-blue.gif) bottom center no-repeat; padding-bottom: 10px;}*/

.email-me-info .email-me-details		{ width: 210px; float: left; }
.email-me-info .email-me-details p 		{ padding-bottom: 21px; color: #FFF;}

.email-me .second-col h3				{ padding-top: 75px; padding-bottom: 25px;}

/* Email me - wider label container*/
.email-me .form-row 					{ width: 440px; float: left;}
.email-me .text-container				{ width: 160px; float: left;}
.email-me .text-container p   			{ padding: 0 20px 0px 0;}

/* Checkbox with text to right */
.email-me .row-checkboxes				{ padding-top: 6px; padding-bottom: 11px;}

ul.checkbox-list						{ width: 200px; float: left;}
ul.checkbox-list li						{ float: left; width: 100%; position: relative; margin-top: 0px; padding-bottom: 13px; }
ul.checkbox-list li input.checkbox 		{ position: absolute; top: 3px; left: 3px;}
ul.checkbox-list li label 				{ float: left; width: auto; margin-left: 30px; display: inline;}
ul.checkbox-list li p 					{ clear: both;}

.email-me .row-submit					{ padding-top: 13px;}

/* Email me thanks*/
.email-me .one-col-intro h2.primary		{ padding: 0 0 17px 0; margin: 0; }
.email-me .one-col-intro h3.secondary	{ padding:0 0 25px 0; margin: 0;}
.email-me .thanks						{ padding-bottom: 190px;}

/* =Store locator
-----------------------------------------------------------------------------*/
.store-locator .store-main-image							{ width: 960px; padding: 0px 0 26px 0;}
.store-locator .store-description							{ width: 460px; float: left; padding-right: 40px;}
.store-locator .store-description p							{ padding: 0 0 20px 0; margin: 0;}
.store-locator .store-description span.first-letters 		{ float: left; text-transform: uppercase; margin-top: -1px;}

.store-locator .store-details								{ width: 460px; float: left; border-bottom: 2px solid #D6D6D6;}
.store-locator .store-details .store-map					{ border: 2px solid #999; }

.store-details .store-title									{ border-bottom: 2px solid #D6D6D6; padding: 0px 0 16px 0;}
.store-details .store-hours									{ padding-top: 2px;}
.store-details ul 											{ margin: 14px 0 13px 0;}
.store-details ul li										{ padding-bottom: 2px;}
.store-details ul li.store-hours-title						{ color: #999;}
.store-locator .store-details ul li span.day				{ display: block; min-width: 70px !important; width: auto; float: left;}
.store-locator .store-details ul.store-address li.store-tel	{ padding-top: 9px; color: #999;}
.store-locator .store-details ul.store-hours li.store-print	{ padding-top: 7px; color: #999;}


/* =Stockists
-----------------------------------------------------------------------------*/
.stockists .country-row					{ width: 960px; padding: 0px 0 20px 0;}
.stockists .country-row h3				{ float: left; padding-right: 30px;}
.stockists .store-row					{ width: 960px; float: left; border-bottom: 1px solid #ccc;}
.stockists .top-row						{ border-top: 1px solid #ccc;}

.stockists .store-title					{ width: 160px; float: left; padding-top: 16px;}
.stockists .store-details				{ width: 290px; float: left; background: #F5F5F5; padding: 16px 0 0 10px;}

.stockists .top-row .store-title,
.stockists .top-row .store-details		{ padding-top: 16px; padding-bottom: 16px; color: #313230;}

.stockists .store-details ul 			{ margin: 0 0 15px 0;}
.stockists .store-details li.store-tel 	{ padding-top: 10px; padding-bottom: 8px; color: #999;}
.stockists .store-details li.store-email,
.stockists .store-details li.store-map  { padding: 0; margin: 0; color: #999;}

/* =About McQueen
-----------------------------------------------------------------------------*/
.about .main-col p			{ padding: 0 20px 22px 0; margin: 0;}
.mainimage-caption			{ border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 16px 0 16px 0; width: 198px; margin-top: 20px;}

/* =Returns
-----------------------------------------------------------------------------*/
.returns h4			{ padding-top: 30px; padding-bottom: 2px;}
.returns h4.top		{ padding-top: 0px;}
.returns a.contact	{ background: url(../images/chevron-grey-right.png) center left no-repeat; padding-left: 20px; display: inline; font-size: 0.857em !important; letter-spacing: 1px !important;}

/* =Terms / Help 
-----------------------------------------------------------------------------*/
.service-page .main-col p 	{ padding-right: 40px;}

.service-page ul 			{ padding: 9px 0 21px 0; color: #999;}
.service-page ul li			{ list-style-type: disc; list-style-position: inside;}

.service-page h4			{ padding-top: 30px; padding-bottom: 2px;}
.service-page h4.top		{ padding-top: 26px;}
.service-page h4.tight		{ padding-top: 0px;}
.service-page a 			{ text-transform: none; letter-spacing:0px !important; color: #313230!important; display: inline !important;}
.service-page a:hover 		{ color: #313230!important; }
.service-page a.contact		{ text-transform: uppercase; background: #000 url(../images/arrow-white-right-onblack.gif) center left no-repeat; padding-left: 20px; display: block;}

/* =Size Guides
-----------------------------------------------------------------------------*/
/* Side guide tables */
.size-table-wrapper						{ width: auto; float: left; margin: 16px 0 30px 0; padding: 0;}
.size-table-wrapper	.size-table			{ width: auto; float: left; margin: 17px 0 20px 0; border-top: 1px solid #CCC; text-transform: uppercase; font-size: 0.857em;}
.size-table-wrapper	.size-table	.shade	{ background: #F5F5F5;}

.size-table tr.grey-text td 			{ color: #999;}
.size-table th,
.size-table td 							{ border-bottom: 1px solid #ccc;}

.size-table th							{ padding: 5px 0 5px 0;}
.size-table td 							{ padding: 5px 20px 5px 20px; vertical-align: top;}
.size-table td.row-name					{ padding: 5px 0 5px 10px; }

/* Cell padding for size guides */
.mens-shoes								{ width: 960px;}
.mens-shoes td.row-name,
.shoes td.row-name						{ width: 150px;}

.shoes td 								{ padding: 5px 15px 5px 15px;}
.mens-shoes td							{ padding: 5px 8px 5px 8px;}
.womenswear td							{ padding: 5px 15px 5px 15px;}

.belts td.row-name						{ width: 120px;}

/* Womenswear*/
.measuring-tips-wrapper					{ width: 380px; float: right; min-height: 540px; height: auto !important; height: 540px; /* for IE 6*/}
.measuring-tips-wrapper h4				{ padding: 16px 0 16px 0;  }

.measuring-tips							{ width: 380px; float: right; position: relative; border-top: 1px solid #D6D6D6;}
.measuring-tips h4						{ border-bottom: 1px solid #D6D6D6; width: 300px; }


.measuring-tips .womenswear				{ background: url(../images/sp-size-guide-womenswear.jpg) no-repeat; width: 180px; height: 492px; position: absolute; top: 0px; right: 0; z-index: 1;}
.measuring-tips .menswear				{ background: url(../images/sp-size-guide-menswear.jpg) no-repeat; width: 180px; height: 492px; position: absolute; top: 0px; right: 0; z-index: 1;}
.measuring-tips	h4						{ position: relative; z-index: 2; padding-bottom: 2px;}
.measuring-tips	p						{ position: relative; z-index: 2; padding-top: 2px; width: 220px;}
.measuring-tips	p.mb20					{ margin-bottom: 20px;}

/* Position of product images */
.size-table-wrapper .img-position		{ position: relative;}
.size-table-wrapper img.belts			{ top: -30px; left: 40px; margin-bottom: -30px;}

/* Care guides */
.care-guide								{ margin-bottom: -45px;}
.care-guide .two-col-layout .main-col	{ width: 480px; float: left; }
.care-guide .two-col-layout .side-col 	{ width: 480px; float: left; padding: 0;}

.care-guide .cg-wrapper				    { width: 100%; float: left;}
.care-guide .cg-wrapper p 			    { width: 380px; float: left;}
.care-guide .cg-wrapper img			    { float: right; margin-right: 0px; }

.care-guide .two-col-layout .side-col h4,
.care-guide .two-col-layout .side-col p { padding-left: 20px;}

.care-guide h4							{ padding-bottom: 2px;}
.care-guide h4.underline				{ padding: 32px 0 17px 0; margin: 0 0 16px 0;}
.care-guide .materials h4.underline		{ padding-top: 12px;}

.care-guide p 							{ padding-bottom: 41px; color:#878787;}

/* Jewellery */
.care-guide h4							{ padding-top: 16px;}
.care-guide .jewellery					{ padding-bottom: 20px;}
.care-guide .jewellery p				{ padding-bottom: 21px;}
.care-guide .jewellery .side-col		{ padding-left: 20px;}
.care-guide .jewellery .side-col p		{ margin-right: 80px;}

/* Wash care */
.care-guide h3							{ width: 460px; padding-top: 16px; padding-bottom: 16px;}

/* =Contact us
-----------------------------------------------------------------------------*/
.contact-us .checkbox-container 		{ clear: both; float: left; width: 100%; position: relative; margin-top: 60px; padding-bottom: 11px; }
