//BUTTONS

button { border: 0 none; }

button.demo {
	background-color: @key;
	border-top: 1px solid @keylight;
	border-bottom: 1px solid @transblack;
	.box-shadow(
		inset 0 0 20px 5px @transblack, 
		inset 0 0 0 0 @keylight,
		0 2px 4px 0 @lightblack);
	text-shadow: -1px -1px 0 black, 1px 1px 0 @keylight;

	color: white;
	
	.slowtrans;

	i { 
		color: @key;
		font-size: 85px;
		text-shadow: 0 0 0 transparent;
		vertical-align: bottom;
		position: relative;
			top: -11px;
	}

}
	button.demo:hover {
//		background-color: @keylight;
		.box-shadow(
			inset 0 0 20px 5px @transblack, 
			inset 0px 10px 50px 0 fadeout(@keylight, 70%),
			0 2px 4px 0 @lightblack);
		 text-shadow: -1px -1px 0 black, 1px 1px 0 @key;
		
		.slowtrans;

		i {
			color: white;
			text-shadow: 0 0 4px @key;
			.fasttrans;
		}
	}
button.large {
	width: 800px;
	margin: 0 auto;
	height: 100px;
	.border-radius(8px);
	padding-top: 7px;

	font-size: 80px;
	line-height: 100px;
	
}
button.medium {
	.column(5, 8);
	.push(2);
	height: 60px;
	.border-radius(6px);
	margin-top: 20px; 

	font-size: 40px;
	line-height: 60px;

	i { font-size: 50px; top: -6px; }
}
button.green:hover { background-color: @green; .fasttrans; }
button.small {
	.column(2);
	.push(2);
	margin-top: 100px;
	height: 50px;
	.border-radius(6px);
	font-size: 40px;
	line-height: 50px;
}

	button:focus { outline: none; }