/* button */
.dem-button[class]{
	font-weight: bold;
	text-shadow: -1px -1px #000;
	padding: .8em 2em;
	background-color: var(--dem-button-bg, #000);
	background-image: linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%), radial-gradient(190% 100% at 50% 0%, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 50%, rgba(0,0,0,0) 50%);
	background-repeat: no-repeat;
	background-size: 200% 100%, auto;
	background-position: 200% 0, 0 0;
	box-shadow: rgba(0,0,0,.3) 0 2px 5px;
	color: var(--dem-button-color, #fff);
}

.dem-button[class]:active {
	top: 1px;
	box-shadow: none;
}

.dem-button[class]:hover {
	transition: background .5s linear;
	background-color: var(--dem-button-hover-bg, var(--dem-button-bg, #000));
	background-position: -200% 0, 0 0;
	color: var(--dem-button-hover-color, var(--dem-button-color, #fff));
}
.dem-button[class]:visited{ color:var(--dem-button-color, #fff); }