/* 

	Document:				default.css
	This version:			*** Commented for development ***
	Deployment version:		E:\SVN\Brand Work Files\Outfit\static xhtml\css
	Notes:					Use for all website styling
	
*/


body {
 margin:0; 
 padding:0; 
 font: 90% verdana, gill sans, arial, verdana, sans-serif;
 background:#a5acaf;
 color: #fff;
 }
 
.clear_fix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* FORMAT */

h1, h2 {
 color: #000;
 font-weight: bold;
 font-size: 90%;
 margin: 0;
 }

p {
 line-height: 1.2em;
 font-size: 90%;
 }

p.top a {
 color: #fff;
 text-decoration: none;
 }

p.top a:hover {
 color: #a3c2b5;
 text-decoration: underline;
 }

p.smaller {
 font-size: 90%; 
 line-height: 1.2em;
 }

p.nopad {
 line-height: normal;
 padding: 0;
 margin: 0;
 }

.bold {
 font-weight: bold;
 color: #000;
 }

img {
 border: 0;
 padding:0;
 margin:0;
 }

/* LINKS */

a {
 color: #da3d7e;
 text-decoration: none;
 font-weight: bold;
 font-size: 90%;
 }

a:hover {
 text-decoration: underline;
 }

a.white_link {
 color: #000 !important;		
 }

a.pdf_link {
 background: url(../images/pdf.gif) right top no-repeat;
 color: #000 !important;
 display: block;
 width: 407px;
 }

/* active nav */

body#home div#topnav li.home a {
 text-decoration: underline;
 color: #333;
}

body#about div#topnav li.about_us a {
 text-decoration: underline;
 color: #333;
}

body#brands div#topnav li.outfit_brands a {
 text-decoration: underline;
 color: #333;
}

body#press div#topnav li.press_relations a {
 text-decoration: underline;
 color: #333;
}

body#giftcard div#topnav li.gift_card a {
 text-decoration: underline;
 color: #333;
}

body#account_card div#topnav li.account_card a {
 text-decoration: underline;
 color: #333;
}

body#location div#topnav li.store_locator a {
 text-decoration: underline;
 color: #333;
}

body#careers div#topnav li.careers_and_vacancies a {
 text-decoration: underline;
 color: #333;
}

body#newsletter div#topnav li.newsletter a {
 text-decoration: underline;
 color: #333;
}

body#charity div#topnav li.charity a {
 text-decoration: underline;
 color: #333;
}

body#contact div#topnav li.contact a {
 text-decoration: underline;
 color: #333;
}

/* LISTS */

ul {
 line-height: 1.5em;
 font-size: 90%;
}

ul.forward li {
 list-style-image: url(../images/arrow_right.gif);
 line-height: 1.5em;
 font-size: 90%;
 margin-left: -20px;
 }

ul.down {
 list-style-image: url(../images/arrow_down.gif);
 }

ul.back {
 list-style-image: url(../images/arrow_left.gif);
 }

ul.asterisk li{
 list-style-image: url(../images/icon_asterisk.gif);
 margin-left: -20px;
 line-height: 1.5em;
 font-size: 90%;
 }
 
ul.italic li a {
 color: #fff !important; 
 font-weight: normal !important;
 font-style: italic;
 text-decoration: none;
 }

ul.italic li a:hover {
 color: #000 !important;
 text-decoration: underline !important;
 }

/* FORMS */

dt, dd {
 margin: 0;
 }

label {
 line-height: 1.5em;
 font-size: 90%;
 cursor: pointer;
 }

input {
 width: 300px;
 height: 18px;
 background-color: #ccc;
 margin: 3px 0 3px 0;
}

textarea {
 width: 400px;
 height: 200px;
 background-color: #ccc;
 margin: 5px 0 5px 0;
}

.checkbox, .radio
{
 width: 15px;
 height: 15px;
 background: transparent;
}


/****************************************************/
/*    Header  & Navigation    */
/****************************************************/


#header {
 width: 950px;
 /*height: 118px;*/
 height: 120px;
 background: #a5acaf;
 overflow: hidden; 
 }

#header h1 {
 float: left;
 text-align: left;
 margin: 22px 0 10px 10px !important;
 margin: 22px 0 5px 5px;
 }
 
#header_sale {
 float:right;
 margin:10px 20px 0 0;
 }
 
#header h2 {
 float: right;
 margin-top: 5px;
 margin-right: 20px;
}

#header #banner_ad {
 float: right;
 margin: 5px 27px 0 0 !important;
 }

div#topnav {
 float: left;
 margin: 0 10px 0 0;
 width: 100%;
 }

div#topnav ul {
 background: transparent;
 padding: 0;
 list-style-type: none;
 text-align: center;
 float: left;
 margin: 6px 0 0 -14px !important;
 margin: 6px 0 0 -40px;
 }

div#topnav li {
 float: left;
 margin: 0 0 6px 25px !important;
 margin: 0 0 6px 24px;
 padding: 0;
 }

 
#topnav li.home {
 width: 40px;
 }
 
#topnav li.about_us, #topnav li.gift_card {


 width: 45px;
 }
 
#topnav li.outfit_brands {
 width: 55px;
 }
 
#topnav li.press_relations, #topnav li.careers_and_vacancies {
 width: 75px;
 }
 
#topnav li.account_card, #topnav li.store_locator, #topnav li.charity, #topnav li.contact {
 width: 60px;
 }
 
#topnav li.newsletter {
 width: 86px;
 }
 

div#topnav li a {
 display: block;
 font-size: 85%;
 text-transform: uppercase;
 text-decoration: none;
 color: #fff;
 font-weight: bold;
 padding: 0;
 line-height: 13px;
 width: 100%;
 }

div#topnav li a.topnav_first {
 text-align: left !important;
 width: 60px;
 }

div#topnav a:hover {
 text-decoration: underline;
 }

/****************************************************/
/*     Left Content     */
/****************************************************/

#wrapper {
 min-width: 980px;
 overflow: hidden;
 height:100%;
 border-top: 3px solid #fff;
 }

#left {
 float: left; 
 width: 50%;
 display: inline;
 margin-right: 15px;
 }

#left a {
 color: #167ea0;
 }

#column {
 padding: 20px 10px 10px 0 !important;
 padding: 20px 10px 10px 0;
 margin-left: 10px;
 }

#store_left {
 float: left; 
 width: 429px !important;
 width: 429px;
 display: inline;
 margin-right: 0;
 }

#store_left.strapline {
 margin-top: 16px;
 } 
 
/****************************************************/
/*     Right Content     */
/****************************************************/


#right_container {
 float: right; 
 width: 48%;

 height: 100%;
 font-size: 0.8em;
 }

#right_container a {
 font-size: 1.2em !important;
 }

#right_container #vacancies a {
 font-size: 1em !important;
 }
 
#right_display {
 float:left;
}
 
#right_display ul {
 list-style: none;
 padding: 0;
 margin: 0;
 }
 
#right_display li {
 padding: 0;
 margin-bottom: -2px !important;
 margin-bottom: 0;
 }

#right_container img {
 border-right: 2px solid #fff;
 }

img#top_image {
 border-bottom: 2px solid #fff !important;
 }


#right img, #right_stores, #store_locator_right {
 margin-bottom: -3px;
 }


/* HOME */

body#home #right_container {
 background: #f6938e url(../images/lifestyle/w39_10/home.jpg) no-repeat left top;
 height: 551px;
 }
 
/* ABOUT */

body#about #right_container {
 background: #e07726 url(../images/lifestyle/w39_10/about_us.jpg) no-repeat left top;
 height: 1139px;
 }

#right_display img {
 margin-bottom: -4px;
 }

/* BRANDS */

body#brands #right_container {
 background: #bfd2b4 url(../images/lifestyle/w39_10/brands.jpg) no-repeat left top;
 height: 571px;
 }

body#brands #column a {
 color: #000;
 }
#right_brands img {
 margin-bottom: -3px;
 }

.leftnav {
 float: left;
 display: inline;
 width: 195px;
 list-style-type: none;
 line-height: 1.5em;
 margin: 0 0 0 6px;
 padding: 0;
 }
 
.leftnav dt {
 padding: 0;
 margin: 0;
 line-height: normal !important;
 } 

.leftnav dd {
 padding-bottom: 10px;
 margin: 0;
 font-size: 0.8em;
 color: #eac500;
 line-height: normal !important;
 }

.leftnav li {
 margin-bottom: 12px; 
 }
 
.leftnav li a {
 margin-top: 3px;
 text-transform: uppercase;
 text-decoration: none;
 }
 
.leftnav li a:hover {
 text-decoration: underline;
 }

.leftnav .space {
 margin-bottom: 10px;
 }
 
.left_brand {
 background: red;
 }
 
 
/* PRESS RELATIONS */

body#press #right_container {
 background: #016aab url(../images/lifestyle/w39_10/press.jpg) no-repeat left top;
 height: 571px;
 }
 
body#press #column a {
 color: #000;
 }

body#press #column a:hover {
 text-decoration: underline;
 }
 
/* GIFT CARD */

body#giftcard #right_container {
 background: #e54658 url(../images/lifestyle/w39_10/gift_card.jpg) no-repeat top left;
 height: 854px;
 }
body#giftcard #column a {
 color: #000;
 }

body#giftcard #column a:hover {
 text-decoration: underline;
 }
#right_giftcard img {
 margin-bottom: -3px;
 }

#gift_top_contain {
 float:left;
 width:100%;
}

#gift_right_pic {
 float:right; 
 width:183px;
 height:119px;
}

#gift_title_img {
 float:left;
 width:190px;
}


/* ACCOUNT CARD */
	
body#account_card #apr {
	clear:left;
	}
 
body#account_card #apr h3 {
	font-size:1.3em;
	color: #000;
	margin:0;
	float:left;
	}
	
body#account_card #apr p {
	margin:0;
	padding-top:6px;
	}

body#account_card #right_container {
 background: #c6b79a url(../images/lifestyle/w39_10/account_card.jpg) no-repeat left top;
 height: 854px;
 }
 
body#account_card #column a {
 color: #000;
 }

#right_account_card img {
 margin-bottom: -3px;
 }


#acc_top_contain {
 float:left;
 width:100%;
}

#acc_right_pic {
 float:right; 
 width:183px;
 height:119px;
}

#acc_title_img {
 float:left;
 width:265px;
}


/* LOCATION */

body#location #right_container {
 background: #fe0000;
 width: 56%;
 }
 
.opening_times_table, #easter_trading_hours, .opening_times_bottom_table {
 background-color:#fff;
 width: auto;
 margin: 10px 5px;
 }
.opening_times_table TR, #easter_trading_hours TR, .opening_times_bottom_table tr {
 background-color:#0098C3;
 }
.opening_times_table TD,  #easter_trading_hours TD, .opening_times_bottom_table td {
 background-color:#0098C3;
 }
 
.opening_times_bottom_table {
	margin-top: 10px;
	}

#opening_times_table2 {
 width: 500px;
 margin: 0 0 10px 10px;
 }


/* CAREERS */

body#careers #right_container {
 background: #ba002f;
 }
  
body#careers #column a {
 color: #000;
 }

body#careers #column a:hover {
 text-decoration: underline;
 }

/* NEWSLETTER */

body#newsletter #right_container {
 background: #00b9c6 url(../images/lifestyle/w39_10/newsletters.jpg) no-repeat left top;
 height: 1140px;
 }

body#newsletter #column a {
 color: #000;
 }
 
.newsletterbutton
{
 width: 145px;
 height: 30px;
 color: #fff; 
 background-color: #fabb00;
 font-size: 95%;
 font-weight: bold;
 border: 1px solid #fff;
 padding: 5px 10px 5px 10px;
 cursor: pointer; /* hand-shaped cursor */
}
 
/* CHARITY */

body#charity #column a {
 color: #000;
 }

#charityquote {
 float:left;
 width: 350px;
 font-weight: bold;
}

#charity_top_contain {
 float:left;
 width:100%;
}

/*#charity_right_pic {
 float:right; 
 width:168px;
 height:168px;
}*/

body#charity #right_container {
 background: url(../images/rainbow_main.jpg) no-repeat left top;
 height: 671px;
 width: 51.3%;

 }
 
body#charity #left {
 float: left; 
 width: 46%;
 display: inline;
 margin:0;
 }
 

#charity_title_img {
 float:left;
 width:297px;
}

#charity_content h1 img {
	margin-top: 10px;
	display: block;
	}


/* CONTACT */

body#contact #right_container {
 background: #708e5c url(../images/lifestyle/w39_10/contact_us.jpg) no-repeat left top;
 height: 571px;
 }
 
body#contact #column a {
 color: #000;
 }
 
.contactbutton
{
 width: 145px;
 height: 30px;
 color: #fff; 
 background-color: #1a4795;
 font-size: 95%;
 font-weight: bold;
 border: 1px solid #fff;
 padding: 5px 10px 5px 10px;
 cursor: pointer; /* hand-shaped cursor */
}

/* CAREERS */

#right_careers {
 width: 100%;
 display: inline; 
 float: left;
 }

#right_careers img {
 margin-bottom: -3px;
 }

#right_careers_lifestyle {
 display: inline; 
 float: left;
 }

#right_careers_list {
 display: inline; 
 float: left;
 margin: 0 0 0 0;
 }

#right_careers_list ul {
 list-style-type: none;
 padding: 0px;
 margin: 40px 0 0 20px;
 line-height: 1.5em;
 }

#right_careers_list ul a {
 color: #fff; 
 text-decoration: none;
 }

#right_careers_list li.active a{
 color: #000 !important; 
 font-weight: bold;
 }

#right_careers_list ul a:hover {
 color: #000;
 font-weight: bold;
 }
 
#right_careers_list #vacancies {
 display: none;
 margin: 0 0 0 0px;
 padding: 0px;
}

#right_careers_list #vacancies a {
 color: #FFF !important;
 }
 
#right_careers_list #vacancies a:active, #right_careers_list #vacancies a:hover, #right_careers_list #vacancies a:focus {
 color: #000 !important;
 }

li.active ul.toggle_content {
 display: block !important;
 }

/*  STORE LOCATOR STYLES  */

#store_locator_container {
 display: inline;
 }

#store_locator_left {
 float: left; 
 display: inline;
 width: 55%;
 }

#store_locator fieldset {
 border: 0;
 }

#store_locator input {
 width: 24em;
 border: none;
 margin: 0;
 padding: 0 0 6px 5px;
 font-weight: bold;
 background: #a5acaf !important;
 color: #fff;
 }

#store_locator select {
	margin-bottom: 8px;
	}

.inlineform {
 display: inline;
 }

#store_locator_center {
 float: left; 
 display: inline;
 width: 45%;
 }

#store_locator_center ul {
 list-style-type: none;
 margin-left: 39px;
 }

#store_locator_right {
 width: 100%;
 float: left; 
 display: inline;
 background-color: #0098C3;
 }

.brand_list {
 float: right;
 color: #000;  
 padding: 0;

 }

.brand_list ul {
 line-height: 0.5em;
 }
 
/* force the height of the right hand panel on smaller maps */
#borehamwood_map, #bristol_avon_meads_map, #bristol_longwell_green_map, #bromborough_map, #leicester_map, #llandudno_map, #manchester_map, #newport_map, #norwich_map, #southport_map {
	/*height: 600px;*/
	}
	
#nottingham_map, #peterborough_map, #preston_map, #teesside_map {
	/*height: 650px;*/
	}
 
/****************************************************/
/*      Footer      */
/****************************************************/

#footer {
 clear: both;
 border-top: 3px solid #fff;
 }

div#footer ul {
 background-color: transparent;
 clear: left;
 margin: 6px 0 0 20px;
 padding: 0;
 list-style-type: none;
 }

div#footer li {
 float: left;
 margin: 0;
 padding:0;
 }

div#footer li a {
 float: left;
 display: block;
 }
 
 
 /* new charity styles added */
 
 #right_container.padmeright { margin-right:60px; }