<h1>Rock, Paper, or Scissors?</h1>

<p>A steam-powered bot has challenged you to a game. <u>Rock</u> beats <u>scissors</u>, <u>scissors</u> beats <u>paper</u>, and <u>paper</u> beats <u>rock</u>.</p>

<div>
<table class="center">
    <thead>
        <tr>
            <th colspan="2">Scoreboard</th>
        </tr>
    </thead>
    <tbody>
        <tr class = "number">
            <td>0</td>
            <td>0</td>
        </tr>
        <tr class = "names">
          <td>You</td>
          <td>Bot</td>
      </tr>
    </tbody>
</table>
</div>

<h2>Choose Wisely</h2>

<button>Rock</button>

<button>Paper</button>

<button>Scissors</button>
body {
    text-align: center;
    background: black;
    color: lime;
    font-size: 20px;
}
table{
    text-align:center;
    border:1px solid lime;
    width: 250px; 
  
}

th{
  border-bottom:1px solid lime;
  font-size: 35px;
}

tr.names{
  font-size: 20px;
}

tr.number{
  font-size: 50px;
}


table.center {
    margin-left:auto; 
    margin-right:auto;
  }

button{
    background: lime;
    color: black;
    border: none;
    padding: 10px 15px;
    font-size: 20px;
    font-weight: bold;
    margin: 5px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.