.art-btn {
	position: relative;
	display: flex;
	align-items: center;
	text-decoration: none;
	cursor: pointer;
	outline: none;
	overflow: hidden;
	transition: color 0.3s 0.1s ease-out;
	text-align: center;
}
.art-btn:nth-child(odd) {
	background: var(--btn-primary-bg-colour);
	color: var(--btn-primary-txt-colour);
	border: 2px solid var(--btn-primary-border-colour);
}
.art-btn:nth-child(odd):hover {
	background: var(--btn-primary-bg-colour-hover);
	color: var(--btn-primary-txt-colour-hover);
	border: 2px solid var(--btn-primary-border-colour-hover);
}
.art-btn:nth-child(even) {
	background: var(--btn-secondary-bg-colour);
	color: var(--btn-secondary-txt-colour);
	border: 2px solid var(--btn-secondary-border-colour);
}
.art-btn:nth-child(even):hover {
	background: var(--btn-secondary-bg-colour-hover);
	color: var(--btn-secondary-txt-colour-hover);
	border: 2px solid var(--btn-secondary-border-colour-hover);
}
.art-btn::before {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	content: '';
	border-radius: 50%;
	display: block;
	width: 20em;
	height: 20em;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -5%);
	text-align: center;
	transition: box-shadow 0.8s cubic-bezier(0.18, 0.89, 0.32, 1.28);
	z-index: -1;
}
.art-btn:nth-child(odd):hover::before {
	box-shadow: inset 0 0 0 10em var(--btn-primary-bg-colour-hover);
}
.art-btn:nth-child(even):hover::before {
	box-shadow: inset 0 0 0 10em var(--btn-secondary-bg-colour-hover);
}