1body {
  2    background-color: #ddd;
  3    font-family: 'Raleway', sans-serif;
  4}
  5
  6div.card {
  7    background-color: #fff;
  8    margin: 20px 20%;
  9    padding: 20px 40px;
 10    border-radius: 4px;
 11    box-shadow: 8px 8px 8px #ccc;
 12}
 13
 14.fadable {
 15    opacity: 0;
 16    transition: opacity 200ms;
 17}
 18
 19.fadein {
 20    opacity: 1;
 21}
 22
 23ul.horizontal {
 24    list-style-type: none;
 25    margin: 0;
 26    padding: 0;
 27    overflow: hidden;
 28}
 29
 30ul.horizontal li {
 31    float: left;
 32    display: block;
 33    background-color: #0AF;
 34    margin: 4px;
 35    padding: 4px;
 36    border-radius: 4px;
 37    box-shadow: 2px 2px 2px #ccc;
 38}
 39
 40#filters li {
 41    cursor: pointer;
 42    background-color: #48F;
 43    transition: background-color 200ms;
 44}
 45
 46#filters li:hover {
 47    background-color: #F44;
 48}
 49
 50a {
 51    text-decoration: none;
 52    color: #09F;
 53    transition: color 200ms;
 54}
 55
 56a:hover {
 57    color: #0BF;
 58}
 59
 60pre, code {
 61    color: #235;
 62    font-family: 'Inconsolata', monospace;
 63}
 64
 65pre {
 66    background-color: #222;
 67    color: #fff;
 68    padding: 15px 30px;
 69    overflow: auto;
 70    word-wrap: normal;
 71    white-space: pre;
 72}
 73
 74kbd {
 75    background-color: #fbfbfb;
 76    border-bottom-color: #888;
 77    padding: 3px;
 78    border: 1px solid #ccc;
 79    border-bottom: 2px;
 80    border-radius: 3px;
 81    box-shadow: #aaa 0px -2px 0px 0px inset;
 82    font-family: 'Inconsolata', monospace;
 83    font-size: 14px;
 84}
 85
 86br {
 87    line-height: 1.5;
 88}
 89
 90button {
 91    background-color: #fa0;
 92    color: #fff;
 93    border-radius: 4px;
 94    border: none;
 95    padding: 8px;
 96    display: inline-block;
 97    font-size: 16px;
 98    margin: 4px 2px;
 99    cursor: pointer;
100    transition: box-shadow 150ms;
101}
102
103button:hover {
104    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
105}
106