/*
	EMPTY BAG
 */
div.pBag.pEmpty { margin: 3rem auto; padding: 1.5rem; }
div.pEmpty, div.pShipping.pEmpty { background-color: rgb(250, 240, 240); }
div.pShipping.pNone { background-color: white; border: solid rgb(245, 245, 245); }
div.pFilled, div.pShipping.pFilled { background-color: rgb(245, 245, 245); }
p.pEmpty { color : rgb(224, 0, 0); font-weight: bold; }

@media screen and (max-width: 767px) {
	div.pBag.pEmpty { width: 94vw; }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
	div.pBag.pEmpty { width: 62vw; }
}
@media screen and (min-width: 1280px) {
	div.pBag.pEmpty { width: 38vw; }
}


/*
	PRODUCTS
 */

section.pBag { display: inline-block; text-align: left; margin-top: 1.5rem; }

section.pBag h2 { text-align: center; }

div.pProduct { background-color: rgb(245, 245, 245); margin-bottom: 3px; position: relative; }
div.pProduct > * { display: inline-block; vertical-align: middle; }
div.pProduct a.pImg img { }
div.pProduct div.pTxt { text-align: left; padding: 0.5rem 0; }
div.pProduct div.pTxt > * { display: inline-block; vertical-align: middle; min-height: 1rem;  }

div.pProduct div.pTxt .pName { text-align: left; margin-bottom: 1rem; padding-left: 0.5rem; }
div.pProduct .pAdjust { text-align: right; }
p.pPrice{ text-align: right; line-height: 2rem; margin-top: 0; }
p.pPrice span { font-size: 0.8em; }
button.pQpm  { margin-left: 2rem; }

div.pTotal p.pPrice, div.pTotal p.pPrice span { font-weight: bold; line-height: 2rem; text-align: right; }
div.pTotal { padding: 1rem 0; vertical-align: middle; }
div.pTotal p.pPrice { margin-left : 0; }

button.pQpm { position: relative; }
button.pQpm::before { font-size: 0.8em; }

@media screen and (max-width: 767px) {
	section.pBag { width: 100vw; }
	section.pBag h2 { margin: 0 3vw; }
	div.pProduct { padding: 0 3vw; }
	div.pProduct .pImg { position: relative; left: -3vw; width: 21vw; height: 21vw; }
	div.pProduct div.pTxt { width: 73vw; }
	div.pProduct .pName { width: 73vw; }
	div.pProduct .pAdjust { width: 57vw; }
	
	div.pTotal > * { display: inline-block; vertical-align: middle; }
	div.pTotal { padding: 1rem 3vw; }
	div.pTotal p.pName { width: 78vw; }
	p.pPrice { width: 16vw; }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
	section.pBag { width: 80vw; }
	div.pProduct .pImg { width: 13vw; height: 13vw; }
	div.pProduct div.pTxt { width: 67vw; }
	div.pProduct .pName { width: 67vw; }
	div.pProduct .pAdjust { width: 59vw; }
	p.pPrice { padding-right: 1rem; }
	
	div.pTotal > * { display: inline-block; vertical-align: middle; }
	div.pTotal p.pName { width: 72vw; }
	p.pPrice { width: 8vw; }
}
@media screen and (min-width: 1280px) {
	section.pBag { width: 62vw; }
	div.pProduct .pImg { width: 8vw; height: 8vw; }
	div.pProduct div.pTxt { width: 54vw; }
	div.pProduct .pName { width: 54vw; }
	div.pProduct .pAdjust { width: 49vw; }
	p.pPrice { padding-right: 1rem; }
	
	div.pTotal > * { display: inline-block; vertical-align: middle; }
	div.pTotal p.pName { width: 57vw; }
	p.pPrice { width: 5vw; }
}


/*
	SHIPPING
 */

div.pShipping { background-color: rgb(245, 245, 245);  padding: 1rem; margin-bottom: 3px; text-align: right; }
div.pShipping p { text-align: left; }


/*
	ACCOUNT & PROCEED
 */


div.pAccount { margin-bottom: 2rem; text-align: center; }
div.pAccount button { margin: 0 0.5rem; }
div.pProceed { margin-top: 2rem; text-align: center; }


/*
	UPSELL
 */

section.pUpsell { text-align: center; margin-top: 2rem; }

@media screen and (max-width: 767px) {
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
}
@media screen and (min-width: 1280px) {
}


/*
	REASSURANCE
 */

div.pReassurance { text-align: center; margin-top: 2rem; }
div.pSwitch { text-align: center; margin-bottom: 1rem; }
div.pCards img { width: 3rem; height: calc(3rem / 1.618); margin: 0.5rem 0.25rem; }
@media screen and (max-width: 767px) {
	img.pCards {  }
	div.pReassurance, div.pSwitch { width: 94vw; }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
	img.pCards {  }
	div.pReassurance, div.pSwitch { width: 80vw; }
}
@media screen and (min-width: 1280px) {
	img.pCards {  }
	div.pReassurance, div.pSwitch { width: 62vw; }
}


/*
	LOYALTY
 */

p.pLoyalty { background-color: rgb(215, 239, 215); padding: 1rem; margin-top: 1.5rem; }

@media screen and (max-width: 767px) {
	p.pLoyalty { width: 100vw; }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
	p.pLoyalty { width: 80vw; }
}
@media screen and (min-width: 1280px) {
	p.pLoyalty { width: 62vw; }
}