/* Page background (SPPB page CSS): #fdf8f4, #fefcfb on /in-store-order. */
body { background-color: #fdf8f4; }
body.pb-page-in-store-order { background-color: #fefcfb; }

/* The single SP Page Builder section that the seven include pages (rewards, rewards/*, in-store-order,
   locations) wrapped their partial in on the Joomla site: 40px top padding, Bootstrap-width container
   with a 15px gutter, and a stacking level of 1 (below the header slot at 99 and the footer at 21). */
.pb-sec { position: relative; z-index: 1; padding-top: 40px; background-color: #fdf8f4; }
.pb-sec__in { width: 100%; margin: 0 auto; padding: 0 15px; }
@media (min-width: 576px)  { .pb-sec__in { max-width: 540px; } }
@media (min-width: 768px)  { .pb-sec__in { max-width: 720px; } }
@media (min-width: 992px)  { .pb-sec__in { max-width: 960px; } }
@media (min-width: 1200px) { .pb-sec__in { max-width: 1140px; } }
@media (min-width: 1400px) { .pb-sec__in { max-width: 1320px; } }
/* The partial sat in a positioned flex column: its margins never collapsed out of the section, and
   absolutely positioned children (e.g. the signup honeypot) are placed against the column. */
.pb-sec__col { position: relative; display: flow-root; }
/* /locations zeroed the column gutter, so its content spans the full container width. */
.pb-sec--flush .pb-sec__in { padding: 0; }
/* /rewards/me used a full-width section with no container or gutter. */
.pb-sec--full .pb-sec__in { max-width: none; padding: 0; }
/* /in-store-order: white section inset 20px from the sides with 40px below it. */
.pb-sec--inset { margin: 0 20px 40px; background-color: #fff; }