Mobile CSS Not Working?

[toad78]

Looking at [this page] on a phone device (https://www.sugarloaftheoldcourse.com/eshop/memberships) (add an item to your cart), the Shopping Cart popup text color seems to be white or the items are hidden. I’m using the below code but do not see why no prices, subtotals, or totals are showing:

#cboxLoadedContent h1, .cart-info th {
	color: #333333!important
}
#cboxLoadedContent .cart-info td {
	text-align: center;
	color: #333 !important;
	display: block!important;
	}
@media screen and (max-width: 768px) {

#colorbox #cboxContent h1 {
	margin: 0;
	padding: 0;
	background: none;
}
#cboxLoadedContent .totals div {
    border: medium none;
    color: #333 !important;
    display: block!important;
	}
#cboxLoadedContent .bottom {
	width: 100%!important;;
}
.bottom > div > a, .bottom > div > button {
   display: block!important;;
   margin: 1em auto!important;;
   width: 100%!important;;
   color: #333!important;
}
}

[PaulOB]

You seem to have a different structure in the mobile version so the color you are setting is not applied and inherits white from the body.

I think you can just apply a color to cart-info instead.

.cart-info{color:#333}

[toad78]

Thank you! That covered it.