<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Number Guessing Game</title>
    <style>
        body {
        
            font-family: Arial;
            text-align: center;
            margin: 40px;
            
        }
         
        .ty{
            background-image: url("https://i.ibb.co/wKnf7XL/Numerology1-1.jpg");
        }
        .container {
            max-width: 400px;
            margin: 0 auto;
            padding: 100px;
            background-color: rgba(173, 82, 82, 0.959);
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(11, 11, 11, 0.329);
            text-align:center;
            position:static;
           

        
        }
        name{
              padding:10px;
            }
        input {
            padding: 10px;
            margin: 10px;
        }

        button {
            padding: 10px 20px;
            margin: 10px;
            cursor: pointer;
            background-color: #4caf50;
            color: white;
            border: none;
            border-radius: 5px;
        }
    </style>
</head>
<body>

<div id="game-container">
    <h1>Number Guessing Game</h1>
    <p>I have chosen a number between 1 and 100.</p>
    <label for="userGuess">Enter your guess:</label>
    <input type="number" id="userGuess" min="1" max="100">
    <button onclick="checkGuess()">Submit Guess</button>
    <p id="result"></p>
</div>



</body>
</html>
