.bit {
	position: relative;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	vertical-align: middle;
	color: $text-color;
	text-decoration: none;
	background-color: $co-gray-80;

	@include bitSize();

	@if $useBorderRadius { border-radius: $border-radius-1;}
}

.bit-ribbon {
	position: absolute;
	overflow: visible;

	&:after,
	&:before {
		content:"";
		display: block;
		position: absolute;
		width: 6px;
		height: 6px;
		border: 3px solid;
	}

	&-bottom-right {
		bottom: $sp-4;
		right: -6px;
		border-bottom-right-radius: 0;
		&:before {
			z-index: 1;
			top: 100%;
			right: 0;
			border-color: inherit;
			border-bottom-color: transparent;
			border-right-color: transparent;
		}
		&:after {
			z-index: 2;
			top: 100%;
			right: -1px;
			border-color: rgba(#000, .2);
			border-bottom-color: transparent;
			border-right-color: transparent;
		}
	}
}