JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://newskillsacademy.co.uk/wp-content/plugins/simple-signup-form-pro/templates/assets/css/simple_signup_pro.css">
<link rel="stylesheet" href="https://newskillsacademy.co.uk/wp-content/plugins/simple-signup-form-pro/templates/assets/css/simple_signup_pro.css">
<link rel="stylesheet" href="https://newskillsacademy.co.uk/wp-content/themes/academy/style.css">
<div id="ssp-1786600221-487496969" class="simplesignuppro ssp_embed" style="width: 100%; position: static; opacity: 1; margin: 0px auto; transition: all 0s ease-in 0s; animation-duration: 0s; animation-timing-function: linear; animation-delay: 0s;">
<div class="mc_embed_signup">
<div class="mc_embed_signup_inner" style="box-shadow: none; background: rgb(244, 247, 249); border-radius: 4px;">
<form onsubmit="return false;" method="post" class="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" target="_blank" novalidate="">
<div class="inside-form">
<h2 class="-default3" style="color: rgb(0, 0, 0); font-size: 17px; font-weight: normal; font-family: Roboto, serif;"></h2>
<div class="mc-field-group">
<div class="signup">
<div class="-default2">
<input type="text" value="" name="firstnamesub" class="firstnamesub customfields" placeholder="First Name" style="margin-bottom: 0px; border-radius: 3px; font-size: 16px; color: rgb(0, 0, 0); font-weight: normal; font-family: Roboto, serif;">
</div>
<div class="ssp-email-row -default4">
<input type="email" value="" name="ssp_email" class="ssp_email mce-EMAIL" placeholder="Your Email" style="font-size: 16px; color: rgb(0, 0, 0); font-weight: normal; border-top-left-radius: 3px; border-bottom-left-radius: 3px; font-family: Roboto, serif;">
<input type="submit" value="Submit" name="subscribe" class="subscribe button" style="margin-top: 0px; border-top-right-radius: 3px;...
CSS
.ssp-email-row.-default1 {
width: 28% !important;
}
.-default1 {
width: 28%
}
.signup > div {
float: left;
width: 28.5% !important;
}