Big Red number container

With faux-vigentte background, radial gradients and more awesomeness!

by dreamdealer

HTML

<div class="number">3</div>

CSS

html {
      height: 100%; 
 }
 body {
      font-family: georgia;
      background-image:
         -moz-radial-gradient(50% 50%, transparent 0%, transparent 60%, rgba(0,0,0,.4) 100%),
         url('http://www.subtlepatterns.com/patterns/carbon_fibre.png');
 }
 .number {
      text-align: center;
      line-height: 67%;
      font-size: 300px;
      font-weight: bold;
      text-indent: 2%;
      color: #FFFFFF;
      text-shadow: 0px 0px 6px rgba(0,0,0,.5);
      background: red;
      background-image: -moz-radial-gradient(0% 0%, transparent 0%, transparent 70%, rgba(0,0,0,.8) 100%);
      width: 300px;
      height: 300px;
      border-radius: 50%;
      position: absolute;
      left: 50%;
      top: 20%;
      margin-left: -150px;
      box-shadow: 4px 4px 10px rgba(0,0,0,.5), 0px 0px 0px 6px #FFFFFF;
 }