/* catalog.css */
div.centerContainer { width: 640px; float: left; padding: 0; margin: -10px 0; }
div.categoryList { width: 640px; /* margin: 0 auto; */ }
ul.categoryList li{ float: left; list-style: none; padding: 5px 6px 28px 6px; margin: 5px; width: 138px; height: 138px; }
div.productList { width: 500px; /* margin: 0 auto; */}
ul.productList li{ float: left; list-style: none; padding: 5px 6px 32px 6px; margin: 5px; width: 138px; height: 138px; }
ul.areaList { width: 740px; }
ul.areaList li { float: left; list-style: none; padding: 5px; }
fieldset.detail { width: 500px; float: left; margin: 0 10px 10px 100px; padding: 5px; }
fieldset legend { font-weight: bold; color: #666; padding: 2px 5px; }
/*
fieldset.miniCart { float: right; width: 160px; margin: 0 2px 0 8px;}
fieldset.miniCart p { font-size: 9pt; }
*/
/* bottom text on catalog pages */
div.subText div p { margin: 10px 135px; text-align: left; color: #666; }
div.subText div p strong { font-weight: bold; color: #679; }

table.style_table { width: 800px; /* margin: 0 0 0 10px; */}
table.style_table td { padding: 0 0 20px 0; vertical-align: top; }
table.style_table td * { padding: 1px; }
table.style_table td img { padding: 1px; }
.imageContainer { position:relative; }
.altStyleImageCSS26 { min-height: 145px; min-width: 250px; /* border: 1px solid grey; */}
.altStyleImageCSS27 { min-height: 125px; min-width: 250px; /* border: 1px solid grey; */}
/*.altStyleImageCSS27 img { border: 1px solid pink; }*/
/*.previewOnline { position:absolute; top: 10px; right: -5px; background-image: url(/images/zz_images/instant_preview_sm.png); width: 65px; height: 50px; z-index: 10;}*/
/*.previewOnline { position:absolute; bottom: -10px; right: 20px; background-image: url(/images/zz_images/instant-preview-bar.png); width: 118px; height: 21px; z-index: 10;}*/
.previewOnline { font-size: 9px; color: #b2b2cb; font-weight: bold; line-height: 9px; background: #fff; margin-bottom: 2px; }
.addPhoto { font-size: 9px; color: #ff85aa; font-weight: bold; line-height: 9px; background: #fff; margin-bottom: 2px; margin-top: -1px; }

table.style_table td p img { vertical-align: top; }


table.shape_table { width: 800px; /* margin: 0 0 0 10px; */}
table.shape_table td { padding: 0 0 20px 0; }
table.shape_table td * { padding: 1px; }
table.shape_table p { line-height: 14px; color: #666666; }

table.color_table { width: 800px; /* margin: 0 0 0 10px; */}
table.color_table td { padding: 0 0 20px 0; }
table.color_table td * { padding: 1px; }

table.physical_table { clear: both; width: 700px; margin: 16px 50px 20px 15px;}
table.physical_table td { padding: 0 0 20px 0; vertical-align: top; }
table.physical_table td * { padding: 1px; }
table.physical_table td img { padding: 0; }
table.physical_table td a.colorBoxFavorPack { font-size: 11px; color: red; font-weight: bold; text-decoration: underline; }


/* area home pages */
/* [ left margin ] + [ width ] + [ right margin ] <= 800px for IE 6 compatability */
#headingContainer { float: left; height: 100px; clear: left; }
#bigLetter { background-color: #666; }
h1.areaImage_lg { background-repeat:no-repeat; width: 792px; height: 216px; color: #FFF; line-height: 335px; text-indent: 35px; margin-left: 5px; font-weight: normal; letter-spacing: 6px; font-size: 20px;}


/* new styling June 27, 2011 */
.areaheadingContainer {position: relative; height:630px; clear:both; margin-bottom:200px;}
h1.areaHead { position: absolute; clear:both; zoom: 1; background-repeat:no-repeat; width: 210px; height: 130px; color: #b1afaa; line-height: 125px; text-indent: 65px; font-weight: bold; letter-spacing: 10px; font-size: 22px; font-family: Arial, Helvetica, sans-serif; }
.areaImage { position: absolute; top:0; left:300px;}
.photoGallery { position: absolute; clear:both; top:55px; left:620px;}
.topImage { float: left; margin-left: -100; margin-top: -20px; }
/* end new styling June 27, 2011 */
.ideaGalleryImgLink { margin-right: -16px; margin-top: -2px; }

h2.areaHead { position: relative; top: -75px; left: 60px; color: #999; font-weight: bold; letter-spacing: 10px; font-size: 22px; font-family: Arial, Helvetica, sans-serif; margin-right: -100px; }
h2.areaImage_sm { clear:both; zoom: 1; background-repeat:no-repeat; width: 789px; height: 120px; color: #FEFEFE; line-height: 125px; text-indent: 65px; font-weight: bold; letter-spacing: 10px; font-size: 22px; font-family: Verdana, Arial, sans-serif; }
/* h1.listHeader { clear: both; margin: 0px 0 8px 30px; color: #666; padding-top: 20px; } */
h1.listHeader { display: block; color: #999; margin: 0 0 0 30px; text-align:left; letter-spacing: 4px; font-size: 19px; font-weight: bold; font-family: Verdana, Arial, sans-serif; clear: both; }
h1.listHeaderNarrow { display: block; color: #999; margin: 0 0 0 30px; text-align:left; letter-spacing: 1.5px; font-size: 19px; font-weight: bold; font-family: Verdana, Arial, sans-serif; clear: both; }
h1.listHeaderExtraNarrow { display: block; color: #999; margin: 0 0 0 30px; text-align:left; letter-spacing: -1px; font-size: 19px; font-weight: bold; font-family: Verdana, Arial, sans-serif; clear: both; }
h1.shapeListHeader { padding-top: 15px; }
h1.itemListHeader { padding-top: 20px; }
h1.listHeader span, h1.listHeaderNarrow span, h1.listHeaderExtraNarrow span { font-size: 12px; letter-spacing: normal; }

.physicalHeader { float: left; margin-top: 20px; }
.physicalHeader img { margin-left: 60px; float: left;  }
.physicalHeader div { float: left; padding: 0px; }
.physicalHeader div p { width: 300px; text-align: left; margin: 0 0 5px 25px; font: bold 12px/16px Arial, Helvetica, sans-serif; color: #999; }
#phName { font: bold 24px/50px Arial, Helvetica, sans-serif; color: #666; margin-bottom: 5px; }

.physRelShapes { padding-top: 10px; width: 100%; margin: 0 auto; overflow: hidden; }
.physRelShapes p a, .physRelShapes p a:hover, .physRelShapes p a:visited { color: #666; text-decoration: none; }
.physRelShapes div table { margin: 0 auto; }
.physRelShapes div table td { padding: 10px 0; }
.physRelShapes .rsTypeDesc { font-weight: bold; }
.physRelShapes .rsSeperator { border-bottom: 1px dotted #666; margin-bottom: 15px; }
.prsLink a, .prsLink a:visited { font-weight: bold; text-decoration: underline; color: #999; font-size: 11px; }

.subhead { clear: both; color: #777; text-align: left; margin: 5px 0 18px 30px; }
ul.subhead { margin-top: 10px; }
ul.subhead li { list-style: none; margin: 5px 0 0 0; }

.priceHeading { font: 12px/16px Arial, Helvetica, sans-serif; letter-spacing:2px; font-weight:bold; }

h2.areaIdeasHeading { padding-top: 20px; clear: both; display: block; color: #b1afaa; margin: 2px 0 0 30px; text-align:left; letter-spacing: 4px; font-size: 19px; font-weight: bold; font-family: Verdana, Arial, sans-serif; }
h2.withHeader { padding-top: 0; }
h2.ideas { padding-top: 20px }
h2.WLT { padding-top: 15px }
.areasubhead { color: #777; text-align: left; margin: 5px 0 0 30px; }

ul.areaProducts { width: 800px; }
ul.areaProducts li { float: left; list-style: none; padding:  10px 32px 45px 20px; width: 140px; height: 150px; color: #888; font-size: 11px; line-height: 14px; }
ul.areaProducts a { color: #888; }
ul.areaProducts a:hover { text-decoration: none; }
ul.areaProducts a span { font-weight: bold; font-size: 12px; }
ul.areaProducts a span:hover { text-decoration: underline; }
ul.areaProducts img { margin-bottom:5px; }


ul.areaIdeas { width: 778px;  margin-left: 22px; }
ul.areaIdeas li { float: left; list-style: none; padding: 18px 0px 32px 0px; width: 152px; height: 130px; color: #888; font-weight: bold;  line-height: 16px; }
ul.areaIdeas a { color: #888; }
ul.areaIdeas a:hover { text-decoration: none; }
ul.areaIdeas a span:hover { text-decoration: underline; }

ul.WLT { width: 790px; margin-left: 10px; margin-top: 10px; }
ul.WLT li { float: left; list-style: none; padding: 10px; }

div.shapeIdeas{ /* height: 190px;  width: 160px; */ vertical-align: middle; display: table-cell; /* margin-left: 62px; */ }
ul.shapeIdeas { width: 778px;  margin-left: 42px; vertical-align:bottom; }
ul.shapeIdeas li { float: left; list-style: none; padding: 18px 0px 32px 0px; width: 152px; height: 160px; color: #888; font-weight: bold;  line-height: 18px; vertical-align:bottom; }
ul.shapeIdeas a { color: #888; }
ul.shapeIdeas a:hover { text-decoration: none; }
ul.shapeIdeas a span:hover { text-decoration: underline; }

/* .galleryLink { float: right; margin: 88px 30px 0 0; position: relative; z-index: 4;  } */

/* end area home pages */

.price { font-size: 12px; }

/* begin item page styling */
.itemDetails { width: 800px; float: left; clear: both; padding: 0 10px; color: #666666; }
.itemDetails div { padding: 0 10px; }
.itemDetails ul { padding: 0 14px; }

.itemImage { float: left; text-align: left; vertical-align: top; margin-bottom: 10px;}
.itemImage p { padding-left: 10px;}
.itemOptions { float: left; text-align: left; vertical-align: top; width: 390px; }
.itemOptions p { margin: 0 0 14px 0; /*margin: 14px auto;*/ }
.itemOptions label { margin-right: 10px; vertical-align: top; }
.itemOptions .txtField { margin: 4px auto; }
.itemOptions .charCounter { margin: -5px 0 0 0; padding-left: 40px;}
.itemOptions hr { margin: 20px auto; clear: both; }
.itemOptions h3 { margin: 10px auto; clear: both;}

#shapeStock ul { list-style-type: none; margin: -10px 0 14px 0; }
#shapeStock input, img { vertical-align: middle; }
#shapeStock img { padding-bottom: 3px; }

.itemOption { margin: 5px auto; float: left; clear: both; width: 350px;}
.itemOption h4 { font-size: 11px; font-weight: bold; margin: 5px auto;  /*padding: 0 5px;*/ color: #333333; float: left; clear: both; width: 350px;}
.itemOption div p { font-size: 11px; line-height: 15px; margin: 2px auto; /*padding: 0 5px;*/ color: #333333; float: left; clear: both; width: 350px;}

.qtyDiscount { color: grey; text-decoration: none; font-style: normal; }
.qtyDiscount option { color: black; }

/*#options { margin-bottom: 160px; }*/
#monoStyles { position: relative; width: 360px; vertical-align: top; margin: 0 0 10px 0; }
.charCounter { padding-left: 40px;}
.monoLink { padding: 0 4px; }
.monoChoice { line-height: 10px; text-align: center; float: left; padding: 0; margin: 0 6px; }
.monoChoice label { margin-left: 6px; }
.monoChoice input { margin-top: 5px; }
.itemOptions .addtocart { clear: both; padding: 10px 0; margin: 0; }

/* what to say styling */
#vertical_slide { padding: 0px; font: 12px Arial, Helvetica, Verdana, sans-serif; font-weight: bold; position: relative; width: 366px; height: 85px; margin: 0 auto; overflow: auto; }

#vertical_slide p { color: #666; font: 10px Arial, Helvetica, Verdana, sans-serif; line-height: 10px; margin: 0 12px 4px 3px; padding: 0 0 0 3px; }
#vertical_slide a { color: #8A7575; font: 11px Arial, Helvetica, Verdana, sans-serif; font-weight: bold; }

#closeBox { font:9px arial; line-height: 12px; letter-spacing:.1em; position: absolute; width: 10px; height: 10px; background-image: url(/images/zz_images/close.png); background-color: #ffffff; left: 365px; top: 8px; z-index: 800; }
#verticalslide_container { background: #e2dddb; color: #666; padding: 5px; padding-top: 0px; border: 5px solid #F3F1F1; font: 11px Arial, Helvetica, Verdana, sans-serif; font-weight: bold; position: relative; width: 375px; height: 130px; }
#v_s_c_heading { position: relative; margin-left: 6px; }

img.item { border: 5px solid #99b07e; }
p.item { font: bold 12px/13px Arial, Helvetica, Verdana, sans-serif; color: #666; margin-top: 3px; }
b.bigDot { font-size: 42px; color: #99b07e; vertical-align: bottom; }
img.more { height: 10px; width: 40px; }

/* end item page styling */

/* see more styling */
.seemore_shapes { position: absolute; top: 59px; right: 0px; margin: 10px; text-align: right; }
.seemore_NoSwatch { top: 34px; }
.seemoreTitle { font: bold 13px Arial, Helvetica, sans-serif; color: #999; margin: 3px; }
ul.seemoreList li { list-style: none; color: #999; display: inline; font-size: 11px; }
ul.seemoreList li a { color: #999; font-weight: bold; margin-right: 3px; }
ul.seemoreList li span { text-decoration: underline; margin-right: 3px; }

/* dynamic image loading */
a.loadimg img { background: transparent url(/images/zz_images/spinner.gif) no-repeat center center; height: 100px; width: 100px; }
a.tooltip img { height: 15px; width: 15px; }

#chooseByColor a  { display: inline-block; width: 20px; }
#chooseByColorLong a  { display: inline-block; width: 18px; }
#chooseByColor a img, #chooseByColor span img, #chooseByColorLong a img, #chooseByColorLong span img { vertical-align: middle; }
#CBCsubHead { margin-right: 6px; }
p.swatchColHead { font-size: 10px; color: #999 }

#chooseByShape { width: 600px;  }
#chooseByShape * { margin: 0 auto; padding: 0 auto; }

#areaShapes { width: 820px; }
#areaShapes ul, #areaShapes ul li { list-style: none; float: left; padding-bottom: 10px; }
#areaShapes ul li { height: 190px; width: 160px; }
#areaShapes div { height: 190px; width: 160px; vertical-align: middle; display: table-cell; }
#areaShapes .shapeBorderWide { height: 188px; width: 318px; border: 1px solid #666 }
#areaShapes .shapeBorderWide div { height: 188px; width: 318px; text-align: center; }
#areaShapes .shapeBorder { height: 188px; width: 158px; border: 1px solid #666 }
#areaShapes .shapeBorder div { height: 188px; width: 158px; }
#areaShapes .shapeWide, #areaShapes .shapeWide div { height: 190px; width: 320px; }
#areaShapes .ShapeAreaDescription { font-size: 10px; font-style: italic; color: #FF88FF; }

/* Favor Packs */
table.fp_table { clear: both; width: 700px; margin: 15px 50px 20px 15px;}
table.fp_table td { padding: 0 0 20px 0; vertical-align: top; }
table.fp_table td * { padding: 1px; }
table.fp_table td p.childItems { font-size: 11px; line-height: 14px; margin-bottom: 7px; }
table.fp_table td img { padding: 0; }
table.fp_table a.zoom { position: relative; top: -60px; left: -137px; }
table.fp_table a.fpClickImage { position: relative; left: 10px; }
table.fp_table input.fp_Btn { color: #333; background-color: #DDD; border: 1px solid #333; padding: 3px; clear: both; margin-top: 3px; }
table.fp_table input.fp_Btn:hover { color: #DDD; background-color: #888; border: 1px dotted #DDD; }
.fp_Header { float: left; margin-top: 20px; }
.fp_Header img { margin-left: 60px; float: left;  }
.fp_Header div { float: left; padding: 0px; }
.fp_Header div p { width: auto; text-align: left; margin: 0 0 5px 25px; font: bold 12px/16px Arial, Helvetica, sans-serif; color: #999; }
.fp_Header div p.fp_saveTxt { color: #666; }
.fp_Header div ul { width: 300px; text-align: left; margin: 10px 0 10px 38px; font: bold 12px/16px Arial, Helvetica, sans-serif; color: #999; }
.fp_Header div li { margin: 5px auto; }
#fp_Name { font: bold 24px/50px Arial, Helvetica, sans-serif; color: #666; margin-bottom: 5px; }
#fp_ClickTxt { clear: both; text-align: left; padding: 15px 0 0 40px; }
.fp_saveTxt{ color: #666; }

/* Favor Pack Styles */
.fp_styles { text-align: center; display: table; clear: both; }
.fp_styles ul, .shapeSelection ul li { list-style: none; float: left; }
.fp_styles ul { width: 850px; /* padding: 10px;*/ margin-top: 0px;}
.fp_styles a, .shapeSelection a:hover, .shapeSelection a:visited { color: #666; text-decoration: none; }
.fp_styles ul li { padding: 0 3px; /*border: 1px solid blue;*/ float: left; }
.fp_styles div { vertical-align: middle; display: table-cell; }
div.fpSP01 { width: 132px; height: 145px; float: left; }
div.fpSP02 { width: 132px; height: 85px; float: left; }
div.fpSP03 { width: 132px; height: 105px; float: left; }
div.fpSP09 { width: 132px; height: 95px; float: left; }
.fp_subhead { margin-left: 20px; margin-bottom: 15px; }
#fp_listHeader { margin-top: 5px; margin-left: 20px; }

/* ratings */
#classRatingOn { position: absolute; top: 39px; height: 12px; background: url(/images/zz_images/fivestarson_sm.png) no-repeat; }
#classRatingOff { position: absolute; top: 39px; height: 12px; background: url(/images/zz_images/fivestarsoff_sm.png) no-repeat; }
#custReviews { position: absolute; top: 38px; right: 50px; text-align: right; font: 12px Arial, Helvetica, sans-serif; color: #666; }
#prodReviews { position: absolute; top: 38px; right: 85px; text-align: right; font: 12px Arial, Helvetica, sans-serif; color: #666; }


/* blog feed */
.blogFeed { font-size: 11px; color: #666; text-align: left; padding: 20px 15px 15px 14px; margin: 10px; font-style: italic; }
.blogFeed ul { list-style: none; }
.blogFeed li { margin: 6px auto; }
.blogFeed a, .blogFeed a:link, .blogFeed a:visited, .blogFeed a:hover, .blogFeed a:active { color: #FFF; }
#blogFeedHead { display: block; clear: both; font-weight: bold; color: #FFF; letter-spacing: 1px; font-size: 12px; margin-bottom: 5px; margin-left: -18px; font-style: normal; }
#blogFeedHead a:link, #blogFeedHead a:visited, #blogFeedHead a:hover, #blogFeedHead a:active { color: #FFF; }
