.product
{width:269px;float:left;border:solid #ccc 1px;padding:0;margin:0 0 20px}
.product:before
{display:block;height:4px;margin:-1px;margin-bottom:-3px;background:transparent url(front_c_tr.gif) scroll no-repeat top right;content:url(front_c_tl.gif);text-align:left}
.product:after
{display:block;clear:both;height:4px;margin:-1px;margin-top:-3px;background:transparent url(front_c_br.gif) scroll no-repeat bottom right;content:url(front_c_bl.gif);text-align:left}
.product h2
{margin:0;padding:4px 4px 5px 15px;background:#eee url(front_hd.gif) repeat-x 0 0}
.product h2:before
{display:inline;height:1px;margin:0 0 0 -11px;padding:0 2px 0 0;background:transparent;content:url(front_ic.gif)}
.productDesc
{float:left;margin:4px 0 1px;padding:0 4px;width:172px;min-height:130px;border-right:solid #ccc 1px;text-align:left}
.product a
{font-weight:bold}
.productShot
{float:right;width:78px;padding:26px 5px 4px;text-align:center}
.cyaBox
{border:1px solid #589}
.cyaBox:before
{background:transparent url(front_c_cya_tr.gif) scroll no-repeat top right;content:url(front_c_cya_tl.gif)}
.cyaBox:after
{background:transparent url(front_c_cya_br.gif) scroll no-repeat bottom right;content:url(front_c_cya_bl.gif)}
.cyaBox h2
{color:#589;background-color:#cceef1;background-position:0 -90px}
.cyaBox h2:before
{content:url(front_ic_cya.gif)}
.cyaBox .productDesc
{border-right:1px solid #589}
.cyaBox a:link, .cyaBox a:hover, .cyaBox a:visited, .cyaBox a:active
{color:#589}
.vioBox
{border:1px solid #71577d;float:right}
.vioBox:before
{background:transparent url(front_c_vio_tr.gif) scroll no-repeat top right;content:url(front_c_vio_tl.gif)}
.vioBox:after
{background:transparent url(front_c_vio_br.gif) scroll no-repeat bottom right;content:url(front_c_vio_bl.gif)}
.vioBox h2
{color:#71577d;background-color:#ecd6e6;background-position:0 -210px}
.vioBox h2:before
{content:url(front_ic_vio.gif)}
.vioBox .productDesc
{border-right:1px solid #71577d}
.vioBox a:link, .vioBox a:hover, .vioBox a:visited, .vioBox a:active
{color:#71577d}
.redBox
{border:1px solid #c33}
.redBox:before
{background:transparent url(front_c_red_tr.gif) scroll no-repeat top right;content:url(front_c_red_tl.gif)}
.redBox:after
{background:transparent url(front_c_red_br.gif) scroll no-repeat bottom right;content:url(front_c_red_bl.gif)}
.redBox h2
{color:#b34c4c;background-color:#ffd0d3;background-position:0 -150px}
.redBox h2:before
{content:url(front_ic_red.gif);padding-right:3px}
.redBox .productDesc
{border-right:1px solid #c33}
.redBox .productShot
{padding-top:19px}
.redBox a:link, .redBox a:hover, .redBox a:visited, .redBox a:active
{color:#b34c4c}
.orgBox
{border:1px solid #f90;float:right}
.orgBox:before
{background:transparent url(front_c_org_tr.gif) scroll no-repeat top right;content:url(front_c_org_tl.gif)}
.orgBox:after
{background:transparent url(front_c_org_br.gif) scroll no-repeat bottom right;content:url(front_c_org_bl.gif)}
.orgBox h2
{color:#cc7d0d;background-color:#ffe8c9;background-position:0 -120px}
.orgBox h2:before
{content:url(front_ic_org.gif);padding-right:3px}
.orgBox .productDesc
{border-right:1px solid #f90}
.orgBox .productShot
{padding-top:19px}
.orgBox a:link, .orgBox a:hover, .orgBox a:visited, .orgBox a:active
{color:#cc7d0d}
.bluBox
{border:1px solid #1860b3;float:right}
.bluBox:before
{background:transparent url(front_c_blu_tr.gif) scroll no-repeat top right;content:url(front_c_blu_tl.gif)}
.bluBox:after
{background:transparent url(front_c_blu_br.gif) scroll no-repeat bottom right;content:url(front_c_blu_bl.gif)}
.bluBox h2
{color:#1848b3;background-color:#cce6ff;background-position:0 -30px}
.bluBox h2:before
{content:url(front_ic_blu.gif);padding-right:3px}
.bluBox .productDesc
{border-right:1px solid #1860b3}
.bluBox .productShot
{padding-top:19px}
.bluBox a:link, .bluBox a:hover, .bluBox a:visited, .bluBox a:active
{color:#1848b3}
.grnBox
{border:1px solid #090;float:right}
.grnBox:before
{background:transparent url(front_c_grn_tr.gif) scroll no-repeat top right;content:url(front_c_grn_tl.gif)}
.grnBox:after
{background:transparent url(front_c_grn_br.gif) scroll no-repeat bottom right;content:url(front_c_grn_bl.gif)}
.grnBox h2
{color:#4e8b4e;background-color:#baefba;background-position:0 -60px}
.grnBox h2:before
{content:url(front_ic_grn.gif);padding-right:3px}
.grnBox .productDesc
{border-right:1px solid #090}
.grnBox .productShot
{padding-top:10px}
.grnBox a:link, .grnBox a:hover, .grnBox a:visited, .grnBox a:active
{color:#4e8b4e}
.yelBox
{border:1px solid #bb2}
.yelBox:before
{background:transparent url(front_c_yel_tr.gif) scroll no-repeat top right;content:url(front_c_yel_tl.gif)}
.yelBox:after
{background:transparent url(front_c_yel_br.gif) scroll no-repeat bottom right;content:url(front_c_yel_bl.gif)}
.yelBox h2
{color:#990;background-color:#f6f6b0;background-position:0 -240px}
.yelBox h2:before
{content:url(front_ic_yel.gif);padding-right:3px}
.yelBox .productDesc
{border-right:1px solid #bb2}
.yelBox .productShot
{padding-top:10px}
.yelBox a:link, .yelBox a:hover, .yelBox a:visited, .yelBox a:active
{color:#990}
.stlBox
{border:1px solid #999;float:right}
.stlBox:before
{background:transparent url(front_c_stl_tr.gif) scroll no-repeat top right;content:url(front_c_stl_tl.gif)}
.stlBox:after
{background:transparent url(front_c_stl_br.gif) scroll no-repeat bottom right;content:url(front_c_stl_bl.gif)}
.stlBox h2
{color:#777;background-color:#e2e2e2;background-position:0 -180px}
.stlBox h2:before
{content:url(front_ic_stl.gif);padding-right:3px}
.stlBox .productDesc
{border-right:1px solid #999}
.stlBox .productShot
{padding-top:10px}
.stlBox a:link, .stlBox a:hover, .stlBox a:visited, .stlBox a:active
{color:#777}

