* {
    margin: 0;
    padding: 0;
}

html {
    padding: 1em 2em;
    background: white;
    color: #333;
}

body {
    font: 14px/1.5 Helvetica, Sans-Serif;
    width: 768px;
    margin: 0 auto;
}

h1 {
    font-size: 24px;
}

h2 {
    font-size: 18px;
    border-bottom: solid 1px #666;
}

h3 {
    font-size: 16px;
    clear: right;
}

h3 a {
    font-weight: normal;
}

h4 {
    font-size: 16px;
    font-weight: normal;
    font-style: italic;
}

h2, h3, h4 {
    margin: 1em auto;
}

p {
    margin: 1em 2em;
}

img {
    border: none;
}

p img {
    float: right;
    margin: 0 0 1em 1em;
}

blockquote {
    margin: 1em 0;
    padding: 1em 2em;
    border-top: solid 1px #ccc;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.0, #f0f0f0), color-stop(0.33, white), color-stop(1.0, white));
    background: -moz-linear-gradient(top, #f0f0f0, #fff);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f0f0f0ff, endColorstr=#ffffffff);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#f0f0f0ff, endColorstr=#ffffffff)";
}

blockquote p {
    margin: 0;
    font-style: italic;
}

.clearer {
    clear: right;
    height: 0;
    font-size: 0;
    line-height: 0;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.icon img {
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 100ms;
    -webkit-transform: scale(1.0);
}

.icon img:hover {
    -webkit-transform: scale(1.25);
}

footer p {
    margin: 2em 0 1em 0;
    font-size: 12px;
    font-style: italic;
}
