Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Style
<style type="text/css">
    .centre{
        margin:0 auto;
        text-align:center;
    }
    .left{
        text-align:left;
    }
    table#matrix{
        /*border:1px solid #000;
        -moz-box-shadow:    3px 3px 5px 6px #ccc;
        -webkit-box-shadow: 3px 3px 5px 6px #ccc;
        box-shadow:         3px 3px 5px 6px #ccc;*/
        border-collapse:collapse;
margin:0 auto;
    }
    
    table#matrix tr td{
        padding:15px 15px 0 15px;
        border-bottom:1px solid #005480;
    }
    table#matrix tr:nth-child(odd) td{
        padding:0 15px 15px 15px;
    }
    table#matrix tr:nth-child(even) td{
        border:none;
        vertical-align:bottom;
    }
    table#matrix tr td div{
        margin:0 auto;
    }
    
    table#matrix .headingRow td{
        min-width:70px;
        font-weight:bold;
    }
    table#matrix tr td p{
        font-size:xx-small;
        text-align:center;
        margin:0;
        padding:2px 0 0 0; /* bit of padding to separate dot from text */
    }
    .circle {
        width: 15px;
        height: 15px;
        -moz-border-radius: 50px;
        -webkit-border-radius: 50px;
        border-radius: 50px;
        -moz-box-shadow:    0px 0px 15px 1px #ccc;
        -webkit-box-shadow: 0px 0px 15px 1px #ccc;
        box-shadow:         0px 0px 15x 1px #ccc;
    }
    .green{
        background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, green 0%, green 100%, green 95%);
        background-image: -webkit-radial-gradient(45px 45px, circle cover, green, green);
        background-image: radial-gradient(45px 45px 45deg, circle cover, green 0%, green 100%, green 95%);
        background-color:green;
        
    }
    .orange{
        background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, yellow 0%, orange 100%, red 95%);
        background-image: -webkit-radial-gradient(45px 45px, circle cover, yellow, orange);
        background-image: radial-gradient(45px 45px 45deg, circle cover, yellow 0%, orange 100%, red 95%);
        background-color:orange;
    }
    .red{
        background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, orange 0%, red 100%, red 95%);
        background-image: -webkit-radial-gradient(45px 45px, circle cover, orange, red);
        background-image: radial-gradient(45px 45px 45deg, circle cover, orange 0%, red 100%, red 95%);
        background-color:red;
    }
  </style>