body {
		background-image: url(./images/starfield.jpg);
		width:100%;
}


.buttonbar {
	display:inline-block;
	padding: 20px;
}

.mode {
	position:relative;
	float:left;
	width:10%;
}

#auto_button, #autogrey_button {
	margin-left: 2.5%;
	outline: none;
}

#manual_button, #manualgrey_button {
		margin-left: 1%;
		outline: none;
}


.speed {
	position:relative;
	margin-top:1.5%;
	width:10%;
}

#slower_button{
	margin-left:2%;
	outline: none;
}

#faster_button{
	margin-left:0.6%;
	outline: none;
}

.harmony {
	float:right;
	width:20%;

}

#major_button, #majorgrey_button{
	margin-right: 1.5%;
	outline: none;
}
#minor_button, #minorgrey_button{
	margin-right: -0.5%;
	outline: none;
}





.speed:active {
  -webkit-transform:scale(1.25); /* Safari and Chrome */
	-ms-transform:scale(1.25);
	-moz-transform:scale(1.25);
	transform: scale(1.25);
}


.imgbutton:not(.hidden), .imgbutton:hover {
	border-radius: 50%;
	transition: box-shadow 0.3s ease;
}
#major_button, #majorgrey_button:hover {
	box-shadow: 0 0 5px 5px MediumPurple;
}
#minor_button, #minorgrey_button:hover {
	box-shadow: 0 0 5px 5px MediumPurple;
}

#manual_button, #manualgrey_button:hover {
	box-shadow: 0 0 5px 5px CornflowerBlue;
}
#auto_button, #autogrey_button:hover {
	box-shadow: 0 0 5px 5px CornflowerBlue;
}


.hidden {
	display: none;
}

/* .watermark {
	position: fixed;
	width: 30%;
	bottom: -8%;
	left:34%;
} */