/*
Theme Name:   Gilmours SAP Web Shop
Theme URI:    http://www.gilmours.co.nz/
Description:  Gilmours SAP Web Shop theme by Volkside. Based on 960.gs by Nathan Smith.
Version:      0.10
Author:       Volkside
Author URI:   http://www.volkside.com/
Template:     960.gs
Tags:         gilmours, sap web shop
*/

/*
Colour specifications:
- Background gray: #dcdddf
- Page white: #ffffff
- Gilmours red (logo, primary navi, account area, feature border, catague hierarchy arrows): #e3001b
- Gilmours black (logo): #161418
- Shopping basket summary black (on the right): #231f20
- Text white (header, primary navi, product search, account area, shopping basket summary etc.): #ffffff
- Text gray (browse products, content area, footer): #414042
- Background light gray (content area): #dcddde

Measured columns from PSD:
- left:   187px
- middle: 587px
- right:  171px

Actual columns:
- left:   185px & 5px left padding
- middle: 585xp & 5+5px l/r padding
- right:  170px & 5px right padding
*/

/*
NOTES:
- Be careful with 'products' as it's used as an id and a class name
- In primary navigation 'selected' class is set for LI, in product tree it's set for LI and A
*/

/* use packaged and optimised 960bc */
@import url('960_packaged.css'); 


/* uncomment the following style to view the grid as a background image */
/*.container_12 { background: #fff url("../mimes/images/12_col.gif") repeat-y; }*/

/* Ensure info DIVs don't break page formatting */
div.module-name { padding: 0 !important; margin: 0 !important; }

/* body */
body { background-color: #dcdddf; color: #414042; }

/* font overrides */
body, pre, textarea { font:13px/1.5 Helvetica, Arial, sans-serif; }
input { font:12px/1.0 Helvetica, Arial, sans-serif; }
select { font:12px/1.0 Helvetica, Arial, sans-serif; }

/* heading sizes */
h1 { font-size: 29px; }
h2 { font-size: 16px; margin-bottom: 5px; }
h3 { font-size: 12px; }
h4 { font-size: 12px; }

/* lists */
ul { list-style-type: square; }

/* core structure */
#page { min-height: 800px; margin-top: 5px; }
#page_header { margin-top: 5px; }
#page_inner { min-height: 670px; }
#frame_page_inner { margin-left: 17px; }
#wrapper { background-color: white; /*padding: 0 16px;*/ }
  #header { height: 130px; }
  #content { min-height: 400px; }
  #footer { padding: 5px; color: #808285; border-top: 1px solid #dcddde; }

/* scrolling */
.scroll { overflow: scroll; }
.scroll_x { overflow-x: scroll; overflow-y: visible; }
.scroll_y { overflow-x: visible; overflow-y: scroll; }

/* core column definitions */
.column_left, .column_middle, .column_right { display: inline; float: left; }
.column_left   { width: 185px; padding-left: 5px; }
.column_middle { width: 585px; padding: 0px 5px 0px 5px; }
.column_right  { width: 170px; padding-right: 5px; }

/* header and header parts */
#header div.logo { height: 130px; background: url("../mimes/images/page_corner.png") no-repeat top left transparent; }
#header div.logo img { margin: 29px 0px 0px 0px; padding: 10px 0; }
#header div#search_top { height: 21px; background: url("../mimes/images/product_search_corner.png") no-repeat top left #e3001b; }

#header div.heading { height: 125px; margin: 5px 5px 0px 5px; padding: 0; background: url("../mimes/images/heading_background.png") no-repeat top left transparent; }
#header div.heading #headline { height: 99px; }

#header div.tools { width: 170px; margin: 5px 0px 0px 0px; color: white; }
  #account { height: 50px; margin-bottom: 5px; background-color: #e3001b; }
  #basket_summary { height: 49px; background-color: #231f20; }

div.heading h1 { color: white; font-weight: normal; padding: 45px 0 0 15px;}
div.tools p { font-size: 11px; margin: 0; }
span#user_name { display: block; font-size: 16px; text-transform: uppercase; line-height: 18px; }

/* search panel bottom part */
#search_bottom { /*height: 40px;*/ background-color: #e3001b; }
#search_bottom input[type="text"] { width: 125px; }
#search_bottom input[type="submit"] { width: 35px; min-height: 0; }

/* generic panel class, and some instance-specific customisations */
.panel { padding: 5px; }  /* all panels automatically inherit 5px padding, override where necessary */
.panel h2, .panel h3 { text-transform: uppercase; color: white; margin: 0; }
#products.panel { padding: 0; }
#products.panel h3 { font-weight: normal; color: #e3001b; margin: 15px 0 5px 5px; }
#specials.panel h2 { padding: 5px 0 0 10px;}
.sidebar.panel { padding: 0; }

/* content area */
.contentarea { width: 585px; margin: 5px 5px 0 5px; padding: 0; }
.contentarea.wide { width: 760px; margin: 5px 0 0 0; padding: 0px 5px 0px 5px; }  /* column_middle + column_right */
.contentarea ul { list-style-type: none; list-style-image: url("../mimes/images/red_bullet.png"); }
.contentarea ol li, .contentarea ul li { margin-left: 15px; }
p.norm { margin: 1em 0; }

/* split content area */
.split .primary { width: 350px; float: left; background-color: #dcddde; }
.split .secondary { width: 225px; float: left; background-color: white; padding-left: 10px; }
.split .secondary h3 { border-bottom: 1px solid #414042; margin: 0; }
.split .secondary ul { margin-bottom: 20px; }
.split .secondary a { text-decoration: none; }

/* sidebar */
.sidebar { margin-top: 5px; }
.sidebar h3, div.sidebar h4 { margin: 10px 0; }
.sidebar p { margin-bottom: 5px; }
.sidebar ol li, .sidebar ul li { margin-left: 15px; }
.sidebar li.trading_hours { font-size: 10px; }
.sidebar span.store_name { text-transform: uppercase; }

/* default link colours */
a:link, a:visited { color: #414042; } /* link: #004B91; visited: #743399 */
a:active, a:hover { color: #FF4B33; }
a.disabled { color: #818285; text-decoration: none; }

/* default menu/list link colours for panels and footer */
.panel li a, #footer li a { text-decoration: none; }

/* tools links on top right */
.tools a, .tools a:link, .tools a:visited, .tools a:active, .tools a:hover { color: white; }

/* primary navigation */
ul#primary_navi { margin-top: 5px; width: 595px; overflow: hidden; }
ul#primary_navi li { display: inline; float: left; margin: 0; text-align: center; vertical-align: middle; }
ul#primary_navi li a {
  width: 93px; height: 20px; margin-right: 5px;
  background-color: #e3001b;
  font-size: 12px; color: white; text-transform: uppercase; text-decoration: none;
  display: block; overflow: hidden; vertical-align: middle;
}
ul#primary_navi li a:hover, ul#primary_navi li.selected a { background-color: #818285; }

/* product navigation bar */
#products ul { margin: 0px; }
#products li { list-style-image: url("../mimes/images/red_bullet.png"); margin-left: 25px; word-wrap: break-word; }
#products li.selected { list-style-image: url("../mimes/images/red_bullet.png"); }
#products li.parent { list-style-image: url("../mimes/images/arrow_right.png"); }
#products li.selectedparent { list-style-image: url("../mimes/images/arrow_down.png"); }
#products li a.selected, #products li a.selectedparent { font-weight: bold; }

/* breadcrumb navigation */
ul#breadcrumbs { display: inline-block; font-size: 11px; margin: 0 0 0 -5px; padding: 5px 0 10px 0; }
ul#breadcrumbs li { display: inline; float: left; margin: 0; padding: 0 0 0 5px; }
ul#breadcrumbs, ul#breadcrumbs li a:link, ul#breadcrumbs li a:visited { color: #818285;  }
ul#breadcrumbs li a:hover, ul#breadcrumbs li a:active { color: #FF4B33;  }

/* table navigation */
.table_navi { padding-bottom: 5px; }
.table_navi .results, .table_navi .key { float: left; }
.table_navi ul.pages { float: right; clear: right; display: inline; list-style-type: none; margin: 0; }
.table_navi ul.pages li { display: inline; float: left; }
.table_navi ul.pages li.title { text-transform: uppercase; }
.table_navi ul.pages li.selected { font-weight: bold; }
.table_navi ul.pages a { text-decoration: none; color: #414042;  }

.table_navi .key { background-color: white; padding: 5px; }
.table_navi .key h3 { margin: 0; }
.table_navi .key ul, .table_navi .key li { list-style-type: none; list-style-image: none; }
.table_navi .key li { margin-bottom: 2px; list-style-type: none; list-style-image: none; }
.table_navi .key span.color_key { line-height: 0; padding: 0 4px; }
.table_navi .key span.available_key { background-color: black; }
.table_navi .key span.on_order_key { background-color: #0000ff; }
.table_navi .key span.out_of_stock_key { background-color: #800080; }

/* footer navigation */
ul#footer_navi { float: left; margin: 0; }
ul#footer_navi li, p.copyright { display: inline; float: left; margin: 0; padding: 0 5px; }
ul#footer_navi li { border-right: 1px solid #dcddde; }
ul#footer_navi li.last { border: none; }
p.copyright { float: right; }

/* helper classes */
.float_left { float: left; }
.float_right { float: right; }

.center { text-align: center; }

.no_transform { text-transform: none; }
.bold { font-weight: bold; }
.tip { font-size: 11px; color: #666666; font-style: italic; margin-left: 5px; }
span.filetype { color: #818285; }
		
/* busy animation */
div#busy { text-align: center; }
div#busy p { margin-bottom: 5px; }
	
/* featured specials */
#specials { display: inline-block; width: 761px; height: 211px; margin: 5px 0 5px 5px; padding: 0; background-color: #e3001b; }

/* rounded corners adapted from: http://redmelon.net/tstme/4corners/ */
#specials .top, #specials .top div { width: 100%; height: 24px; }
#specials .top      { background: url("../mimes/images/specials_corner_right.png") no-repeat top right; }
#specials .top div  { background: url("../mimes/images/specials_corner_left_white.png") no-repeat top left; }

/* specials content */
#specials .inner    { display: inline-block; width: 741px; height: 167px; margin: 10px; background-color: white; }
#specials ul { list-style-type: none; }
#specials ul li { float: left; margin: 5px; }

/* general table styling */
table { width: 100%; margin-bottom: 10px; margin-top: 4px; }
table table { margin: 0; }
td, th { padding: 2px 5px; vertical-align: middle; }
thead { background-color: #e3001b; color: white; font-weight: bold; text-transform: uppercase; text-align: left; }
thead th { background-color: #e3001b; }
table a { text-decoration: none; }
table th a, table th a:link, table th a:visited { color: white; }
tr.even td { background: white; }
tr.odd td { background: #eceded; }

/* Product table styling */
table.products select { width: 50px; }
table.products input[type="text"] { height: 12px; width: 60px; }
table.products img { vertical-align: middle }
table.products td { min-height: 24px; }
table.products .code { width: 50px; }
table.products .promo { padding: 0; text-align: right; width: 18px; }
table.products .quantity { text-align: right; width: 66px; }
table.products .unom { width: 50px; text-transform: none; }
table.products .cpq { text-align: right; width: 28px; }
table.products .price { text-align: right; width: 65px; }
table.products tr.disabled, tr.disabled a { color: #818285; }
table.products tr.on_order { color: #0000ff; }
table.products tr.on_order a:link, table.products tr.on_order a:visited { color: #0000ff; }
table.products tr.on_order a:hover, table.products tr.on_order a:active { color: #FF4B33; }
table.products tr.out_of_stock { color: #800080; }
table.products tr.out_of_stock a:link, table.products tr.out_of_stock a:visited { color: #800080; }
table.products tr.out_of_stock a:hover, table.products tr.out_of_stock a:active { color: #FF4B33; }
.cat-prd-prc, .cat-prd-prc-lbl-post, .cat-prd-prc-lbl-post-empty { padding: 0; }

/* forms */
input[type="submit"], input[type="button"], input[type="text"], select { vertical-align: middle; }
input[type="submit"], input[type="button"], button { font-size: 16px; min-height: 30px; overflow: auto; }
fieldset { border: none; padding: 10px 0; }
fieldset legend { font-weight: bold; }

/* disabled table row form controls */
tr.disabled input, tr.disabled select, tr.disabled .hide-when-disabled { visibility: hidden; } 

/* ===========================================
 *  page-specific styles
 * ===========================================
*/

/* 0. login page */
#userid, #password { height:15px; width:120px; font:13px/1.5 Helvetica, Arial, sans-serif; }
#login_error {font-weight:bold; color: red;}
#reminder_message {font-weight:bold;}


/* 1. homepage */
.home .contentarea { background-color: #dcddde; }
.home .contentarea p { padding: 5px; }
.home .column_right img.flybuys { margin: 10px 25px; }
.home #proprietor_photo { margin-left: 5px }

/* 2. my store page */
.my-store .split .primary { width: 330px; padding: 10px; }
.my-store .split .secondary { width: 215px; padding: 10px; }
.my-store .contentarea h3 { font-weight: normal; text-transform: uppercase; border-bottom: 1px solid white; margin-bottom: 5px; padding-bottom: 5px; }
.my-store .sidebar { color: white; background-color: #808285; width: 160px; padding: 0 5px; margin-right: 5px; }
.my-store .sidebar a { color: white; }

/* 3. product (browsing) pages */
body.products .contentarea p { margin: 10px 0 5px 0; }
div#productbrowse { background-color: #dcddde; padding: 5px; width: 565px; }
#productbrowse table { border-bottom: 0px none; margin: 0; padding: 0; }
#productbrowse table td { float: left; width: 30%; padding-bottom: 5px; height: 50px; }
#productbrowse table td span.bullet { background: transparent url('../mimes/images/red_bullet.png') no-repeat left center; float: left; width: 7px; margin-right: 5px; } 
#productbrowse table td a { text-decoration: none; text-transform: uppercase; word-wrap: break-word; list-style-type: square; }

/* 4. product list page */
.product-list .primary { background-color: #dcddde; padding: 5px; min-height: 500px; }
.product-list .primary h2 { text-transform: uppercase; }
.add_to_basket { float: right; padding: 5px 85px 10px 0px; }
.header-sorter { margin: 0; padding:0; vertical-align: middle; float:left; }
.header-sorter-icons { margin-top: 1px; padding: 0; vertical-align: middle; border: 0px; display:block; float: right; }
.sorticon { margin: 1px; display: block; vertical-align: middle; width: 10px; height: 7px; }
.product-description { float:left; }
.product-description-icons { float:right; }
.bp-icon { margin: 1px; vertical-align: middle; width: 16px; height: 16px;}
.bp-icon-legend { width: 16px; height: 16px;}
	
/* 5. product details page */
#product-details .primary { background-color: #dcddde; padding: 5px; min-height: 500px; }
#product-details .primary h2 { text-transform: uppercase; }
#product-details .primary .inner { background-color: white; width: 565px; padding: 5px; }
#product-details .primary .inner div { width: 47%; }
#product-details .primary img.product-image { float: left; }
#product-details p.detail   { font-size: 16px; font-weight: bold; padding-left: 13px; background: url("../mimes/images/red_bullet.png") no-repeat 0px 10px transparent; }
#product-details p.sub_detail { font-size: 12px; font-weight: bold; padding-left: 20px; no-repeat: 0px 10px transparent; }
p.status_message { color: #444243; text-align: left; }
form#add_product { background-color: #dcddde; padding: 0 10px; text-align: center; }
form#add_product input[type="text"] { width: 60px; }
form#add_product input[type="button"] { clear: left; margin: 10px 0; }

/* 9. shopping basket */
div#order_progress { float: left; height: 50px; width: 585px; font-size: 11px;}
#order_progress h3 { display: none; }
#order_progress ul { list-style: none; }
#order_progress li { float: left; margin: 5px 12px; height: 25px; }
#order_progress li span { display: block; float: left; }
#order_progress li span.index { width: 25px; background: transparent url("../mimes/images/order_progress.png") no-repeat left; font-weight: bold; text-align: center; vertical-align: middle; line-height: 25px; color: white;}
#order_progress li span.title { line-height: 13px; vertical-align: middle; overflow: hidden; margin-left: 5px;}
#order_progress li.current span.index { background: transparent url("../mimes/images/order_progress_current.png") no-repeat left; }
#order_progress li.separator { width: 36px; background: transparent url("../mimes/images/arrow.gif") no-repeat 0px 10px; margin:0; }

div.halfed div { padding: 5px }
div.left_half { clear: left; float: left; width: 47%; }
div.right_half { clear: none; float: right; width: 47%; }

.order_end { clear: both; display: block; width: 100%; }
.order_end .order_summary { background-color: #dcdddf; float: left; width: 70% }
.order_end .order_update { clear: none; float: right; /*width: 20%; */ padding: 5px 110px 15px 0px; }

.order_summary dl { padding: 0; }
.order_summary dt { float: left; width: 120px; text-align: left; }
dt:after { content: ':'; }
.order_summary dd { margin: 0 0 0 125px; padding: 0; text-align: right; }

/* 10. Order Instructions */
.payment input[type='radio']:checked + label { font-weight: bold } 
div.order_method { margin-top: 10px; }
li.payment_disclaimer { font-size: smaller; font-style: italic; }
.continue_checkout input { white-space:normal; width: 100px; }
.continue_checkout label { 
	margin-left: 10px;
	position: absolute;
	vertical-align: middle;
	width: 180px;
	white-space: normal;
}
/*label[for="delivery_instructions"] { margin-top: -20px; }*/
textarea#headerComment { height: 40px; }

.ui-datepicker { border: none !important; -moz-border-radius: none; }
#delivery_date_dialog fieldset { padding: 10px 0 0 0; }
#delivery_date_dialog fieldset legend { margin: 0; padding: 0; display: none; }
#delivery_date_dialog label { margin-right: 4px; }
#delivery_datepicker { margin: 20px 0 0 0; }

#delivery_address_dialog div.address { margin: 10px; }
#delivery_address_dialog div.address input { clear: left; float: left; }
#delivery_address_dialog div.address div { clear: none; }

#payment_dialog fieldset { padding: 10px 0 0 10px; margin-bottom: 10px; }
#payment_dialog legend { margin: 5px 0 0 -10px; }
#payment_dialog #cc_table_container { margin-bottom: 5px; max-height: 180px; overflow: auto; }
#payment_type { font-weight: bold; }
#cc_registration_fieldset { text-align: center; }
#cc_registration_fieldset p { text-align: left; }
#cc_registration_fieldset #finished_reg_button { margin-top: 20px; }
#payment_dialog .warn, #payment_dialog .error, #payment_dialog .info { display: block; margin: 5px 0; }
#payment_fieldset { padding: 0; }
#payment_fieldset #selected_cc { margin-left: 22px; }
#credit_card_table {
	border: 0 none;
	background: transparent none;
}
#credit_card_table tr:hover td {
	background-color: #ECEDED;
}
#credit_card_table .radio { padding: 0; text-align: center; width: 21px; }
#credit_card_table .delete { width: 90px }

/* 14. Order Completed */
.completion .contentarea h3 { margin: 10px 0 10px 0; }
.completion .contentarea dl, .completion .contentarea p { margin-bottom: 10px; }

dl.inline dt { float: left; clear: left; margin-right: 5px; }

/* 16. contact us */
h2.message { margin: 0; }
p.message { margin: 0; }
#contact_form { background-color: #dcdddf; padding: 5px; }
#contact_form fieldset { padding: 0; }
#contact_form label { font-weight: bold; display: block; margin-top: 5px;}
#contact_form input[type="submit"] { margin-top: 10px; }
#contact_form input[type="button"] { margin-top: 10px; }

/* 17. my account */
.my-account .split .primary { background-color: transparent; }
.my-account .primary div { background-color: #dcdddf; padding: 5px; margin: 10px 0 15px 0;}
.my-account .primary h3 { margin: 0;}
.my-account pre { margin-left: 20px; }
.my-account .contentarea h2, .my-account .contentarea p { margin: 0; } 

/* 17. My Templates */
.templates h2 { margin: 10px 0 10px 0; }

/* 18. My orders */
.orders h2, .order_products { margin: 10px 0 10px 0; }

/* Store Partners */
.storepartners h2 { margin-bottom: 5px; }
.storepartners .partner { margin: 5px 0 10px 0; padding-bottom: 5px; border-bottom: 1px inset; }
.storepartners .partner .logo { float: left; margin: 5px 10px 0 0; }

/* master template */
#master-template h2 { margin-bottom: 10px; }
#master-template ul , #master-template li { list-style: none !important; list-style-image: none !important; }
#master-template .category-heading { color: white; margin-bottom: 2px; }
#master-template li.category .category-heading { background-color: #E3001B; font-size: 18px; padding-left: 5px; }
#master-template li.sub-category .category-heading { background-color: #818285; font-size: 16px; margin-left: -15px; padding-left: 15px; }
#master-template li.sub-sub-category .category-heading { background-color: #231F20; font-size: 15px; margin-left: -30px; padding-left: 30px; }
#master-template thead th { background-color: white; color: #414042; }
	
/* Error Message */
.error 				{ border: 1px solid #c40026; background: #fff7f2 url(../mimes/images/error.gif) no-repeat 4px 4px; padding: 2px 2px 2px 24px; margin: 0px 0px 3px 0px; color: #c40026;}
.error span			{ text-align:left; }
.error p			{ margin:0; padding:0}
.error-items		{ border: 1px solid #c40026; background: #fff7f2 url(../mimes/images/error.gif) no-repeat 4px 4px; padding: 2px 2px 2px 24px; margin: 0px 0px 3px 0px; text-align:left; color: #c40026; }
.error-items span	{ text-align:left; }

/* Warning Message */
.warn				{ border: 1px solid #ff9900; background: #fffffa url(../mimes/images/warn.gif) no-repeat 4px 4px; padding: 2px 2px 2px 24px; margin: 0px 0px 3px 0px; color: #e97900; }
.warn span			{ text-align:left; }
.warn p				{ margin:0; padding:0 }
.warn-items			{ border: 1px solid #ff9900; background: #fffffa url(../mimes/images/warn.gif) no-repeat 4px 4px; padding: 2px 2px 2px 24px; margin: 0px 0px 3px 0px; text-align:left; color: #e97900; }
.warn-items span	{ text-align:left; }

.non_catalog_msg ul { margin-left: 10px; list-style: square; }
.non_catalog_msg li { float: left; margin: 0 20px 0 30px; }
	
/* Info Message */
.info				{ border: 1px solid green; background: #fafffc url(../mimes/images/info.gif) no-repeat 4px 4px; padding: 2px 2px 2px 24px; margin: 0px 0px 3px 0px; color: green; }
.info span			{ text-align:left; }
.info p				{ margin:0; padding:0; }
.info-items			{ border: 1px solid green; background: #fafffc url(../mimes/images/info.gif) no-repeat 4px 4px; padding: 2px 2px 2px 24px; margin: 0px 0px 3px 0px; text-align:left; color: green; }
.info-items span	{ text-align:left; }

.item-msg-area		{ margin: 0px; padding: 3px 4px 0px 4px !important; }
.header-msg-area	{ margin: 0px; padding: 3px 0px 0px 0px; }

/* EOF */