index.html

<!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>Blackjack</title>
    <link rel="stylesheet" href="index.css">
    
</head>
<body>
    <div class="container">
        <div>
            <h1>Blackjack game</h1>
        </div>
        <div class="display">
            <div class="sumBal">
                <p id="sum">Sum: 0</p>
                <p id="balance">Balance: $1000</p>
                <p id="bet">Bet: 0</p>
            </div>
                <div id="msgHeight">
                <p id="message">Draw a card to start the game! 😀</p>
            </div>
            <div id="cards"></div>
        </div>
        <div class="buttons-bet">
            <div class="buttons">
                <button id="new-card-btn">NEW CARD</button>
                <button id="stop-btn">STOP</button>
                <button id="restart-game-btn">RESTART GAME</button>
                <button id="refill-balance-btn">REFILL BALANCE</button>
            </div>
            <div class="bet">
                <button id="bet-all-in">ALL IN</button>
                <button id="bet-50">+50</button>
                <button id="bet-100">+100</button>
                <button id="bet-200">+200</button>
            </div>
        </div>
        
    </div>
    <script src="script.js"></script>
</body>
</html>