/*---------------------------------
MAIN STYLE SHEET

Version:	1.0
Author:		Michael Walsh
Website:	www.enovate.co.uk
Created:	06/05/10

----------------------------------

CONTENTS

00 RESET STYLES
01 FONT FAMILY
02 HTML TAGS
03 FORMS
04 PAGE LAYOUT
05 NAVIGATION
06 FOOTER
07 HOMEPAGE
08 STORES PAGE
09 OPENING HOURS PAGE
10 CONTACT PAGE
11 BRANDS PAGE
12 LOCATION PAGE
13 GALLERY PAGE
14 STORE PAGE
15 WOMENSWEAR STORE PAGE
16 WOMENSWEAR PRESS PAGE
17 PROMOTIONS PAGE
18 EVENTS PAGE
19 WOMENSWEAR WISHLIST PAGE
20 INFINITI AUTOMOTIVE PAGE
21 ONE SKIN PAGE
22 ZAGGER VINTAGE PAGE

--------------------------------*/


/*------------------------------------------------------------------------------------------------------- =00 RESET STYLES ------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	text-decoration: none;
}

/*------------------------------------------------------------------------------------------------------- =01 FONT FAMILY ------*/


h1, .nav, .nav ul
{
	font-family:"Times New Roman", Times, serif;
}

h2, h3, h4, h5, .section p, .section .copyright, .datatable, .section ul {
	font-family:Arial, Helvetica, sans-serif;
}


/*------------------------------------------------------------------------------------------------------- =02 HTML TAGS ------*/

body {
  color:#FFF;
  text-align:center;
  background:#000;
}

html {
     overflow: -moz-scrollbars-vertical;
}

p, h3, h4, h5, ul, ol, dl, small {
	padding-top:1em;
}

ul, ol {
	padding-left:3em;
}

ul ul, ol ol {
	padding-top:0;
}

table {
	margin-top:1.4em;
	margin-bottom:1.4em;
}

h1 {
	font-size:18px;
	color:#FFF;
	font-weight:normal;
	text-transform:uppercase;
}

h2 {
	font-size:13px;
	color:#FFF;
	font-weight:bold;
}

em {

}

abbr, acronym {
  border-bottom: 1px dotted #000;
  cursor: help;
}

cite {
	font-style:normal;
	font-weight:bold;
	margin-top:0.5em;
	color:#000;
	display:block;
	text-align:right;
}

img {
	border: 0px none; 
	display:block;
}

object {
	display:block;
	float:left;
}

small {
	font-size:0.8em;
	line-height:1.4;
	color:#999;
	display:block;
}

/*------------------------------------------------------------------------------------------------------- =03 FORMS ------*/

form {
	margin:0;
	border:0;
	padding:0;
}

form p {
	clear:both; 
	padding-top:25px !important;
	height:1%;
}

input, textarea {
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
	border:1px solid #868686;
	border-top:1px solid #3D3D3D;
	border-left:1px solid #3D3D3D;
	width:300px;
	padding:4px;
	color:#000;
	float:left;
	margin:0 !important;
}

label {
	width:175px;
	display:block;
	float:left;
}

input:focus, textarea:focus {
	border:1px solid #FFF;
}

.button {
	width:75px;
	background-color:#393939;
	border:1px solid #808080;
	color:#FFF;
	font-weight:bold;
	font-size:0.9em;
	background-image:none !important;
	float:right;
	padding:3px;
	margin:0;
	margin-right:20px !important;
}

.buttonHover {
	width:75px;
	background-color:#FFF;
	border:1px solid #808080;
	color:#000;
	font-weight:bold;
	font-size:0.9em;
	background-image:none !important;
	float:right;
	padding:3px;
	margin:0;
	margin-right:20px !important;
}

* html .button {margin-left:153px;}
* html .buttonHover {margin-left:153px;}

/*------------------------------------------------------------------------------------------------------- =04 PAGE LAYOUT ------*/

#wrapper {
	width:740px;
	margin:40px auto;
	text-align:left;
	position:relative;
}

#header, #header a {
	width:82px;
	height:495px;
	float:left;
}

#header p {
	padding:0;
	text-indent:-9999px;
}

#header a {
	background-image:url(../images/interface/logo.gif);	
}

.inner {
	float:right;
	width:618px;
}

.section {
	width:598px;
	min-height:400px;
	padding:40px 0;
}

* html .section {height:400px;}

.section p {
	text-align:justify;
	font-size:12px;
	line-height:1.6;
}

.section ul {
	font-size:12px;
	overflow: hidden;
}

.section a {
	color:#FFF;
}

.section a:hover, .section a:focus {
	text-decoration:underline;
}

.section .centre {
	text-align:center;	
}

.section .centre-image {
	margin:0 auto;	
}

/*------------------------------------------------------------------------------------------------------- =05 NAVIGATION ------*/

.nav {
	font-size:13px;
	position:absolute;
	right:0px;
}
 
.nav ul {
	display:block;
	margin:0;
	padding:0;
	border:0;
	list-style: none;
}

.nav li {
	float: left;
	padding: 0 25px 0 0;
	margin: 0;
}

.nav li.last {
	padding-right:20px;	
}

.nav ul a {
	float: left;
	display: block;
	color: #fff;
	text-decoration: none;
	text-transform:uppercase;
}

.nav ul a:hover, .nav ul a:focus, .nav ul li.current a {
	text-decoration:underline;
}

/*------------------------------------------------------------------------------------------------------- =06 FOOTER ------*/

.footer {
	width:598px;
	height:12px;
	background:url(../images/interface/address.gif) no-repeat;
	text-indent:-9999px;
	clear:both;
}

.footer p {
	padding:0;
}

.copyright {
	color:#151515;
	font-size:11px;
	margin: 0 auto;
	clear:both;
	padding:20px 0;
}

.copyright a {
	color:#151515;
}

.copyright a:hover {
	text-decoration:underline;
}

/*------------------------------------------------------------------------------------------------------- =07 HOMEPAGE ------*/

#home #wrapper {
	width:778px;	
}

#home #header a {
	width:344px;
	height:96px;
	margin-left:30px;
	background-image:url(../images/homepage/logo-medium.gif);
}

#home #header {
	width:778px;
	height:	96px;
	margin-bottom:40px;
}

#home #header p.branding {
	width:374px;
	height:96px;
	margin:0 auto;
}

#home p.intro {
	width:653px;
	height:37px;
	background-image:url(../images/homepage/intro.gif);
	text-indent:-9999px;
	margin:0 0 0 63px;
	padding:0;
	clear:both;
}

#home .container {
	padding:20px 0 30px 63px;
	float:left;
}

#home .section {
	margin:0;
	padding:0;
	min-height:0;
	width:778px;
	float:none;
}

* html #home .section {height:1%;}

#home .container .section {
	width:198px;
	float:left;
	margin-right:30px;
}

#home .social {
	margin-right:0;	
}

#home .container .section a, #home .container .section div.outer {
	padding:20px;
	border:1px solid #333;
	display:block;
	text-decoration:none;
	height:110px;
}

#home .container .section a:hover {
	border-color:#FFF;	
}

#home .container .section p {
	text-align:left;
	padding:0;	
	color:#999;
}

#home .container .section p strong {
	display:block;
	padding-bottom:1em;
	color:#FFF;
}

#home .container .social a {
	padding:0;
	display:block;
	height:auto;
	border:0;
	padding:4px 0 4px 23px;
	background-repeat:no-repeat;
}

#home .container .social a:hover {
	background-position:0 -100px;
}

#home .container .social a.twitter {background-image:url(../images/logos/twitter.png);}
#home .container .social a.facebook {background-image:url(../images/logos/facebook.png);}
#home .container .one-skin {background-image:url(../images/homepage/one-skin.gif)}
#home .container .infiniti {background-image:url(../images/homepage/infiniti.gif)}

/*#home p.intro {
	width:344px;
	height:60px;
	background-image:url(../images/homepage/intro.gif);
	text-indent:-9999px;
	float:right;
	margin-right:30px;
}*/



#home .footer {
	width:653px;
	height:12px;
	background-image:url(../images/homepage/address.gif);
	margin:30px 0 30px 63px;
	clear:both;
}

#home .copyright {
	padding:0;
	padding-bottom:10px;	
}

.aside ul {
	list-style-type:none;
	padding:0;
	padding-left:45%;
}

.aside li {
	display:inline;
}

.aside a {
	background: url(../images/homepage/socialmedia.gif) no-repeat left top;
	display: block;
	float:left;
	height: 30px;
	width: 30px;
	margin: 0 4px 30px 4px;
	text-indent: -9999em;
}

.aside #facebook {
	background-position: right top;
}

.aside #twitter:hover {
	background-position: left bottom;	
}

.aside #facebook:hover {
	background-position: right bottom;
}

#home .stores {	
	clear:both;
}

/*------------------------------------------------------------------------------------------------------- =08 STORES PAGE ------*/

#stores .inner, #stores .section {
	width:618px;	
}

#stores .section {
	padding-top:36px;	
	padding-bottom:44px;
}

ul.stores {
	padding:0;
	margin:0;
	list-style:none;
}

ul.stores li {
	width:289px;
	height:115px;
	float:left;
	padding:18px 20px 0 0;
	position:relative;
	z-index:100;
	overflow:hidden;
}

ul.stores li span {
	position:absolute;
	bottom:-1px;
	left:0;
	height:36px;
	width:289px;
	z-index:101;
}

ul.stores li a {
	float:left;
	background-color:#333;
}

ul.openinghours li {
	height: auto;	
}

ul.openinghours li span {
	bottom: auto;
	top: 96px;	
}

ul.openinghours .datatable {
	width: 100%;	
}

/*------------------------------------------------------------------------------------------------------- =09 OPENING HOURS PAGE ------*/

.datatable {
	border:2px solid #FFF;
	border-collapse: collapse;
	color:#FFF;
	margin:0 auto;
	font-size:12px;
	margin-top:1em;
}

.datatable th {
	background-color:#FFF;
	color:#000;
	padding:0.5em 0.7em;
}

.datatable td {
	padding:0.5em 0.7em;
	border:2px solid #FFF;
	background-color:#000;
}

.datatable td.closed {
	background-color: white;
	color: black;	
}

.zagger-opening-hours p {
	text-align:center;
	font-size:11px;
	font-weight:bold;
	padding-bottom:1em;
}

/*------------------------------------------------------------------------------------------------------- =10 CONTACT PAGE ------*/

.zagger-contact ul.stores li span {
	top:25px;	
}

.zagger-contact ul.stores li {
	padding-top:61px;
	height:55px;
	font-size:25px;
	text-align:center;
}

/*------------------------------------------------------------------------------------------------------- =11 BRANDS PAGE ------*/

div.brands-list ul {
	overflow:hidden;
	list-style-type:none;
	padding:2em 0 1em 0;
	font-size:13px;
	width: 350px;
}

div.brands-list p {
	overflow:hidden;
	padding:0 0 1em 0;
	font-size:13px;
}

div.brands-list ul li {
	width:175px;
	float:left;
	text-align: left;
	padding-bottom:4px;
}

.brands #fbx-womenswear, .brands #fbx-womenswear ul {
	width:600px;
}

.brands #fbx-womenswear ul li {
	width:200px;
}

/*------------------------------------------------------------------------------------------------------- =12 LOCATION PAGE ------*/

#zagger-location .section, #zagger-location .section p {
	text-align:center;
}

#zagger-location .section img {
	margin:0 auto;	
}

#zagger-location h1 {
	padding-top:2em;
}

/*------------------------------------------------------------------------------------------------------- =13 GALLERY PAGE ------*/

ul.gallery {
	padding:0;
	margin:0;
	list-style:none;
	padding-top:35px;
	height:1%;
}

ul.gallery li {
	height:131px;
	width:175px;
	float:left;
	padding:30px 27px 0 4px;
}

ul.gallery li a {
	position:relative;
	height:131px;
	width:175px;
	float:left;
}

.cooper-bmw-chelmsford ul.gallery {
	padding-top:115px;	
}

ul.gallery li span {
	display:none;
	position:absolute;
	height:115px;
	width:159px;
	z-index:101;
	border: 8px solid #000;
	border: 8px solid rgba(0, 0, 0, .75);
}

.gallery ul.gallery {
	padding-top:0;
	margin-top:0;
	overflow:hidden;
	float:left;
}

/*------------------------------------------------------------------------------------------------------- =14 STORE PAGE ------*/

#store .figure img {
	float:right;
	margin-left:20px;
	margin-top:0.5em;
}

#store .section {
	min-height:390px;
	padding:55px 0 35px 0;
}

* html #store .section {height:390px;}

.zagger-menswear .section p {padding-top:52px;}
.zagger-womanswear .section p {padding-bottom:1em; padding-top:0;}
.zagger-fashion .section p {padding-top:77px;}
.zagger-basic .section p {padding-top:52px;}
.zagger-hugo-boss .section p {padding-top:47px;}
.zagger-labels-for-less .section p {padding-top:0px;}
.vintage .section p {padding-top:0px;}

#store .figure {
	padding-top:0;	
}

.zagger-labels-for-less .section .labels, .zagger-labels-for-less .section .vintage {padding-top:30px;}

/*------------------------------------------------------------------------------------------------------- =15 WOMENSWEAR STORE PAGE ------*/

.column-left {
	width:289px;
}

.column-right {
	float:right;
	width:289px;
}

.zagger-womanswear ul.stores li {
	padding-right:0;	
}

.zagger-womanswear .column-right {
	padding-bottom:35px;	
}

/*------------------------------------------------------------------------------------------------------- =16 WOMENSWEAR PRESS PAGE ------*/

#press-photos img {
	display:inline;
}

#press-photos .section p {
	text-align:center;
	padding-left:50px;
	padding-right:50px;
}

/*------------------------------------------------------------------------------------------------------- =17 PROMOTIONS PAGE ------*/

#zagger-promotions .section h1 {
	text-align:center;
	font-size:30px;
	padding-left:50px;
	padding-right:50px;
	padding-top:155px;
}

#zagger-promotions .centre-image img {
	margin:0 auto;
	margin-top:160px;
}

#zagger-promotions .one-skin-about {
	padding:2em 0 1em 0;
	margin:0 auto;
	width:450px;
	text-align:center;
}

/*------------------------------------------------------------------------------------------------------- =18 EVENTS PAGE ------*/

/*.zagger-events ul.stores {
	padding-top:65px;
	height:1%;
}*/

/*------------------------------------------------------------------------------------------------------- =19 WOMENSWEAR WISHLIST PAGE ------*/

#wishlist-info {
	width:400px;
	margin:0 auto;	
}

#wishlist-info p {
	text-align:center;	
}

/*------------------------------------------------------------------------------------------------------- =20 INFINITI AUTOMOTIVE PAGE ------*/

.infiniti-automotive .infiniti {padding-top:60px;}

/*------------------------------------------------------------------------------------------------------- =21 ONE SKIN PAGE ------*/

.one-skin .one-skin {padding-top:50px;}

/*------------------------------------------------------------------------------------------------------- =22 ZAGGER VINTAGE PAGE ------*/

.vintage .section .vintage {padding-top:45px;}
