Maybe someone can make heads or tails of what I’m trying to achieve if I just paste the code in.
<!doctype html>
<html style="background-color: #8F5C98">
<head>
<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Graphic Designer Specialising in Brand Design, Consultation, Management and Illustration. Based in Lincolnshire, UK">
<meta name="author" content="Martin Bodger">
<meta name="keywords" content="Graphic, Designer, Illustrator, Animator, Lincoln, Lincolnshire, United Kingdom">
<title>Martin Bodger | Designer</title>
<link href="../_css/websitestyletest.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<script src="../_js/jquery-3.3.1.min.js"></script>
<script src="https://www.google.com/recaptcha/api.js"></script>
<script>
$(document).ready(function() {
$('.field input').keyup(function() {
var empty = false;
$('.field input').each(function() {
if ($(this).val().length == 0) {
empty = true;
}
});
if (empty) {
$('#send').attr('disabled', 'disabled');
} else {
$('#send').attr('disabled', false);
}
});
});
</script>
</head>
<body>
<div class="body">
<div class="header" style="pointer-events: none;">
<a href="../index.html">
<div class="logo" style="pointer-events: auto;">
<img src="../_images/mb_logo_hover.png"/>
</div>
</a>
<div class="navbar" style="pointer-events: auto;">
<ul>
<li><a href="design.html">Design</a></li>
<li><a href="illustration.html">Illustration</a></li>
<li><a href="animation.html">Animation</a></li>
<li style="transform: skew(0deg, 16deg);"><a href="contact.html">Contact</a></li>
<li><a href="about.html">About</a></li>
</ul>
</div>
</div>
<div id="contact-area">
<form name="contactform" method="post" action="contactengine.php" target="_blank">
<table>
<tr>
<td valign="top">
<label for="name">Your Name *</label>
</td>
</tr>
<tr>
<td valign="top">
<input class="field" type="text" name="name" maxlength="50" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="email">Your Email *</label>
</td>
</tr>
<tr>
<td valign="top">
<input class="field" type="text" name="email" maxlength="50" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="enquiry">Your Enquiry *</label>
</td>
</tr>
<tr>
<td valign="top">
<input class="field" type="text" name="enquiry" maxlength="30" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="message">Your Message *</label>
</td>
</tr>
<tr>
<td valign="top">
<textarea name="message" maxlength="1000" cols="25" rows="5"></textarea>
</td>
</tr>
<tr>
<td>
<input type="submit" name="send" value="send" id="send" disabled="disabled">
</td>
</tr>
<tr>
<td>
<div style="margin-left: 10%" class="g-recaptcha" data-sitekey="6LdiPkcUAAAAAMgzMjSiA-gD6nWsbbVrDXQXRfxM" data-callback="recaptcha_callback"></div>
</td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>