thin-icon.less

.thin-icon {
	width: 1em;
	height: 1em;
	position: relative;
	display: inline-block;
	z-index: 1;
	&:before, &:after {
		content: "";
		display: block;
		right: 0;
		top: 50%;
		position: absolute;
	}
}

.thin-icon-close {
	&:before, &:after {
		border-top: 2px solid #999;
		width: 1em;
	}
	&:before {
		.transform( rotate(45deg) );
	}
	&:after {
		.transform( rotate(-45deg) );
	}
}
.thin-icon-left {
	&:before, &:after {
		border-top: 2px solid #999;
		width: 0.7em;
		left: 20%;
	}
	&:before {
		.transform( rotate(45deg) );
		.transform-origin(left, top);
	}
	&:after {
		.transform( rotate(-45deg) );
		.transform-origin(left, bottom);
	}
}
.thin-icon-right {
	&:before, &:after {
		border-top: 2px solid #999;
		width: 0.7em;
		left: 20%;
	}
	&:before {
		.transform( rotate(45deg) );
		.transform-origin(right, bottom);
	}
	&:after {
		.transform( rotate(-45deg) );
		.transform-origin(right, top);
	}
}