html, body, #options button{
	height: 100%;
}


h2, label, #score, #options button{
	text-transform: uppercase;
}


/*To center these items*/
#title, #options, #reset{
	margin: 0 auto;
}


body{
	font-family: 'Quicksand';
	background-color: #FFFFFF;
	margin: 0;
}


h2{
	color: white;
	text-align: center;
	margin: 0;
	font-weight: normal;
	line-height: 1.1;
	padding: 50px 0;
}


p{
	font-weight: bold;
}


label{
	font-weight: bold;
	letter-spacing: 0.5px;
}


input[type="number"]{
	width: 50px;
}


/*Rounded long squares look like a color palette*/
.square{
	width: 60px;
	padding-bottom: 100px;
	float: left;							/*single row of squares*/
	border-radius: 15%;

	transition: background 0.6s;			/*to fade the square background in 0.6seconds*/
	-webkit-transition: background 0.6s;
	-moz-transition: background 0.6s;
}


#container{
	margin: 0 auto 5% auto; 
	border-top: 2px solid #232323;			
	height: 17%;
}


#rgb{
	font-size: 200%;
}


#score{
	display: inline-block;					/*to stay on the same line as the EASY/HARD buttons and ROUNDS input*/
	width: 30%;
	font-weight: 700;
	letter-spacing: 0.5px;
}

#title{
	display: block;
	width: max-content;						/*width is adjusted to the length of the text. if it is 100% width of body, there will be no space to center this block.*/
	padding-top: 30px;
	padding-bottom: 5px;
	font-weight: 700;
	font-size: 20px;
}


button{
	font-family: 'Quicksand';
	outline: none;
}


#options{
	background-color: white;
	height: 30px;
	text-align: center;
}


#options button{
	border: none;
	background: none;
	font-weight: 700;
	color: #232323;
	letter-spacing: 1px;
	font-size: inherit;
	padding: 0 1px;
	margin: 0 5px;

	transition: all 0.1s;
	-webkit-transition: all 0.3s;	
	-moz-transition: all 0.3s;	
}


#options button:hover{
	border-bottom: 3px solid #232323;
}


#result{
	margin: 0 auto 25px auto;
	color: #232323;
	font-size: 17px;
	text-align: center;
	height: 10px;
}


#reset{
	display: block;
	color: white;
	font-size: 20px;
	padding: 5px 7px;
	border-radius: 6px;
	background-color: #232323;		
}