/* MUTLIPAGE V1.2.21 */

#continueButtonWrap{
	display:none;
}

#continueButton{
	border: 0;
}

#mpHidden{
	display:none;
}

/*#mpWrap: holds EVERYTING to do with multi page (products, cart, page nav, page dips, etc)*/
#mpWrap{ 
	width: 730px;
	margin: 0 auto;		
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	font-size: 12px;
	overflow: hidden; /*for inner floats*/
	text-align: left; /*override any shell.css */
	line-height: normal;
}

#mpWrap a img{ /*all anchor images*/
	border: 0;
}

#mpWrap a:active,a:focus{
	outline: none; /*NO LINK FOCUS BORDERS!!*/
}

#mpHeader{

}

#mpSubHeader{/*ONLY SET THE BACKGROUND IMAGE SOURCE IF YOU ARE *NOT* USING "HEADER TOGGLE"*/
	width: 730px;
	height: 235px;
}

#mpOrdercopy1{
	margin: 0 auto;
	padding: 0 10px;
}

#mpOrdercopy1 a{
	color: #000;
}

#mpOrdercopy2{ /*NO ORDER*/
	margin: 0 auto -15px;
	padding: 10px 10px 0 87px;
	height: 57px;
	font-weight: bold;
	background: url(mp_cartNoOrderArrow.gif) left center no-repeat;
}

#mpOrdercopy2 em {
	font-weight: normal;
	font-style:normal;
	color: #000;
}

#mpOrdercopy3{ /*SUBMIT YOUR ORDER*/
	margin: 10px auto 0;
	padding: 0 10px;
	font-weight: bold;	
}

#mpOrdercopy3 em {
	font-weight: normal;
	font-style:normal;
	color: #000;
}

#mpTopCart{
	display:none;
	overflow: hidden; /*for inner floats*/
	padding: 10px;
}

#mpTopCart a{
	display: block;
	float: right;
	border: 1px dotted red;
	width: 100px;
	height: 25px;
}

#mpLoadingMessage{
	width: 728px; /*730*/
	height: 100px;
	clear: both;
	background: url(mp_loading.gif) center center no-repeat;
	text-align: center;	
	border: 1px solid #999;
	padding: 10px 0;
}

/***************************************************************
Page Navigation
***************************************************************/
#mpPageNavTop, #mpPageNavBtm{
	width: 730px; /*730 SEE: #mpWrap*/
	border-bottom: 15px solid #960000; /* #bfbfbf;*/
	float: left;
	background: url(mp_PageNavInstrct.gif) 0 -100px no-repeat; /*HIDE IT TO START*/
	margin: 15px 0 0 0;
}

#mpPageNavTop li, #mpPageNavBtm li{
	display: block;
	width: 144px;
	float: left;
	background:url(mp_PageNav.gif) bottom left no-repeat;
	margin: 0 2px 0 0;	
}

#mpPageNavTop li a, #mpPageNavBtm li a{
	display: block;
	width: 144px;
	height: 17px;/*22*/
	padding: 5px 0 0 0;
	background:url(mp_PageNav.gif) bottom left no-repeat;
	color: #000;
	font-size: 12px;
	text-align:center;
	text-decoration: none;
	font-weight: bold;	
}

#mpPageNavTop li a:hover, #mpPageNavBtm li a:hover {
	color: #ffff00;
}

#mpPageNavTop li a.currPage, #mpPageNavBtm li a.currPage{
	background:url(mp_PageNav.gif) top left no-repeat;
	color: #fff;
	cursor:default;
}

#mpPageNavTop li a.currPage:hover, #mpPageNavBtm li a.currPage:hover {
	color: #fff;
}

/***************************************************************
Product Presentation
***************************************************************/

/*#mpSubwrap: holds ALL products*/
#mpSubwrap{
	clear: both;
	height: 0;
	overflow: hidden; /*this is for the "SHELF" functionality*/
	width: 730px;
} 

#mpSubwrapBottom{
	visibility: hidden;
} 

.mpProdWrap{
	clear: both;
	width: 730px; /*need width for IE6 */
	margin: 0 0 25px; /*use padding b/c IE6 issue with margin & float */
}

.mpProdSubWrap{
	background: url(mp_prodBG.gif) top left repeat-x;
	border: 1px solid #999;
	padding: 10px;
	
	width: 708px; /*730-lft/rght border-lft/rght padding only here to stop IE7 hover-jump bug, normally it wouldnt be necesarry */
}

/************************************************************************
Image AND Other Images navigation
*************************************************************************/

.mpImgWrap{
	width: 220px;
	float: left;
}

.mpImgWrap p{ /*do not size the IMG, size the p around it*/
	width: 220px;
	height: 220px;
}

.mpImgWrap p img{ /*do not size the IMG, size the p around it*/
	border: 2px solid #fff;
}

.mpImgWrap ul{
	list-style: none;
	float: left;
	width: 200px;
	padding: 3px 10px;
	color: #999;
}

.mpImgWrap ul li{
	display: block;
	float: left;
	width: 20px;
}

.mpImgWrap ul li.oLabel{
	width: 80px;
}

.mpImgWrap ul li a{
	display: block;
	text-align: center;	
	text-decoration: none;
	color: #999;
}

.mpImgWrap ul li a:hover {
	text-decoration: underline;
}

.mpImgWrap ul li a.current{
	color: #333;
	font-weight: bold;
}

/************************************************************************
Product DETAILS Area
*************************************************************************/
.mpDetailWrap{
	width: 474px;
	padding: 10px 0 0 10px;
	float: left;
}

/* ALL ITEMS WITHIN mpDetailWrap */
.mpDetailWrap *{
	float: none;
}

.mpDetailWrap h2{ /*PRODUCT TITLE*/
	font-size: 18px;
	font-weight: bold;
	color: #268065; /*orange*/
}

.mpDetailWrap h2 u{ /*PCH NAMING - HIDE FROM USER!!! */
	display: none;
}

.mpDetailWrap h1{ /*SAVINGS STORY*/
	font-size: 18px;
	font-weight: bold;
	color: #990000; /*light blue*/	
}

.mpDetailWrap h3{ /*SAVINGS COMPARISON*/
	font-size: 15px;
	font-weight: bold;
	color: #990000; /*light blue*/	
}

.mpDetailWrap h4{ /*SUB HEAD*/
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 10px;
}

.mpDetailWrap .mpBodyCopy{ /*BODY COPY DIV SCROLL */
	max-height: 250px; /*height ok here when using overflow auto */
	padding: 0 10px 0 0;
	overflow: auto; /*scroll*/
	
/*SCROLL BAR COLORING ONLY WORKS IN IE 5.5+ */	
	scrollbar-face-color: #fff;
	scrollbar-arrow-color: #ff0000;
	scrollbar-track-color: #fff;
	
	scrollbar-highlight-color: #666;
	scrollbar-3dlight-color: #666;
	scrollbar-darkshadow-color: #666;
	scrollbar-shadow-color: #666;
}

/*IE6 only, doesnt support max-height, this is a fixed height*/
* html .mpDetailWrap .mpBodyCopy{ 
	height: 150px; /* 150px approved by merch/mktg on 05.09.2008 @ "scrollbar" meeting in conf C. Rob B, Marureen B., Jen H. */
}

.mpDetailWrap ul{
	list-style-type: square;
	margin: 10px 0 10px 25px;
}

.mpFlytype { /* FLYTYPE */
	margin: 10px 0 0 0;
	font-size: 10px;
}

/******************************************/
/*BURST added 2008.02.21, markm*/
.mpBurst{
	width: 75px;
	margin: 0 0 0 10px;
	clear: right; /*force line break*/
	float: right;
}

/************************************************************************
FEATURE Product Order Area
*************************************************************************/
.mpFeature .mpFeatureHeader{
	font-size: 30px;
	font-weight: bold;
	color: #333; /*black*/
	text-align: center;
}

/*ie 6 peekaboo bug fix*/
* html .mpFeature .mpFeatureHeader{
	display: inline-block;
}

.mpFeature .mpImgWrap{
	width: 330px;
	float: left;
}

.mpFeature .mpImgWrap p{ /*do not size the IMG, size the p around it*/
	width: 330px;
	height: 330px;
}

.mpFeature .mpDetailWrap{
	width: 364px;
	padding: 10px 0 0 10px;
	float: left;
}

/*feature burst*/
.mpFeature .mpDetailBurst{ /*resize the details area when bursts exist */ 
	width: 289px;
}

.mpFeature .mpBodyCopy{ /*BODY COPY DIV SCROLL */
	max-height: 320px; /*height ok here when using overflow auto */
}

* html .mpFeature .mpBodyCopy{ 
	height: 300px;
}

/************************************************************************
Product Order Area
*************************************************************************/
.mpOrderWrap{
	height: 33px; /*38*/
	width: 700px;
	padding: 5px 15px 0;
	float: left;
	background: url(mp_orderareaBG1.gif) bottom left no-repeat;
}

.mpOrderAdditional{
	background-image:url(mp_orderareaBG2.gif);
}


.mpOrderWrap p{
	float: left;
	width: 200px;
	color: #fff;	
}

.mpOrderWrap p span{ /*PCH PRICE*/
	font-weight: bold;
}
.mpOrderWrap p strong{
	font-weight: bold;
	font-size: 14px;
	color: #FFFF00;
}

.mpOrderWrap h4{
	width: 550px;
	font-weight: bold;
	font-size: 12px;
	color: #ffff00;
}

.mpOrderWrap p.cartButton{
	float: right;
	width: 129px; /*width of CART bg img*/
	padding: 1px 0 0 0;
}

.mpOrderWrap p a{
	display:block; /*to make WHOLE area "hot"*/
	height: 25px; /*height of bg img*/
	width: 129px; /*width of bg img*/	
	background: url(mp_cartButton.gif) 0 0 no-repeat;		
}

.mpOrderWrap p a:hover{
	background-position: 0 -25px;		
}

.mpOrderWrap p a.added, .mpOrderWrap p a.added:hover { /*:hover for IE fix*/
	background-position: 0 -50px;		
}

/************************************************************************
Cart
*************************************************************************/
#mpCart{
	clear: both;
	background: url(mp_cartBG.gif) bottom left no-repeat;
	height: 156px;
}

#mpCartCount{
	height: 22px; /*27*/
	text-align: right;
	background: url(mp_cartHeader.gif) top left no-repeat;
	color: #fff;
	font-weight: bold;
	font-size: 12px;
	padding: 5px 5px 0 0;
	overflow: hidden; /*for inner floats*/
}

#mpCartSubWrap{
	height: 129px;
	background:url(mp_cartEmpty.gif) center center no-repeat;
	padding: 0 25px;
}

#mpCartSubWrap .mpCartItem{
	overflow: hidden; /*for inner floats*/
	padding: 4px 0 0 0;
	border-bottom: 1px solid #999;
	height: 38px;
}

#mpCartSubWrap .mpCartItem h4{
	float: left;
	width: 530px;
	font-weight: bold;
	font-size: 15px;
}

#mpCartSubWrap .mpCartItem h4 a{
	color: #000;
	text-decoration: none;
	border-bottom: 1px dashed #990000;
}

#mpCartSubWrap .mpCartItem h4 a:hover {
	border-bottom: none;
	text-decoration: underline;	
}

#mpCartSubWrap .mpCartItem p.mpCartPCHPrice{
	float: left;
	width: 110px;
}

#mpCartSubWrap .mpCartItem p.mpCartPCHPrice span{
	font-weight: bold;	
}


#mpCartSubWrap .mpCartItem p.mpCartFourPay{
	float: left;
	width: 200px;	
}

#mpCartSubWrap .mpCartItem p.mpCartFourPay span{
	font-weight: bold;
	font-size: 14px;
	color: #990000;
}

#mpCartSubWrap p.mpCartRemove{
	clear: both;
	float: left;
	width: 70px;
	height: 38px;
}
#mpCartSubWrap .mpCartRemove a{
	display: block; /*make it all "hot"*/
	color: #990000;
	text-decoration: none;
	background: url(mp_cartRemove.jpg) left center no-repeat;
	height: 16px; /*FOR IE to allow BG.IMG clickable - legal request*/
	padding: 0 0 0 20px;	
}

#mpCartSubWrap .mpCartRemove a:hover {
	text-decoration: underline;
}

/************************************************************************
Navigation
*************************************************************************/
#mpNav{
	width: 650px;
	margin: 0 auto;
	padding: 25px 0 0 0;
}

#mpNavBack, #mpNavNext{
	visibility: hidden;
	width: 150px;
}

#mpNavBack{
	float: left;
}

 #mpNavBack a, #mpNavNext a{
	display: block; /*all hot*/
	width: 150px;
	height: 38px;	
}

#mpNavBack a{
	background: url(mp_NavBack.gif) top left no-repeat;
}

#mpNavNext a{
	background: url(mp_NavNext.gif) top left no-repeat;
}

#mpNavBack a:hover, #mpNavNext a:hover{
	background-position: 0 -38px;
}

#mpNavPgCnt{
	visibility: hidden;
	float: left;
	width: 350px; /*650-(button width*2) */
	font-size: 14px;
	text-align: center;
}

#mpNavNext{
	float: right;
}

.mpIssue h4{
	color: red;
	font-size: 25px;
	text-align: center;
	width: auto;
}

.mpIssue p img{
	border-color: red;
}

/*********** DO NOT EDIT **************/
/*The clearfix fixes a strange issue IE6 was having when clicking on Image Viewer the container would expand ~10px */
.mpClearFix{
	clear: both;
	height: 0;
	line-height: 0;
	font-size: 0;
	margin: 0;
	padding: 0;
}