/* CSS Document */ body { background: #fff; margin-left: 20px; padding: 0; z-index:0} img {border-style: none; text-decoration:none;} td.left {background: #F4EEEE;} td.contentvertline {background: #DDD; width: 1px; } p, a, li { font: 11px/14px Tahoma, Arial, Helvetica, san-serif; color:#555; text-align: left; margin: 0; padding: 0; } a { color:#333; margin: 0; padding: 0; text-decoration: none; outline: none; } a:hover { color:#000; text-decoration: underline; } p.contentheader { color: #7F8517; font-weight: bold; padding: 6px 0 6px 0; text-align: left} p.contentheaderbw { color: #606060; font-weight: bold; padding: 6px 0 6px 0; text-align: left} div.contentheader { font: bold 11px/14px Tahoma, Arial, Helvetica, san-serif; color: #7f8517; padding: 6px 0; text-align: left; margin: 0;} p.smallright { font: 10px/12px Tahoma, Arial, Helvetica, san-serif; color:#666; text-align: right; margin: 0; padding: 0; } p.contentheader2 { font: bold 12px/15px Tahoma, Arial, Helvetica, san-serif; color: #7f8517; text-align: left; padding: 6px 0 0; } p.small { font: 10px/12px Tahoma, Arial, Helvetica, san-serif; color:#666; text-align: left; margin: 0; padding: 0; } form { padding: 0; margin: 0; } .search { font: 10px Tahoma, Arial, Helvetica, san-serif; color:#000; border: 1px solid #777; background: #FFF; width: 162px; height:17px; } .zipsearch { font: 10px Tahoma, Arial, Helvetica, san-serif; color:#000; border: 1px solid #777; background: #FFF; width: 90px; height:16px; } .request { font: 10px Tahoma, Arial, Helvetica, san-serif; color:#000; border: 1px solid #777; background: #FFF; width: 20px; height:16px; } div.blurb { text-align: left; width: 432px; margin: 0; padding: 25px 0 0; } div.blurb p { text-align: left; margin: 0; padding: 0 0 15px; } p.blurbinstruction { text-align: left; margin: 0; padding: 15px 7px 25px 0; } p.blurbinset { text-align: left; margin: 0; padding: 15px 7px; } p.blurbinset a:hover { text-align: left; margin: 0; padding: 0; } p.blurbinset a:hover { color:#000; text-decoration: underline; text-align: left; } div.header { background: #C1C671;} /* grayscale microsite css */ div.headerbw { background: #b2b2b2;} span.stactive { text-align: left; margin: 0; padding: 0 0 15px; color: #F15D22; font-weight: bold;} p.synctechheader { text-align: left; margin: 0; padding: 0 0 15px; color: #717074; font-weight: bold;} a.synctechheader { text-align: left; margin: 0; padding: 0 0 15px; color: #717074; font-weight: bold; text-decoration: none;} p.synctechheader a { text-align: left; margin: 0; padding: 0 0 15px; color: #717074; font-weight: bold; text-decoration: none;} p.synctechheader a:hover { text-align: left; margin: 0; padding: 0 0 15px; color: #F15D22; font-weight: bold; text-decoration: none;} div.productdetctabw { width: 244px; margin:0; padding:0} div.productdetctahdrbw p { text-align: left; background: #e5e5e5; font-weight: bold; margin:0; padding: 7px 8px 7px 8px;} div.contentbw { background: #c9cacc;} div.popup { background: white;} div.popupms {background-image: url(http://www.peterpepper.com/main/images/microsites/health/topnav_b.jpg);} div.nav { background: #C1C0BD;} table.homeproducts { border-collapse: collapse #ddd; width: 758px; margin: 0; padding: 0; } table.homeproducts tr { border-left: 1px solid #ddd; margin: 0; padding: 0;} table.homeproducts tr td { border-right: 1px solid #ddd; margin: 0; padding: 0;} div.breadcrumb {background: #EEE; padding: 0 0 0 20px; text-align: left} div.breadcrumb ul { padding: 6px 0 8px 0; margin: 0; } div.breadcrumb ul li { display: inline; margin: 0; padding: 0 6px 0 0px;} div.breadcrumb ul li.state { font-weight: bold;} div.breadcrumb ul li a { color:#333; text-decoration: none; } div.breadcrumb ul li a:hover { color:#000; text-decoration: underline; } div.leftnav { background-color: #f4eeee; text-align: left; width: 160px; margin: 0; padding: 0; } div.leftnav ul { list-style-type: none; margin: 0; padding: 0 20px 15px 20px; } div.leftnav ul li { margin: 0; padding: 3px 0 3px 0; } div.leftnav ul li.selected { background: transparent url( '../images/leftnav_selected_arrow2.gif' ) no-repeat; margin: 0 0 0 0; padding: 3px 0 3px 9px; } div.leftnav ul li.selected a { color: #000; font-weight: bold; text-decoration: none; } div.leftnav ul li.selected a:hover { text-decoration: underline; } div.findarep { background:#EAEFA5; text-align:center; margin:0; padding: 15px 0 15px 0;} div.find { margin: 0; padding: 5px 0 15px 0; } div.blurbhdr p { background:#eaefa5; text-align: left; margin: 0; padding: 5px 7px; } div.note { text-align: left; border: solid 1px #c1c671; margin: 0 0 15px; padding: 7px; } div.note a:hover { color:#000; text-decoration: underline; } table.category { border-collapse: collapse; width: 575px; margin: 10px 0 10px 0; padding: 0; } table.category tr td { text-align: left; border-right: 1px solid #ddd; margin: 0; padding: 0; } table.category tr td.last { border-right: none;} div.subnavhdr { background-color: #f8fcaf; width: 575px; margin: 0; padding: 0; } div.subnavhdr p { font: 10px Tahoma, Arial, Helvetica, san-serif; color:#666; font-weight: bold; margin: 0; padding: 12px 10px 5px 10px; } div.subnav { text-align: left; width: 141px; margin: 0; padding: 0; } div.subnav ul { text-align: left; list-style-type: none; margin: 0; padding: 0 10px 5px; } div.subnav ul li { text-align: left; margin: 0; padding: 0 0 2px; } div.subnav ul li.category { color: #333; font-weight: bold; text-align: left; } div.subnav ul li a { color: #333; font-weight: bold; text-decoration: none; text-align: left; } div.subnav ul li a:hover { color: #000; text-decoration: underline; text-align: left; } div.subnav ul li.last { text-align: left; margin: 0; padding: 3px 0 0; } div.subnav ul li.last a { color: #333; font-weight: bold; text-decoration: none; text-align: left; } div.subnav ul li.last a:hover { color: #000; text-decoration: underline; text-align: left; } div.subnav ul li.indent { background: url(../images/small_arrow.gif) no-repeat; text-align: left; margin: 0 0 0 0; padding: 3px 0 1px 9px; } div.subnav ul li.indent a { color: #444; font-weight: normal; text-decoration: none; text-align: left; } div.subnav ul li.indent a:hover { color: #000; text-decoration: underline; text-align: left; } p.cattitle { color: #828918; font-weight: bold; margin: 0; padding: 0 0 8px 0; } p.cattitle2 { color: #828918; font-weight: bold; margin: 0; padding: 15px 0 8px 0; } p.catproddescr { margin: 0; padding: 0 0 8px 0; } p.blurb { text-align: left; margin: 0; padding: 25px 10px 15px 0; } table.catproduct { border-collapse: collapse; border-style: none; width: 429px; margin: 0 0 15px 0; padding: 0; } table.catproduct tr td { margin: 0; padding: 0; } table.catproductsep { border-collapse: collapse; border-style: none; width: 429px; margin: 15px 0 15px 0; padding: 0; } table.catproductsep tr td { border-right: 1px solid #ddd; margin: 0; padding: 0; } table.catproductsep tr td.last { border-right: none; margin: 0; padding: 0; } table.catproduct2 { border-collapse: collapse; width: 296px; margin: 0 0 15px 0; padding: 0; } table.catproduct2 tr td { margin: 0; padding: 0; } div.catproduct { border-right: 1px solid #ddd; width: 199px; margin: 0; padding: 0;} div.catproductinfo { text-align: left; margin: 0; padding: 0 10px; } div.catproductinfoprod { border-right: 1px solid #ddd; margin: 0; padding: 0 10px 0 10px;} div.catproductlast { border-right: none; width: 198px; margin:0; padding: 0 12px 0 10px; } div.catproductwide { border-right: none; width: 409px; margin:0; padding: 0 12px 0 10px; } div.catproduct3col { border-style: none; width: 141px; margin:0; padding: 15px 0 0 0; } div.catproduct3colsep { border-style: none; width: 141px; margin:0; padding: 0; } div.catproductinfo ul { list-style-type: none; margin: 0; padding: 0; } div.catproductinfo ul li { background: transparent url( '../images/small_arrow.gif' ) no-repeat; margin: 0 0 0 0; padding: 3px 0 3px 9px; } div.catproductinfo ul li a { color: #333; font-weight: bold; text-decoration: none; } div.catproductinfo ul li a:hover { color: #000; text-decoration: underline; } div.productimage { height: 100px; vertical-align: bottom; margin: 0; padding: 0; } div.productimagesmall { text-align: center; height: 100px; vertical-align: bottom; margin: 0; padding: 0; } div.productimage img { display: inline; } div.whattoconsider { background-color: #f2f6b6; text-align: left; width: 122px; border: solid 1px #c1c671; margin: 0; padding: 10px; } div.whattoconsider2 { background-color: #f2f6b6; text-align: left; width: 257px; border: solid 1px #c1c671; margin: 0; padding: 10px; } div.whattoconsiderw { background-color: #f2f6b6; text-align: left; width: 555px; border: solid 1px #c1c671; margin: 0; padding: 10px; } div.popupcontent { background:#eaefa5; vertical-align: bottom; width: 600px; height: 21px; margin: 0; padding: 0; } div.popupcontent ul { list-style-type: none; margin: 0; padding: 0; } div.popupcontent ul li { display: inline; margin: 0; padding: 0;} div.popupcontent ul li a { margin: 0; padding: 0;} div.popupcontentbw { background:#cccccc; vertical-align: bottom; width: 600px; height: 21px; margin: 0; padding: 0; } div.popupcontentbw ul { list-style-type: none; margin: 0; padding: 0; } div.popupcontentbw ul li { display: inline; margin: 0; padding: 0;} div.popupcontentbw ul li a { margin: 0; padding: 0;} div.popuplargeimage { margin: 15px 10px; padding: 0; } div.popuplargeimage img { border: solid 1px white; } /*div.popuplargeimage color used to be #ccc changed to white to resolve JS comment on 08Dec05 email.*/ div.popupsmallimage { margin: 5px 0 5px 10px; padding: 0; } div.popupsmallimage img { border: 1px solid #ccc; } div.popuplargecolor { border: 1px solid #ccc; width: 220px; height: 220px; margin: 5px 10px 5px 10px; padding: 0; } div.popupsmallcolor { text-align: center; border: solid 1px #ccc; width: 53px; height: 53px !important; margin: 5px 0 5px 10px; padding: 0; } p.popuplargecolor { text-align: left; margin: 0; padding: 10px 0 0 10px } p.popupsmall { font: 10px/12px Tahoma, Arial, Helvetica, san-serif; color:#666; margin: 0; padding: 10px 0 15px 10px; } p.productdethdr { text-align: left; font-weight: bold; padding: 20px 0 0 0;} p.productdetcontent { text-align: left; padding: 15px 0 15px 0;} p.productdetcontent a:hover { text-decoration: underline; } div.productdet { text-align: left; margin: 0; padding: 4px 0 8px 0; } div.productdet a { font-weight: bold; } div.productdet a:hover { color:#000; text-decoration: underline; } div.productdetcta { width: 244px; margin:0; padding:0} div.productdetctahdr p { text-align: left; background:#EAEFA5; font-weight: bold; margin:0; padding: 7px 8px 7px 8px;} div.productdetctasubhdr p { border-top: 1px solid #ccc; background:#eee; font-weight: bold; text-align: left; margin:0; padding:7px 8px; } div.productdetctaleft p { background: #eee; text-align: left; margin: 0; padding: 10px 8px; } div.productdetctaleft a { font-weight: bold; color:#555;} div.productdetctalefth2b a { color: #555; font-weight: bold; } div.productdetctaleft a:hover { color:#000; text-decoration: underline; } div.productdetctalefth2b a:hover { color: #000; text-decoration: underline; } div.productdetctaright {font: 11px/14px Tahoma, Arial, Helvetica, san-serif; color:#555; text-align: left; background:#EEE; margin:0; padding:10px 8px 10px 0; } div.productdetctarighth2b { color: #555; font: 11px/14px Tahoma, Arial, Helvetica, san-serif; background: #eee; text-align: left; margin: 0; padding: 3px 8px 3px 0; } div.productdetctalefth2b p { color: #555; font: 11px/14px Tahoma, Arial, Helvetica, san-serif; background: #eee; text-align: left; margin: 0; padding: 3px 8px; } div.productdetctablurb p { text-align: left; background:#eee; margin:0; padding:10px 8px; } div.productdetdisclaim p { text-align: left; margin: 0; padding: 5px 0 2px; } div.productdetctabtn p { text-align: left; background:#EEE; margin:0; padding:4px 8px 4px 8px; } .productdetctasearch { text-align: left; background:#EEE; margin:0; padding:0 8px 10px 8px; } div.productdetctainfo p { text-align: left; border-top: 1px solid #ccc; background:#EEE; margin:0; padding:7px 8px 7px 8px; } div.productdetctarightspacer p { text-align: left; background:#EEE; margin:0; padding:10px 8px 10px 0; } table.productdetctarightr tr td { text-align: right; background:#eee; margin:0; padding:10px 8px 10px 0; } table.products { text-align: left; border-collapse: collapse; margin: 0; padding: 0; } table.products tr { vertical-align: middle; border-left: 1px solid #ddd; margin: 0; padding: 0; } span.productsleft1 { border-left: 1px solid #ddd;} table.products td { vertical-align: middle; border-right: 1px solid #ddd; width: 124px; margin: 0; padding: 5px 8px; } table.products td a { color:#333; text-decoration: none; margin: 0; padding: 0; } table.products td a:hover { color:#000; text-decoration: underline; } /*product group code - 23 Aug 2007 */ table.productgroups { text-align: left; border-collapse: collapse; margin: 0; padding: 0; } table.productgroups tr { vertical-align: middle; border-left: 1px solid #ddd; margin: 0; padding: 0; } table.productgroups td { vertical-align: middle; border-right: 1px solid #ddd; width: 248px; margin: 0; padding: 5px 8px; } /* width originally 124px */ table.productgroups td a { color:#333; text-decoration: none; margin: 0; padding: 0; } table.productgroups td a:hover { color:#000; text-decoration: underline; } div.productgroupfeatures { padding: 0 0 0 10px; text-align: left} div.productgroupfeatures ul { padding: 4px 0 8px; margin: 0; } div.productgroupfeatures ul li {list-style-type: disc; display: inline; margin: 0; padding: 0 6px 0 0px;} div.productgroupfeatures ul li.state { font-weight: bold;} div.productgroupfeatures ul li a { color:#333; text-decoration: none; } div.productgroupfeatures ul li a:hover { color:#000; text-decoration: underline; } p.price { font: 10px/14px Tahoma, Arial, Helvetica, san-serif; color: #444; margin: 0; padding: 0; } p.sort { font-weight: bold; text-align: left; margin:0; padding: 6px 0; } p.sort a.selected { color: #000; font-weight: bold; text decoration: none; } p.sort a.selected:hover { color: #000; font-weight: bold; text decoration: underline; } p.pagenums { font-weight: bold; text-align: right; margin:0; padding: 6px 0; } p.pagenums a.selected { color: #000; font-weight: bold; text decoration: none; } p.pagenums a.selected:hover { color: #000; font-weight: bold; text decoration: underline; } span.pipe { color: #ddd; margin: 0; padding: 0 0 8px 0;} div.litrequest { text-align: left; width: 27px; margin: 0; padding: 0 7px 15px; } div.radioselect {margin: 0; padding: 0 0 15px 0; } .formlarge { font: 11px Tahoma, Arial, Helvetica, san-serif; color:#000; border: solid 1px #777; background: #fff; text-align: left; width: 360px; height:16px; } .formlargetarea { font: 11px Tahoma, Arial, Helvetica, san-serif; color:#000; border: solid 1px #777; background: #fff; text-align: left; width: 360px; height:50px; } .formsmall { font: 11px Tahoma, Arial, Helvetica, san-serif; color:#000; border: solid 1px #777; background: #fff; text-align: left; width: 180px; height:16px; } .formtiny { font: 11px Tahoma, Arial, Helvetica, san-serif; color:#000; border: solid 1px #777; background: #fff; text-align: left; width: 90px; height:16px; } .formsamplerqst { font: 11px Tahoma, Arial, Helvetica, san-serif; color:#000; border: solid 1px #777; background: #fff; text-align: left; width: 50px; height:16px; } p.formtext { text-align: left; margin: 0; padding: 0 7px 8px; } div.forminfo { text-align: left; margin: 0; padding: 0 7px 8px; } p.forminstruction { text-align: left; margin: 0; padding: 0 7px 15px; } div.download { width: 39px; margin: 0; padding: 0 7px 15px 7px; } div.download a { border: 0; } p.downloadsmall { font: 10px/12px Tahoma, Arial, Helvetica, san-serif; text-align: center; color:#666; margin: 0; padding: 5px 0 0 0; } p.blurbdescription { text-align: left; margin: 0; padding: 0 7px 15px 0; } p.continue { margin: 0; padding: 15px 0 15px 0; } p.continue a:hover { color:#000; text-decoration: underline; } p.righttext { font: 11px/14px Tahoma, Arial, Helvetica, san-serif; color:#555; text-align: right; margin: 0; padding: 0; } div.footer { padding: 0 0 0 24px; } div.footer ul { padding: 2px 0 5px 0; margin: 0; } div.footer ul li { display: inline; border-right: 1px solid #ecf0a8; margin: 0; padding: 0 8px 0 6px;} div.footer ul li.last { border-right: none; } div.footer ul li a { color:#FFF; text-decoration: none;} div.footer ul li a:hover { color:#ecf0a8; text-decoration: underline; } div.footerright { padding: 0 30px 0 0; } div.footerright p { color: #fff; padding: 2px 0 5px 0; margin: 0; text-align: right; } div.popupsmallcfs { text-align: center; margin: 5px 0 5px 10px; padding: 0; width: 60px; height: 60px !important; border: solid 1px #ccc; } div.productimagetall { text-align: center; height: 150px; vertical-align: bottom; margin: 0; padding: 0; } p.pscatgridfinish { font: 10px/14px Tahoma, Arial, Helvetica, san-serif; color: #444; margin: 0; padding: 0; } div.popupsmallimagenoline img { padding: 5px; border: 1px #ccc; } div.productdetvpi { text-align: left; margin: 0; padding: 4px 0 0; } div.productdetvpi a { font-weight: bold; } div.productdetvpi a:hover { color:#000; text-decoration: underline; } span.regtm { font: 8px/14px Tahoma, Arial, Helvetica, san-serif; color: #444; position: relative; top: -2pt; margin: 0; padding: 0; } div.yellowbox { background-color: #f2f6b6; text-align: left; border: solid 1px #c1c671; margin: 0; padding: 10px; } div.yellowhighlight { background-color: #f2f6b6; text-align: left; border: none; margin: 0; padding: 5px; } div.whitebox { background-color: white; text-align: left; border: solid 1px #c1c671; margin: 0; padding: 10px; } /* more selections --start */ div.moreselections {background-color: white; text-align: left; margin: 0; padding: 10px; border: solid 1px #ddd;} table.moreselections { text-align: left; border-collapse: collapse; margin: 0; padding: 0; } table.moreselections tr { vertical-align: middle; border-left: 1px solid #ddd; margin: 0; padding: 0; } table.moreselections td { vertical-align: middle; border-right: 1px solid #ddd; width: 100px; margin: 0; padding: 5px 8px; text-align: left;} /* more selections text parameters */ p.moreselectionsdimsinactive {font: 13px/16px Tahoma, Arial, Helvetica, san-serif; font-weight:normal; color: #696969; margin: 0; padding: 0; text-align: center;} p.moreselectionsdimsinactive a { font: 13px/16px Tahoma, Arial, Helvetica, san-serif; color:#696969; margin: 0; padding: 0; text-decoration:none; font-weight:normal; } p.moreselectionsdimsinactive a:hover { font: 13px/16px Tahoma, Arial, Helvetica, san-serif; color:#696969; text-decoration: underline; font-weight: none; } p.moreselectionsdimsactive {font: bold 13px/16px Tahoma, Arial, Helvetica, san-serif; color: #9b9f23; margin: 0; padding: 0; font-weight: bold; text-align: center;} p.moreselectionsdimsactive a { font: 13px/16px Tahoma, Arial, Helvetica, san-serif; color:#9b9f23; margin: 0; padding: 0; text-decoration: none; font-weight: bold; } p.moreselectionsdimsactive a:hover { font: 13px/16px Tahoma, Arial, Helvetica, san-serif; color:#9b9f23; text-decoration: underline; font-weight: bold;} /* more selections --end */ div.activecolor { font: bold 11px/14px Tahoma, Arial, Helvetica, san-serif; color:#555;text-align: left; margin: 0; padding: 10px 0 0 10px; } div.sparseproductlmbox { padding-top:5px; padding-bottom:10px; background-image:url('http://www.peterpepper.com/main/images/products/features/globalelements/yellowspacer.jpg');} div.sparseproductlmbox p {font: 10px/14px Tahoma, Arial, Helvetica, san-serif; color:#555; font-weight:600;padding-top:10px; padding-bottom:10px; background-image:url('http://www.peterpepper.com/main/images/products/features/globalelements/yellowspacer.jpg');} span.sparseproductlmboxopts {font: 10px/20px Tahoma, Arial, Helvetica, san-serif; color:#333; font-weight:bold; padding-left:28px;} span.sparseproductlmboxopts a {font: 10px/20px Tahoma, Arial, Helvetica, san-serif; color:#333; font-weight:bold; text-decoration:none;} div.sparsecaption p { font: 10px/14px Tahoma, Arial, Helvetica, san-serif; text-align: left; margin: 0; padding: 0; } /*f360*/ .addressfield { border: 1px none #CCCCCC; } .elementdivheader { background: #6395C8; font-family: Veranda, Arial, Helvetica; font-size: 12px; color: #ffffff; font-weight: bold; padding:5px 5px 5px 5px; } .elementsubdivheader { background: white; padding:0px 0px 0px 0px; font-family: Veranda, Geneva, Arial, Helvetica; font-size: 12px; color: #333333; font-weight: bold; } .elementattributeheader {padding:0; font-family: Veranda, Geneva, Arial, Helvetica; font-size: 12px; color: #333333; font-weight: bold; border-bottom-color: gray; border-bottom-width: thin; } .elementtext {font-family: Geneva, Arial, Helvetica; font-size: 12px; color: #333333; } .elementtext a {font-family: Geneva, Arial, Helvetica; font-size: 12px; color: #000; } .elementtext a:hover { color:#000; text-decoration: underline; } .elementsubheadertext {font-family: Geneva, Arial, Helvetica; font-size: 12px; color: #333333; font-weight: bold;} .contactmethodheader {font-family: veranda, Arial, Helvetica; font-size: 12px; color: #ff6633; font-weight: bold;} /*wocode*/ .style5 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; } .style9 {font-family: Geneva, Arial, Helvetica; font-size: 10px; } .style14 {font-family: Geneva, Arial, Helvetica} .pvheader {font-family: Geneva, Arial, Helvetica; font-size: 16px; font-weight:bold; color: #333333;} .wiboxnumber {font-family: Geneva, Arial, Helvetica; font-size: 18px; font-weight:bold; color: #333333;} .style15 {font-family: Geneva, Arial, Helvetica; font-size: 12px; color: #333333; } .style16 {font-family: Geneva, Arial, Helvetica; font-size: 12px; color: #000000; } .style20 { font-family: Geneva, Arial, Helvetica; font-size: 14px; color: #CC6600; font-weight: bold; } .sectheaderinverse { font-family: Geneva, Arial, Helvetica; font-size: 14px; color: #333333; font-weight: bold; } .style23 {font-family: Geneva, Arial, Helvetica; font-size: 11px; } .leftlistheader { font-family: Geneva, Arial, Helvetica; font-size: 13px; color: white; font-weight: bold; } .style24 { font-size: 12px; color: #669900; } .style26 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; } .style27 {color: #333333} .sectheader { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-bottom-style: solid; border-top-color: #333333; border-right-color: #333333; border-bottom-color: #333333; border-left-color: #333333; } .wolineitems { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: dotted; border-top-color: #CCCCCC; border-right-color: #CCCCCC; border-bottom-color: #CC6600; border-left-color: #CCCCCC; border-bottom-style: dotted; } .wolineitemswnote { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: dotted; border-top-color: #CCCCCC; border-right-color: #CCCCCC; border-bottom-color: #CC6600; border-left-color: #CCCCCC; border-bottom-style: none; } .totalsheader { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-left-style: solid; border-right-style: none; border-top-color: #CC6600; border-right-color: #999999; border-bottom-color: #CC6600; border-left-color: #999999; border-bottom-style: dotted; border-top-style: none;} .totalsheadertop { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-left-style: solid; border-right-style: none; border-top-color: #CC6600; border-right-color: #999999; border-bottom-color: #CC6600; border-left-color: #999999; border-bottom-style: dotted; border-top-style: solid; } .totalsvaluetop { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: solid; border-left-style: none; border-top-color: #CC6600; border-right-color: #999999; border-bottom-color: #CC6600; border-left-color: #999999; border-bottom-style: dotted; border-top-style: solid; } .totalsvalue { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: solid; border-left-style: none; border-top-color: #CC6600; border-right-color: #999999; border-bottom-color: #CC6600; border-left-color: #999999; border-bottom-style: dotted; border-top-style: none; } .totalsheaderbottom { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-left-style: solid; border-right-style: none; border-top-color: #CC6600; border-right-color: #999999; border-bottom-color: #CC6600; border-left-color: #999999; border-top-style: none; border-bottom-style: solid; } .totalsvaluebottom { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: solid; border-left-style: none; border-top-color: #CC6600; border-right-color: #999999; border-bottom-color: #CC6600; border-left-color: #999999; border-bottom-style: solid; border-top-style: none; } .wolineitemsheader { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: dotted; border-bottom-style: dotted; border-top-color: #333333; border-right-color: #CCCCCC; border-bottom-color: #333333; border-left-color: #333333; } .dataheader { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: none; border-bottom-style: dotted; border-top-color: #999999; border-right-color: #999999; border-bottom-color: #CC6600; border-left-color: #999999; border-left-style: solid; } .datafield { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: solid; border-left-style: none; border-top-color: #CC6600; border-right-color: #999999; border-bottom-color: #CC6600; border-left-color: #999999; border-bottom-style: dotted; } .datafieldalert { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-bottom-style: solid; border-top-color: #FF0000; border-right-color: #FF0000; border-bottom-color: #FF0000; border-left-color: #FF0000; border-right-style: solid; border-top-style: solid; } .dataheaderalert { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: none; border-bottom-style: solid; border-top-color: #FF0000; border-right-color: #FF0000; border-bottom-color: #FF0000; border-left-color: #FF0000; border-top-style: solid; border-left-style: solid; } .wolineitemsalert { border-top-width: 1pt; border-right-width: 1pt; border-bottom-width: 1pt; border-left-width: 1pt; border-right-style: dotted; border-top-color: #CCCCCC; border-right-color: #FF0000; border-bottom-color: #FF0000; border-left-color: #CCCCCC; border-bottom-style: solid; } .addressfield { border: 1px none #CCCCCC; } .TabbedPanels { margin: 0px; padding: 0px; float: left; clear: none; width: 730px; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/ } /* This is the selector for the TabGroup. The TabGroup container houses * all of the tab buttons for each tabbed panel in the widget. This container * does not contribute anything visually to the look of the widget for our * default style. * * The name of the class ("TabbedPanelsTabGroup") used in this selector is not * necessary to make the widget function. You can use any class name you * want to style the TabGroup container. */ .TabbedPanelsTabGroup { margin: 0px; padding: 0px; } /* This is the selector for the TabbedPanelsTab. This container houses * the title for the panel. This is also the tab "button" that the user clicks * on to activate the corresponding content panel so that it appears on top * of the other tabbed panels contained in the widget. * * For our default style, each tab is positioned relatively 1 pixel down from * where it wold normally render. This allows each tab to overlap the content * panel that renders below it. Each tab is rendered with a 1 pixel bottom * border that has a color that matches the top border of the current content * panel. This gives the appearance that the tab is being drawn behind the * content panel. * * The name of the class ("TabbedPanelsTab") used in this selector is not * necessary to make the widget function. You can use any class name you want * to style this tab container. */ .TabbedPanelsTab { position: relative; top: 1px; float: left; padding: 4px 10px; margin: 0px 1px 0px 0px; font: bold 0.7em sans-serif; background-color: #DDD; list-style: none; border-left: solid 1px #CCC; border-bottom: solid 1px #999; border-top: solid 1px #999; border-right: solid 1px #999; -moz-user-select: none; -khtml-user-select: none; cursor: pointer; } /* This selector is an example of how to change the appearnce of a tab button * container as the mouse enters it. The class "TabbedPanelsTabHover" is * programatically added and removed from the tab element as the mouse enters * and exits the container. */ .TabbedPanelsTabHover { background-color: #CCC; } /* This selector is an example of how to change the appearance of a tab button * container after the user has clicked on it to activate a content panel. * The class "TabbedPanelsTabSelected" is programatically added and removed * from the tab element as the user clicks on the tab button containers in * the widget. * * As mentioned above, for our default style, tab buttons are positioned * 1 pixel down from where it would normally render. When the tab button is * selected, we change its bottom border to match the background color of the * content panel so that it looks like the tab is part of the content panel. */ .TabbedPanelsTabSelected { background-color: #FFFFCC; border-bottom: 1px solid #EEE; } /* This selector is an example of how to make a link inside of a tab button * look like normal text. Users may want to use links inside of a tab button * so that when it gets focus, the text *inside* the tab button gets a focus * ring around it, instead of the focus ring around the entire tab. */ .TabbedPanelsTab a { color: black; text-decoration: none; } /* This is the selector for the ContentGroup. The ContentGroup container houses * all of the content panels for each tabbed panel in the widget. For our * default style, this container provides the background color and borders that * surround the content. * * The name of the class ("TabbedPanelsContentGroup") used in this selector is * not necessary to make the widget function. You can use any class name you * want to style the ContentGroup container. */ .TabbedPanelsContentGroup { clear: both; border-left: solid 1px #CCC; border-bottom: solid 1px #CCC; border-top: solid 1px #999; border-right: solid 1px #999; background-color: #EEE; } /* This is the selector for the Content panel. The Content panel holds the * content for a single tabbed panel. For our default style, this container * provides some padding, so that the content is not pushed up against the * widget borders. * * The name of the class ("TabbedPanelsContent") used in this selector is * not necessary to make the widget function. You can use any class name you * want to style the Content container. */ .TabbedPanelsContent { padding: 4px; } /* This selector is an example of how to change the appearnce of the currently * active container panel. The class "TabbedPanelsContentVisible" is * programatically added and removed from the content element as the panel * is activated/deactivated. */ .TabbedPanelsContentVisible { } /* Vertical Tabbed Panels * * The following rules override some of the default rules above so that the * TabbedPanels widget renders with its tab buttons along the left side of * the currently active content panel. * * With the rules defined below, the only change that will have to be made * to switch a horizontal tabbed panels widget to a vertical tabbed panels * widget, is to use the "VTabbedPanels" class on the top-level widget * container element, instead of "TabbedPanels". */ /* This selector floats the TabGroup so that the tab buttons it contains * render to the left of the active content panel. A border is drawn around * the group container to make it look like a list container. */ .VTabbedPanels .TabbedPanelsTabGroup { float: left; width: 10em; height: 20em; background-color: #EEE; position: relative; border-top: solid 1px #999; border-right: solid 1px #999; border-left: solid 1px #CCC; border-bottom: solid 1px #CCC; } /* This selector disables the float property that is placed on each tab button * by the default TabbedPanelsTab selector rule above. It also draws a bottom * border for the tab. The tab button will get its left and right border from * the TabGroup, and its top border from the TabGroup or tab button above it. */ .VTabbedPanels .TabbedPanelsTab { float: none; margin: 0px; border-top: none; border-left: none; border-right: none; } /* This selector disables the float property that is placed on each tab button * by the default TabbedPanelsTab selector rule above. It also draws a bottom * border for the tab. The tab button will get its left and right border from * the TabGroup, and its top border from the TabGroup or tab button above it. */ .VTabbedPanels .TabbedPanelsTabSelected { background-color: #EEE; border-bottom: solid 1px #999; } /* This selector floats the content panels for the widget so that they * render to the right of the tabbed buttons. */ .VTabbedPanels .TabbedPanelsContentGroup { clear: none; float: left; padding: 0px; width: 30em; height: 20em; } @charset "UTF-8"; /* SpryAccordion.css - Revision: Spry Preview Release 1.4 */ /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */ /* This is the selector for the main Accordion container. For our default style, * we draw borders on the left, right, and bottom. The top border of the Accordion * will be rendered by the first AccordionPanelTab which never moves. * * If you want to constrain the width of the Accordion widget, set a width on * the Accordion container. By default, our accordion expands horizontally to fill * up available space. * * The name of the class ("Accordion") used in this selector is not necessary * to make the widget function. You can use any class name you want to style the * Accordion container. */ .Accordion { border-left: solid 1px gray; border-right: solid 1px black; border-bottom: solid 1px gray; overflow: hidden; } /* This is the selector for the AccordionPanel container which houses the * panel tab and a panel content area. It doesn't render visually, but we * make sure that it has zero margin and padding. * * The name of the class ("AccordionPanel") used in this selector is not necessary * to make the widget function. You can use any class name you want to style an * accordion panel container. */ .AccordionPanel { margin: 0px; padding: 0px; } /* This is the selector for the AccordionPanelTab. This container houses * the title for the panel. This is also the container that the user clicks * on to open a specific panel. * * The name of the class ("AccordionPanelTab") used in this selector is not necessary * to make the widget function. You can use any class name you want to style an * accordion panel tab container. */ .AccordionPanelTab { background-color: #CCCCCC; border-top: solid 1px black; border-bottom: solid 1px gray; margin: 0px; padding: 2px; cursor: pointer; -moz-user-select: none; -khtml-user-select: none; width: 760px; } /* This is the selector for a Panel's Content area. It's important to note that * you should never put any padding on the panel's content area if you plan to * use the Accordions panel animations. Placing a non-zero padding on the content * area can cause the accordion to abruptly grow in height while the panels animate. * * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel * Content container. * * The name of the class ("AccordionPanelContent") used in this selector is not necessary * to make the widget function. You can use any class name you want to style an * accordion panel content container. */ .AccordionPanelContent { overflow: auto; margin: 0px; padding: 0px; height: 200px; } /* This is an example of how to change the appearance of the panel tab that is * currently open. The class "AccordionPanelOpen" is programatically added and removed * from panels as the user clicks on the tabs within the Accordion. */ .AccordionPanelOpen .AccordionPanelTab { background-color: #EEEEEE; } /* This is an example of how to change the appearance of the panel tab as the * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added * and removed from panel tab containers as the mouse enters and exits the tab container. */ .AccordionPanelTabHover { color: #555555; } .AccordionPanelOpen .AccordionPanelTabHover { color: #555555; } /* This is an example of how to change the appearance of all the panel tabs when the * Accordion has focus. The "AccordionFocused" class is programatically added and removed * whenever the Accordion gains or loses keyboard focus. */ .AccordionFocused .AccordionPanelTab { background-color: #3399FF; } /* This is an example of how to change the appearance of the panel tab that is * currently open when the Accordion has focus. */ .AccordionFocused .AccordionPanelOpen .AccordionPanelTab { background-color: #33CCFF; } @charset "UTF-8"; /* SpryCollapsiblePanel.css - Revision: Spry Preview Release 1.4 */ /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */ /* This is the selector for the main CollapsiblePanel container. For our * default style, the CollapsiblePanel is responsible for drawing the borders * around the widget. * * If you want to constrain the width of the CollapsiblePanel widget, set a width on * the CollapsiblePanel container. By default, our CollapsiblePanel expands horizontally to fill * up available space. * * The name of the class ("CollapsiblePanel") used in this selector is not necessary * to make the widget function. You can use any class name you want to style the * CollapsiblePanel container. */ .CollapsiblePanel { margin: 0px; padding: 0px; border-left: solid 1px #CCC; border-right: solid 1px #999; border-top: solid 1px #999; border-bottom: solid 1px #CCC; width: 400px; } /* This is the selector for the CollapsiblePanelTab. This container houses * the title for the panel. This is also the container that the user clicks * on to open or close the panel. * * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary * to make the widget function. You can use any class name you want to style an * CollapsiblePanel panel tab container. */ .CollapsiblePanelTab { background-color: white; border-bottom: solid 1px #CCC; margin: 0px; padding: 2px; cursor: pointer; -moz-user-select: none; -khtml-user-select: none; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: .7em; font-weight: bold; } /* This is the selector for a CollapsiblePanel's Content area. It's important to note that * you should never put any padding on the content area element if you plan to * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate. * * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary * to make the widget function. You can use any class name you want to style a * CollapsiblePanel content container. */ .CollapsiblePanelContent { margin: 0px; padding: 0px; } /* An anchor tag can be used inside of a CollapsiblePanelTab so that the * keyboard focus ring appears *inside* the tab instead of around the tab. * This is an example of how to make the text within the anchor tag look * like non-anchor (normal) text. */ .CollapsiblePanelTab a { color: black; text-decoration: none; } /* This is an example of how to change the appearance of the panel tab that is * currently open. The class "CollapsiblePanelOpen" is programatically added and removed * from panels as the user clicks on the tabs within the CollapsiblePanel. */ .CollapsiblePanelOpen .CollapsiblePanelTab { background-color: #FFFFCC; } /* This is an example of how to change the appearance of the panel tab as the * mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added * and removed from panel tab containers as the mouse enters and exits the tab container. */ .CollapsiblePanelTabHover, .CollapsiblePanelOpen .CollapsiblePanelTabHover { background-color: #FFFFCC; } /* This is an example of how to change the appearance of all the panel tabs when the * CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed * whenever the CollapsiblePanel gains or loses keyboard focus. */ .CollapsiblePanelFocused .CollapsiblePanelTab { background-color: #FFFFCC; } /* dock - top */ .dock { position: relative; height: 80px; width:900px; text-align: center; padding-top:10px; /* padding-bottom:10px;*/ } .dock-container { position: absolute; height: 80px; /* background: url(images/dock-bg2.gif);*/ padding-left: 20px; text-align:center; width:900px; } a.dock-item { display: block; width: 40px; color: #000; position: absolute; top: 0px; text-align: center; text-decoration: none; font: bold 11px Trebuchet MS, Tahoma, Arial, Helvetica, san-serif; } .dock-item img { border: none; margin: 5px 10px 0px; width: 100%; } .dock-item span { display: none; padding-left: 20px; } /* dock2 - bottom */ #dock2 { width: 900px; height: 80px; /* bottom: 0px; position: absolute; left: 0px; */ } .dock-container2 { position: absolute; height: 60px; width:900px; /*background-color: white;*/ padding-left: 20px; text-align:center; } a.dock-item2 { display: block; font: bold 12px Trebuchet MS, Tahoma, Arial, Helvetica, san-serif; /* width: 40px; */ color: #000; bottom: 0px; position: absolute; padding-right:10px; text-align: center; text-decoration: none; } .dock-item2 span { display: none; /*padding-left: 20px;*/ color: #6666; } .dock-item2 img { border: none; margin: 5px 10px 0px; /*width: 100%; */ height:50px; padding-right:10px; }