How to customize the checkout page

You have the option to tailor the appearance of the checkout page by utilizing custom CSS code. To proceed with this customization, follow these steps:

  1. Access your account;
  2. Navigate to the “Appearance” section;
  3. Select “Customize”;
  4. Within the customization menu, locate and click on “Additional CSS”;
  5. Insert the desired CSS code snippets from the examples provided below at the end of the CSS code field.

Please note that some knowledge of CSS is required to complete this task effectively.

Snippet #1. Remove the accommodation label.

.mphb_sc_checkout-wrapper .mphb-room-details .title-wrapper {
  display: none;
}

Snippet #2. Minimize the price breakdown table.

.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper .mphb-price-breakdown-dates-subtotal,
.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper .mphb-price-breakdown-accommodation-subtotal,
.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper .mphb-price-breakdown-accommodation-taxes,
.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper .mphb-price-breakdown-accommodation-taxes-subtotal,
.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper .mphb-price-breakdown-fees,
.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper .mphb-price-breakdown-fee-taxes,
.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper .mphb-price-breakdown-fees-subtotal,
.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper .mphb-price-breakdown-fee-taxes-subtotal,
.mphb_sc_checkout-wrapper .mphb-room-price-breakdown-wrapper tbody .mphb-price-breakdown-subtotal {
	display: none;
}

Should you require further assistance or have any inquiries, please do not hesitate to contact our expert support team. We are readily available to provide the necessary guidance and support to fulfill your request.