CSS3 Only Poker Chips - Snippet

Preview
HTML
CSS
JS

<div class="fish red">
  <div>1</div>
</div> 

<div class="fish orange">
  <div>20</div>
</div>

 <div class="fish green">
  <div>100</div>
</div>

<div class="fish blue">
  <div>1000</div>
</div>

<div class="fish blue disabled">
  <div>1000</div>
</div>

<div class="fish black">
  <div>5000</div>
</div>

body {
    margin: 0px;
    padding: 0px;
	background: #ddd;
}

div.fish {
    float: left;
    width: 70px;
    height: 70px;
    margin: 30px;
    border-radius: 150px;
    -webkit-border-radius: 150px;
    -moz-border-radius: 150px;
    box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.2);
    -moz-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.2);
    -webkit-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.2);
    border: 10px dotted #fff;
}

div.fish div {
    font-family: Verdana;
    text-align: center;
    line-height: 70px;
    font-size: 1.7em;
}

div.orange { background: #f7b55e }

div.green { background: #92ed40 }

div.blue { background: #4cc3fe }

div.black {
    background: #333;
    color: #eee;
    box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.1);
    -moz-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.1);
    -webkit-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.1);
    border: 10px dotted #ccc;
}

div.red { background: #fd5f72 }

div.disabled { opacity: 0.4 }