/* ----------------------------------------------------------------------------
 * Provides the base CSS for Eway.ca
 *
 * Naming convention for this CSS:
 * - The first curly brace must be on the same line of the CSS selector
 * - The dash (-) is used to separated CSS class words
 * - All properties must be alphabetically sorted
 *
 * CSS Declaration example:
 *
 * .my-css-class-example {
 *      background-color: #000
 *      border: 1px solid #FFF;
 *      color: #FFF;
 *      display: block;
 *      margin: 0;•a:visited
 *      padding: 0;
 *      text-align: left;
 * }
 * ------------------------------------------------------------------------- */

html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;	        
}

body {
    margin: 0;
    
/* --- WCAG --- */
    /*color: Black;*/
    background-color : White;
}


/* --- WCAG --- */
strong {
    font-weight: bold; /* Used to ensure style consistency on the Strong tag */
}


/* ----------------------------------------------------------------------------
 * HTML elements section                                                            
 * - Provides the basic CSS classes to be used for basic html elements
 * ------------------------------------------------------------------------- */
.std-table {
}


/* Generally used on first column when description*/
table td.description-std {
    font-weight: bold;
    padding: 3px;
    text-align: left;
    vertical-align: middle;
    width: 500px;
}

/*Used when displaying money/sum/amount*/
table td.money-std {
    text-align: right;
    width: 100px;
}

/* ----------------------------------------------------------------------------
 * CSS classes for Group Order Warning Page
 * ------------------------------------------------------------------------- */
.go-warning-page-title {
    color: #CC0000;
    display: block;
    font-family: Arial, Verdana, sans-serif;
    font-size: x-large;
    margin: 15px 0;
    padding: 0;
    text-align: left;
}

.go-warning-page-font {
	font-family: Arial, Verdana, sans-serif;
	font-size: medium;
	color: #000;
}

.go-warning-page-link, .go-warning-page-link a:link, .go-warning-page-link a:active, .go-warning-page-link a:visited {
    font-family: Arial, Verdana, sans-serif !important;
    font-size: medium;
	color:#005EC2 !important;
}
/* ----------------------------------------------------------------------------
 * Titles section                                                            
 * - Provides the basic CSS classes to be used for titles
 * ------------------------------------------------------------------------- */
.page-title {
    color: #CC0000;
    display: block;
    font: bold 15pt Arial, Verdana, sans-serif; /*WCAG : was 20px*/
    margin: 15px 0;
    padding: 0;
    text-align: left;
}

#contentStart {
    width: 100%;
}

.action-title {
    background-color: transparent;
    color: #808080;
    display: block;
    font: bold 15pt Verdana, Arial, sans-serif; /*WCAG : was 20px*/
    margin: 15px 0;
    padding: 0;
    text-align: left;
}

/* ----------------------------------------------------------------------------
 * Navigation menu section                                                            
 * - Provides the basic CSS classes to be used for the main navigation menu
 * - *Should provides the basic CSS classes for the category navigation menu
 * ------------------------------------------------------------------------- */

/* The navigation holder */
.nav-holder {
    background: transparent url('../Images/navigation.gif') no-repeat right 0;    
    margin: 0;
    padding: 0;
    position: relative;
}

.nav-holder-square-corner {
    background: transparent url('../Images/navigation.gif') no-repeat center 0;    
    margin: 0;
    padding: 0;
}

/* Main class for the navigation */
.nav {
    background-color: transparent;
    color: #FFF; 
    font: 10pt Arial, Helvetica, sans-serif; /*WCAG : was 13px*/
}

/* Provides the style for the "Hello {BuyerName}" */
.nav .nav-user-info {
    font: 11pt Arial, Helvetica, sans-serif; /*WCAG : was 14px*/
    height: 31px;
    padding: 0 0 0 7px;
    width: 220px;
    position : relative;
}


/*  Tooltip related CSS for Hello Buyer */
.tooltip-username {
    background-color: #FFFFDA;    
    border: 1px solid #808080;
    border-radius: 5px;
    color: #151515;
    cursor: default;
	display: block;
	padding: 5px 3px;
	position: absolute;
    text-align: left;
    top: -1px;
    z-index: 13000;
    font-size : 12px;

}

    td.nav-user-info > span
    {
        float: left;
        width: 195px;
        height: 30px;
        line-height: 30px;
        overflow: hidden;
    }


.nav .nav-menu {
    /* Empty for now, but maybe we will add some properties in the future */ 
}

/* Applies navigation item style */
.nav .nav-item {    
    background-color: transparent;
    border-collapse: collapse;
    color: #FFF;
    cursor: pointer;
    height: 31px;
    font: 11pt Arial, Helvetica, sans-serif;/*WCAG : was 14px*/
}

.nav .nav-item td {
    padding: 0 8px;
}

/* Positionning the arrow for item with subitem */
.nav .nav-item td img {
    display: inline-block;
    margin-left: 6px;
    margin-bottom: 2px;
}

/* Applies a rounded border for browser supporting :hover pseudo-class (IE7+) */
.nav .nav-item td.nav-last-item:hover {
    background: transparent url('../Images/navigation.gif') no-repeat right -31px !important;
    color: #FFF;
}

/* Applies navigation subitem style */
.nav .nav-subitem {
    background: #FFF;        
    border-collapse: separate !important; /* Fixes a border display bug for IE */
    border: 1px solid #1576A8;
    border-top: 0 none;
    border-spacing: 0;
    color: #000;
    cursor: pointer;
    font: 10pt Arial, Helvetica, sans-serif; /*WCAG : was 13px*/
    text-align: left;    
}

.nav .nav-subitem td {
    border-top: 1px solid #EFEFEF;
    padding: 6px 8px;    
    
}

/* Provides selected style for item and subitem */
.nav .nav-selected-item {
    background: transparent url('../Images/navigation.gif') no-repeat -15px -31px; 
    color: #FFF;
}

.nav .nav-selected-subitem {
    background-color: #1576A8;
    color: #FFF;
}

/* ----------------------------------------------------------------------------
 * Grids section                                                            
 * - Provides the basic CSS classes to be used for grids
 * ------------------------------------------------------------------------- */
.grid-std {
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: 100%;
}

.grid-std tr.grid-row {
    background-color: #FFF;
}

.grid-std tr.alternate {
    background-color: #E5E5E5;
}

.grid-std th.grid-header {
    background-color: #808080;
    border: 1px solid #FFF;
    color: #FFF;
    font-weight: bold;
    padding: 6px 1px;
    vertical-align: top;
}

.grid-std td.grid-cell {
    border: 1px solid #FFF;
    color: #000;
    padding: 0 1px;
    vertical-align: top;
}

/* ----------------------------------------------------------------------------
 * Forms section
 * - Provides the basic classes to be used for forms layout
 * ------------------------------------------------------------------------- */
 
 /* Base CSS class for form used to apply the new CSS style on the children of the element having this CSS class  */ 
 .form-std {
    margin: 0;
    padding: 0;
    font: 9pt Arial, Verdana, Helvetica, sans-serif; /*WCAG : was 12px*/
    text-align: left;
    width: 100%;
}

/* Common CSS properties for the form section and the form title */
.form-std fieldset, .form-std legend {
    border: 0 none;
    margin: 0;
    padding: 0;
}

/* Form title section styling */
.form-std legend {
    background-color: #808080;
    color: #FFF;
    font-size: 11pt; /*WCAG : was 14px*/
    margin: 0;
    padding: 5px 1%;
    width: 98%;
    
    /* IE6-7 CSS hack for legend position */	
    *margin-left: -7px;
}

.form-std legend.action-title {
    background-color: transparent;
    color: #979797;
    font: normal 18px Verdana, Arial, sans-serif;
    padding: 5px 10px;
    
    /* IE6-7 CSS hack for legend position */	
    margin-left: -7px;
}

.form-std legend.transparency {
    filter: alpha(opacity=100);
    opacity: 1;
}

.form-std span.warning {
    color: #CC0000;
    margin: 0 3px;
}

/* Form extra notes position (used under form title section) */
.form-std .notes {
    margin-right: 1px;
    text-align: right;	
}

/* Form extra notes styling */
.form-std .notes span {
    color: #808080;
    font-weight: bold;
    margin-left: 6px;
    vertical-align: middle;
}

/* Form extra notes position (used under form title section) */
.form-std .Quicknotes {
    margin-right: 1px;
    margin-bottom: 40px;
    /*text-align: right;	*/
}

/* Form extra notes styling */
.form-std .Quicknotes span {
    color: #808080;
    font-weight: bold;
    /*margin-left: 6px;*/
    margin-left: 0px;
    vertical-align: middle;
}

/* Resets default behaviour of list for form layout */
.form-std ol, .form-std ul {
    list-style: none;
    margin: 0;
    padding: 8px 0 0 10px;
}

/* Represents a row in the form layout */
.form-std li {
    clear: both;
    margin: 0;
    padding: 0 0 12px;
}

.form-std li.deli-option 
{
    padding-bottom: 0px !important;
}

.form-std li div.form-buttons-holder .button-std {
    margin-left: 5px; 
    margin-right: 5px; 
}

.form-std li div.form-buttons-holder .button-std:first-child {
    margin-left: 0; 
}

/* Redefines the strong color for form layout*/
.form-std li strong {
    color: #808080;
}

.form-std li label {
        max-width: 900px;
    }
/* Form label styling, backwards compatible using a span with specific CSS class */
.form-std li label, .form-std span.label, td.label {	
    color: #000;
    display: inline-block;
    font-size: 12px;
    margin: 0 0 1px;
    padding: 0;
    vertical-align: middle;
}

 

/* Font size of the original font on the page where the control is */
.form-std li label, .font-original span.label, td.label { 
     font : bold 11px Verdana, Arial, Helvetica, sans-serif !important; 
     color : #000000 
}

.form-std li label, .font-small span.label, td.label { 
     font : bold small Verdana, Arial, Helvetica, sans-serif !important; 
     color : #000000 
}

/* Form label for radio buttons and checkboxes */
.form-std li label.choice { 
    font-weight: normal !important;
    margin: 0;
    padding: 0;
    vertical-align: middle;
}

/* Due to .Net radio/checkbox generated HTML (in a span), we will use special CSS to have the same behaviour */ 
span.radio-std label, span.checkbox-std label { 
    font-weight: normal !important;
    margin: 0 0 0 6px;
    padding: 0;
}

/* Due to .Net radio/checkbox generated HTML (in a span), we will use special CSS to have the same behaviour */ 
table.radio-std {
    width: 100%;
}

table.radio-std td {
    padding: 4px 2px;
    vertical-align: middle;
}

table.radio-std input {
    margin: 0;
    padding: 0;
    vertical-align: top;    
}

table.radio-std label {
    font-weight: normal !important;
    margin: 0 0 0 6px;
    vertical-align: middle;
}

/* Used to align the asterisk for mandator fields */
.form-std li div span.required,
.form-std li div span.required-highlighted  {
    vertical-align: middle;
}

/* Form divider, show a line to delimit elements if needed */
.form-std hr.divider {
    margin: 5px 0 15px;
}

/* Applies standard width to the form elements */
.form-std li div .textbox-std { 
    width: 298px; 
}

/* Special case for phone number where textboxes are smaller */
.form-std li div.phone-number .textbox-std { width: 38px; }
.form-std li div.phone-extension .textbox-std { width: 51px; }

.form-std li div label.phone-extension-old  { 
    font: 10px Verdana, Arial, Helvetica, sans-serif !important; 
    font-weight: normal !important;
}

.form-std li div .dropdownlist-std { width: 310px; /* Textbox size + Padding */ }

/* Special case for phone number columns to prevent extra markup or inline style */
.form-std li div.phone-number { width: 308px; /* Textbox size + Padding */ }
.form-std li div.phone-number-old { width: 285px !important; /* Textbox size + Padding */ }
.form-std li div.phone-number-contact-us { width: 295px !important; /* Textbox size + Padding */ }
.form-std li div.phone-number-precheckout { width: 281px !important; /* Textbox size + Padding */ }

.form-std li div.phone-number-checkout { width: 281px !important; /* Textbox size + Padding */ }

.form-std li div.phone-number .left {
    padding: 0;
    width: 75%;
}

.form-std li div.phone-number .right {
    padding: 0;
    text-align: left;
    width: 20%;
}

/* Old phone format */
.form-std li div.phone-number-old .left,
.form-std li div.phone-number-contact-us .left {
    width: 63%;
}

.form-std li div.phone-number-precheckout .left { width: 75%; }

.form-std li div.phone-number-checkout .left { width: 73%; }

.form-std li div.phone-number-old .right,
.form-std li div.phone-number-contact-us .right {
    width: 35%;
}

.form-std li div.phone-number-precheckout .right { width: 20%; }

.form-std li div.phone-number-checkout .right { width: 22%; }

/* Related to Wizard-like steps in form */

/* Used in forms wizard-like header */
.form-std div.form-steps-header {
    padding: 0 0 8px 0;
    text-align : left;
    width : 100%;
}

.form-std div.form-steps-header-actiontitle {
    color : #979797;
    font: bold 20px Verdana, Arial, sans-serif;
    padding: 0 0 8px 0;
}

.form-std div.form-steps-footer .button-std {
    margin-left: 5px; 
    margin-right: 5px; 
}

.form-std div.form-steps-footer:first-child {
    margin-left: 5px; 
}

.form-std ul.steps {
    display: inline;
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

/* Used in forms wizard-like header - step title */
.form-std li.step, 
          li.step-selected,
          span.step-number,
          span.step-number-selected {
    color: #616175;
    display: inline;
    font: bold 12px Verdana;
    padding-right: 40px;
    vertical-align: middle;
}

.form-std span.step-number, 
          span.step-number-selected {
    font-size: 26px;
    padding-right: 10px;	
}

/* Used in forms wizard-like header - step title selected color */
.form-std li.step-selected,
          span.step-number-selected {
    color: #31659C;
}


.form-std a.std-link-small, a.std-link-small:hover {
    color: #000;
    font-size: 10px;
    text-decoration: underline;
}

.form-std a.std-link-small:hover {
    font-size: 10px;
    text-decoration: underline;
}

hr.divider {
    border: 0 none;
    border-top: 1px solid #808080;
    display: block;
    height: 1px;
    margin: 0;
    padding: 0;
    text-align: left;
    width: 99%;
}

/* -------------------------------------------------------------------------
 * Extends of "form-std" to apply a lite form style
 * ------------------------------------------------------------------------- */
.form-lite { 
    font-family: Verdana, Arial, Helvetica, sans-serif;
    margin-top: 35px;
    
    *margin-top: 10px;
}
    
.form-lite fieldset {
    border: 2px solid #808080 !important;
    position: relative;
    margin: 20px 0 15px;
}

.form-lite .legend {
    margin: -17px 0 0 0;    
    position: absolute;
    width: 100%;
    *margin-left: -21px; /* IE6-7 CSS hack for legend position */
}
    
.form-lite legend {
    background-color: transparent;
    color: #808080;
    font-size: 12px;
    font-weight: bold;	    
    padding: 0;
}
    
.form-lite .notes { 
    margin-right: 0;
    position: absolute;
    right: 0;
    top: -17px;
}

.form-lite .Quicknotes { 
    margin-right: 0;
    /*position: absolute;*/
    right: 0;
    top: -17px;
}

.form-lite ol, .form-lite ul { 
    margin: 5px 20px; 
    padding-left: 0; 
}

.form-lite-quick ol { 
    margin: 5px 0px; 
    padding-left: 0; 
}

.form-lite hr.divider { 
    margin: 0 0 12px;
}

/* ----------------------------------------------------------------------------
 * Links section                                                            
 * - Provides the basic CSS classes to be used for links
 * ------------------------------------------------------------------------- */
 
.link-std { 
}
 
.link-std:hover {
}


/* Temporary fix */
.link-std-small {
    color: #000 !important;
    font: 11px Arial, Helvetica, sans-serif !important;
    
/* --- WCAG --- */
    text-decoration: underline;
}

.link-std-small:hover {
    cursor: pointer;
    font: 11px Arial, Helvetica, sans-serif !important;
    text-decoration: underline;
}

.link-button-std-small {
    color: #000;
    font: 11px Arial, Helvetica, sans-serif !important;
    text-decoration: underline !important;
}

.link-button-std-small:hover {
    color: #005EC2;
    cursor: pointer;
    font: 11px Arial, Helvetica, sans-serif !important;
    text-decoration: underline !important;
}

/* ----------------------------------------------------------------------------
 * Inputs section                                                            
 * - Provides the basic CSS classes to be used for the following inputs:
 *   - Button
 *   - Checkbox
 *   - DropdownList
 *   - RadioButton
 *   - Textbox
 * ------------------------------------------------------------------------- */
 
/* Defines the base styling for standard buttons */
.button-std {
    background-color: #707070 !important;
    border: 1px outset #707070;
    color: #FFF !important;
    cursor: pointer;
    display: inline-block;
    font: 12px Arial, Verdana, Helvetica, sans-serif !important;
    margin: 5px 0px;
    overflow: visible; /* Fix IE7 double padding bug */
    padding: 3px 6px !important;
    text-align: center;
    text-decoration: none !important;
    vertical-align: middle;
}

/* Defines the base hover styling for standard buttons */
.button-std:hover {
    background-color: #005EC2 !important;
    color: #FFF;
}

.button-std-disabled {
    background-color: #707070 !important;
    border: 1px outset #707070;
    color: #FFF !important;
    cursor: pointer;
    display: inline-block;
    font: 12px Arial, Verdana, Helvetica, sans-serif !important;
    margin: 5px 0px;
    overflow: visible; /* Fix IE7 double padding bug */
    padding: 3px 6px !important;
    text-align: center;
    text-decoration: none !important;
    vertical-align: middle;
}

.go-button-std-disabled {
    background-color: #B0B0B0 !important;
    border: 1px outset #B0B0B0;
    color: #FFF !important;
    cursor: default;
    display: inline-block;
    font: 12px Arial, Verdana, Helvetica, sans-serif !important;
    margin: 5px 0px;
    overflow: visible; /* Fix IE7 double padding bug */
    padding: 3px 6px !important;
    text-align: center;
    text-decoration: none !important;
    vertical-align: middle;
}

.go-button-std-disabled-no-border {
    border: 0 !important;
	font-size: 8pt !important;/*WCAG : 11px*/
	font-weight: normal !important;
	height:20px !important;
	display:inline-block !important;
    padding: 0px 15px !important;
    cursor:default !important;
}

/* TODO: Trouver un meilleur nom? Plus sémantique que "blue"? */
.blue-button {
    background-color: #005EC2;
    color: #FFF;
    border: 1px outset #005EC2;
    margin: 0;
}

/* Defines the base styling for standard textboxes and textareas */
.textbox-std, .textarea-std {
    font: 12px Arial, Verdana, Helvetica, sans-serif;
    padding-left: 4px;
    padding-right: 4px;
}

/* Overrides some properties for textareas */
.textarea-std {
    line-height: 1.3em;
    padding: 0 3px;
}

/* Defines the base styling for textboxes and textareas with focus for browsers supporting it, not supported by IE6-7 */
.textbox-std:focus, .textarea-std:focus { 
    /*background-color: #F0F0F0; */	
}

/* Defines the base styling for a standard dropdownlist */
.dropdownlist-std {
    font: 12px Arial, Verdana, Helvetica, sans-serif;
    vertical-align: middle;
}

/* Defines the base styling for radio buttons and checkboxes */
/* Due to .Net radio/checkbox generated HTML (in a span), we will use special CSS to have the same behaviour */ 
.radio-std, 
.checkbox-std,
span.radio-std input, 
span.checkbox-std input { 
    margin: 0;
    padding: 0;
    vertical-align: middle;
}

/* ----------------------------------------------------------------------------
 * Page masking                                                         
 * - Provides the basic CSS classes to be used for Page masking
 * ------------------------------------------------------------------------- */
 
/* Used when background needs to be disabled */
.disabled-background {
    background-color: #808080;
    color: #000;
    display: none;
    position: absolute;          
    top: 0;
    left: 0;
    z-index: 100000;
    filter: alpha(opacity=70); /* For IE8 and earlier */
    opacity: 0.7;
}

/* Used around the disabled content - content to display. */
.displayed-content {
    background: #FFF;
    top : 100px;
    color: #000;
    display: block;
    margin: 0;
    padding: 0 10px;	
    position: absolute;
    width: 970px;
    z-index: 100001;
}

.disabled-background-manage {
    background-color: #808080;
    color: #000;
    position: absolute;          
    top: 0;
    left: 0;
    z-index: 9998;
    filter: alpha(opacity=70); /* For IE8 and earlier */
    opacity: 0.7;
    display: block;
    width: 100%;
}

.displayed-content-manage {
    background: #FFF;
    top : 100px;
    color: #000;
    display: block;
    margin: 0;
    padding: 0 10px;	
    position: absolute;
    width: 970px; 
    z-index: 9999;
}

.modal-background {
    background-color: #808080;
    filter: alpha(opacity=70);
    opacity: 0.7;
}
    
/* ----------------------------------------------------------------------------
 * Error handling sections                                                       
 * - Provides the basic CSS classes to be used for required field markers
 * ------------------------------------------------------------------------- */
.form-std span.required, span.required-highlighted {	
    color: #000;	
    font-size: 12px;
    margin: 0 3px;
}

.form-std span.required-highlighted {
    color: #FF0000;
}

.form-std span.required-ship-to-account {
    display : inline-block;
    margin: 0 3px;
    width : 100%;
}

.form-std .error-message-list {
    width: 345px;
}

.form-std .error-message-list ul {
    list-style-type: disc;
    margin: 0 0 0 12px;
    padding: 5px 0 0 12px;    
}

.form-std .error-message-list ul li {
    margin: 0;
    padding: 0;    
}

/* Would be better to use a generic class instead of multiples class... */
.mandatory-error-message, 
.syntax-error-message,
.existing-error-message {
    display: none;
}

.form-std .error-message
{
    color : #FF0000;
}

.validation-msg-std
{
    color : #ee0000 !important;
    font-family : Verdana, Arial, Helvetica, Sans-Serif;
    font-size : 11px;
    font-style : normal;
    line-height : normal;
    text-align : left;
}

/* ----------------------------------------------------------------------------
 * Window Popup elements section                                                         
 * - Provides the basic CSS classes to be used for window popup elements
 * ------------------------------------------------------------------------- */
.popup-std {
    background-color: #FFF;
    border: 1px solid #808080;
    padding: 0;
    position: relative;
    overflow: visible !important;
    width: 730px !important;
}

.popup-addindiv {
    height: 384px;
    padding: 0;
    width: 815px !important;    
    border: 0 none;
}

.popup-addindivgroup {
    height: 350px;
    padding: 0;
    width: 815px !important;    
    border: 0 none;
}

.popup-addindivgroup-height {
    height: 635px !important;
    top: 100px !important;
}

.popup-addindivgroup-create {
    height: 200px !important;
}

.popup-std .searchUsers {
    overflow: visible !important;
    width: 730px !important;
}

.popup-std-searchUsers-group-order 
{
    background-color: #FFF;
    border: 1px solid #808080;
    height: 385px;
    padding: 0;
    position: relative;
    overflow: visible !important;
    width: 779px !important;
}

.popup-msg-std {
    margin: 0 auto;
}

.popup-msg-std h3 {
    background-color: #C00;
    border-bottom: 1px solid #808080;
    color: #FFF;
    font-weight: bold;
    font-size: 12px;
    margin: 0;
    padding: 5px 10px;
}

.popup-msg-std h3 span
{
    color: #ffffff !important;
    padding: 5px 10px !important;
}

.popup-msg-std .popup-content {
    padding: 6px 6px 0 6px;
}

.popup-msg-std .popup-content .popup-image-cell {
    vertical-align: top;
}

.popup-msg-std .popup-content .popup-text-cell {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    padding-left: 1px;
}

.popup-msg-std .popup-content .popup-image-cell img {
    display: block;
    margin: 1px 9px 1px 3px;
}

.popup-msg-std .popup-buttons {
    padding: 6px;
    text-align: center;
}

.popup-msg-std .popup-button {
    background-color: #808080;
    border: 1px solid #808080;
    color: #FFF;
    cursor: pointer;
    display: inline-block;
    font: 10px Verdana;
    margin: 0 0 0 5px;
    overflow: visible; /* Fix IE7 double padding bug */
    padding: 2px 3px;
    text-align: center;
}

.popup-msg-std .popup-button:hover {
    background-color: #005EC2;
    border: 1px solid #005EC2;
}



/* ----------------------------------------------------------------------------
 * Utilities section                                                               
 * - Provides some useful and helpful CSS classes
 * ------------------------------------------------------------------------- */
.bigger { font-size: 1.2em; }
.block { display: block; }
.bold { font-weight: bold; }
.clickable { cursor: pointer; }
.NoLinkPointer { cursor:default; }
.centered { margin-left: auto; margin-right: auto; }
.clear { clear: both; }
.float-right { float: right; }
.float-left { float: left; }
.full-size { width: 100%; }
.has-side-spacing { padding: 0 10px; }
.has-spacing { padding: 10px; }
.hidden { visibility: hidden; }
.hide { display: none; }
.italic { font-style: italic; }
.no-margin { margin: 0 !important; }
.no-mb { margin-bottom: 0; }
.no-mt { margin-top: 0; }
.no-space { margin: 0 !important; padding: 0 !important; }
.smaller { font-size: .8em; }
.strike { text-decoration: line-through; }
.talign-center { text-align: center; }
.talign-left { text-align: left; }
.talign-right { text-align: right; }
.valign-middle { vertical-align: middle; }
.valign-top { vertical-align: top; }
.mandatory { color : #FF0000; }
.negative-currency { color : Red;}
.pos-rel { position : relative; }

.clearfix:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
}
    
/* 
 * Utilities CSS to make a two half sized columns as follow:
 * <div class="clearfix">
 *   <div class="left">My left content</div>
 *   <div class="right">My right content</div>
 * </div>
 */
.left {
    float: left;
    padding-right: 1%;
    width: 48%;
}

.full {
    float: left;
    width: 100%;
}

.right { 
    float: right; 
    padding-left: 1%;
    width: 49%;
}

/*
* Manage Users / Ship-To-Account related CSS
* Currently only used in the Manage User / Ship-To Account page / grid
*/

/* div with id = shipToAccountList*/
#shipToAccountList, .shipto-account-list
{
    border : 1px solid #EAEAEA;
    overflow-x: scroll;
    overflow-y: visible;
    height : 260px;
    width : 780px;
}

/* selected row in grid */
tr.row-selected
{
    background-color: #005EC2;
    color : White;
    cursor : default;
}

/* not selected row in grid */	
tr.row-not-selected
{
    
    background-color : white;
    color : Black;
    cursor : default;
}


#shipToAccountList table.ship-to-accounts,
.shipto-account-list table.ship-to-accounts
{
    cursor : pointer;
    margin : 0;
    padding : 0;
    width: 1024px;
    
}
    
#shipToAccountList td.account-number,
.shipto-account-list td.account-number
{
    cursor : pointer;
    text-align : left;
    width : 60px;
}
    
#shipToAccountList td.name,
.shipto-account-list td.name
{
    cursor : pointer;
    text-align : left;
    width : 150px;
}
    
#shipToAccountList td.cost-center,
.shipto-account-list td.cost-center
{
    cursor : pointer;
    text-align : left;
    width : 160px;
}
    
#shipToAccountList td.attention,
.shipto-account-list td.attention
{
    cursor : pointer;
    text-align : left;
    width : 100px;
    
}

#shipToAccountList td.address-info,
.shipto-account-list td.address-info
{
    cursor : pointer;
    text-align : left;
    width : 300px;
}

.addall-shipto-size
{
    width : 60%;
}

/* 
    General Information Send Email Notification
    CheckBox specifics
*/
.form-std li div label.SendEmailNotificationFrOnly 
{
    margin-left: 5px; 
    vertical-align: top; 
    width : 400px; 
    font-weight : normal !important
    
}
.form-std li div label.SendEmailNotificationEnOnly 
{
    margin-left: 5px;
    font-weight : normal !important;
    
}

/*****************************************************
  BudgetCalculatorControl specifics
******************************************************/
.bccBuyer
{
     background-color : #ECECEC;
     border : 1px solid #808080;
     border-radius : 5px;
     -moz-border-radius : 5px;
     line-height : 28px;
     text-align : center;
     vertical-align : middle;
}
.bccApprover {
    margin-left : 7px;
    margin-top : 10px;
    margin-bottom : 10px;
}

.budget-padding-bottom { padding-bottom: 10px; }
.budget-padding-top { padding-top: 10px; }
/*****************************************************/

/*****************************************************
  Search Product Listing Control specifics
******************************************************/
.searchlst
{
    border-collapse : separate !important;
    font-size : 10px;
    font-family : Verdana, Arial, Helvetica, Sans-Serif;
    border-spacing : 1px;
    width : 100%;
}

.searchlst-img
{
    height : 100px;
    margin : 7px 8px 8px 8px;
    width : 100px;
    
}

.searchlst-hdr
{
    /*.GridHeaderRow, .GridHeaderRow a:link, .GridHeaderRow a:active, .GridHeaderRow a:hover, .GridHeaderRow a:visited {*/
    color:#fff;
    background-color:#808080;
    font-weight:bold;
    height : 22px;
    text-transform:uppercase;
    
}

/*Search Product List Header CSS */
.searchlst-img-hdr
{
    text-align : left;
}


.searchlst-desc-hdr
{
    text-align : left;
    padding-left : 2px;
}


.searchlst-price-hdr
{
    text-align : right;
    padding-right : 2px;
}



.searchlst-uom-hdr
{
    text-align : center;
    padding-left : 1px;
    padding-right : 1px;
}


.searchlst-qty-hdr
{
    text-align : center;
    padding-left : 2px;
    padding-right : 2px;
}

.searchlst-chk-hdr
{
    text-align : left;
    
}


.searchlst-onbd-hdr
{
}

/* Search Product List Item CSS */
.searchlst-img-col
{
    text-align : left;
}

.searchlst-desc-col
{
    text-align : left;
    vertical-align : top;
}

.searchlst-price-col
{
    text-align : right;
    vertical-align : top;
}

.searchlst-uom-col
{
    text-align : center;
    vertical-align : top;	
}

.searchlst-qty-col
{
    text-align : center;
    vertical-align : top;
}

.searchlst-add-col
{
    text-align : center;
    vertical-align : top;
}

.searchlst-chk-col
{
    text-align : center;
    vertical-align : top;

}

.searchlst-onbd-col
{
    text-align : center;
    vertical-align : top;
}


.accs-popup-link
{
    /*position : relative; */
    z-index : 1;
}


/*****************************************************
  Search Product Listing Control specifics
******************************************************/

.orderlst
{
    border-collapse : separate !important;
    border-spacing : 1px;
    font-size : 10px;
    font-family : Verdana, Arial, Helvetica, Sans-Serif;
    text-align : left;
    vertical-align : top;
    /*padding : 1px;*/
    /*table-layout : auto;*/
    width : 100%;
}

.orderlst-hdr
{
    color:#fff;
    background-color:#808080;
    font-weight:bold;
    height : 30px;
    text-transform:uppercase;
    text-align : center;
    
}


.orderlst-qty-hdr-en
{
    text-align : left;
    padding-left : 3px;
    width : 10%; /*78px;*/
}

.orderlst-prod-hdr-en
{
    text-align : left;
    padding-left : 3px;
    width : 15%; /*114px;*/
}

.orderlst-desc-hdr-en
{
    text-align : left;
    padding-left : 3px;
    width : 21%; /*161px;*/
}

.orderlst-linenote-hdr-en
{
    text-align : left;
    padding-left : 3px;
    width : 16%; /*124px;*/
}

.orderlst-price-hdr-en
{
    text-align : right;
    padding-right : 3px;
    width : 13%; /*100px;*/
}

.orderlist-uom-hdr-en
{
    text-align : center;
    width : 6%; /*39px;*/
}

.orderlst-total-hdr-en
{	
    text-align : right;
    padding-right : 3px;
    width : 10%; /*80px;*/
}

.orderlst-chk-hdr-en
{
    width : 3%; /*24px;*/
}

.orderlst-del-hdr-en
{
    width : 7%; /*53px;*/
}

.orderlst-qty-hdr-fr
{
    text-align : left;
    padding-left : 3px;
    width : 115px;
}

.orderlst-prod-hdr-fr
{
    text-align : left;
    padding-left : 3px;
    width : 113px;
}

.orderlst-desc-hdr-fr
{
    text-align : left;
    padding-left : 3px;
    width : 147px;
}

.orderlst-linenote-hdr-fr
{
    text-align : left;
    padding-left : 3px;
    width : 124px;
}

.orderlst-price-hdr-fr
{
    text-align : right;
    padding-right : 3px;
    width : 112px;
}

.orderlist-uom-hdr-fr
{
    text-align : center;
    width : 49px;
}

.orderlst-total-hdr-fr
{	
    text-align : right;
    padding-right : 3px;
    width : 77px;
}

.orderlst-chk-hdr-fr
{
    width : 24px;
}

.orderlst-del-hdr-fr
{
    width:53px;
}

.orderlst-row
{
    background-color : transparent;
}
.orderlst-row-alt
{
    background-color:#e5e5e5;
}

.orderlst-row,
.orderlst-row-alt
{
    vertical-align : top;
    text-align : left;
    min-height: 65px;
    height: auto !important;
    height: 65px;
    
}

.orderlst-row>td,
.orderlst-row-alt>td
{
    padding-right : 2px;
    padding-left : 2px;
    padding-top : 2px;
    /*
    min-height: 65px;
    height: auto !important;
    height: 65px;
*/
}

.orderlst-qty-col-fr,
.orderlst-qty-col-en
{
    vertical-align : top;
}

.orderlst-prod-col-fr,
.orderlst-prod-col-en
{
    vertical-align : top;
}

/* div container in column
   in order to align the accessories
   link to the bottom 
*/
.orderlst-prod-col-fr-cont,
.orderlst-prod-col-en-cont
{
     min-height: 65px;
    height: auto !important;
    height: 65px;
    position : relative;
}

.orderlst-desc-col-fr,
.orderlst-desc-col-en
{
    vertical-align : top;
}

.orderlst-linenote-col-en,
.orderlst-linenote-col-fr
{
    vertical-align : top;
}

.orderlst-price-col-en,
.orderlst-price-col-fr
{
    vertical-align : top;
    text-align :right;
}

.orderlst-uom-col-fr,
.orderlst-uom-col-en
{
    vertical-align : top;
    text-align : center;
}

.orderlst-total-col-fr,
.orderlst-total-col-en
{
    vertical-align : top;
    text-align : right;
}

.orderlst-chk-col-en,
.orderlst-chk-col-fr
{
    vertical-align : top;
    text-align : center;
}

.orderlst-del-col-fr,
.orderlst-del-col-en
{
    vertical-align : top;
    text-align : center;
}


/* Promotion Control CSS */

.promo-ctl
{
    border: 1px solid silver;
    margin: 0;
    padding: 0;
    width: 768px;
}

.promo-ctl div.header
{ 
    height: 25px;
}

.promo-ctl table.header
{ 
    height: 100%;
    width: 100%;
}


.promo-ctl div.content
{ 
    height: 150px;
    vertical-align: top;
}

.promo-ctl table.content
{ 
    height: 100%;
    width: 100%;
}

.promo-ctl div.promo-detail
{ 
    height: auto;
}

.promo-ctl table.promo-detail
{ 
    height: auto;
    width: 100%;
}

.promo-ctl td.title-section
{ 
    margin: 0;
    padding: 0;
    text-align: left;
    vertical-align: middle;
    width: 100%;
}


.promo-ctl div span.title
{
    font: 18px Verdana, Helvetica, sans-serif;  
    padding: 2px 0px 0px 7px;
    vertical-align: top;
}

.promo-ctl div img.title
{
    padding: 2px 0px 0px 14px;
}

.promo-ctl td.link
{
    margin: 0;
    padding: 0px 3px 0px 0px;
    text-align: right;
    vertical-align: bottom;
    width: 100%;
}

.promo-ctl div.link-bottom
{
    padding: 0px 3px 0px 0px;
    text-align: right;
    vertical-align: bottom;
}

.promo-ctl div a.link
{
    color: Black !important;
    font: 10px Verdana, Helvetica, sans-serif; 

/* --- WCAG --- */
    text-decoration: underline;
}

.promo-ctl div a.link:hover
{
    color: #005EC2 !important;
    cursor: pointer;
    text-decoration: underline !important;      
}

.promo-ctl div.left {
    float: left;
}

.promo-ctl div.right { 
    float: right;
}

.promo-ctl td.left-promo 
{
    padding-right: 28px;
    text-align: right;
    vertical-align: top;
}

.promo-ctl td.right-promo  
{
    padding-left: 28px;
    text-align: left;
    vertical-align: top;
}

.promo-ctl a.arrow 
{
    cursor: pointer;       
}

.promo-ctl td.left-arrow 
{
    padding: 20px 0px 0px 0px;
    text-align: left;
    vertical-align: middle;
}

.promo-ctl td.right-arrow
{
    padding: 20px 0px 0px 0px;
    text-align: right;
    vertical-align: middle;
}

.promo-ctl td.promo-detail
{
    text-align: center;
    vertical-align: bottom;
    width: 100%;
}

.promo-ctl td.promo-detail-text
{
    text-align: center;
    vertical-align: bottom;
}

.promo-ctl span.promo-detail
{
    color: #cc0000;
    font: 12px Verdana, Helvetica, sans-serif; 
}

.promo-ctl td.link-back-promo
{
    margin: 0;
    padding: 0px 3px 0px 0px;
    text-align: right;
    vertical-align: bottom;
}

.promo-ctl .cpBody
{
    height: 0px;
    overflow: hidden;

/* --- WCAG --- */
    color: Black;
    background-color : White;	    
}


/* switch-to function used in cart */

.switchto-icon
{
    float: left; 
    margin: 0; 
    padding: 0; 
    width: 15px;
}

.switchto-txt
{
    float:right; 
    margin:0px; 
    padding: 0 10px 0 0; 
    width : 50px;
    top : -1px;
}

/* Credit Card List Control CSS */


.share-button-no-underline  {
    background-color:Transparent;
    border:none;
    color:#005EC2;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    text-transform:capitalize;
    height:20px;
    display:inline-block;
    cursor:pointer;
    padding: 4px 8px 0px 0px;
    margin: 0px;
    vertical-align: bottom;
}

.share-button-no-underline-default  {
    background-color:Transparent;
    border:none;
    color:#005EC2;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    text-transform:capitalize;
    height:20px;
    display:inline-block;
    cursor:default;
    padding: 4px 8px 0px 0px;
    margin: 0px;
    vertical-align: bottom;
}

.share-button  {
    background-color:Transparent;
    border:none;
    color:#005EC2 !important;
    font-family: Arial, Verdana, Helvetica, sans-serif !important;
    font-size: 11px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    text-transform:capitalize;
    height:20px;
    display:inline-block;
    cursor:pointer;
    padding: 4px 8px 0px 0px;
    margin: 0px;
    vertical-align: bottom;
}

.share-button:hover {
    background-color:Transparent;
    border:none;
    color:#005EC2;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    text-transform:capitalize;
    text-decoration: underline !important;
    height:20px;
    display:inline-block;
    cursor:pointer;
    padding: 4px 8px 0px 0px;
    margin: 0px;
    vertical-align: bottom;
}

.link-bold  {
    background-color:Transparent;
    border:none;
    color:#005EC2 !important;
    font-family: Arial, Verdana, Helvetica, sans-serif !important;
    font-size: 11px !important;
    font-weight: bold !important;
    text-decoration: underline;
    text-transform:capitalize;
    display:inline-block;
    cursor:pointer;
    margin: 0px;
}

.link-bold:hover {
    background-color:Transparent;
    border:none;
    color:#005EC2;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: bold;
    text-transform:capitalize;
    text-decoration: underline;
    display:inline-block;
    cursor:pointer;
    margin: 0px;
}

.column1, .column2, .column3
{
    /*width : 33%;
    cursor : pointer;
*/
}

/* Group Order Edit CSS */

.form-std .group-order-chkbox-text
{
    margin-left: 5px; 
    vertical-align: middle; 
    width : 500px; 
    font-weight : bold;
}

.form-std .title-bar {
    text-align: right;	
}

.form-std .title-bar span {
    color: #808080;
    font-weight: bold;
    vertical-align: middle;
}

.displayed-content-grp
{
    padding: 0 !important;
}

.ModalBackground-grp 
{
    background-color: #808080;
    filter:alpha(opacity=70);
    opacity:0.7;
}

.textbox-std-calendar { 
    width: 270px !important; 
}

.form-std .go-man-top-label-width 
{
	color: black;
    width: 300px;
    display : inline-block;
}

.form-std .go-man-top-label-left
{
    text-align: left;
}

.form-std .go-man-top-label-right
{
	color: black;
    text-align: right;
}

.form-std .button-std-send-reminder
{
    margin: 0px !important;
}

.form-std .no-padding-top ol
{
    padding-top: 0px !important;
}

.form-std ol.go-manage 
{
    padding: 0px !important;
}

.form-std li.go-manage-top 
{
    padding-top: 8px !important;
}

.form-std li.go-manage-bottom
{
    padding-bottom: 20px !important;
}

.form-std li.go-manage 
{
    padding: 0px !important;
}

/* Group Order Processing CSS */


.WidthAddressControl { width:475px;}

.BtnFullGrey:focus {
	background-color:#808080;
	border: 1px solid #808080;
	color:#fff;
	font-size: 8pt;
	font-weight: normal;
	text-transform:capitalize;
	height:20px;
	display:inline-block;
	cursor:pointer;
	outline: dotted 1px;
}

.outline {
	outline: none;
}

.outline:focus {
	outline: dotted 1px;
}


/*
* Manage Approval Rules / Approvers related CSS
* Currently only used in the Manage Approval Rules / Approvers page / grid
*/


#approversList
{
    border : 1px solid #EAEAEA;
    overflow-x: scroll;
    overflow-y: visible;
    height : 260px;
    width : 780px;
    margin-left:-1px;
    margin-right:-2px;
}


/* selected row in grid */
#approversList tr.row-selected
{
    background-color: #005EC2;
    color : White;
    cursor : default;
}

/* not selected row in grid */	
#approversList tr.row-not-selected
{
    
    background-color : white;
    color : Black;
    cursor : default;
}


#approversList table.approvers-list

{
    cursor : pointer;
    margin : 0;
    padding : 0;
    width : 780px !important;
}

#approversList td.userid
{
    cursor : pointer !important;
    padding: 0px 2px 0px 0px !important;
    margin:0 !important;
    text-align : left !important;
    width : 215px !important;
}

#approversList td.firstname
{
    cursor : pointer !important;
    text-align : left !important;
    width : 120px !important;
}

#approversList td.lastname
{
    cursor : pointer !important;
    text-align : left !important;
    width : 120px !important;
}

#approversList td.send-order-notif
{
    cursor : pointer !important;
    text-align : center !important;
    width : 84px !important;
}

#approversList td.show-on-site
{
    cursor : pointer !important;
    text-align : center !important;
    width : 69px !important;
}

#approversList td.can-modify-order
{
    cursor : pointer !important;
    text-align : center !important;
    width : 84px !important;
}

#approversList td.default-approver
{
    cursor : pointer !important;
    text-align : center !important;
    width : 90px !important;
}

div.approvers-list
{
    border-left : 1px solid #EAEAEA;
    border-right : 1px solid #EAEAEA;
    border-top : 1px solid #EAEAEA;
    overflow-x: scroll;
    overflow-y: visible;
    width : 300px;
}

table.approvers-list
{
    overflow-x: scroll;
    overflow-y: visible;
    width : 100%;
}

.approvers-list td.firstname
{
    cursor : pointer;
    text-align : left;
    width : 70px;
}

.approvers-list td.lastname
{
    cursor : pointer;
    text-align : left;
    width : 70px;
}

.approvers-list td.userid
{
    cursor : pointer;
    text-align : left;
    width : 130px;
}

.approvers-list td.isactive
{
    cursor : pointer;
    text-align : left;
    width : 40px;
    padding-right:0px;
}

#approvers-list td.colheader-userid
{
    padding:5px;
    width : 216px !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
}

#approvers-list td.colheader-firstname
{
    padding:5px;
    width : 120px !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
}

#approvers-list td.colheader-lastname
{
    padding:5px;
    width : 120px !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
}

#approvers-list td.colheader-send-order-notif
{
    padding:5px;
    width : 75px !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
    text-align: center;
}

#approvers-list td.colheader-show-on-site
{
    padding:5px;
    width : 60px !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
    text-align: center;
}

#approvers-list td.colheader-can-modify-order
{
    padding:5px;
    width : 75px !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
    text-align: center;
}

#approvers-list td.colheader-default-approver
{
    padding:5px;
    width : 80px !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
    text-align: center;
}

#approvers-list tr#header-approver-list, #approvers-list td.colheader {
    border:1px solid #EAEAEA;
    border-bottom:0px;
    
}
.form-std span.required-approvers-list {
    display : inline-block;
    margin: 0 3px;
    width : 100%;
}

div.members-list
{
    border-left : 1px solid #EAEAEA;
    border-right : 1px solid #EAEAEA;
    border-top : 1px solid #EAEAEA;
    overflow-x: scroll;
    overflow-y: visible;
    width : 300px;
}

table.members-list
{
    overflow-x: scroll;
    overflow-y: visible;
    width : 100%;
}

#membersList
{
    border : 1px solid #EAEAEA;
    overflow-x: scroll;
    overflow-y: visible;
    height : 260px;
    width : 780px;
    margin-left:-1px;
    margin-right:-2px;
}


/* selected row in grid */
#membersList tr.row-selected
{
    background-color: #005EC2;
    color : White;
    cursor : default;
}

/* not selected row in grid */	
#membersList tr.row-not-selected
{
    
    background-color : white;
    color : Black;
    cursor : default;
}


#membersList table.members-list

{
    cursor : pointer;
    margin : 0;
    padding : 0;
    width: 1024px;
}

#membersList-list td.colheader {
    padding:5px;
    }
#membersList-list tr#header-approver-list, #members td.colheader {
    border:1px solid #EAEAEA;
    border-bottom:0px;
    
}  

#membersList td.account-number
{
    cursor : pointer;
    text-align : left;
    width : 60px;
}
    
#membersList td.name
{
    cursor : pointer;
    text-align : left;
    width : 150px;
}
    
#membersList td.cost-center
{
    cursor : pointer;
    text-align : left;
    width : 160px;
}
    
#membersList td.attention
{
    cursor : pointer;
    text-align : left;
    width : 100px;
    
}

#membersList td.address-info
{
    cursor : pointer;
    text-align : left;
    width : 300px;
}

#membersList td.firstname
{
    cursor : pointer;
    text-align : left;
    width : 160px;
}

#membersList td.lastname
{
    cursor : pointer;
    text-align : left;
    width : 160px;
}

#membersList td.userid
{
    cursor : pointer;
    text-align : left;
    width : 160px;
}

#membersList td.member-firstname
{
    cursor : pointer;
    padding: 0px 5px 0px 0px;
    text-align : left;
}

#membersList td.member-lastname
{
    cursor : pointer;
    text-align : left;
    width : 350px;
}

#membersList td.member-userid
{
    cursor : pointer;
    text-align : left;
    width : 800px;
}

#membersList td.isactive
{
    cursor : pointer;
    text-align : left;
    width : 160px;
}

#ApprovalRulesList
{
    border : 1px solid #EAEAEA;
    overflow-x: scroll;
    overflow-y: visible;
    height : 260px;
    width : 780px;
    margin-left:-1px;
    margin-right:-2px;
}

.addall-shipto-size
{
    width : 60%;
}

#rules-list td.colheader-rule-type
{
    padding:5px;
    width : 30% !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
}

#rules-list td.colheader-rule-action
{
    padding:5px;
    width : 30% !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
}

#rules-list td.colheader-operator-type
{
    padding:5px;
    width : 20% !important;
    border:1px solid #EAEAEA;
    border-bottom:0px;
}

#rules-list td.colheader-dollar-limit
{
    padding:5px;
    border:1px solid #EAEAEA;
    border-bottom:0px;
}