/*ARROWS*/
/*copyright 2021 Roy Bryan*/


.b-up::before, .b-right::before, .b-down::before, .b-left::before, .a-up::after, .a-right::after, .a-down:after, .a-left::after{
	content: "";
	height: 0px;
	width: 0px;
	position: absolute;
	z-index: 3;
	transition-duration: 0.2s;
}
.b-up::before, .b-down::before, .a-up::after, .a-down::after{
	right: calc(50%+1em);
	border-right: .33em solid transparent;
	border-left: .33em solid transparent;
}
.b-right::before, .b-left::before, .a-right::after, .a-left::after{
	bottom: calc(50%+1em);
	border-top: .33em solid transparent;
	border-bottom: .33em solid transparent;
}
.b-up::before, .a-up::after{
	top: -5%;
	border-bottom: .33em solid #000;
}
.b-right::before, .a-right::after{
	right: -5%;
	border-left: .33em solid #000;
}
.b-down::before, .a-down::after{
	bottom: -5%;
	border-top: .33em solid #000;
}
.b-left::before, .a-left::after{
	left: -5%;
	border-right: .33em solid #000;
}
.shrink::after, .shrink::before{
	transform: scale(0);
}