/* ########################################################################## */
/*                            Common Styles                                   */
/* ########################################################################## */

* {
    border:             none;
    margin:             0;
}

html {
    height:             100%;
}

body {
    font-size:          12px;
    font-family:        verdana, arial, sans-serif;
    text-align:         center;
    margin:             0 auto;
    height:             100%;
    background-color:   #F8F8F8;
    color:              #3D3D3D;
}

h3 {
    font-size:          120%;
    font-weight:        bold;
    text-align:         center;
    color:              #F93A16;
    margin-bottom:      10px;
}

h4 {
    font-size:          100%;
    font-weight:        strong;
    margin-bottom:      10px;
}

a, a:link, a:visited {
    color:              #3D3D3D;
}

a:hover {
    text-decoration:    none;
}

hr {
    border: none;
    border-top:         1px dotted #C8C8C8;
    height: 0px;
    padding-bottom: 1px;
}

div#body {
    max-width:          84em;
    min-width:          64em;
    min-height:         45em; /* Added - minimum height for the body */
    margin:             0 auto;
    background-color:   #FFFFFF;
    padding-top:        2px; /* changed from 15px in original CSS */
}


div#content {
    width:              98%;
    margin:             0px 5px 0px 10px;
    text-align:         left;
}

div#workspace {
    /*min-height:         30em;*/
}

ul {
    margin-left: 0px;
    padding-left: 30px;
}

ul.standardlist li {
    padding-bottom: 5px;
}

/* ########################################################################## */
/*                            Banner Styles                                   */
/* Name changes for convenience:                                              */
/* head              => banner                                                */
/* user_info_wrap    => dashboard                                             */
/* user_info_content => dashboard_content                                     */
/* ########################################################################## */

div#banner {
    display:            inline-block;
    border-bottom:      1px solid #000000;
    width:              100%;
}

div#banner:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#banner td#logo {
    height:             120px;
    vertical-align:     bottom;
}

div#banner td#custlogo {
    height:             120px;
    vertical-align:     bottom;
}

div#banner div#dashboard {
    float:              right;
    width:              23em;
    border:             1px solid #D6EDFF;
    min-height:         95px;
    font-size:          11.4px;  /* Added - overriding the content font size */
    margin: 0px;
    padding: 0px;
}

div#dashboard_high_half {
    margin-top:         11px; /* changed from 17px in original CSS */
    background-color: #FFF;
    width: 21em;
    padding-left: 1em;
    padding-right: 1em
}

div#dashboard_low_half {
    background-image:   url('images/new/user-info-bg2.gif');
    background-position: top left;
    background-repeat:  repeat-x;
    padding-bottom: 11px;
    padding-top: 4px;
    margin-bottom: 4px;
    width: 21em;
    padding-left: 1em;
    padding-right: 1em
}

div#banner div#dashboard div#dashboard_content {
    margin:             0px;
    padding:            0px;
    display:            inline-block;
    word-wrap:          break-word;
}

div#banner div#dashboard div#dashboard_content:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#banner div#dashboard div#dashboard_content div.row {
    width:              21em;
    clear:              both;
}

div#banner div#dashboard div#dashboard_content div.row div.left {
    float:              left;
    text-align:         right;
    width:              47%;
}

div#banner div#dashboard div#dashboard_content div.row div.right {
    float:              right;
    text-align:         left;
    width:              47%;
}

div#banner div#dashboard div#dashboard_content div#view_order {
    padding-bottom:     5px;
}

table {
    font-size: 100%;
}

.newsarea {
    margin: 0px;
    padding: 10px;
    padding-top: 1px;
    background-color:   #FFF;
}

/* ########################################################################## */
/*                               Menu Styles                                  */
/* Name changes for convenience:                                              */
/* a.products        => a.catalogue                                           */
/* a.mynetxpress     => a.my                                                  */
/* ########################################################################## */

ul#top_menu {
    background-image:   url('images/new/top-menu-bg.gif');
    background-repeat:  repeat-x;  
    background-color:   #CFCFCF;
    height:             100%;
    width:              100%;
    list-style:         none;
    margin:             0px;
    padding-left:       0px;
    display:            inline-block;
    font-size:          11.4px; /* Added - overriding the content font size */
}

ul#top_menu:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

ul#top_menu li {
    display:            inline;
    float:              left;
    height:             2.9em;
    background-image:   url('images/new/top-menu-divide.gif');
    background-repeat:  no-repeat;
    background-position: top right;
}

ul#top_menu li ul {
    position:           absolute;
    display:            block;
    left:               -999 em;
    visibility:         hidden;
    z-index:            9999;
    margin:             0;
    padding:            0;
    background-color:   #F8F8F8;
}

ul#top_menu li:hover ul {
    display:            block;
    top: auto;
    left:               auto;
    visibility:         visible;
    position:           absolute;
    border:             1px solid #C4C4C6;
}

* html ul#top_menu iframe {
	position: absolute;
	/* account for the border */
	z-index: 0;
	filter: progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);
}

ul#top_menu li.over ul {
    display:            block;
    position:           absolute;
    left:               auto;
    visibility:         visible;
    z-index:            99;
    border:             1px solid #C4C4C6;
    width:              auto;
}

ul#top_menu li ul li {
    z-index:            999;
    float:              none;
    display:            block;
    border-top:         1px dashed #C4C4C6;
    background-image:   none !important;
    background-color:   #F8F8F8;
    min-width:          100px;
    width:              100%;
}

ul#top_menu li ul li a {
    width:              150px;
    text-align:         left;
    display:            block;
    position:           relative;
    background-color:   #F8F8F8;
    background-image:   none;
    font-weight:        normal;
    text-decoration:    none;
    height:             2.9em;
    text-indent:        5px;
}

ul#top_menu li ul li a:hover {
    background-color:   #C9DEF1;
    text-decoration:    none;
}


ul#top_menu li.small {
    background-image:   url('images/new/top-menu-divide-sm.gif');
    background-position: 0% 50%;
    background-repeat:  no-repeat;
    float:              right;
    height: 2.9em;
}

ul#top_menu li a {
    height:             30px;
    display:            block;
    color:              #03163E;
    text-decoration:    none;
    font-weight:        bold;
    line-height:        30px;
    text-align:         center; 
    padding:            0 10px;
}

ul#top_menu li a.home {
    width:              5%; /* Changed from 10% in the original CSS */
}

/* ## Only hover for actual links in the menu. No hover for dropdowns ## */
ul#top_menu li a.home:hover {
    text-decoration:    underline;
}

/* ## Other standard dropdown menus ## */
ul#top_menu li a.orders, a.catalogue, a.support, a.nx, a.functions, a.super {
    width:              5%;
    cursor:             default;
}

/* ## Slight change for My NetXpress & Print On Demand dropdown menus ## */
ul#top_menu li a.my, a.cp {
    text-align:         left;
    padding:            0px !important;
    padding-left:       5px !important;
    padding-right:      5px !important;
    cursor:             default; /* Added - no link, so default cursor */
}

ul#top_menu li.small a {
    padding:            0;
    height: 2.9em;
}

ul#top_menu li.small a.help {
    width:              6em;
    text-align:         center;
    background-image: url('images/new/top-menu-questionmark.gif');
    background-repeat: no-repeat;
    background-position: 90% 40%;
}

ul#top_menu li.small a.contact_us {
    width:              8.5em;
    text-align:         center;
    background-image: url('images/new/top-menu-contact.gif');
    background-repeat: no-repeat;
    background-position: 95% 35%;
}

ul#top_menu li.small a img {
    vertical-align:     middle;
    display: inline-block;
}

ul#top_menu li.small a.sign_out {
    width:              6em;
}

/* ########################################################################## */
/*                            Search Bar Styles                               */
/* ########################################################################## */

div#search {
    background-color:   #071440;
    height:             3em;
    line-height:        3em; /* Added - for vertical alignment */
    width:              100%;
    display:            inline-block;
    position:           relative;
}

div#search:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#search div.left {
    margin-left:        5px;
    float:              left;
}

div#search div.right {
    margin-right:       5px;
    float:              right;
}

/* ## Added to accommodate for font change for IE5.5, IE6 ## */
div#search div.left table, div#search div.right table {
    color:              #FFFFFF;
    font-weight:        bold; 
    font-size:          11.4px;
}

div#search select {
    height:         18px; /* Added - to match the height of the searchbox */
    font-size:      12px;
}

div#search input.text_box {
    width:              250px; /* Changed from 305px in original CSS */
    height:             18px;
    font-size:          12px;
    border:             1px solid #C0C0C0;
    padding-left:       3px; /* Added - slight padding for text */
}

/* ########################################################################## */
/*                         Default Page Styles                                */
/* ########################################################################## */

div#page_content {
    margin-top:         1px;
    display:            inline-block;
    width:              100%;
}

div#page_content:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

/* ## New div for welcome/search page since they are laid out differently  ## */
div#welcome {
    float:              left;
    width:              100%;  /* changed from 79% in original CSS */
    font-size:          105%;
}

div#search_results_page {
    float:              left;
    width:              48em;
    width:              76%;
    font-size:          105%;
}

div#compare_results_page {
    float:              left;
    width:              48em;
    width:              98%;
    font-size:          105%;
}

/* ## Making breadcrubs div generic enough so its not tied to one div ##      */
div#breadcrumbs {
    height:             100%;
    background-color:   #E4E4E4;
    color:              #07173B;
    margin-bottom:      15px;
    padding-bottom:     5px;
    width:              100%;
    line-height:        1em;
}

div#breadcrumbs.alert {
    background-image:  url("icons/alert_question.gif");
    background-color: #FFD;
    background-repeat: no-repeat;
    background-position: 2px top;
}

span.bold a.correction:hover {
    text-decoration: none !important;
}

span.bold a.correction {
    display: inline !important;
    margin-bottom: 0px !important;
    margin-left: 0px !important;
    font-style: italic;
    text-decoration: underline !important;
}

div#breadcrumbs .breadcrumb {
    padding: 3px;
    margin:  0px ! important;
    margin-right: 10px ! important;
    margin-left: 10px ! important;
    padding-left: 10px;
    border-bottom:      1px solid #D1D2D4;
    float: none;
    display: block;
    background-color: #FFF;
}

div#page_content div#left_menu_wrap ul#left_menu li a.breadcrumb:hover {
    text-decoration:    line-through;
    color: #ff0000;
}

span.cross {
    color: #000000;
    font-size: 12px;
    font-weight: bold;
    padding-right: 2px;
}

div#breadcrumbs p {
    padding:            5px 0px 5px 10px;
}

div#breadcrumbs.alert p {
    padding:            5px 0px 5px 35px;
}

/* ########################################################################## */
/*                          Login Page Styles                                 */
/* ########################################################################## */

div#login {
    font-size:          100%; /* Changed from 115% in original CSS */
}

div#login div#top {
    display:            block;
    width: 100%;
}

div#login div#top:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#login div#top div#login_box {
    width:              48%; /* Changed from 46% in original CSS */
    background-color:   #C9DEF1;
    height:             15em;
    float:              left;
}

div#login div#top div#login_box div#choose_country {
    background-image:   url('images/new/left-menu-head-bg.gif');
    background-repeat:  repeat-x;
    background-color:   #061441;
    height:             28px; /* Added - explicitly defining height */
    line-height:        28px;
    text-align:         center;
    color:              #FFFFFF;
}

div#login div#top div#login_box div#choose_country label {
    font-weight:        bold;
}

div#login div#top div#login_box div#login_form {
    color:              #666664;
    text-align:         center;
}

div#login div#top div#login_box div#login_form label {
    font-weight:        bold;
    margin-right:       10px;
    font-size:          90%; /* Added - reducing form label size */
}

div#login div#top div#info_box {
    width:              52%; /* Changed from 53% in original CSS */
    float:              left;
}

div#login div#top div#info_box div#header {
    background-color:   #EEEEEE;
    line-height:        2em;
    text-align:         right;
}

div#login div#top div#info_box div#header a {
    background-image:   url('images/new/arrow-right.gif');
    background-repeat:  no-repeat;
    background-position: 0% 50%;
    padding-left:       10px;
    margin-right:       30px;
}

div#login div#top div#info_box div#info_content {
    color:              #666666;
    width:              90%;  /* Changed from 80% in original CSS */
    margin-top:         20px; /* Changed from 'margin: 20px auto' in orig CSS */
    margin-left:        30px;
}

div#login div#top div#info_box div#info_content ul#new_to_list {
    margin:             0px;
    list-style:         none;

}

div#login div#top div#info_box div#info_content ul#new_to_list li {
    background-image:   url('images/new/arrow-right.gif');
    background-repeat:  no-repeat;
    background-position: 0% 50%;
    padding-left:       10px;
    margin-left:        0px; /* Changed from -40px in original CSS */
    margin-top:         5px;
}

div#liquor {
    margin:             0 10px;
    color:              #878787;
    font-size:          80%; /* reducing font size for warning */
}

div#disclaimer {
    margin:             10px 10px;
    color:              #878787;
    font-size:          80%; /* reducing font size for warning */
}

/* ########################################################################## */
/*                           Left Menu Styles                                 */
/* ########################################################################## */

div#page_content div#left_menu_wrap {
    margin-right:       5px;
    font-size:          11.4px; /* Added - reducing font size for left menu */
}

div#page_content div#left_menu_wrap ul#left_menu {
    width:              100%;
    list-style:         none;
    margin:             0px;
    padding-left:       0px;
    display:            inline-block;
    background-color:   #EDF4FA; /* Changed from #EEEEEE in original CSS */
    /*background-image:   url('images/new/left-menu-footer-bg.gif');*/
    /*background-repeat:  no-repeat;*/
    /*background-position: bottom center;*/
}

div#page_content div#left_menu_wrap ul#left_menu:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#page_content div#left_menu_wrap ul#left_menu li.search {
    display:            inline;
    float:              left;
    width:              100%;
    text-align:         left;
    border-bottom:      1px solid #FFFFFF;
    background-color:   #FFFFFF;
}

div#page_content div#left_menu_wrap ul#left_menu li {
    display:            inline;
    float:              left;
    width:              100%;
    text-align:         left;
    border-bottom:      1px solid #FFFFFF;
}

div#page_content div#left_menu_wrap ul#left_menu li a {
    display:            block;
    margin:             8px 0 8px 10px;
    color:              #3E3E3E;
    text-decoration:    none;
}

div#page_content div#left_menu_wrap ul#left_menu li a:hover { 
    text-decoration:    underline;
}

div#page_content div#left_menu_wrap ul#left_menu li.header {
    background-image:   url('images/new/left-menu-head-bg.gif');
    background-repeat:  repeat-x;
    background-color:   #07143E;
    height:             100%;
    line-height:        28px;
    color:              #FFFFFF;
    font-weight:        bold;
    text-indent:        10px;
}

div#page_content div#left_menu_wrap ul#left_menu li.header_search {
    background-image:   url('images/new/left-menu-head-bg-grey.gif');
    background-color:   #A4A7B6;
    color:              #000000;
}

div#page_content div#left_menu_wrap ul#left_menu li.header_alert {
    background-image:   url('images/new/left-menu-head-bg-yellow.gif');
    background-color:  #FFD;
    color:              #000000;
}

div#page_content div#left_menu_wrap ul#left_menu li.header p {
    background-image:   url('images/new/left-menu-refine.gif');
    background-repeat:  no-repeat;
    background-position: 90% 10%;
}

div#page_content div#left_menu_wrap ul#left_menu li.header img {
    position:           relative;
    /*top:                -2px;*/
    vertical-align:     middle;
    margin-left:        10px;
}

div#page_content div#left_menu_wrap ul#left_menu li.category {
    background-color:   #C9DEF1;
    color:              #3E3E3E;
    text-decoration:    none;
    font-weight:        bold; 
    width: 100%;
    padding:            10px 0px 10px 0px;
}

div.category_label {
    margin-left: 10px;
}

div#page_content div#left_menu_wrap ul#left_menu li a.category_item {
    display:            block;
    margin:             8px 0 8px 20px;
    color:              #3E3E3E;
    text-decoration:    none;
}

div#page_content div#left_menu_wrap ul#left_menu li a.category_item:hover {
    text-decoration:    underline;
}

/* ########################################################################## */
/*                             Welcome Styles                                 */
/* ########################################################################## */

div#welcome div#summary {
    margin:             5px 0px 5px 0px;
    padding:            10px 0px 3px 0px;
    height:             12em;
    background:         url('images/new/welcome_blue_gradient.png') repeat-x top left;
    border:             solid 1px #CAD9EF;
}

div#welcome div#summary p#lob {
    float:              left;
    padding:            0px 30px 0px 30px;
}

div#welcome ul#main {
    margin:             15px 0px 15px 20px;
    padding-left:       220px;
}

div#welcome ul#links {
    padding-left:       2px;
    list-style:         none;
}

/* ## Added new li style for bottom padding on lists ## */
div#welcome ul#main li {
    padding-bottom:     3px;
}

div#welcome ul#links li {
    background:         url('images/new/single_arrow.png') no-repeat left;
    padding:            8px 0px 8px 25px;
    border-bottom: 1px dotted #C8C8C8;
    margin-top: 0px;
    margin-bottom: 0px;
}

div#welcome ul#links li.no_rule {
    border: none;
}

div#welcome ul#links li.category {
    background-color:   #F3F3F4;
    background-image:   none;
    padding-top:        10px;
    padding-bottom:     10px;
    font-weight:        bold;
}

/* ## Added new style, no text decoration for hrefs ## */
div#welcome ul a {
    text-decoration:    none;
}

/* ## Added new style, on hover, underline ## */
div#welcome ul li a:hover{
    text-decoration:    underline;
}

div#welcome table#summary {
    width:              100%;
    font-size:          1em;
    border:             solid 1px #D1D2D4;
    margin-bottom:      1em;
}

div#welcome table#summary td {
    vertical-align:     top;
    padding:            10px;
}

/* ## Added new no padding cell style for browse products list ## */
div#welcome table#summary td.nopadding {
    vertical-align:     top;
    padding:            0px;
}

div#welcome table#summary td.header {
    padding:            0px;
    padding-left:       10px;
    vertical-align:     middle;
    color:              #3E3E3E;
    font-weight:        bold;
    width:              280px;
    height:             30px;
    border-bottom:      1px solid #D1D2D4;
    background:         url('images/new/welcome_gray_gradient.png') repeat-x top left;
    text-transform:     uppercase;
}

div#welcome table#summary td.header span.headerarrow {
    padding-left:       30px;
    background:         url('images/new/double_arrow.png') no-repeat left;
}

/* ########################################################################## */
/*                          Merchandise Styles                                */
/* ########################################################################## */

div.complementary_items {
    display: block;
    margin-bottom: 15px;
    width: auto;
    height: auto;
    border: 1px solid #D1D2D4;
    padding: 5px;
    background-image:   url('images/new/related-products-bg.gif');
    background-repeat:  repeat-x;
}

div.complementary_items div.complementary_items_heading {
    font-size:          100%;
    font-weight:        bold;
    clear:              both;
    float:              left;
    margin-bottom:      6px;
}


div.complementary_items div.merch_3up {
    float: left;
    width: 32%;
    margin: 3px;
    clear: none;
}

div.complementary_items div.merch_2up {
    float: left;
    width: 47%;
    margin: 3px;
    clear: none;
}

div#merchandise_banner {
    height: 170px;
    margin-bottom: 1px;
    width: 100%;
    background-position: top right;
    background-repeat: no-repeat;
}

div#search_results_page div#merchandise {
    display:            block;
    margin-bottom:      15px;
    width:              100%;
    height:             180px;
}

div#search_results_page div#merchandise_large {
    display:            inline-block;
    margin-bottom:      15px;
    width:              100%;
    height:             260px;
}

div#search_results_page div#merchandise:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#search_results_page div#main_merchandise {
    background-image:   url('images/new/product-detail-bg.gif');
    background-repeat:  no-repeat;
    background-position:top right;
    background-color:   #F4F6FC;
    width:              60%;
    height:             100%;
    height:             180px;
    margin-right:       5px;
    float:              left;
    position:           relative;
    overflow:           hidden;
}

div#search_results_page div#main_merchandise_single {
    background-image:   url('images/new/related-products-bg.gif');
    background-repeat:  no-repeat;
    background-position:top left;
    background-color:   #F4F6FC;
    width:              100%;
    height:             100%;
    height:             180px;
    padding-bottom:     5px;
    margin-right:       5px;
    float:              left;
    position:           relative;
    overflow:           hidden;
}

div#search_results_page div#merchandise_superhero {
    background-image:   url('images/new/product-detail-bg.gif');
    background-repeat:  no-repeat;
    background-position:top left;
    border-top:         2px solid #AAA;
    border-bottom:      2px solid #AAA;
    background-color:   #F4F6FC;
    width:              100%;
    height:             100%;
    height:             260px;
    padding-bottom:     5px;
    margin-bottom:      10px;
    float:              left;
    position:           relative;
    overflow:           hidden;
}

div#merchandise_superhero p.black_fg {
    font-size: 130%;
    padding-bottom: 0.5em;
}

div#merchandise_superhero table {
    margin: 0;
    padding: 0;
    width: 250px;
}

div#merchandise_superhero td.product_image_wrap {
    width:              250px;
    height:             250px;
    line-height:        250px;
    border:             1px solid #EBEBEB;
    background-color:   #FFF;
    vertical-align:     middle;
    overflow:           hidden;
    margin: 0;
    padding: 0;
}

div#search_results_page div#main_merchandise_single div#product_image {
    float:              left;
    margin:             5px;
    width:              34%
}

div#search_results_page div#merchandise_superhero div#product_image {
    float:              left;
    margin:             5px;
    width:              270px;
    height:             260px;
}

div#search_results_page div#main_merchandise_single div#product_description {
    float:              left;
    margin:             5px;
    color:              #666666;
    width:              62%;
}

div#search_results_page div#main_merchandise:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#search_results_page div#main_merchandise div#product_image {
    float:              left;
    margin:             5px;
    width:              32%
}


div#search_results_page div#main_merchandise div#product_image img {
    /*border:             1px solid #ECECEC;*/
}

div#search_results_page div#main_merchandise div#product_description {
    float:              left;
    margin:             5px;
    color:              #666666;
    width:              62%;
}

div#search_results_page div#main_merchandise div#product_description div#additional_info {
    font-size:          85%;
}

div#search_results_page div#side_merchandise {
    background-image:   url('images/new/related-products-bg.gif');
    background-repeat:  repeat-x;
    background-color:   #E4EEF4;
    width:              38%;
    height:             180px;
    float:              left;
    font-size:          11.4px;
    color:              #666666;
    word-wrap:          break-word;
}

div#search_results_page div#side_merchandise div.related_product table {
    float: left;
}

div#search_results_page div#side_merchandise div.related_product {
    margin:             3px 3px 3px 3px;
}

div#search_results_page div#side_merchandise div.related_product:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#search_results_page div#side_merchandise div.related_product p {
    width:              60%;
    float:              right;
}

div#search_results_page div#side_merchandise div.related_product p a {
    text-decoration:    none;
    color:              inherit;
}

div#search_results_page div#side_merchandise div.related_product p a:hover {
    text-decoration:    underline;
}

* div.merch_fadeout {
    width: 100%;
    height: 64px;
    background-image: url(images/new/grad-fade.png);
    background-repeat: repeat-x;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 30;
}

/* ########################################################################## */
/*                          Search Results Styles                             */
/* ########################################################################## */

div#search_results div#search_results_header {
    background-color:   #C9DEF1;
    display:            inline-block;
    padding:            0px;
    height:             150%;
    width:              100%;
    border:             1px dotted #A9A9A9;
}
div#search_results div#search_results_header:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#search_results div#search_results_header div#product_count {
    float:              left;
    width:              240px; /* changed from 250px, 300px, in original CSS */
    padding: 5px;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

div#search_results div#search_results_header div#paging {
    float:              right;
    text-align:         right;
    width:              180px; /* changed from 260px, 350px in original CSS */
    height:             20px;
    padding: 5px;
    padding-top: 10px;
    padding-right: 10px;
}

div#search_results div#search_results_header div#paging a img {
    vertical-align:     -40%;
}

div#search_results div#search_results_header div#paging a, div#paging span {
    font-weight:        bold;
    margin:             0 2px;
    text-decoration:    none;
}

div#search_results div#search_results_header div#paging a:hover {
    text-decoration:    underline;
}

div#search_results table#results {
    width:              100%;
    margin:             0 auto;
    margin-top:         2px;
    font-size:          1em;
    border-left:        2px solid #E4E4E4;
    border-right:       2px solid #E4E4E4;
}

div#search_results table#results tr {
    text-align:         left;
    color:              #000000; /* changed from #666666 in original CSS */
}
div#search_results table#results tr th {
    /*text-decoration: underline;*/
    font-weight:        bold;
    font-size:          11.4px; /* Added - reducing size of tbl heading */
    background-color:   #E4E4E4; /* Added - background color for tbl heading */
    white-space:        nowrap;
    vertical-align:     top;
}
div#search_results table#results tr td {
    vertical-align:     top;
    word-wrap:          break-word;
    border-bottom:      1px dotted #A9A9A9; /* Added - border for each cell */
}

div#search_results table#results tr td.description a {
    text-decoration:    none;
}
div#search_results table#results tr td.description a:hover {
    text-decoration:    underline;
}

div#search_results table#results tr td.description div.info_images {
    margin-top:         3px;
}

div#search_results table#results tr td.description a.cp_link {
    text-decoration: underline;
    font-weight: bold;
}

div#search_results table#results tr td.description a.cp_link:hover {
    text-decoration: none;
    font-weight: bold;
}


div#search_results table#results tr td.description div.prodcode {
    font-size:          80%;
    font-weight:        bold;
    padding-top:        3px;
}

div#search_results table#results tr td.description div.prodcode span {
    color:              #3D3D3D;
}

/* icons for contract_item, earthsaver, locally_made  */
img.description_icon {
    border:             1px solid #656565;
    margin: 1px;
    margin-top: 2px;
    margin-bottom: 0px;
}

/* ## Added new div class to format the image in the table cell ## */
div#search_results table#results tr td.description_image {
    width:              80px;
    height:             80px;
    text-align:         center;
    background-color:   #FFF;
    border:             1px solid #EBEBEB;
    vertical-align:     middle;
}

div#search_results table#results table tr td.description_noimage {
    width:              80px;
    height:             80px;
    line-height:        80px;
    border:             none;
}

div#search_results table#results tr.odd {
    background-color:   #F8F8F8;
}

div#search_results table#results tr.selected {
    background-color:   #EFF5FA;
}

div#search_results table#results tr.selected td {
    border-top:         1px dotted #A9A9A9;
    border-bottom:      1px dotted #A9A9A9;
}

div#search_results table#results td input.qty_text {
    border:             1px solid #7F9DB9;
    width:              45px;
    float:              left;
    margin-right:       3px;
}

div#search_results table#results td input.button {
    font-size:          10.2px;
    margin-top:         10px;
    margin-bottom:      5px;
}

td div.qty_arrows {
    width:              2px;
    float:              left;
    margin-right:       3px; /* changed from 25px in original CSS */
}

td div.qty_arrows:first-child {
    margin-top:         -3px;
    /* only applied in firefox */
}

td div.qty_arrows a img {
    padding-bottom:     2px;
}


/* ########################################################################## */
/*                             Blowup Styles                                  */
/* Name changes for convenience:                                              */
/* product_details   => blowup                                                */
/* a.mynetxpress     => a.my                                                  */
/* ########################################################################## */

div#blowup {
    width: 100%;
}

div#blowup div#detail:after {
    content:            ".";
    visibility:         hidden;
    display:            block;
    height:             0;
    clear:              both;
}

div#blowup div#detail div#product_image {
    float:              left;
    margin-bottom:      10px;
}

/* ## Added a image wrap div to define a set area for image ## */
/* Not associating it with blowup */
div#product_image td.product_image_wrap {
    width:              250px;
    height:             250px;
    line-height:        250px;
    background-color:   #FFF;
    border:             1px solid #EBEBEB;
    text-align:         center;
    vertical-align:     middle;
    overflow:           hidden;
}

div#product_image td.product_image_wrap_120 {
    width:              120px;
    height:             120px;
    line-height:        120px;
    background-color:   #FFF;
    border:             1px solid #EBEBEB;
    text-align:         center;
    vertical-align:     middle;
    overflow:           hidden;
}

/* Not associating it with blowup */
div#product_image div.product_image_wrap div.noimage, td#product_image div.product_image_wrap_120 div.noimage {
    font-family:        arial;
    font-weight:        bold;
    font-size:          110%;
    color:              #000000;
}


div#blowup div#detail div#product_description {
    margin-right: 0px;
    padding-right: 0px;
    margin-bottom: 10px;
    font-size:     100%; /* changed from 110% in original CSS */
    color:         #444444; /* changed from #656565 in original CSS */
}

div#blowup div#detail div#product_description table td {
    vertical-align:     top;
    width:              50%;
}

div#blowup div#detail div#product_description table td.longdesc {
    font-weight:        bold;
    width:              40%;
    padding-bottom:     5px;
    background-color:   #FFE5E1;
}

div#blowup div#detail div#product_description table td .cnetdesc {
    text-align:     justify;
    padding-right:  15px;
    margin-top:     10px;
    margin-bottom:  10px;
    font-weight:    normal;
}

div#blowup div#detail div#product_description table td input.qty_text {
    border:             1px solid #7F9DB9;
    width:              45px; /* changed from 40px in original CSS */
    float:              left;
    margin-right:       3px;
}

div#blowup div#detail div#product_description table td div.qty_arrows {
    width:              2px;
    float:              left;
}

div#blowup div#detail div#product_description table td div.qty_arrows:first-child {
    margin-top:         -3px;
    /* only applied in firefox */
}

div#blowup div#detail div#product_description .product_details {
    width: 70%;
}

div#blowup div#detail div#product_image p#report_error{
    height:             100%;
    background-color:   #EEEEEE;
    line-height:        25px;
    color:              #676767;
    padding-left:       10px;
    margin-top:         5px;
    margin-bottom:      5px;
    /*width:              100%;*/
}
div#blowup div#detail div#product_image p#report_error a {
    color: #676767;
}

div#blowup div#detail td#product_image p#report_error img {
    margin-right: 5px;
    vertical-align: middle;
}

div#blowup div#detail {
    clear: both;
}

div#blowup div#detail .cnetspecs {
    clear: both;
}

div#blowup div#detail .mtext {
    clear: both;
    margin-top:    10px;
    margin-bottom: 15px;
}

div#blowup div#detail .mtext .ce_mtext {
    text-align:  left;
    font-size:   10px;
    font-weight: bold;
    color:       #ff0000;
}

div#blowup div#detail .mtext .cnet_mtext p {
    margin-top:    5px;
    margin-bottom: 10px;
    text-align:     justify;
    padding-right:  15px;
}

div#blowup div#detail .show_all_mtext {
    text-align: right;
}

/* ########################################################################## */
/*                  Substitution Prompt Styles                                */
/* ########################################################################## */

p#substitutionprompt a {
    color:              #000000;
    text-decoration:    none;
}

p#substitutionprompt a:hover {
    text-decoration:    underline;
}

table#substitutionprompt a {
    color:              #000000;
    text-decoration:    none;
}

table#substitutionprompt a:hover {
    text-decoration:    underline;
}

/* ########################################################################## */
/*                             Footer Styles                                  */
/* ########################################################################## */

div#footer {
    margin-top:         20px;
    border-top:         1px dotted #C8C8C8;
    color:              #000000;
    text-align:         center;
    padding:            15px 0px 15px 0px;
    font-size:          90%; /* Changed from 90% in original CSS */
}

div#footer a {
    color:              #000000;
    text-decoration:    none;
}

div#footer a:hover {
    text-decoration:    underline;
}

/* ########################################################################## */
/*                             Footer Styles                                  */
/* ########################################################################## */

p.smalltext {
    font-size: 90%;
}

p.inline-description {
    padding: 0;
    margin-bottom: 4px;
}

input[type="button"], input[type="reset"], input[type="submit"] {
    color:              #666666;
    border:             1px solid #7F9DB9;
    padding:            2px 3px;
    font-size:          11.4px;
    font-family:        verdana, arial, sans-serif;
    font-weight:        bold;
    background-image:   url('images/new/btn-bg.gif');
    background-repeat:  repeat-x;
    background-position: top left;
}

input[type="text"], input[type="password"], textarea, select {
    border:             1px solid #7F9DB9;
    margin-right:       3px;
    color:              #000000;
    font-size:          12px;
    font-weight:        normal;
    font-style:         normal;
    font-family:        verdana, arial, sans-serif;
}

/* Have to duplicate the above CSS for IE6 and lower - works in conjunction   */
/* with the creating of the class names in the ie6.js                         */

textarea.textareaclass {
    border:             1px solid #7F9DB9;
    margin-right:       3px;
    color:              #000000;
    font-weight:        normal;
    font-style:         normal;
    font-family:        verdana, arial, sans-serif;
}

input.submitclass, input.buttonclass, input.resetclass {
    color:              #666666;
    border:             1px solid #7F9DB9;
    padding:            2px 3px;
    font-size:          11.4px;
    font-family:        verdana, arial, sans-serif;
    font-weight:        bold;
    background:         url('images/new/btn-bg.gif') repeat top left;
}

input.textclass, input.passwordclass {
    border:             1px solid #7F9DB9;
    margin-right:       3px;
    color:              #000000;
    font-weight:        normal;
    font-style:         normal;
    font-size:          12px;
    font-family:        verdana, arial, sans-serif;
}

input.btn-arrowright {
    background:         url('images/new/btn-arrowright.gif') no-repeat top left;
    width:              20px;
    height:             20px;
    border:             none;
}

textarea {
    font-size:          11.4px;
}

div.box {
    border-width:       1px;
    border-style:       solid;
    border-color:       #000000;
}

/* ## Added a span to format the product count next to category ## */
span.product_count {
    font-weight:        normal;
    font-size:          80%;
    color:              #2375BF;
}

/************* commonly used classes ************/

p.text {
    padding-bottom: 8px;
}

.clear {
    clear: both;
}
.bold, .boldtext {
    font-weight: bold;
}
.left {
    float:  left;
}
.underline {
    text-decoration: underline !important;
}
.padding_left_20 {
    padding-left: 20px;
}
.padding_right_10 {
    padding-right: 10px;
}
.padding_top {
    padding-top:    15px;
}
.padding_bottom_10 {
    padding-bottom:      10px;
}
.padding_bottom_5 {
    margin-bottom:      5px;
}
.error {
    color:              red;
    font-weight:        bold;
}

* td.complementary_item_image, * td.merchandise_thumbnail_image {
    width:              80px;
    height:             80px;
    
    text-align:         center;
    background-color:   #FFF;
    border:             1px solid #EBEBEB;

    vertical-align:     middle;
    margin-right:       5px;
}

.complementary_item {
    float: left;
    width: 31%;
    clear: none;
}

.complementary_item p {
}

.complementary_item a {
}

.complementary_item a:hover {
    text-decoration:    underline;
}

.complementary_item a:hover p {
    text-decoration:    underline;
}

* input.component_error {
    border:             2px solid #ff0000 !important;
    /*background-color:   #ff0000;*/
}

* textarea.component_error {
    border:             2px solid #ff0000 !important;
}

.bigheading {
    color:              #06143F;
    font-size:          120%;
    font-weight:        bold;
    margin-top:         5px;
    margin-bottom:      15px;
    border-bottom:      dotted 1px #A4A7B6;
    text-transform:     uppercase;
    /*text-align:         center;*/
}

.heading {
    color:              #F93A16;
    font-size:          150%;
    font-weight:        bold;
    margin-top:         15px;
    margin-bottom:      15px;
}

.sign {
    text-align:         right;
    color:              #670500;
    font-style:         italic;
    margin-top:         10px;
    margin-bottom:      10px;
}

.pageform {
    background-color:   #F2F2F2;
    padding-top:         10px;
    padding-bottom:      10px;
    padding-left:        5px;
    padding-right:       3px;
    border:             1px solid #E4E4E4;
    margin-bottom: 	15px;
}

/* this is used on the View Order page */
.pageform2 {
    background-color:   #F2F2F2;
    padding-top:         5px;
    padding-bottom:      5px;
    padding-left:        5px;
    padding-right:       3px;
    border:             1px solid #E4E4E4;
}

.no_bg {
    background:         none;
}

.lightgrey_bg {
    background:         #F8F8F8;
    border:             1px solid #E4E4E4;
    padding-left:       10px;
    padding-right:      5px;
    padding-top:        10px;
    padding-bottom:     10px;
}

.palegrey_bg {
    background-color:   #E4E4E4;
}

.brightblue_bg {
    background-color:   #D6ECFF;
}

.outline2 {
    background-color: #000;
    color: #FFF;
}

.black_fg {
    color:              #000000;
}

/* ########################################################################## */
/*                      Table Generator Style classes                         */
/* ########################################################################## */

/* This is to narrow up the view order table for the wider cases */
div.vieworder {
    width:          100%;
    overflow:       auto;
}

span.linenote {
    display: inline-block;
    padding-top: 4px;
}

span.order_item_linenote {
    font-size: 90%;
    white-space: nowrap;
    margin-left: 2px;
};

table.vieworder {
    width: 99%;
}

table.tabgen td {
    font-size:          100%;
    padding-top:        4px;
    padding-bottom:     4px;
}

tr.error
{
     BACKGROUND-COLOR: #FEEBB1; 
    BACKGROUND-COLOR: #CCCCCC;
}

tr.submenu {
    color:              #FFFFFF;
    font-size:          11.4px;
    font-style:         normal;
    font-family:        verdana, arial, sans-serif;
    background-color:   #FFFFFF;
}

th.submenu, th.submenu a {
    color:              #FFFFFF;
    font-style:         normal;
    background-color:   #000032;
    padding-bottom:     5px;
    padding-top:        5px;
}

th.header {
    font-size:          8pt;
    padding-left:       10px;
}

.rowcolor_primary td, .rowcolor2 td, .rowcolor_secondary td, th.submenu {
    padding-left: 4px; padding-right: 4px;
}

.rowcolor_primary {
    background-color:   #F8F8F8;
}

.rowcolor_secondary, .rowcolor {
    background-color:   #D7ECFF;
}

tr.rowcolor2, tr.rowcolor2 a:hover{
    BACKGROUND-COLOR: #4FADF3;
    color:#FFFFFF;
}

.darkbgcolor
{
    BACKGROUND-COLOR: #000032;
}

td.bodycolor2
{
    COLOR: #FFFFFF;
    BACKGROUND-COLOR: #000032;
}


DIV.hidden { display: none }
DIV.visible { }


TD.separator
{
    border-bottom-style: solid;
    border-width: 2px;
    border-color: #000032;
    border-spacing: 2em;
}

BODY.printorder
{
    BACKGROUND-COLOR: #FFFFFF;
}

/* #### FROM catalogue_access.xsl ###### */
.visible { }
.invisible { display: none }
tr.table_header th { font-weight: bold }
/* Doesn't seem to do anything */
#item_deny_checkboxes, #item_deny_bulk,  #item_deny_checkboxes td, #item_deny_bulk td { text-align: left; width: 100%; border: solid 1px #C8C8C8; }


/* user messages see ttml/lib/message */
 
ul.message_list {
 position:      relative;
 padding-left:  0;
 list-style:    none;
 padding-bottom: 2px;
 padding-top:    2px;
}

div.message {
    border-top: 1px dashed;
    border-bottom: 1px dashed;
    border-left: 0px;
    border-right: 0px;
    margin: 10px 0px;
    padding:15px 10px 15px 70px;
    background-repeat: no-repeat;
    background-position: 10px center;
}

div.spacer {
    clear:both;
}

td.settings-link {
    background-color: #edf4fa;
    text-align: center;
}

table.settings-group-comments {
    width: 100%;
    background-color: #FFF;
    border: 1px solid #448;
}

table.settings-group-comments th {
    border-bottom: 2px solid #448;
}

table.settings-group-comments td {
    border-bottom: 1px solid #448;
    padding: 4px;
}

table.hasborder {
    border: 2px solid #CFCFCD !important;
}

table.hasborder td {
    border: 1px solid #CFCFCD !important;
}
div.message_success {
 border-color: #484;
 background-color: #DFD;
 background-image: url("icons/message_success.gif");
}

div.message_info {
 border-color:      #448;
 background-color:  #edf4fa;
 background-image:  url("icons/message_info.gif");
}

div.message_warning {
 border-color:      #884;
 background-color:  #FFD;
 background-image:  url("icons/message_warning.gif");
}

div.message_error {
 border-color:      #844;
 background-color:  #FDD;
 background-image:  url("icons/message_error.gif");
 color:             #ff0000;
 font-weight:       bold;
}

div.message_substitute {
 border-color: #884;
 background-color: #FFD;
 background-image: url("icons/message_warning.gif");
 background-position: 10px 15px;
 color: #111100;
 font-weight: bold italic;
}

/* ########################################################################## */
/*                Div styles for Lines of Business block                      */
/* ########################################################################## */

div#lines_of_business {
    border-bottom:      1px dotted #A9A9A9;
    border-top:         1px dotted #A9A9A9;
    background-color:   #EEEEEE;
    margin-top:         10px;
    margin-bottom:      10px;
}

div#lines_of_business img.header {
    margin:             15px 0px 0px 15px;
}

div#lines_of_business table {
    margin:             0 auto;
    font-size:          11.4px;
}

div#lines_of_business table td {
    text-align:         center;
}

.bg_alt {
    background-color:   #D6ECFF;
}

/* ########################################################################## */
/*            Styles for NX table tabs                                        */
/* ########################################################################## */

div#NXTabbed {
    background-image: none;
    font-size: 11px;
    width: 98%;
}

div#NXTabs {
    background-image: none;
    float: left;
    clear: both;
    font-size: 11px;
    font-weight: bold;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 15px;
    width: 98%;
}

div#NXTabsContent {
    width: 98%;
    background-image: none;
    clear: both;
    float: left;
    font-size: 11px;
    border-top: solid;
    border: solid;
    border-top-width: 8px;
    border-bottom-width: 10px;
    border-color: #CCE0EE;
    margin-bottom: 30px;
}

div.NXTabOn {
    display: inline;
    float: left;
    width: 125px; 
    height: 20px;
    color: black;
    text-align: center;
    padding-top: 10px;
    background-image: url(/media/images/blowup_tab_on.jpg);
}

div.NXTabOff {
    display: inline;
    float: left;
    width: 125px; 
    height: 20px;
    color: #06143F;
    text-align: center;
    padding-top: 10px;
    background-image: url(/media/images/blowup_tab_off.jpg);
}

div.NXTabOff a,
div.NXTabOff a:link,
div.NXTabOff a:visited {
    color: #06143F;
    text-decoration: none;
}

div.NXTabOff a:hover {
    color: #F93A16;
    text-decoration: underline;
}

div.NXTabs img {
    float: right;
    padding-top: 6px;
    padding-right: 3px;
}

div.NXTabsRow {
    clear: both;
    margin: 0px;
    padding-left: 14px;
    min-height: 25px;
}

div.NXTabsStripe {
    background-color: rgb(239,245,250);
}

div.NXTabsLabel {
    font-weight: bold;
    display: inline;
    float: left;
    padding: 5px 4px;
    font-size: 11px;
    width: 30%;
    text-align: left
}

div.NXTabsValue {
    display: inline;
    float: left;
    padding: 5px 4px;
    font-size: 11px;
    text-align: left;
    width: 65%;
}

div.NXTabsData {
    padding: 0px;
}

div.NXTabsData h4 {
    clear: both;
    margin-bottom: 0px;
    padding: 4px;
    background-color: #E4E4E4;
}

/* ########################################################################## */
/*            Styles for Pop Up Modal Div                                     */
/* ########################################################################## */

#popupdiv {
	position:           absolute;
	visibility:         hidden;
	width:              500px;
	left:               20px;
	top:                300px;
	background-color:   #CCE0EE;
	border:             2px solid #3D3D3D;
	padding:            10px;
}

#popupdivclose {
	float:              right;
}

#popupdiv h1 {
    font-size:          12px;
    font-weight:        bold;
}

#popupdiv p {
    font-size:          12px;
    font-weight:        normal;
}

#popupdiv hr {
    color:              #3D3D3D;
    border:             none;
    height:             2px;
    margin-top:         10px;
    margin-bottom:      10px;
    background-color:   #3D3D3D;
    clear:              both;
}

#popupdiv img {
    float:              left;
}

#popupdiv div.popupdivtext {
    float:              left;
    width:              450px;
    margin-left:        10px;
    margin-bottom:      10px;
}