styles.css

/* reset */
html, body, h1, h2, ul, li, p { margin: 0; padding: 0; border: 0; }

BODY { background: #fff; color: #3c3c3c; font: 14px/18px "Trebuchet MS", "Helvetica CY", sans-serif; }

A { color: #106d9f; text-decoration: underline; }
A:hover { color: #c00; }
.m-dotted { color: #106d9f; border-bottom: 1px dotted #106d9f; cursor: pointer; }
.m-dotted:hover { color: #c00; border-color: #c00; }

H2 { padding-top: 20px; font-size: 24px; line-height: 28px; font-weight: normal; }
P { padding-top: 14px; }
UL { padding: 10px 0 0 28px; }
LI { padding-top: 4px; }

/* global */
.g-hidden { display: none; }
.g-line { zoom: 1; }
.g-line:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/* layouts */
.l-container { width: 720px; padding: 0 40px; margin: 0 auto; }

/* header */
.b-header { position: relative; padding-top: 32px; }
.b-header .title { float: left; padding: 18px 0 0 0; }
.b-header .title .name { float: left; padding: 4px 12px; background: #86c7e0; color: #fff; font-size: 36px; line-height: 40px; }
.b-header .title .slogan { padding: 4px 0 0 13px; color: #545454; font: italic 18px/22px Georgia, "Century Schoolbook L", Serif; }