Untitled

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Javascript 1</title>

    <style>
        span{
            display: none;
            color: red;
        }

        input[type=number]::-webkit-inner-spin-button,
        input[type=number]::-webkit-outer-spin-button{
            -webkit-appearance: none;
            appearance: none;
            margin: 0;
        }

        input[type=number]{
            -moz-appearance: textfield;
        }


        #menu{
            background-color: rgba(0,0, 0, 0.7);
            color: white;
            width: 0%;
            position: fixed;
            text-align: center;
            height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 999;
            left: 0;
            top: 0;
            transition: 0.5s;
        }

        #menu ul{
            flex-direction: column;
            list-style: none;
            visibility: hidden;
            transition: 0.5s;
        }

        #menu ul li{
            display: block;
        }

        #menu ul li a{
            color: white;
            text-decoration: none;
            text-transform: uppercase;
        }

        #menu ul li a:hover{
            color: black;
        }

        #menu #closeMenu{
            position: absolute;
            top: 60px;
            right: 40px;
        }
    </style>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
</head>
<body>

    <div id="openMenu" onclick="openMenu()" ><i class="fas fa-bars"></i></div>

    <div id="menu">
            <div id="closeMenu"><i class="fas fa-times"></i></div>
        <ul id="items">
            <li><a href="#">Home</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Contact</a></li>
            <li><a href="#">More</a></li>
        </ul>

    </div>

    <form name="myForm" action="#" method="POST" onsubmit="return validateForm()">
        Navn:
        <input name="formName" id="formName" type="text">
        <span id="name-error">Name must be filled</span>

        Telfonnummer:
        <input name="formPhone" id="formPhone" type="number">
        <span id="phone-error">Phone must be filled</span>

        Email:
        <input name="formEmail" id="formEmail" type="text">
        <span id="email-error">Email must be filled</span>

        <button type="submit">Send</button>
    </form>
    <script src="js/script.js"></script>
</body>
</html>