css-setting with !important cannot be replaced

Hello!

I have made a change for the mobile view via CSS:

@media only screen and (max-width: 450px) {
	.w3eden .card-body {
		padding: unset!important;
	}

	.w3eden .media {
		display: flex;
		flex-direction: column;
	}

	.w3eden .ml-3 {
		margin-left: unset!important;
	}
}

Unfortunately there is an entry:

.w3eden .ml-3, .w3eden .mx-3 {
    margin-left: 1rem!important;
}

to have a space next to the button in the horizotal view. In the way I changed it is ugly. But can’t change anything because of the existing !important.

https://ibb.co/0Xz8SSK

Maybe there is a better/different way?

create a new template would be possible for me, but I considered that too much effort for this small customization.

Thanks for any hint!