/*  body and font definitions */
html { 
padding:0px;
margin:0px;
}

body {
background-color: #7f8092;
font-size: 62.5%;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
padding:0px;
margin:0px;
}


a { 
color: #000;
background-color: transparent;
text-decoration: none;
}

/*
a:hover {color: #bf7; background-color:transparent;}
a:active { color:#bf7; background-color:transparent;}
*/
a:hover {color: #60c025; background-color:transparent;}
a:active { color:#60c025; background-color:transparent;}


img {
border: 0;
}

img.textwrap {
float: left;
}


h1 {
font-size:1.8em;
/*
padding-top:10px;
*/
text-transform:uppercase;
color: #999;
}

h3 {
font-size:1.4em;
margin-top:10px;
margin-bottom:5px;
text-transform:uppercase;
color: #999;
}

h2 {
font-size:1.4em;
margin-top:10px;
margin-bottom:5px;
text-transform:uppercase;
color: #999;
}

h4 {
font-size: 1.4em;
color: #999;


/* following never used but here just in case - now just for text to match h3
text-transform:uppercase;
text-align: right;
color: #bf7;
background-color: #90897a;
padding:3px 20px;
margin:0px
*/
}


.editbutton {
background-color: #ffd325;
border: 1px solid #999;
font-size: 1.2em;
}

.local a {
text-decoration: line-through;
}

.local {
text-decoration: line-through;
}

.floatleft {
float: left;
}

.floatright {
float: right;
}

.center {
text-align: center;
}

.p_banner {
/*
float: left;
clear: left;
*/
/*width: 100%;*/
text-align: center;
font-size: 1.3em;
color: #fff;
/*background-color: #6c9de9;*/
background-color:#c7c2a9;
margin-top: 8px;
padding:3px;

display:block;
}


/* clear necessary for ie if under variable, wrapped image
clear will force div to move below the bottom outer edge of any right-floating div earlier in the source document.
*/
.block {
float: left;
clear: left;
width: 100%;
font-size: 1.1em;
}

.block a {

color: #628fd3;
/*
color: #333399;
*/
}

.block a:hover, a:active {
color: #94d6ff;
}

.quantitybox {
/* 3 of these on a product page, and used for basket */
margin-left: 1px;
font-size: 1.1em;
}

.quantitybox table {
width: 325px;
float: left;
/* eliminate cell spacing: */
border-collapse: collapse;
border: 1px solid #999;
}

.quantitybox th {
padding-left: 4px;
padding-right: 4px;
/*background-color: #7bb0d0;*/
background-color: #c7c2a9;
/*border: 1px solid #f00;*/

}

.quantitybox td {
padding-left: 4px;
padding-right: 4px;
/*border: 1px solid #f00;*/
}

.quantitybox a {
/* for the edit button */
/*
color: #333399;
*/
color: #628fd3;
text-decoration: underline;
font-size: .9em;
}

.quantitybox a:hover, a:active {
/*
color: #bf7;
*/
color: #94d6ff;
}

.qtitle {
/* like h3 */
margin-top: 4px;
color: #999;
font-weight: bold;
font-size: 1.3em;
}

.qtitle a {
color: #999;
}

.qtitle a:hover, a:active {
color: #bbb;
}


.quantitybox form {
margin: 0px;
padding: 0px;
}

.quantitybox input {
/* width styled in tag */
margin: 0px;
padding: 0px;
font-family: verdana, sans serif;
font-size: 1em;
}

.small {
font-size: .9em;
}

.smallred {
font-size: .9em;
color: #da3c2b;
}

.smallitalic {
font-size: .9em;
font-style: italic;
}

.smallreditalic {
font-size: .9em;
color: #ff3333;
font-style: italic;
}

.linktext {
float: left;
clear: left;
margin-left: 5px;
margin-top: 2px;
text-align: left;
}

.listprice {
float: left;
clear: left;
margin-left: 5px;
margin-top: 2px;
font-family: Arial, sans serif;
font-weight: bold;
font-size: .8em;
color: #747474;
}

.saleprice {
float: left;
clear: left;
margin-left: 5px;
margin-top: 2px;
font-family: Arial, sans serif;
font-weight: bold;
font-size: .8em;
color: #da3c2b;
}

.ratings {
float: left;
clear: left;
margin-left: 5px;
margin-top: 2px;
font-family: Arial, sans serif;
/*font-weight: bold;*/
font-size: .8em;
color: #da3c2b;
}

.pdflink {
font-size: 1.4em;
vertical-align: 2px;
}

.wrap1 {
/* little blocks on category page */
width: 120px;
height: 179px;
float: left;
padding-top: 9px;
text-align: center;
font-size: 1.2em;
}



/*  positioning-layers static and absolute */



#left {
/*tall pic is 200pix wide at bottom, and 135px tall tongue to right*/
position: absolute;
left: 0px;
top: 0px;
width: 200px;
/*z-index: -999;*/

/*margin: 10px;*/
}


#banner {
/* behind tall pic.  margins make no sense.  see also top-margin on body. where did rt margin come from? */
height: 135px;
background-image: url(../assets-site/00-sunflower-1x135.jpg);
background-repeat: repeat-x;
}

#logo {
position: absolute;
left: 200px;
top: 0px;
}

#webtext {
/*also holds google search*/
float: right;
/*text-align:right;*/
padding-right:10px;
font-size: .9em;
color: #ccc;
font-style: italic;
}


#right {
position: absolute;
right: 0px;        
width: 200px;
margin: 0px;
background-color: #7f8092; /*need bg to avoid overlap ugliness*/
}


#content {
margin: 16px 216px 0px 216px;
padding: 10px;
background-color: #fff;
/*
position: relative;
*/

}


.bodytext {
font-size: 1.2em;
}

.bodytext ul {
/*for firefox*/
display:block;
padding-left:13px;
}


#checkoutcontent {
/*used for local checkout, also in secure.css*/
margin: 16px 16px 0px 216px;
padding: 10px;
background-color: #fff;

font-size: 1.2em;
}

#checkoutcontent a {
color: #628fd3;
}

#checkoutcontent a:hover, a:active {
color: #94d6ff;
}


#footer {
/*
clear: left;
float: left;
*/
clear:both; /*necessary to clear all floats (from wraps above) for content div bg to extend down.*/
/*padding-top: 20px; was45*/
margin-top: 45px;
width: 100%;
/*height: 100px; 40px; was 60*/
text-align: center;
/*border-top: 1px solid #999;*/
padding-top: 20px;
}

#footer a {
text-decoration: underline;
}

/* subsections */

#searchbox {
/* firefox and ie handle height of text box differently - split the difference */
margin-top: 10px;
margin-bottom: -2px;
/*padding-right: 10px;*/
padding-left: 10px;
height: 16px;
border:1px solid red;
}

#searchbox form {
margin: 0px;
padding: 0px;
}

#searchbox input {
/* width styled in tag */
margin: 0px;
padding: 0px;
background-color: #f9f4db;
color: #000;
font-family: verdana, sans serif;
font-size: 10px;
}

.navbar {
margin-top: -2px;
color: #628fd3;
font-size: 1.2em;
}

.navbar a {
color: #628fd3;
}

.navbar a:hover, a:active {
color: #94d6ff;
}


.topcontent {
/* to push other things down below the wrapping section - not sure if this is used */
display: block;
}





.menu-top {
/* container, for gray PRODUCTS etc */
float: left;
width: 200px;
padding-left:5px; /*temp to make old title imgs work*/
background-color:#7ed5b;
margin-top: 16px;
}


.menu {
/* container */
float: left;
width: 200px;
/*background-color: #7ed56b;*/
/*background-image: url(../assets-site/00-green-grad.gif);*/
background-image: url(../assets-site/00-blue-grad.gif);
background-repeat: repeat-y;
padding: 0px;
margin: 0px;
}

.menu ul {
margin:0;
padding: 5px 0px 7px 0px; /*air top and bottom*/
list-style-type: none;
font-size:1.3em;
font-family: Verdana, Arial, Sans-Serif;
}

.menu li {
/* ie bug - without width there are gaps before any b or span */
width: 100%;
margin:0;
padding: 0;
}

.menu a {
/* style left menu link if necessary */
color:#fff;
padding-left:10px;
padding-top:2px;
padding-bottom:1px;
display:block;
width:100%;
}

.menu a:hover {
/*background-image: url(../assets-site/00-green-grad-dark.gif);*/
background-image: url(../assets-site/00-blue-grad-dark.gif);
background-repeat: repeat-y;
}


.menu2 {
/* container */
float: right;
width: 200px;
/*background-image: url(../assets-site/00-green-grad-right.gif);*/
background-image: url(../assets-site/00-blue-grad-right.gif);
background-repeat: repeat-y;
padding: 0px;
margin: 0px;
/*border:1px solid yellow;*/
}

.menu2-top {
float: right;
width: 195px;/*to allow padding*/
margin: 16px 0px 0px 0px;
/*margin: 0px 0px 0px 0px;*/
padding: 0px 0px 0px 5px;
}

.menu2 ul {
margin:0;
padding: 5px 0px 7px 0px; /*air top and bottom*/
list-style-type: none;
font-size:1.3em;
font-family: Verdana, Arial, Sans-Serif;
}


.menu2 li {
/* ie bug - without width there are gaps before any b or span */
width: 100%;
margin:0;
padding: 0;
}

.menu2 a {
color:#fff;
padding:2px 0px 1px 10px;
display:block;
}

.menu2 a:hover {
/*background-image: url(../assets-site/00-green-grad-right-dark.gif);*/
background-image: url(../assets-site/00-blue-grad-right-dark.gif);
background-repeat: repeat-y;
}


.menu3 {
/* container */
float: right;
width: 200px;
/*background-image: url(../assets-site/00-green-grad-right.gif);*/
background-image: url(../assets-site/00-blue-grad-right.gif);
background-repeat: repeat-y;
padding: 0px;
margin: 0px;
/*border:1px solid yellow;*/
}

.wrap3 {
text-align: center;
margin:0px;
padding:10px 2px 2px 2px;
font-size:1.3em;
font-family: Verdana, Arial, Sans-Serif;
}

.wrap3:hover {
/*background-image: url(../assets-site/00-green-grad-right-dark.gif);*/
background-image: url(../assets-site/00-blue-grad-right-dark.gif);
background-repeat: repeat-y;
}

.wrap3 a {
color:#fff;
}

/* colorbar is 24px tall. */
/* clear needed if directly under body text with variable size image */
.colorbar {
float: left;
clear: left;
width: 100%;
background-color: #c7c2a9;
margin-top: 8px;
padding: 0px;
}

.barspan {
font-size:1.4em;
text-transform: uppercase;
font-family: Verdana, Arial, Sans-Serif;

font-weight: bold;
font-style: italic;
margin: 3px;
position: relative;
top: 3px;
}

/*Styles added to accomodate the use of bxslider with index.php
October/November 2015 - Gary Atkinson*/


/*style the caption area at the bottom of the panel*/
.bxslider-caption {
    position:absolute;
    bottom:0px;
/*    right:0px;
    left:0px;*/
    width: 100%;
    /*min-height: 50px;*/
    background-color: rgba(34, 34, 34, 0.6);

    padding-left: 0.5em;
    padding-top: 0.25em;
    padding-bottom: 0.5em;
    padding-right: 0.5em;
    z-index: 1;
    /*font-family: Source Sans Pro, sans-serif;*/
}

.bxslider-caption:hover {

    background-color: rgba(34, 34, 34, 0.9);
    /*cursor: pointer;*/
}

.line-1-text {
    color: white;
    /*font-size: 2.0em;*/
    font-size: 1.58vw;
    font-weight: 700;
    text-align: left;
    text-transform: none;

    /*font-family: Source Sans Pro, sans-serif;*/
}

.line-2-text {
    color: white;
    /*font-size: 1.6em;*/
    font-size: 1.6vw;
    font-weight: 500;
    text-align: left;
    text-transform: none;

    /*font-family: Source Sans Pro, sans-serif;*/
}



/*remove the box shadow from the slider*/
.bx-wrapper {
    /*box-shadow: none;*/
}

#loading-freestyle {
    height:450px;
    position:relative;
    z-order:-9999;
}

.loader {
    position:absolute;
    top:50%;
    margin-top: -16px;
    left:50%;
    margin-left: -16px;
}

.carousel-wrapper {
    margin-bottom:50px;
    visibility:hidden;
    max-width:900px; /* limit width on larger displays*/
    max-height: 400px;
    margin: 0 auto;
}

.terms-head {
    font-size:1.1em;
    font-weight:600;
    margin-left:1.0em;
    color: #999; 
}

.terms {
    margin-left:4.0em;
    margin-right:2.0em;
    margin-top:1.0em;
}

#bbb-logo {
position: absolute;
    top: 82px;
    left: 50px;
}

/* css for shopperapproved.com additions */
#shopper {
position: absolute;
    top: 20px;
    left: 40px;
}

#footer-shopper a { 
    color: #fff;
    background-color: transparent;
    text-decoration: none;
    font-size: 5px;
}

#footer-shopper a:hover { 
    color: #fff;
    cursor: default;
}
