Styling Mailchimp sign up form in React - css

Question

I am trying to use the NPM React module for Mailchimp: https://www.npmjs.com/package/react-mailchimp-form. It works great and gives you all the forms that you may need but I am struggling to style it.
It says that you can add a personalized class for CSS styling, but how will that contain styles for all elements on the form?
Currently the form looks like this:
function MailchimpForm() {
return (
<div>
<Mailchimp
action=
fields={[
{
name: 'EMAIL',
placeholder: 'Email',
type: 'email',
required: true
},
{
name: 'COMPANY',
placeholder: 'name',
type: 'text',
required: true
}
]}
// Change predetermined language
messages={
{
sending: "Sending...",
success: "Thank you for subscribing!",
error: "An unexpected internal error has occurred.",
empty: "You must write an e-mail.",
duplicate: "Too many subscribe attempts for this email address",
button: "Subscribe!"
}
}
// Add a personalized class
className='MailchimpStyle'
/>
</div>
)
}
Where MailchimpStyle is my CSS style class. Is there a way to have multiple CSS styles in a class?
The current class looks like:
.MailchimpStyle {
clear: left;
font: 200px Helvetica, Arial, sans-serif;
}

Answer 1

You should be able to access the elements by specifying the elements after the className in the css sheet. Example for button:
.MailchimpStyle button {
clear: left;
color: black;
background-color: white;
margin: 2px;
}