/* Shop theme layout "Acco" */

/* Reset based on http://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background:transparent;
	border:0;
	font-size:100%;
	margin:0;
	outline:0;
	padding:0;
	vertical-align:baseline;
}
input, select, textarea {
	font:inherit;
}

/* Clearfix: http://perishablepress.com/press/2009/12/06/new-clearfix-hack/ */
.clearfix:after,
.col:after,
.row:after {
	clear:both;
	content:' ';
	display:block;
	font-size:0;
	height:0;
	visibility:hidden;
}
* html .clearfix { zoom:1; } /* IE6 */
*:first-child+html .clearfix { zoom:1; } /* IE7 */

.clear { clear:both; }

/* Grid (based on 1kbgrid.com): 14 columns, 40 pixels each, with 20 pixel gutter */
.g1 { width:40px; }
.g2 { width:100px; }
.g3 { width:160px; }
.g4 { width:220px; }
.g5 { width:280px; }
.g6 { width:340px; }
.g7 { width:400px; }
.g8 { width:460px; }
.g9 { width:520px; }
.g10 { width:580px; }
.g11 { width:640px; }
.g12 { width:700px; }
.g13 { width:760px; }
.g14 { width:820px; }
.col {
	display:inline; /* IE6 */
	float:left;
	margin:0 10px;
	min-height:1px; /* To prevent   in empty cols */
}
.row {
	margin:0;
	width:840px;
}
.row .row {
	display:inline-block;
	margin:0 -10px;
	width:auto;
}

/* Hide classes */
.hide,
.js .js_hide {
	display:none;
}

/* Wrap */
body {
	background:#cce8e9;
	color:#333;
	font:13px/20px 'Helvetica Neue',Helvetica,Arial,sans-serif;
	padding:10px;
}

/* Header */
#header {
	background:#fff;
	height:110px;
	margin:0 0 1px;
	-moz-border-radius-topright:2px;
	-moz-border-radius-topleft:2px;
	-webkit-border-top-right-radius:2px;
	-webkit-border-top-left-radius:2px;
}

/* Title */
#title h1 {
	font-size:60px;
	letter-spacing:-0.02em;
	margin:40px 0 0;
	text-shadow:0 1px 1px #ccc;
}
#title h1 a {
	color:#333;
	cursor:default;
	text-decoration:none;
}
#title #version {
	background:#999;
	color:#fff;
	cursor:pointer;
	font-family:Consolas,monospace;
	font-size:12px;
	font-weight:normal;
	left:-10px;
	padding:3px 6px 1px;
	position:relative;
	text-shadow:none;
	top:-20px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}
#title #version:hover {
	background:#ccc;
}
#title #slogan {
	color:#666;
	font-size:10px;
	letter-spacing:0.2em;
	text-transform:uppercase;
}
#title #slogan span {
	color:#999;
	font-family:Garamond,serif;
	font-size:12px;
	font-style:italic;
	text-transform:none;
}

/* Navigation */
#nav ul {
	background:#008d93;
	left:0;
	list-style:none;
	margin:20px 0 0;
	position:fixed;
	width:120px;
	z-index:9999;
	-moz-border-radius-topright:2px;
	-moz-border-radius-bottomright:2px;
	-moz-box-shadow:rgba(0,0,0,0.2) 0 1px 0;
	-webkit-border-top-right-radius:2px;
	-webkit-border-bottom-right-radius:2px;
	-webkit-box-shadow:rgba(0,0,0,0.2) 0 1px 0;
}
#nav li {
	display:inline; /* IE6 fix */
}
#nav a {
	border-top:1px solid rgba(255,255,255,0.2);
	color:#fff;
	display:block;
	font-size:10px;
	letter-spacing:0.2em;
	padding:0 10px;
	text-decoration:none;
	text-transform:uppercase;
}
#nav a:hover {
	background:#33a3a8; /* rgba(255,255,255,0.2) */
}

/* Buy button */
#buy a {
	background:#b80c46;
	color:#fff;
	display:block;
	font-size:10px;
	letter-spacing:0.2em;
	margin:41px 0 0;
	text-align:center;
	text-decoration:none;
	text-transform:uppercase;
	-moz-border-radius:2px;
	-moz-box-shadow:rgba(0,0,0,0.2) 0 1px 0;
	-webkit-border-radius:2px;
	-webkit-box-shadow:rgba(0,0,0,0.2) 0 1px 0;
}
#buy a:hover { background:#d41161; }

/* Footer */
#footer {
	background:#fff;
	color:#666;
	font-size:10px;
	letter-spacing:0.2em;
	padding:20px 0;
	text-transform:uppercase;
	-moz-border-radius-bottomright:2px;
	-moz-border-radius-bottomleft:2px;
	-webkit-border-bottom-right-radius:2px;
	-webkit-border-bottom-left-radius:2px;
}

/* Content */
.content {
	background:#fff;
	margin:0 0 1px;
	padding:40px 0 20px;
}
.content h2 {
	font-size:40px;
	letter-spacing:-0.01em;
	line-height:40px;
	margin:20px 0;
	padding-top:40px;
	text-shadow:0 1px 1px #ccc;
}
.content h3 {
	font-size:24px;
	font-weight:normal;
	margin-bottom:20px;
	margin-top:40px;
}
.content h2 span,
.content h3 span {
	color:#666;
	font-family:Garamond,serif;
	font-size:1.2em;
	font-style:italic;
	font-weight:normal;
}
.content p {
	margin-bottom:20px;
}
.content .intro {
	color:#666;
	font-size:16px;
	font-family:Palatino,Georgia,serif;
	font-style:italic;
}
.content ul, .content ol { margin-bottom:20px; }
.content .sidenote {
	color:#666;
	font-size:10px;
	line-height:14px;
	margin-left:-120px;
	text-align:right;
}
.content a {
	background:#cce8e9;
	color:#008d93;
	padding:1px 3px;
	text-decoration:none;
	text-shadow:0 -1px 0 #fff;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}
.content a.image {
	padding:0;
	-moz-border-radius:0;
	-webkit-border-radius:0;
}
.content a:visited {
	background:#e5f3f4;
}
.content a:hover {
	background:#008d93;
	color:#fff;
	text-shadow:none;
}
.content pre {
	background:#eee;
	font-family:Consolas,monospace;
	margin-bottom:20px;
	overflow:scroll;
	padding:1px 3px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}
.content code { /* Inline code */
	background:#eee;
	font-family:Consolas,monospace;
	padding:1px 3px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}
.content a code {
	background:transparent;
	padding:0;
}
.content pre code {
	padding:0;
}
.content .code { /* Code block (applied on pre or textarea) */
	background:#eee;
	border:0;
	display:block;
	font-family:Consolas,monospace;
	padding:2px 3px;
	width:99%;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}
.content .marked {
	background:#fffdbe;
	padding:1px 3px;
	text-shadow:0 -1px 0 #fff;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}
.content table {
	border-collapse:collapse;
	border-top:1px solid #eee;
	margin-bottom:20px;
	width:100%;
}
.content th,
.content td {
	border-bottom:1px solid #eee;
	padding:9px 10px 10px 0;
	text-align:left;
}
.content td ul { margin-bottom:0; }
.content tbody tr:hover th,
.content tbody tr:hover td {
	background:#fdfdfd;
}
.unicode-symbol {
	/* Class necessary for IE */
	font-family:'Arial Unicode MS',sans-serif;
	font-size:160%;
}