/*
------------------------------------------------------------
This style sheet will contain all the layout for the site
"BexterWear"
It will be devided into sections:
	General
	Pages:
		General to all
		Specific

COLOURS:
Body bg						:#F8F8F8
Content bg					:#FFF
Header bg					:#F8F8F8
Menu bar bg					:#D8D6D6
Menu bar a					:#000
Footer bg					:#FFF
Footer a					:#000
Footer p					:#000

lnk btn clr                 :#6E6E6E
lnk btn brdr                :#D6D6D6
lnk btn brdr sel            :#ed2b28    Bexter Red (Used to be Orange)
lnk btn hover               :#D6D6D6
lnk btn hover brdr          :#          Bexter Red (Used to be Orange)

btn clr                     :#6E6E6E
btn brdr                    :#D6D6D6
btn hover brdr              :#          Bexter Red (Used to be Orange)

err msg                     :#          Red

second tier menu a          :#878787

Front description bg		:#FBF9FA

prod img border             :#D6D6D6
prod img border:hover       :#          Bexter Red (Used to be Orange)

txt box clr                 :#6E6E6E
tbl delivery                :#EFEFEF
tbl total sep brdr          :#          Bexter Red (Used to be Orange)
------------------------------------------------------------
*/

/*
------------------------------------------------------------
					General for all
------------------------------------------------------------
*/

html, body, form
{
    margin: 0;
    padding: 0;
    /*height: 100%;*/
}

html
{
    overflow-y: scroll; /* To force scrollbars regardless of content length */
}

body
{
    background: #F8F8F8 url('../gfx/bg/page-bg.gif') repeat-x left top;
}

* html body
{
	behavior: url('scripts/csshover3.htc');
	}

.clearer
{
    clear: both;
}

/*

Layout of site shell

*/

/*entire content area*/
#main_container
{
    width: 960px;
    margin: 0 auto 0 auto;
    background-color: #FFF;
}
* html #main_container
{
    height: 100%;
}

/*also entire content area*/
#content
{}
 /*footer*/
#footer
{
	float:left;
    background: transparent url('../gfx/bg/header_grad.jpg') repeat-y left top;
    height: 28px;
    width: 940px;
    padding-left: 10px;
    padding-right: 10px;
} 
#footer p
{
    padding: 4px 0 0 0;
}

/*

Layout of site around content area

*/

/*header*/
#header
{
	width:960px;
    height: 138px;
    background: transparent url('../gfx/bg/header_grad.jpg') repeat-y left top;
    float:left;
}

/*logo in header*/
#logo
{
    margin-top: 20px;
    margin-left: 20px;
    border:none;
    float:left;
}
* html #logo /* The logo alone is a transparent png so is fixed here for IE6 */
{
   behavior: url(png-fix/iepngfix.htc);
}

#header img
{
	border:none;
	}

#header table.login
{
	float:right;
	margin-right:14px;
	margin-top:28px;
	color:#efefef;
	font-size:11px;
	}
#header table.login td
{
	padding-right:4px;
	padding-bottom:2px;
	}
	
#header table.login td a
{
	color: #85827D;
	}
	
#header .button
{
	padding:0;
	margin:0;
	border:none;
	background:#85827D none;
	color:#d6d6d6;
	height:18px;
	line-height:18px;
	width:32px;
	}
	
.login_txt
{
	background-color:#000;
	border:solid 1px #85827D;
	height:15px;
	width:100px;
	color:#d6d6d6;
	}

/*main menu bar at top*/
div#menu-bar
{	
	height: 26px;
	width:960px;
    float:left;
    clear:left;
    margin-top:6px;
    text-transform:uppercase;
    letter-spacing:1px;
}


div#menu-bar div.basket
{
	float:right;
	margin-bottom:5px;
	padding-right:4px;
	height:25px;
	background:transparent url('../gfx/shopping-basket.jpg') no-repeat;
	}
	
div#menu-bar div.basket a
{
    text-transform:none;
	color: #FFF;
    padding-left:28px;
    line-height:26px;
    }

div#menu-bar div.logout
{
	width:50px;
	height:26px;
	line-height:26px;
	text-align:center;
	float:right;
	margin-bottom:5px;
	}
	
div#menu-bar div.welcome
{
	
	height:26px;
	line-height:26px;
	text-align:center;
	float:right;
	text-transform:none;
	color: #FFF;
	margin-bottom:5px;
	}
	
/*TODO*/	
div#menu-bar div.logout a
{
	color:#85827D;
	}
	
div#menu-bar ul
{
	float:left;
    list-style:none;
    padding:0;
    margin:0;
}
div#menu-bar ul li
{
    float: left;
    height: 26px; 
    padding:0;
    margin:0;
    font-size:16px;
}
* html div#menu-bar ul li  /*  Because IE6 NEEDS a width */
{
    width: 103px;
}
div#menu-bar ul li a
{
    display: block;
    height: 20px; 
    line-height:16px;
    padding-right: 20px;
    padding-left: 20px;
    color: #85827D;
}
* html div#menu-bar ul li a  /* Because with a width in IE6, they will need to be centred */
{
    margin: 0 auto;
    padding-right:30px;
}
div#menu-bar ul li a:hover, 
div#menu-bar ul li a.top-selected
{
    color:#fff;
}

/*
------------------------------------------------------------
					General styles
------------------------------------------------------------
*/

.button
{
	font-family: Arial;
    margin:0;
    padding:0 12px 0 12px;
    border:solid 1px #D6D6D6;
    background:transparent url('../gfx/bg/btn.gif') repeat;
    color:#6E6E6E;
    height:26px;
    line-height:20px;
    font-size:11px;
    cursor:pointer;
    cursor:hand;
    }
    
.button:hover
{
	color:#ed2b28;
	border:solid 1px #ed2b28;
	}
	
a.linkbutton_default
{
	display:block;
	height:24px;
	line-height:24px;
	background:transparent url('../gfx/bg/lnkbutton_grad.gif') no-repeat;
	padding-left:25px;
	padding-right:21px;
	font-size:11px;
	color:#6E6E6E;
	margin:0;
	border:solid 1px #D6D6D6;
	}

a.linkbutton_default:hover
{
	background:transparent url('../gfx/bg/lnkbutton_grad_hover.gif') no-repeat;
	border:solid 1px #ed2b28;
	}
	
.textbox
{
    color:#6E6E6E;
    margin:0;
    padding:0;
    }
	
.err_msg
{
	color:Red;
	font-size:11px;

	}
	
input.text-short
{
    width: 30px;
}

input.text-medium
{
    width: 150px;
}

input.text-long
{
    width: 200px;
}

.float_breaker
{
	clear:both;
	height: 0 !important;
	overflow: hidden;
	}

/*
------------------------------------------------------------
					Modal Popup
------------------------------------------------------------
*/
.modal-bg 
{
	background-color:Gray;
	filter:alpha(opacity=70);
	opacity:0.7;
}
.modal-small
{
    padding:20px;
  	background-color: White;
	border: solid 1px #D6D6D6;
	min-height: 210px;
	width: 300px;
	overflow:hidden;
}

.modal-medium
{
	background-color: White;
	border: solid 1px #D6D6D6;
	height: 278px;
	width: 432px;
	padding: 8px;
	overflow:hidden;
}

.modal 
{
	background-color: White;
	border: solid 1px #D6D6D6;
	height: 358px;
	width: 432px;
	padding: 8px;
	overflow:hidden;
}
.modal-close
{
    text-align:right;
    padding:0px 5px 5px 0px;
}

/*
------------------------------------------------------------
					Table forms
------------------------------------------------------------
*/

table.form_layout
{
	border:0;
	margin:10px 0 10px 20px;
	}
	
table.form_layout td
{
	padding:4px 8px 0 0;
	}
	
table.form_layout td.header
{
	font-weight:bold;
	text-align:right;
	vertical-align:top;
	}
	
table.form_layout td.item
{
	text-align:left;
	}
	
table.form_layout td.controls
{
	text-align:left;
	}


/*
------------------------------------------------------------
						Pages
------------------------------------------------------------
*/

/*
------------------------------------------------------------
					Two column layout
------------------------------------------------------------
*/

#main-page-content
{
    
}

/*
------------------------------------------------------------
					One column layout
------------------------------------------------------------
*/

div#catalogue
{
    padding-left: 20px;
    padding-top:25px;
}

/*
------------------------------------------------------------
					Second Tier Menu
------------------------------------------------------------
*/

#second-tier-menu
{
    
}

* html second-tier-menu
{
    
}
#second-tier-menu ul
{
	list-style:none;
	padding:0;
	margin:0;
	}
	
#second-tier-menu ul li
{
	font-size:10px;
	margin:0;
	padding:0;
	}
	
#second-tier-menu ul li a
{
    display: block;
    color: #878787;
    padding: 7px 0 7px 35px;
    width: 153px;
    font-weight: bold;
    font-size: 12px;
    background: transparent url('../gfx/bg/link-underline.gif') no-repeat right bottom;
}

#second-tier-menu ul li a:hover, 
#second-tier-menu ul li a.selected
{
    background: transparent url('../gfx/bg/link-hover3.gif') no-repeat top left;
}

/*
------------------------------------------------------------
						Front page
------------------------------------------------------------
*/
div#front-page-container
{
    /*background: #FFF url('../gfx/bg/hero_front-page.jpg') no-repeat left top;*/
    height: 340px;
}

div#front-page-buttons
{
    width: 273px;
    float: right;
    padding-right: 7px;
}

div#front-page-buttons a img
{
    margin-top: 11px;
    border:none;
}

div#bottom-buttons
{
    padding: 10px 7px 0 7px;
}


/*div#front-description .clearfix
{
    padding: 10px 25px;
    width: 308px !important;
    background: #FBF9FA url('../gfx/bg/long-front-bar.gif') no-repeat right top;  
}*/


div#front-right-panel
{
    float: left;
    background: #FBF9FA url('../gfx/bg/front-right.gif') no-repeat right bottom;  
    width: 571px;
    min-height: 85px;
    margin-left: 10px;
    padding-bottom: 2px;
}

* html div#front-right-panel
{
    height: 85px;
}

div#front-right-panel img
{
	border:none;
	}

div#front-right-inner
{
    padding: 10px 25px;    
    width: 521px;
    height: 65px;
    background: #FBF9FA url('../gfx/bg/long-front-bar.gif') no-repeat right top;  
}

div.traditional-preknotted
{
    margin-right: 15px;
    float: right;
    display: inline;
    width: 200px;
    border: solid 1px #D6D6D6;
    background-color: #323232;
}

a.front-link
{
    display: block;
    background-color: #323232;
    height: 20px;
    padding-top:4px;
    padding-bottom:4px;
    text-align: center;
}

a img
{
    border: 0;
}

/*
------------------------------------------------------------
					Catalogue list
------------------------------------------------------------
*/

.prod-image-container  
{
	float:left;
	margin:10px 20px 20px 0;
	border: solid 1px #D6D6D6;
	}
	
.prod-image-container img
{
	border:none;
	}
	
.prod-buttons
{
	border-top: solid 1px #D6D6D6;
	width:200px;
	}
	
.prod-buttons a
{
	float:left;
	border:none;
	width:74px;
	padding-right:0;
	display:block;
	height:24px;
	line-height:24px;
	background:transparent url('../gfx/bg/link-box.gif') no-repeat 0 8px;
	padding-left:25px;
	font-size:11px;
	color:#6E6E6E;
	margin:0;
	}

.prod-buttons a.more_info{	
	border-right:solid 1px #D6D6D6;
}

.prod-buttons a:hover
{
	background:transparent url('../gfx/bg/link-hover.gif') no-repeat 0 8px;
	}
	
/*
------------------------------------------------------------
					Catalogue view
------------------------------------------------------------
*/

.product_images
{
	padding:0;
	margin:0;
	width:432px;
	float:left;
	margin-right:8px;
	}
	
.product_images .main_image
{
	border:solid 1px #D6D6D6 !important;
	margin:0;
	margin-right:8px;
	}
	
.product_images img
{
	margin:0;
	border:solid 1px #D6D6D6;
	float:left;
	margin-bottom:8px;
	}
	
.product_description
{
	float:left;
	/*height:162px;
	overflow:auto;*/
	width:270px;
	margin-top:15px;
	margin-bottom:8px;
	}

.product_purchase
{
	float:left;
	width:275px;
	}
	
table.product_size_items
{
	float:left;
	width:280px;
	/*height:78px;*/
	}
	
table.product_size_items td.product_item_size .linkbutton_catalogue,
table.product_size_items td.product_item_size .linkbutton_catalogue_selected
{
	width:102px;
	}
	
table.product_size_items td.product_item_price
{
	line-height:11px;
	width:120px;
	}

	
a.linkbutton_catalogue
{
	display:block;
	height:24px;
	line-height:24px;
	background:transparent url('../gfx/bg/link-box.gif') no-repeat 0 8px;
	padding-left:25px;
	padding-right:21px;
	font-size:11px;
	color:#6E6E6E;
	margin:0;
	border:solid 1px #D6D6D6;
	}

a.linkbutton_catalogue_selected
{
	display:block;
	height:24px;
	line-height:24px;
	background:transparent url('../gfx/bg/link-hover.gif') no-repeat 0 8px;
	padding-left:25px;
	padding-right:21px;
	font-size:11px;
	color:#ed2b28;
	margin:0;
	border:solid 1px #ed2b28;
	}

a.linkbutton_catalogue:hover,
a.linkbutton_catalogue_selected:hover
{
	background:transparent url('../gfx/bg/link-hover.gif') no-repeat 0 8px;
	}
	
.product_sizechart
{
	float:left;
	width:95px;
	height:20px;
	text-align:left;
	font-size:11px;
	border:solid 1px #D6D6D6;
	padding-top:5px;
	padding-left:8px;
	padding-right:45px;
	color:#6E6E6E;
	background:transparent url('../gfx/tape_measure.gif') no-repeat 100px 5px;
	display:block;
	}
	
.product_add_to_basket
{
	float:right;
	width:275px;
}
	
.product_error
{
	float:left;
	width:100%;
	height:22px;
	line-height:22px;
	}
	
.product_add_to_basket table
{
	float:right;
	margin-right:8px;
	/*line-height:28px;
	font-weight:bold;
	font-size:14px;*/
	}
	
.product_add_to_basket .price
{
	line-height:28px;
	font-weight:bold;
	font-size:14px;
	}
.product_add_to_basket .price p
{
	line-height:14px;
	text-align:left;
}
	
.product_add_to_basket .textbox
{
	float:right;
	height:19px;
	width:21px;
	padding:3px 2px 0 2px;
	text-align:right;
	margin-right:8px;
	}
	
.product_add_to_basket .button
{
	float:right;
	}
	
.product_on_sale
{
    border:solid 1px #ed2b28;
    padding:6px 12px 6px 12px;
    text-align:center;
    color:#ed2b28;
    min-height:60px;
    float:left;
    margin-bottom:16px;
    width:250px;
    }
    
.product_on_sale h2
{
    margin:0;
    padding:0 0 6px 0;
    }
	
/*
------------------------------------------------------------
					Size Chart
------------------------------------------------------------
*/
#size-chart 
{
    float:left;
    border:solid 1px #D6D6D6;
    padding:12px;
    width:406px;
    height:224px;
}

#size-chart img
{
	float:left;
	}

#size-chart-copy 
{
    float:left;
    margin-left:50px;
    padding-top:30px;
    width:250px;
}
/*
------------------------------------------------------------
					Shopping Basket
------------------------------------------------------------
*/

tr.sep
{
	height:4px;
	}

table.basket
{
    float:left;
	text-align:left;
	width:694px;
}
table.basket th
{
	font-size:12px;
	padding-left:10px;
	padding-right:10px;
	background:#EFEFEF;
	height:30px;
	font-weight:normal;
}

td.sum-text
{
    text-align:right;
    font-weight:bold;
    padding-bottom:5px;
}

table.basket td
{
}

table.basket td a img.hero_image
{
	background-color:#D6D6D6;
	padding:1px;
	margin-right:8px;
	}

table.basket td a:hover img.hero_image
{
	background-color:#ed2b28;
	}
	
table.delivery
{
	float:left;
	width:576px;
	text-align:left;
	background-color:#efefef;
	margin-top:10px;
	margin-bottom:10px;
	}
	
table.delivery td
{
	padding:5px;
	}
	
table.total
{	
	width:576px;
	float:left;
	margin-bottom:10px;
	}
	
table.total td
{
	padding:2px 5px;
	}
	
table.total tr.sep td
{
	background-color:#000000;
	height:1px;
	line-height:1px;
	padding:0;
	margin:0;
	}
	
.payment
{
	clear:both;
	float:right;
	margin-top:20px;
	}
	
table.basket_total
{
	float:right;
	width:400px;
	}
	
table.basket_total .linkbutton_default
{
	float:right;
	width:120px;
	margin-left:8px;
	}
	
/*
------------------------------------------------
        Order Confirmation
------------------------------------------------
*/

table.ordercon
{
	text-align:left;
	margin-bottom:10px;
	margin-left:10px;
	width:830px;
}
table.ordercon th
{
	font-size:12px;
	padding-bottom:10px;
	text-align:left;
}

table.ordercon td
{
    padding-bottom:5px;
}
	
table.ordercon tr.sep
{
	/*background-image:url('../gfx/bg/basket_item_sep.gif');
	background-repeat:repeat-x;
	background-position:center;*/
	height:4px;
	}
	
table.ordercon .linkbutton_default
{
	float:right;
	width:120px;
	margin-left:8px;
}
	
table.ordercon td img.hero_image
{
	background-color:#ed2b28;
	padding:1px;
}
	
	
/*
------------------------------------------------------------
					Address Maintenance
------------------------------------------------------------
*/
.address_list_item
{
	float:left;
	margin:10px 20px 20px 0;
	border: solid 1px #D6D6D6;
	padding:5px;
	width:210px;
	
	}
	
.address_list_item table
{
	float:left;
	margin-bottom:8px;
	}
	
.address_list_item a.linkbutton_default
{
	width:48px;
	float:left;
	margin-left:3px;
	}
	
	
	
	
/** BREAD CRUMBS **/
.breadcrumbs ul, 
.breadcrumbs li { list-style-type:none; padding:0; margin:0; height:55px; }		
.breadcrumbs { border:1px solid #D6D6D6; margin:0px 20px 20px 0px; }
.breadcrumbs li { float:left; line-height:3.5em; color:#777; padding-left:1em; }
.breadcrumbs li p { background:transparent url(../gfx/crumbs.gif) no-repeat right center; display:block; line-height:55px; padding:0 20px 0 0; margin:0; }		
/** 
    Used for linking only 

.breadcrumbs li a:link,
.breadcrumbs li a:visited { color:#777; text-decoration:none; }	
.breadcrumbs a:link, 
.breadcrumbs a:visited,	
.breadcrumbs li a:hover,
.breadcrumbs li a:focus { color:#ed2b28; }

**/					
.breadcrumbs p.selected { color:#ed2b28;  }

.gap { margin-top: 20px; }

.mc { width: 200px; }
.sc { width: 50px; }
.smc { width: 150px; }
.mlc { width: 250px }


.right-al { text-align:right; }
.right { text-align: right; }


/*
------------------------------------------------------------
        Shopping Basket - bottom Panels
------------------------------------------------------------
*/
.sb-panel { border:solid 1px #D6D6D6; height: 140px; float:left; width:216px; margin-right:20px; text-align:center; }
.sb-panel h3 { margin:0px; text-align:center; margin-bottom:10px; height:28px; line-height:28px; padding:0;}
.sb-panel p { padding:0px 10px 0px 10px; font-size:11px; }

.sb-panel .gap { margin-top: 10px; }
.sb-panel .textbox{ font-size:11px;}

.outline    {border-color:#ed2b28;}

.outline h3   {color:#ed2b28;}

.del-row { background-color:#efefef; padding:10px; padding-bottom:10px; }
.total-row { padding-top:5px; padding-bottom:5px; font-weight:bold; }
.total-row td { padding:5px 20px 5px 0; }
.sep-row { height: 20px; }

.error_basket { color:Red; }
.error_basket ul { list-style-type:circle; }

/*
------------------------------------------------------------
        Shopping Basket - bottom Panels
------------------------------------------------------------
*/

.accordionHeader
{
	background-color:#ffffff;
	color:#0000ff;
	font-size:12px;
    font-family: Arial;
    color: #6E6E6E;
    cursor:pointer;
    padding:5px;
    /*border:solid 1px #efefef;*/
    font-weight:bold;
}

.accordionContent, .accordionContent p 
{
	font-size:12px;
    font-family: Arial;
    color: #6E6E6E;
    padding:5px;
}

.accordionHeaderSelected
{
	background-color:#efefef;
	color:#0000ff;
	font-size:12px;
    font-family: Arial;
    color: #6E6E6E;
    cursor:pointer;
    font-weight:bold;
    padding:5px;
}

.accordionHeader:hover, .accordionHeaderSelected:hover
{
	color:#ed2b28;
}


ul.page-list li { line-height:20px; }





/** Trying to get the text to fit on the line **/
.tb-pinfo-qty { width:10px; }
.price-sale-display-single { padding-top: 7px; }