* { font-family: 'Source Sans Pro', sans-serif; color: #221; } body { margin: 2.0em; max-width: 1024px; } div { margin-bottom: 1.4em; } h1 { font-size: 30px; font-weight: 200; } h2 { color: #220; margin-bottom: 1.2em; } .header h1 a { background-color: #A939EF; color: #fff; padding: 0.2em 0.8em; font-weight: normal; text-transform: uppercase; } .icon { float: left; /* width: 50px; */ margin: 1.0em 1.0em 0 2.0em; } .round { border-radius: 64px; border: 3px solid #ddd; } .subhead { padding: 0.5em 0.5em 0 0; border: 1px solid #E0D9D9; background-color: #e8e8e8; margin-bottom: 2.0em; } .subhead p { display: block; font-size: 17px; text-align: left; padding-bottom: 20px; margin: 20px 0 10px 72px; line-height: 22px; } .highlight { background-color: yellow; line-height: 3.0em; padding-left: 1.0em; display: block; } h1.cool, h1.cool strong { margin-top: 0.4em; color: #A939EF; } p { margin: 0 0 1.0em 0; } ul { list-style-position: inside; } ul li { text-indent: 1.0em; } .hero { position: relative; } div.header { position: absolute; z-index: 2; top: 0; left: -4px; } li, p { font-size: 22px; line-height: 1.6em; } .hero img { width: 100%; /* width: 642px; */ /* ugh fucking retina shows this at 748 */ }