p,
ul.list-bullet,
.code-example {
	margin-bottom: 1em;
}
figcaption {
	margin-bottom: .3em;
}

code, pre {
	font-family: "Andale Mono", "Consolas", monospace;
}

code {
	border-radius: 2px;
	padding: 0 2px;
	background-color: #fedeb1;
	color: #272517;
	white-space: nowrap;
}
.css-class-example:before {
	content: '.';
}

pre {
	padding: 1em;
	overflow: auto;
}

.code-example {
	position: relative;
	padding-left: 25px;
	padding-left: 2.5rem;
}
.code-example:before {
	content: '\f121';
	font-size: 17px;
	font-size: 1.7rem;
	font-family: FontAwesome;
	position: absolute;
	left: 0;
	top: 0;
	width: 17px;
	width: 1.7rem;
	text-align: center;
	background-color: #fff7d9;
	color: #fcac60;
}

/* Color Palette */
.colorpalette {
	text-align: right;
}
.colorpalette > li {
	display: inline-block;
	width: 3.5em;
	text-align: left;
}
.colorpalette--large > li {
	width: 6em;
}
.colorpalette__label {
	display: inline-block;
	margin-bottom: 5px;
	text-transform: uppercase;
}
.colorpalette__label:before {
	content: attr(data-color);
}
.colorpalette__blot {
	display: block;
	padding: 50%;
}
.colorpalette__blot--pointy {
	border-radius: 0 50% 50% 50%;
}

@media print {
	@page {
		margin-left: 10px;
		margin-right: 10px;
	}
	
	h1 {
		font-size: 11px;
	}
	h3 {
		font-size: 10px;
		text-decoration: underline;
	}
	
	li, p, a {
		font-size: 9px;
	}
	
	footer {
		display: none;
	}
}