
body    { color: #000000; font-size: 0.8em; font-family: Arial, Sans-Serif; line-height: 1.3em; background-color: #ffffff; background-image: url("images/back.gif"); background-repeat: repeat; text-align: center; margin: 0; padding: 0;  } 
#wrap    { background-color: white; text-align: left; margin: 0 auto; width: 950px; overflow: hidden } 

a {
color: #000000;
}

a:visited {
color:#ffffff;
}
a:hover  { 
color: #018952;
 }
a:active { 
color:#000000;
}

h1   { font-size: 18px; font-style: oblique; font-weight: bold; text-transform: uppercase; margin: 0; padding-top: 5px; padding-bottom: 5px }
 
h2     { font-size: 16px; font-weight: bold; margin: 0; padding: 5px 10px }
h3  { color: #018952; font-size: 14px; font-style: oblique; font-weight: bold; margin: 1em 0 }
h4   { color: black; font-size: xx-large; font-family: Georgia, "Times New Roman", Times, serif; font-variant: small-caps; font-weight: bold; line-height: 32px; text-align: left; margin-top: 1.33em; margin-bottom: 1.33em; margin-left: 30px }
h5    { color: black; font-size: xx-large; font-family: Georgia, "Times New Roman", Times, serif; font-variant: small-caps; font-weight: bold; line-height: 36px; text-align: left; margin-top: 10px; margin-bottom: 10px; margin-left: 30px }
img.download {
vertical-align:middle;}

/* ----------container to center the layout-------- */
#container     { background-color: #ffffff; background-position: center top; margin: 0 auto; padding: 0; width: 100%; overflow: hidden; border: solid 1px #000000 } 

/* ----------banner for logo-------------- */
#banner          { background-color: #ffffff; background-image: url("images/the_better_bag_true_green_5.gif"); background-position: left center; width: 950px; height: 130px; border-bottom: 2px inset #000000 }

#banner2          { background-color: #ffffff; background-image: url("images/the_better_bag_true_green_5.gif"); background-position: left center; width: 950px; height: 120px; border-bottom: 2px inset #000000 }
 
img.banner    { margin: 0; padding-top: 0; padding-right: 0; position: relative; top: 0; right: 0; float: right; clear: left;  }
img.logo        { margin: 0; padding: 0 0 0 10px; position: relative; top: 0; right: 0; float: right }
#bannerleft   { top: 0; left: 0; width: 50%; height: 110px; float: left; border-bottom: 2px inset black }
#bannerright   { top: 0; right: 0; width: 50%; height: 110px; float: right; border-bottom: 2px inset black }
/* --------------right navi------------- */

 #right                     { background-color: #cccccc; background-image: url("images/grey_right.gif"); background-position: left top; text-align: left; visibility: visible; margin: 0; padding: 30px 0 0 20px; position: relative; top: 0; right: 0; bottom: 0; width: 180px; height: auto; float: left; overflow: hidden; border-right: 2px inset black }
 
  #rightinner                { background-color: #cccccc; background-image: url("images/grey_right.gif"); background-position: left top; text-align: justify; visibility: visible; margin: 0; padding: 30px 0 0; position: absolute; top: 115px; left: 778px; width: 196px; float: right; border-left: 2px inset black }
/* --------------menu------------- */

.buttonscontainer             { font-size: 13px; font-weight: bold; margin-top: 0; margin-right: 0; margin-left: 10px; position: relative; width: 160px }

.buttons a         { font-size: 12px; font-style: normal; font-weight: bold; line-height: 23px; text-decoration: none; background-color: transparent; background-image: url("images/menu_image.gif"); text-transform: inherit; text-indent: 15px; display: block; padding: 2px 2px 2px 3px }

 .buttons a:visited           { color: black; font-size: 12px; font-style: normal; font-weight: bold; line-height: 23px; text-decoration: none; background-image: url("images/menu_image.gif"); text-transform: inherit; text-indent: 15px; display: block; padding: 2px 2px 2px 3px }
 
 .buttons a:hover     { color: #ffffff; font-size: 12px; font-weight: bold; line-height: 23px; text-decoration: none; background-color: #a8d59d; text-indent: 15px }

.buttons a:active      {  color: #ffffff; font-size: 12px; font-weight: bold; line-height: 23px; text-decoration: none; background-color: #a8d59d; text-indent: 15px }
 
/* -----------------content--------------------- */ 
#content             { background-image: url("images/background2.gif"); background-repeat: no-repeat; visibility: visible; padding: 30px 30px 10px; position: relative; width: 70%; float: right }
#contentfull             { text-align: justify; visibility: visible; margin: 10px 30px; width: 95%; float: left; border-top: 2pt dotted gray }

#contentfull a {
color: #000000;
}

#contentfull a:visited {
color:#018952;
}
#contentfull a:hover  { 
color: #018952;
 }
#contentfull a:active { 
color:#000000;}

#content a {
color: #000000;
}

#content a:visited {
color:#018952;
}
#content a:hover  { 
color: #018952;
 }
#content a:active { 
color:#000000;
}
#contentleft     { background-color: #cee2bd; background-position: left top; text-align: left; margin: 0 10px 10px 0; padding: 30px 10px 10px; position: relative; width: 275px; float: left; border-right: 3px inset black }

#contentcenter    { background-position: left top; text-align: left; visibility: visible; margin: 30px 0 10px; padding-left: 30px; position: relative; width: 45%; float: none; clear: none }

#contentcenter a {
color: #000000;
}

#contentcenter a:visited {
color:#018952;
}
#contentcenter a:hover  { 
color: #018952;
 }
#contentcenter a:active { 
color:#000000;
}
p {
padding: 5px 10px;
margin:0px; 
}

pre{
font-size: 12px;
padding: 5px 10px;
margin:0px;
}

/*  ----------------footer---------------------- */ 
#footer           { color: white; font-size: 13px; background-color: #018952; text-align: left; margin: 0; padding: 3px 0 5px; width: 950px; height: 30px; clear: both; border-top: 2px inset #000000; overflow:hidden;display:inline-block; }

#footer a       { color: white; font-size: 13px; font-weight: bold; text-decoration: none }

#footer a:visited      { color: white; font-size: 13px; font-weight: bold }

#footer a:hover     { color: black; font-size: 13px; font-weight: bold }

#footer a:active    { color: white; font-size: 13px; font-weight: bold }
.green  { color: #018952; font-size: 13px; font-style: italic; font-weight: bold }

.boxr    { background-position: 0 top; margin-top: 3px; margin-right: 30px; width: auto; height: auto; float: right }

.boxl    { background-position: 0 top; margin-top: 3px; margin-left: 30px; width: auto; height: auto; float: left }

.boxcsi     { color: black; font-size: 0.9em; font-weight: bold; text-align: left; margin-top: 20px; width: 175px; height: auto }
.boxright     { color: black; font-size: 1em; font-style: italic; line-height: 1.5em; background-color: transparent; margin-bottom: 10px; padding: 12px; width: 560px; height: auto; float: left }

.boxleft      { color: black; font-size: 1em; font-style: italic; line-height: 1.5em; background-color: #e9f4e6; background-image: url("images/leaf2.gif"); background-repeat: repeat-x; margin-top: 15px; margin-right: 15px; margin-bottom: 15px; padding: 12px; position: relative; width: 290px; height: auto; float: left; border: ridge 1pt green }
leftimage { position: relative; float: left }

.boxcode        { color: black; font-size: 0.9em; font-style: italic; line-height: 1.2em; background-color: #e9f4e6; background-image: url("images/leaf2.gif"); background-repeat: repeat-x; margin-top: 15px; margin-right: 15px; margin-bottom: 15px; padding: 12px; position: relative; width: 580px; height: auto; float: left; border: ridge 1pt green }
.leftimage { position: relative; float: left }

.ppimage  { position: relative; float: right }
