body {
	/* Background pattern from http://www.pixelsandicecream.com (with adjusted colors), thanks for sharing! */
	background: #444 url('images/CharcoalDamask.png') repeat center top;
	font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
}

h1, h2, h3, h4 { font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; }
h1 { font-size: 36px; font-weight: bold; }
h1 span { font-weight: normal; }

a:link { color: #8a2; text-decoration: none; }
a:visited { color: #570; text-decoration: none; }
a:active { color: #791; }
a:hover { background-color: #cf8; }
a img { border-width: 0; }

.box {
	position: relative; float: left; width: 220px; height: 220px; padding: 20px; margin: 30px 0 0 30px; background-color: #fff;
	-moz-box-shadow: 6px 6px 12px #000; -webkit-box-shadow: 6px 6px 12px #000; box-shadow: 6px 6px 12px #000;
}
.box a img {
	position: absolute; top:20px; left: 20px; width: 220px; height: 220px;
}
.box a img#cclogo {
	position: absolute; top: auto; bottom:20px; width: auto; height: auto;
}

.box > a { color: #000; font-weight: normal; }
.box ul { margin-top: 16px; }
.box ul li a { display: block; }

.box h2, .box p { position: absolute; display: inline-block; background-color: #fff;  }
.box h2 { top: 20px; left: 20px; padding: 2px 8px 2px 0; font-size: 18px; line-height: 22px; font-weight: bold; }
.box p { top: 44px; left: 20px; padding: 0 8px 2px 0; font-size: 14px; line-height: 18px; }