.needle{
    position: absolute;
    top: 50%;
    left:50%;
    background-color:#0cf;
    height:10%;
    margin: -5% 0 0 -5%;    
    transform-origin: 5% center;  
    -moz-transform-origin: 5% center;
    -webkit-transform-origin: 5% center;
    -o-transform-origin: 5% center;
    transition-duration: 1s; 
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s; 
    border-radius: 5px;  
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;

}
  
.long { width: 50%;}
.short { width: 40%;}

.clock
{
  float:left;
  position:relative;
  height: 31%;
  width: 44%;
  border: 1px solid #ddd;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  background-color:#fff;

}

.block{
  position:relative;
  float:left;
  height:50%;
  width:16.6%;
  
}
  
#clockclock
{
  position:absolute;
  top:50%;
}