body{
    background: #fcfcfc;
    color: #777;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 2em;
}
a{
    color: #38c;
}
footer{
    background: #e8ecf0;
    border-bottom-left-radius: 1em;
    bottom: 2em;
    padding: 1em;
    position: fixed;
}
h1{
    font-size: 300%; margin: 0 0 1em;
}
h1 span{
    opacity: 0.3;
}

.box{
    float: left;
    font-size: 2em;
    margin: 0 2em 2em 0;
    text-align: center;
    min-width: 10em;;
    width: 23%;
}
.box a, .box span{
    border: 4px solid #68a;
    border-radius: 1em;;
    background: #fff;
    display: block;
    padding: 3em 0 ;
    text-decoration: none;
    transition: all 0.1s ease-in-out;
    box-shadow: 0.5em 0.5em 1em #ddd;;
}
.box span{
    border: 4px dotted #ccc;
    color: #aaa;
}
.box a:hover{
    color: #c33;
    box-shadow: 0 0 1em #ddd;;
}