Template:Xiangqi diagram/qi.css

.xiangqi-pX {
	position: absolute;
	width: 100px;
	height: 100px;
	background-color: #e00;
	clip-path: polygon(20% 27%, 43% 50%, 20% 73%, 27% 80%, 50% 57%, 73% 80%, 80% 73%, 57% 50%, 80% 27%, 73% 20%, 50% 43%, 27% 20%);
}

.xiangqi-pD {
	position: absolute;
	width: 100px;
	height: 100px;
	background-color: #0d0;
	clip-path: circle(13%);
}

.xiangqi-pR {
	position: absolute;
	width: 100px;
	height: 100px;
	background-color: #0d0;
	clip-path: polygon(0% 80%, 0% 100%, 100% 100%, 100% 0%, 0% 0%, 0% 20%, 7% 20%, 7% 7%, 20% 7%, 20% 0%, 80% 0%, 80% 7%, 93% 7%, 93% 20%, 100% 20%, 100% 80%, 93% 80%, 93% 93%, 80% 93%, 80% 100%, 20% 100%, 20% 93%, 7% 93%, 7% 80%);
}

.xiangqi-aB {
	position: absolute;
	height: 100px;
	transform-origin: 50px 50px;
}

.xiangqi-aL {
	position: absolute;
	left: 50px;
	top: 43.75px;
	height: 12.5px;
	background-color: #0d0;
}

.xiangqi-aH {
	position: absolute;
	top: 25px;
	width: 0px;
	height: 0px;
	border: 25px solid transparent;
	border-left-color: #0d0;
	border-left-width: 50px;
}