Woocommerce support

Hi,
Thank you for your patience and for the login, I will try to help you customize your plugin ARG MultiStep Checkout for WooCommerce, although this is not a third party plugin that we support.
for the width of your fields in the steps please try this css

.argmc-wrapper .argmc-form-steps {
    padding-left: 0;
    padding-right: 0;
}
.argmc-order-step, .argmc-payment-step, .argmc-order-payment-step, .argmc-order-review-step {
    max-width: 100%;
}
.woocommerce-shipping-totals.shipping th {
	width: 50px;
}

I’m not sure what you are finding wrong with the payment box in step two or three, but these boxes are styled from the plugin and will not look like our demo, I didn’t see anything out of line please see the screenshots in the Private Content area. If there was something small to adjust I would be able to assist, but I can’t re-write the plugin to look like our demo.
The English words Customer Details, Billing Address, & Shipping Address are also from the plugin:

so while I could write a script to change these, I would first suggest that you ask the plugin author for their solution as I imagine they must have dealt with this before.
I’m not sure what you mean by the “my account” fields should look like the log in / register, try explaining with some screenshots.

Best regards,
Mike

Hi,
Thank you for the screenshots, on your first one “delivery.png” all of the text is using the same font “helvetica neue” some are bold and #758269 in color, if you want them to all be like this try this css:

.woocommerce-checkout .woocommerce .argmc-wrapper .argmc-form-steps, .woocommerce-checkout .woocommerce .argmc-wrapper #payment div.payment_box, .woocommerce-checkout .woocommerce .argmc-wrapper table.shop_table th, .woocommerce-checkout .woocommerce .argmc-wrapper table.shop_table td, .woocommerce-checkout .woocommerce .argmc-wrapper table.review-table th, .woocommerce-checkout .woocommerce .argmc-wrapper table.review-table td {
	color: #758269;
	font-weight: 600;
}

in my test this also solved the font in the screenshot “payment.png”
Now if you compare the standard demo purchase box and yours

you will notice that yours is missing the PayPal image because your payment gateway doesn’t include it payment_method_ppcp-gateway
the standard PayPal payment gateway does payment_method_paypal
If you want the PayPal image and remove the outer border try this css:

#top #order_review #payment .wc_payment_method.payment_method_ppcp-gateway {
	background-image: url(https://www.paypalobjects.com/webstatic/mktg/Logo/AM_mc_vs_ms_ae_UK.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
#top #order_review #payment {
    border-style: none;
}

Now for your logins, the first image is the woocommerce standard login, the second one is the ARG MultiStep plugin login, this one has different classes and css than the first one, so to make one look like the other would take some time.
Try looking at the plugin options and see if it has a “classic” setting to look like woocommerce, or check it’s support site for css to look like woocommerce.

Best regards,
Mike

Hi,
Please try this css for desktop & mobile for
Checkout
Method of payment
shipping

@media only screen and (max-width: 379px) { 
#top #order_review .woocommerce-shipping-totals.shipping td label,
#top #order_review .woocommerce-shipping-totals.shipping td label bdi,
#top #order_review .woocommerce-shipping-totals.shipping td label bdi .woocommerce-Price-currencySymbol {
	font-size:10px;
}
#top #order_review .woocommerce-shipping-totals.shipping td {
    left: 14px!important;
}
}
@media only screen and (max-width: 450px) { 
#top #order_review .woocommerce-shipping-totals.shipping {
	height: 81px;
}
#top #order_review .woocommerce-shipping-totals.shipping td {
    width: 300px!important;
    max-width: 300px!important;
    left: 47px;
    position: absolute;
}
#payment .payment_method_ppcp-gateway label {
	color: transparent;
}
}
@media only screen and (min-width: 451px) { 
	#top #order_review .woocommerce-shipping-totals.shipping td {
    width: 300px!important;
    max-width: 300px!important;
	}
}
@media only screen and (max-width: 768px) { 
	.responsive #top table.woocommerce-checkout-review-order-table .product-name {
    border-left-style: none;
	}
}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,
Please try this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:

@media only screen and (max-width: 783px) { 
#top.woocommerce-account #main .woocommerce-LostPassword {
	float: left;
    padding-top: 25px;
}
}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike