/*** Icons / .icon-set, .circle, .circle-flat ***/
.icon-set {
	margin-top: 40px;
	.title{
		margin-top: 28px;
		margin-bottom: 10px;
	}
}
.circle-mixi(@circle-size, @font-size){
	@border-size: 3px;
	@border-w: 1px;
	@border-zoom: 0.95;
	display: inline-block;
	text-align: center;
	width: @circle-size;
	height: @circle-size;
	line-height: @circle-size;
	margin-top: 20px;
	border-radius: 50%;
	font-size: @font-size;
	position: relative;
	text-decoration: none;
	&:after{
		position:absolute;
		content:'';
		width:100%;
		height: 100%;
		border-radius: 50%;
		left: 0;
		top: 0;
		border: @border-w solid;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
	}
}
.circle{
	.circle-mixi(145px, 32px);
	@media (max-width: 567px) {
		.circle-mixi(110px, 25px);
	}
}
.circle.big{
	.circle-mixi(170px, 40px);
}
.circle.small{
	.circle-mixi(60px, 20px);
}
.circle-flat-mixi(@circle-size, @font-size){
	display: inline-block;
	text-align: center;
	width: @circle-size;
	height: @circle-size;
	line-height: @circle-size;
	margin: 0 auto;
	border-radius: 50%;
	font-size: @font-size;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	text-decoration: none;
	outline: none;
}
.circle-flat{
	.circle-flat-mixi(200px, 130px);
}