Math returning NaN to page [closed]

Hey guys I'm having trouble understanding where I've gone wrong, I'm assuming its within my maths but I can't see what it is that resulting in it not giving the correct answer

let input = Number(document.querySelector('.rep').value);
let btn = document.getElementById('submit');
let display = document.getElementById('1rm');


btn.addEventListener('click', function(ev) {
    let twentyPercent = Math.floor(input * 0.2);
    let max = Number(twentyPercent.value) * 100;
    display.textContent = Number(max.value);
    ev.preventDefault();
    return
});

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>1 Rep Mac Calculator</title>
    <link href="1rm.css" rel="stylesheet">
    <script defer src="1rm.js"></script>
</head>
<body>
    <div id="title">
        <h1>1 Rep Max Calculator</h1>
    </div>

    <form id="repV">
        <input type="number" min="20" class="rep">
        <input type="submit" id="submit">
    </form>

    <div id="1rm-title">
        <h2>Your 1 rep max is:</h2>
    </div>

    <div id="1rm">
        <p>Text</p>
    </div>
</body>
</html>

Via Active questions tagged javascript - Stack Overflow https://ift.tt/NLqKbyf