Apparence des listes

.post-outer ol {
	counter-reset: li;
	margin-left: 0;
	padding-left: 0
}
.post ol li {
	position: relative;
	margin: 0 0 20px 2em !important;
	padding: 4px 8px !important;
	list-style: none;
	*list-style: decimal;
	border: 1px solid #e2e3e2;
	background: #f2f2f2;
	text-indent: 10px;
}
.post ol li:before {
	content: counter(li);
	counter-increment: li;
	position: absolute;
	top: -5px;
	left: -5px;
	font-family: 'Oswald', serif;
	font-size: 14px;
	width: 12px;
	margin: 0 0 10px 0;
	padding: 4px !important;
	color: #727272;
	text-align: left;
	background: #e2e2e2;
	text-indent: 2px
}
.post ol li:after {
	content: "";
	position: absolute;
	top: -5px;
	left: 14px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 0 5px;
	border-color: transparent transparent transparent #aeaeae;
}

.post-outer ol {
	counter-reset: li;
	margin-left: 0;
	padding-left: 0;
}
.post ol li {
	position: relative;     
	margin: 0 0 20px 2em !important;
	padding: 4px 8px !important;
	list-style: none;
	*list-style: decimal;
}
.post ol li:before {
	content: counter(li);
	counter-increment: li;
	position: absolute;
	top: -8px;
	left: -39px;
	font-family: 'Oswald', serif;
	font-size: 40px;
	width: 34px;
	margin: 0 0 10px 0;
	padding: 4px !important;
	color: #727272;
	text-align: center;
}

.post ol {
	counter-reset: li; 
	margin-left: 0; 
	padding-left: 0;
}
.post ol li {
	position: relative;     
	margin: 0 0 13px 2em !important; 
	padding: 4px 8px !important; 
	list-style: none; 
	*list-style: decimal; 
}
.post ol li:before {
	content: counter(li); 
	counter-increment: li; 
	position: absolute; 
	top: 0; 
	left: -2em; 
	width: 27px; 
	margin-right: 8px; 
	padding: 3px 1px 4px 0 !important; 
	color: #fff;
	font-size: 16px; 
	background: url(http://blog.gwiki.fr/wp-content/uploads/2013/01/circulo5.png) no-repeat left top; 
	font-weight: bold; 
	text-align: center;
}

Voir : http://www.red-team-design.com/css3-ordered-list-styles