
/* COLOURS
-------------------------------------
Purple    (Fashion)      : #bcbffa
Orange    (Food)         : #ffb797 
Blue      (Services)     : #9edbff
Navy Blue (Mens Fashion) : 
Grey                     : #b0b2b4

/* RESET
------------------------------------- */

html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, a, em, img, dl, dt, dd, ol, ul, li, fieldset, label, legend, table, tbody, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
table { border-collapse: separate; border-spacing: 0; }
th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }
a img { border: none; }

html, body, #wrap, form { height: 100%; }
body form > #wrap { height: auto; min-height: 100%; }

/* CLASSES
------------------------------------- */

.left { float: left; }
.right { float: right; }
.clear { clear: both; }

/* TYPOGRAPHY
------------------------------------- */

body { font-size: 12px; color: #434242; background: url(../images/mainBG.jpg) repeat-x top center; background-color: #000000; font-family: Arial, Helvetica, sans-serif; line-height: 1; }

/* Backgrounds */
body.bg-food { background: url(../images/mainBG-food.jpg) repeat-x top center; background-color: #000000; }
body.bg-services { background: url(../images/mainBG-services.jpg) repeat-x top center; background-color: #000000; }

h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; font-weight: normal; }
h1 { font-size: 21px; color: #FFFFFF; }
h2 { font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 18px; margin-bottom: 20px; font-weight: bold; color: #b0b2b4; }
h3 { font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #666363; font-weight: bold; line-height: 19px; margin-bottom: 2px; }
h4 { font-size: 18px;  margin-bottom: 2px; color: #ababab; text-transform: uppercase; overflow: hidden; height: 18px; }
h5 { font-size: 18px; margin-bottom: 10px; color: #ffffff; line-height: 21px; }
h6 { font-size: 12px; font-weight: bold; }

p { font-size: 14px; line-height: 17px; margin-bottom: 17px; font-family: Arial, Helvetica, sans-serif; }
p.last { margin-bottom: 0; }
p.smallText { font-size: 11px; line-height: 13px; margin-bottom: 4px; }

a { text-decoration: none; color: #b0b2b4; }
a:hover { text-decoration: underline; }

strong { font-weight: bold; }
em { font-style: italic; }

li ul, li ol { margin: 0 1.5em; }
ul, ol { margin: 0 0 17px 21px; }
li { font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 17px; }
ul { list-style-type: disc; }
ol { list-style-type: decimal; }

table { margin-bottom: 1.4em; width: 100%; font-family: Arial, Helvetica, sans-serif; }
th { color: #45464a; font-size: 12px; font-weight: bold; line-height: 16px; border-bottom: 3px solid #f6f6f6; padding: 4px 10px 8px 5px; }
td { border-bottom: 1px solid #f6f6f6; padding: 8px 10px 8px 5px; line-height: 16px; }

/* CONTAINERS
------------------------------------- */

#main { width: 960px; margin: 0 auto; padding-bottom: 100px; }
body > #wrap {height: auto; min-height: 100%;}

#header { width: 960px; height: 101px; position: relative; }
#logo { width: 115px; height: 37px; position: absolute; left: 20px; top: 37px; }

#main-inner, #main-inner-top, #main-inner-mid, #main-inner-bot { width: 960px; margin: 0 auto; }
#main-inner-top { height: 11px; }
#main-inner-mid { width: 960px; background: url(../images/BG_main-inner-mid.png); }
#main-inner-bot { height: 9px; }

#main-home-top, #main-home-bot { height: 10px; }
#main-home-mid { width: 960px; background: url(../images/BG_home-mid.png) repeat-y; }
#home-feature-outer { width: 960px; height: 327px; background: url(../images/BG_home-repeat.png); padding-top: 10px; }

#contentContainer { width: 938px; margin: 0 auto; background: url(../images/BG_sidebar.png) repeat-y; background-color: #ffffff; position: relative; }

#sidebar { width: 299px; float: left; display: inline; position: relative; margin-bottom: 50px; }
#mainContent { width: 369px; float: left; display: inline; padding: 16px 20px 30px 21px; }


/* Nav
------------------------------------- */

#nav { width: 654px; height: 22px; position: absolute; right: 10px; top: 65px; }
#nav ul { list-style-type: none; padding: 0; margin: 0; }
#nav li { float: left; display: inline; }
#nav li a { color: #FFFFFF; display: block; height: 22px; text-indent: -9999px; }

#nav li a.nav01 { background: url(../images/nav_01.png) no-repeat; width: 69px; }
#nav li a.nav02 { background: url(../images/nav_02.png) no-repeat; width: 51px; }
#nav li a.nav03 { background: url(../images/nav_03.png) no-repeat; width: 73px; }
#nav li a.nav04 { background: url(../images/nav_04.png) no-repeat; width: 126px; }
#nav li a.nav05 { background: url(../images/nav_05.png) no-repeat; width: 94px; }
#nav li a.nav06 { background: url(../images/nav_06.png) no-repeat; width: 98px; }
#nav li a.nav07 { background: url(../images/nav_07.png) no-repeat; width: 64px; }

#nav li a:hover.nav01, #nav li a.nav01.active01 { background: url(../images/nav_01_o.png) no-repeat; }
#nav li a:hover.nav02, #nav li a.nav02.active02 { background: url(../images/nav_02_o.png) no-repeat; }
#nav li a:hover.nav03, #nav li a.nav03.active03 { background: url(../images/nav_03_o.png) no-repeat; }
#nav li a:hover.nav04, #nav li a.nav04.active04 { background: url(../images/nav_04_o.png) no-repeat; }
#nav li a:hover.nav05, #nav li a.nav05.active05 { background: url(../images/nav_05_o.png) no-repeat; }
#nav li a:hover.nav06, #nav li a.nav06.active06 { background: url(../images/nav_06_o.png) no-repeat; }
#nav li a:hover.nav07, #nav li a.nav07.active07 { background: url(../images/nav_07_o.png) no-repeat; }

/* SubNav
------------------------------------- */

#subNav { width: 212px; float: left; display: inline; padding: 16px 17px 50px 0; }
#subNav ul { list-style-type: none; padding: 0; margin: 0; }
#subNav li { background: url(../images/BG_subNav-bot.png) no-repeat bottom left; padding: 0 0 5px 0; }
#subNav li a { font-size: 15px; line-height: 23px; color: #1B1B1B; background: url(../images/BG_subNav2.png) no-repeat top left; padding: 3px 5px 0 12px; display: block; }
#subNav li a span { background: url(../images/bullet.gif) no-repeat 0 8px; display: block; padding-left: 15px; }
#subNav li a.active { font-weight: bold; }

/* HOME
------------------------------------- */

#home-feature { width: 938px; height: 317px; background-color: #000000; margin: 0 auto; }
#home-feature-small-L { width: 642px; height: 317px; background-color: #000000; margin: 0 auto; float: left; display: inline; border-right: 1px solid #242324; }
#home-feature-small-R { width: 248px; height: 271px; background-color: #242324; margin: 0 auto; float: left; display: inline; border-left: 1px solid #000000; padding: 23px; position: relative; }
#home-feature-small-R p { color: #FFFFFF; font-size: 12px; overflow: hidden; height: 180px; margin-bottom: 10px; line-height: 15px; }
#home-feature-small-R a { position: absolute; bottom: 15px; }

#promos-arrows-L, #promos-arrows-R { width: 20px; height: 40px; display: inline; position: relative; }
#promos-arrows-L { margin-left: -20px; margin-top: 80px; float: left; }
#promos-arrows-R { margin-right: -20px; margin-top: -110px; float: right; }

#promos { width: 940px; height: 161px; background: url(../images/BG_home-repeat.png); margin-top: 15px; padding: 10px; position: relative; margin-left: 0; }
.promo-item { width: 300px; height: 161px; border: 1px solid #5f5b5b; float: left; display: inline; background: url(../images/BG_main-inner-mid.png) -1px 0; margin-right: 17px; }
.promo-last { margin-right: 0; }
.promo-item-img { width: 114px; height: 143px; margin-right: 12px; margin: 9px 0 0 9px; overflow: hidden; float: left; display: inline; }
.promo-item-text { width: 150px; height: 143px; float: left; display: inline; margin: 9px 0 0 9px; overflow: hidden; }
.promo-item-text p.byline { color: #FFFFFF; text-transform: uppercase; font-size: 12px; margin-bottom: 8px; overflow: hidden; height: 15px; }
.promo-item-text p.promo-main { color: #FFFFFF; font-size: 12px; margin-bottom: 5px; height: 48px; overflow: hidden; line-height: 1.3; }
.promo-item-text a img { margin-top: 20px; }

/* CONTENT
------------------------------------- */

.section { height: 88px; line-height: 88px; padding-left: 250px; text-transform: uppercase; font-size: 36px; text-indent: -9999px; }
.section.title-fashion { background: url(../images/t_fashion.gif) no-repeat 250px 28px; }
.section.title-food { background: url(../images/t_food.gif) no-repeat 250px 28px; }
.section.title-services { background: url(../images/t_services.gif) no-repeat 250px 28px; }
.section.title-offers { background: url(../images/t_offers.gif) no-repeat 250px 28px; }
.section.title-cMap { background: url(../images/t_centre-map.gif) no-repeat 250px 28px; }
.section.title-cInfo { background: url(../images/t_centre-info.gif) no-repeat 250px 28px; }
.section.title-signup { background: url(../images/t_signup.gif) no-repeat 250px 28px; }
.section.title-disclaimer { background: url(../images/t_disclaimer.gif) no-repeat 250px 28px; }
.section.title-privacy { background: url(../images/t_privacy.gif) no-repeat 250px 28px; }
/* titlebar with different backgrounds */
.titlebar { height: 40px; line-height: 40px; padding-left: 250px; background-color: #000000; position: relative; }
.titlebar.tb-fashion { background: url(../images/titlebar_fashion.gif) no-repeat right; }
.titlebar.tb-food { background: url(../images/titlebar_food.gif) no-repeat right; }
.titlebar.tb-services { background: url(../images/titlebar_services.gif) no-repeat right; }
.titlebar.tb-general { background: url(../images/titlebar_general.gif) no-repeat right; }

.titlebar h1 { overflow: hidden; width: 379px; height: 40px; }
.titlebar div.backBTN { position: absolute; left: 8px; top: 7px; z-index: 100; }

#mainContent a.weburl { margin-bottom: 10px; display: block; }

h2.fashion { color: #bcbffa; }
h2.food { color: #ffb797; }
h2.services { color: #9edbff; }

/* Centre Map */
#centre-map { float: left; display: inline; width: 685px; padding: 16px 0 50px 0; margin-left: 12px; }

/* LISTINGS
------------------------------------- */

.listing-holder, .listing-item-thumb, .listing-item-text { float: left; display: inline; }
.listing-holder { width: 670px; padding: 16px 0 50px 0; margin-left: 21px; }
.listing-item { width: 670px; background: url(../images/dotted_line.gif) no-repeat bottom; padding: 10px 0 10px 0; }
.listing-item-thumb { width: 138px; height: 76px; border: 1px solid #e8e6e9; margin-right: 14px; overflow: hidden; }
.listing-item-text { width: 500px; }

.listing-item-text p.date { font-size: 11px; color: #7c0868; margin-bottom: 8px; }
.listing-item-text p { margin-bottom: 10px; }


/* SIDEBAR
------------------------------------- */

.galleryBTN { margin-left: 10px; }

#side-shadow-top { width: 299px; background: url(../images/sideImg-shadow-top.png) no-repeat top center; margin-top: -40px; position: relative; padding-top: 14px; }
#side-shadow-bot { background: url(../images/sideImg-shadow-bot.png) no-repeat; width: 269px; height: 20px; margin-left: 10px; }
.sideImg { width: 265px; border: 1px solid #c8c7c9; background-color: #FFFFFF; margin-left: 10px; }
.sideImg img { width: 265px; border: 1px solid #FFFFFF; margin: 0; padding: 0; }

.open-hours { width: 259px; margin: 0 0 0 10px; border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff;  background-color: #f4f3f4; padding: 5px; }
.open-hours ul { list-style-type: none; margin: 0;   }
.open-hours li { clear: both; position: relative; padding: 0 0 15px 0; }
.open-hours li strong { position: absolute; left: 0; font-weight: normal; }
.open-hours li em { position: absolute; right: 0; }
.open-hours p { margin-bottom: 3px; }
.open-hours-line { background: url(../images/dotted_line.gif) no-repeat; height: 1px; width: 269px; margin: 0 0 0 10px; overflow: hidden; }
.margin { margin-bottom: 20px; }
.open-hours li:after {  content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.open-hours li { display: inline-block; }
/* Hides from IE-mac \*/
* html .open-hours li {height: 1%;}
.open-hours li {display: block;}
/* End hide from IE-mac */


/* SIGN-UP
------------------------------------- */

#signupBox { width: 320px; background-color: #fafafa; background:url(../images/BG_signup.gif); border: 1px solid #e4e4e4; padding: 16px 20px 30px 20px; }


/* FOOTER
------------------------------------- */

#footer { width: 960px; height: 55px; margin: 0 auto; background-image: url(../images/BG_footer.gif); background-color: #1c1c1c; margin-top: -55px; clear: both; }

/* CLEAR FIX*/
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}

#footer-L { width: 600px; float: left; display: inline; padding-left: 15px; margin-top: 10px; }
#footer-R { width: 300px; float: right; display: inline; text-align: right; padding-right: 15px; margin-top: 10px; }

#footer-L ul, #footer-R ul { list-style-type: none; margin: 0; padding: 0; }
#footer-L li { float: left; display: inline; }
#footer-L li a { margin-right: 8px; font-size: 11px; color: #9e9d9d; font-family: Arial, Helvetica, sans-serif; }

#footer-R li { float: right; display: inline; }
#footer-R li a { margin-left: 8px; font-size: 11px; color: #585858; font-family: Arial, Helvetica, sans-serif; }

#footer p { color: #9e9d9d; font-size: 11px; margin-bottom: 3px; }

/* FORM ELEMENTS
------------------------------------- */

input.text, input.searchInput, textarea, select, input { color: #5c6167; font-family: Arial, Helvetica, sans-serif; font-size: 12px; }

/* Input Backgrounds */
.inputBG { display: block; height: 26px; background: url(../images/BG_inputR.gif) right top no-repeat; }
.inputBG span { display: block; height: 26px; background: url(../images/BG_inputL.gif) left top no-repeat; }
.inputBG span input.text { display: block; border: none; background: none; margin: 0; padding: 4px; outline: 0; }

/* Input Widths */
.field-span1 .inputBG { width: 72px; }
.field-span1 input.text { width: 64px; }
.field-span2 .inputBG { width: 175px; }
.field-span2 input.text { width: 167px; }
.field-span3 .inputBG { width: 280px; }
.field-span3 input.text { width: 272px; }

fieldset { margin: 0; padding: 0; }
label { float: left; width: 100px; display: block; clear: left; margin-right: 10px; text-align: left; cursor: hand; padding-top: 4px; font-size: 14px; }
label.question { float: left; width: 320px; display: block; clear: left; margin-right: 10px; text-align: left; cursor: hand; padding-top: 4px; font-size: 14px; }
label.terms { float: left; width: 320px; display: block; clear: left; margin-right: 10px; text-align: left; cursor: hand; padding-top: 4px; font-size: 12px; }

textarea, input, select, label, button, optgroup { margin-top: 5px; }
textarea.competition { width: 300px; margin: 15px 0 10px 0;}
input[type="checkbox"], input[type="radio"] { margin-bottom: 0; }	
input.resize, textarea.resize { width: 185px; }
.radioDiv { width: 75px; float: left; display: inline; margin-top: 4px; }

.slider { overflow: hidden; height: 200px; width: 960px; position: relative; }