body {
	background-color:#232323;
	margin: 0;
	font-family: "Avenir";
}
h1{
	color:white;
	text-align: center;
	background: steelblue; 
	margin: 0;
	font-weight: normal;
	line-height: 1.1;
	text-transform: uppercase;
	padding: 20px 0;

}
.square{
	width: 30%;
background: purple;
padding-bottom: 30%;
float:left;
margin:1.66%;
border-radius: 15%;
transition: 0.6s;
--webkit-transition: background 0.6s;
--moz-transition:background 0.6s;
}

#colorDisplay {
font-size: 200%;
}


#container{
	max-width: 600px;
margin: 20px auto;
}
span {
	
}
#stripe { 
background: white;
height: 30px;
text-align: center;
color: black;
 }

 .selected {
 color:white;
	background: steelblue

 }
button {
	border:none ;
	background: none;
	text-transform: uppercase;
	height: 100%;
	font-weight: 700;
	color:steelblue;
	letter-spacing: 1px;
	font-size: inherit;
	transition: all 0.3s;
	--webkit-transition: all 0.3s;
    --moz-transition:all 0.3s;
    outline: none;

}


#message {
	display: inline-block;
	width: 20%;
}
button:hover {
	color:white;
	background: steelblue
}