.pendulum { /* Pendulum styling. */
	border-left: 45px solid transparent;
	border-radius: 25px;
	border-right: 45px solid transparent;
	border-top: 120px solid #4d3391;
	height: 0;
	position: relative;
	width: 0;
}

.yes { /* Pendulum says yes. */
	margin: auto;
}

.no { /* Pendulum says no. */
	animation: nope .1s linear 0s infinite normal;
	margin: auto;
}

@keyframes nope { /* Animation for no. */
	0%	{transform: rotate(-5deg);}
	50%	{transform: rotate(5deg);}
	100%	{transform: rotate(-5deg);}
}

.maybe { /* Pendulum says maybe. */
	animation: couldbe 3s linear 0s infinite normal;
}

@keyframes couldbe { /* Animation for maybe. */
	0%	{transform: rotate(10deg); left: 0; top: 0;}
	25%	{transform: rotate(0); left: calc(50% - 45px); top: 20px;}
	50%	{transform: rotate(-10deg); left: calc(100% - 90px); top: 0;}
	75%	{transform: rotate(0); left: calc(50% - 45px); top: 20px;}
	100%	{transform: rotate(10deg); left: 0; top: 0;}
}

.dunno { /* Pendulum doesn’t know. */
	animation: shrug 3.5s linear 0s infinite normal;
}

@keyframes shrug { /* Animation for dunno. */
	0%	{transform: scale(1, 1); left: 0;}
	25%	{transform: scale(.85, .85); left: calc(50% - 45px);}
	50%	{transform: scale(1, 1); left: calc(100% - 90px);}
	75%	{transform: scale(1.15, 1.15); left: calc(50% - 45px);}
	100%	{transform: scale(1, 1); left: 0;}
}
