body { text-align: center; margin: auto; background: url('background.jpg'); background-repeat: repeat; color: #336699; font-family: Verdana, Arial, SunSans-Regular, Sans-Serif; font-size: 0.8em; } p { color: #336699; } h1 { font-size: 2em; } h1,h2,h3,h4,h5,h6 { color: #336699; margin: 0; padding: 0; } #canvas { text-align: left; width:  90%; max-width: 1137px; _width: expression(document.body.clientWidth < 1137? "90%" : document.body.clientWidth > 1137? "1137px" : "auto");    margin:  20px auto; overflow: hidden; padding: 0px; border: 1px solid #369; background-color: #fff; } .line { float: left; width: 100%; display: block; position: relative; /*prevents shifting when changing viewport in IE;thanks to Alan Gresley*/ overflow: hidden; /*only needed for equal height columns*/ background-color: transparent; border-bottom: 1px solid #369; } .item { position: relative; float: left; overflow: hidden; left: 100%; background-color: #fff; } .column { /* all columns have continous background color */ margin-bottom: -5000px; padding-bottom: 5000px; } /* end generic; all sap elements must have margin-left and with defined */ #logoitem { margin-left: -95%; width: 90%; } #title { margin-left: -80%; width: 65%; } #primary-nav { margin-left: -100%; width: 100%; background-color: #369; text-align: right; overflow: visible; } #main #sidebar-left { margin-left: -100%; width: 200px; border-right: 1px solid #369; z-index: 100; /*prevent main content from obscuring sidebars */ background-color: #336699; color: #ffffff; } #main #sidebar-left .sap-content { padding-left: .5em; padding-right: .5em; } #main #maincontent { margin-left: -100%; width: 100%; color: #444; } #main #maincontent .sap-content { padding: 0px 165px 5px 215px; } #main #sidebar-right { margin-left:  -150px; width: 150px; border-left: 1px solid #369; z-index: 100; /*prevent main content from obscuring sidebars */ text-align: center; } #main #sidebar-right .sap-content { padding-left: .5em; padding-right: .5em; } #main #sidebar-right .sap-content a { color: #369; } #main a { color: #fff; } #maincontent a { color: #369; } #footerline p { color: #fff; } #footerline { border-bottom: none; } #footer { margin-left: -100%; width: 100%; text-align: center; background-color: #369; } #header { background: url('banner.jpg'); height: 150px; background-position: top left; } #search { width: 100%; margin-top: 10px; margin-bottom: 10px; padding-top: 10px; padding-bottom: 10px; text-align: center; } .dotted_line_blue	{ height: 1px; background-color: #336699; background-image:url('theme_dotted_line.gif'); clear:both; margin-bottom: 5px;} .solid_line_blue { height: 1px; background-color:#336699; background-image:url('theme_solid_line.gif');margin-bottom: 5px;} #navcontainer { margin-top: 5px; padding-top:1px; font-size: .8em; } .navlist { margin: 0; /*removes indent IE and Opera*/ padding: 0; /*removes indent Mozilla and NN7*/ list-style-type: none; /*turns off display of bullet*/ width: 100%; border-top: 1px solid #fff; font-size: 1.3em; } .navlist li { padding: 9px 0 6px 23px; border-bottom: 1px solid #fff; background-image: url('bullet.gif'); background-repeat: no-repeat; background-position: 5px 10px; } .navlist li a { color: #fff; text-decoration: none; } .navlist li a:hover { color: #fff; text-decoration: underline; font-weight: bolder; } .horiznav { margin: 0; padding: 0; font-size: 1em; color: #fff; } .horiznav li { display: inline; list-style-type: none; padding: 10px 0 5px 8px; } .horiznav li a { color: #fff; text-decoration: underline; } .horiznav li a:hover { color: #fff; text-decoration: none; } .product_list { margin: 5px 0 5px 0; } .img-shadow, .image_product, .product_image_cost { float:left; background: url(shadowAlpha.png) no-repeat bottom right !important; background: url(shadow.gif) no-repeat bottom right; margin: 10px 0 0 10px !important; margin: 10px 0 0 5px; } .img-shadow img, .image_product img, .product_image_cost img { display: block; position: relative; background-color: #fff; border: 1px solid #336699; margin: -6px 6px 6px -6px; padding: 4px; }  .product_image_cost { text-align: center; } .yarrowheading { background-image: url('bullet_fff.gif'); background-repeat: no-repeat; background-position: 5px 5px; width: 100%; height: 25px; position: relative; } .yarrowheading span { position: absolute; top: 5px; left: 30px;  } .small_info { font-size: 0.7em; }