/*  Affiliate Site styling
    Created: 2009-04-02
    Latest:
    By: jkh
    
    Note: class (.) and id (#) names are prepended with the type of the element
    they apply to. Examples: #div_outer is the id of a div, #btn_search is the
    id of a button.
*/

/*  misc **********************************************************************/
* {margin:0; padding:0; border-width:0}            /* defaults for everything */


/*  layout ********************************************************************/
/*  this section deals with positioning, spacing, and borders. */
body {text-align:center}              /* overcome an IE bug wrt div centering */

#div_outer {
    width:782px;        /* overall width of the outermost container */
    margin:0 auto;      /* center the container within the page */
    text-align:left;    /* left align everything contained */
}

#div_header {
    padding:1.5em 0 1.5em .5em;     /* set top, right, bottom left padding */
    border-bottom:1px solid white;  /* thin bottom border */
}

#div_topnav {
    border-bottom:1px solid white;  /* thin bottom border */
}

#div_maincol {
    width:500px;
    float:right;                    /* force it to right side */
    border-top:1px solid white;
    margin-bottom:1.0em;
}

#div_leftcol {
    width:267px;
    float:left;                     /* force to left side */
    border-top:1px solid white;
    text-align:center;              /* center its contents by default */
}

#div_footer {
    clear:both;                     /* force it below the left and main divs */
    text-align:center;              /* center its contents by default */
    padding:1em;
}

ul.nav {                            /* this is for the 'button' set in the top nav */
    width:auto;
    float:center;
    padding:2em 0.50em;             /* around the button set, not individual buttons */
    list-style:none;                /* no bullets etc. */
}

ul.nav a {                          /* format of each top nav 'button' (link) */
    display:block;
    padding:0.25em 1em;             /* top/bottom and left/right spacing around each button */
    text-align:center;
    text-decoration:none;           /* remove the default a underline */
    border:1px outset silver;       /* this creates the button effect; rgb=#c0c0c0 */
    line-height:1em;                /* this effectively sets the height of the containing div */
    cursor:pointer;                 /* make it look like a link */
}

ul.nav li {
    width:auto;
    float:left;                     /* let the buttons congregate left */
}

ul.ulist1, ul.ulist2 {
    margin:0em 0em 0em 1em;         /* give just a left indent to the items */
    list-style:disc;
    cursor:pointer;
}

ul.ulist2 {
    list-style:circle;              /* give a different bullet style for the sub-list */
}

ol.olist {
    margin:0.5em 0em 0em 1em;         /* give just a left indent to the items */
    list-style:decimal;
}

form {
    text-align:left;                /* form itself is centered, left-align its contents */
    margin:2em 1em 3em 1em;         /* outside the form */
    padding:1em 0.5em 1em 0.5em;    /* within the form */
}

#btn_search {                       /* search button in the form */
    display:inline;
    padding:0em 0.25em;             /* left/right spacing */
    margin-left:0.25em;
    border:1px outset silver;       /* this creates the button effect; rgb=#c0c0c0 */
    line-height:1.25em;             /* not so crammed */
    cursor:pointer;                 /* make it looks like a link */
}

label {                             /* the label for the input text */
    display:block;                  /* force break after */
    padding-bottom:1em;
}

img#img_banner {                    /* format for just this one image */
    padding:1em 0 1em 0;
}

img#img_left {                      /* format for just this one image */
    margin:1px;
    padding-bottom:2em;
    display:inline;
}

/*  highlight the button corresponding to the current page ********************/
/*  For this to work, each html page needs to be customized in one place:
    the id of the body tag. For example, <body id='HOME'>. If pages are added,
    corresponding selectors will have to be added here.
*/
#BUYPARTS #div_topnav .BUYPARTS a,
#GETREPAIRHELP #div_topnav .GETREPAIRHELP a,
#PRODUCTTYPE #div_topnav .PRODUCTTYPE a,
#BRANDS #div_topnav .BRANDS a,
#SHOPWITHCONFIDENCE #div_topnav .SHOPWITHCONFIDENCE a,
#DRYER #div_topnav .DRYER a,
#MICROWAVE #div_topnav .MICROWAVE a

{
    border:1px inset silver;
    cursor:default;
    color:#000000;
    background-color:#E4E1D7;    
}


/*  color *********************************************************************/
/*  the image in div_outer is to create the illusion that the leftcol div is the
    same height as the main col. If the width of left col changes, this image
    must be tweaked (ie the width of the blue portion.) */ 
#div_outer {background:#a4c2c2 url(../_images/2colbgnd.jpg) repeat-y left top}
#div_header {background-color:#4A523E;}
#div_topnav {background-color:#A4C2C2;}
#div_maincol {background-color:#ffffff;}
#div_leftcol {background-color:#E4E1D7;}
#div_footer {background-color:#E4E1D7;}

/* colors for table embedded in main column */
#div_maincoltab {background-color:#ffffff;}
#tab_maincol th {background-color:#CED6B5;}

h1, h2, h3, h4, label, p, p.bodytext, td {color:#333333;}   /* default text color */

form {background-color:#F0EDE4}
input[type='text']:focus {background-color:#FFFFFF;} /* color of the form's text input */
input[type='text']:hover {background-color:#E4E1D7;}

ul.nav a {color:#ffffff;}           /* text color of nav 'buttons' */
ul.nav {background-color:#EA880D;}  /* bgnd color of nav 'buttons' */
ul.nav a:hover {color:#ffffff; background-color:#525A45;} /* flip colors when hovering */

#btn_search:hover {                   /* flip colors when hovering (search form button) */
    color:#ffffff; background-color:#EA880D;
}
body {background-color:#ABAAA5}

/*  type **********************************************************************/
/*  Note: all typeface sizes are specified in em's, which means a size relative
    to the size chosen by the user in their browser. Helps scale the layout if
    the user increases or decreases the font size. Try to avoid px, pt.
*/

a.a_text {                    /* for the 'text' links in form and page bottom */
    text-decoration:underline;
    text-align:center;
    color:#3A00e8;
}

form {                              /* type within the search form */
    font-family:Arial;
    font-size:0.8em;
	
}

h1, h2, h3, h4 {                    /* default face for all headers */
    font-family:'Times New Roman';
}
h1 {                                /* text in header */
    font-size:1.1em;
    letter-spacing:0.4em;           /* horizontal spread (between letters) */
    font-weight:bold;
}

h2 {                                /* text in main col */
    font-size:1.4em;
}

h3 {
    font-size:1em;
    margin-top:0.5em;
}

h4 {
    font-size:0.8em;
    margin-top:0.5em;
}


h3 a {                              /* header text/link in left col */
    margin:1.0em 0.25em 0.0em 0.25em;
    color:black;
    text-decoration:none;
    cursor:pointer;
    /*border-bottom:1px dotted black;*/
}

p.bodytext {                        /* body text in maincol */
    font-family:Arial;
    font-size:0.8em;
    line-height:1.4em;              /* give some vertical spread */
    padding-right:1em;
    margin-top:0.5em;                 /* space between paragraphs */
}

p.footertext {                      /* for the copyright notice */
    font-family:'Times New Roman';
    font-size:1em;
    text-align:center;
}

#tab_maincol {
    font-family:sans-serif;
    font-size:0.8em;
}

ul.nav li {
    font-size:1em;
    font-family:serif;
}

ul.ulist1 li, ul.ulist2 li, ol.olist li {
    margin:0.2em 0em 0em 0em;
    font-size:0.8em;
    font-family:sans-serif;    
}


/*  embedded table in main column *********************************************/
#div_maincoltab {                   /* this div contains the table, sets overall params */
    width:95%;
    margin-top:1em;
    margin-bottom:1em;
}

#tab_maincol {                      /* general formatting of the table */
    border:1px dotted green;
    border-bottom:0px;
}

#tab_maincol th {                   /* general table header formatting */
    padding:4px 3px;
    border-bottom:1px dotted green;
}

.tab_header_col1 {                  /* col1 of header */
    width:33%;
    text-align:center;
    font-weight:bold;
}

.tab_header_col2 {                  /* col2 of header */
    width:33%;
    text-align:center;
    font-weight:bold;
    border-left:1px dotted green;
}

.tab_header_col3 {                  /* col3 of header */
    text-align:center;
    font-weight:bold;
    border-left:1px dotted green;
}

#tab_maincol td {                   /* general cell table formatting */
    border-width:1px;
    border-color:green;
    border-bottom:1px dotted green;
    padding:4px 3px;
}

.tab_body_col1 {                    /* col1 of body */
    text-align:center;
}

.tab_body_col2 {                    /* col2 of body */
    border-left:1px dotted green;    
    text-align:center;
}

.tab_body_col3 {                    /* col3 of body */
    border-left:1px dotted green;    
    text-align:center;
}