/* Styling for the train and its carriages */
body{
	background-color: #ceeafb;
}

.pageDiv{
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.train {
display: flex;
flex-wrap: wrap;
}

/* Styling for the options */
.options {
display: flex;
flex-wrap: wrap;
}

.option {
margin: 10px;
padding: 10px 20px;
font-size: 32px;
cursor: pointer;
font-family: Arial;
background-color: white;
}

.option:hover {
background-color: lightgray;
}

/* Styling for the tick and cross symbols */
.tick,
.cross {
font-size: 30px;
}

.tick {
color: green;
}

.cross {
color: red;
}

.hidden{
	display: none;
}

.smokeHolder{
	position:absolute;
	pointer-events: none;
}

.optionsAreas{
	margin-bottom:50px;
}

#numCarriagesInput{
	padding: 10px;
	font-size: 24px;
}

#buildBtn{
	background:white;
	border:none;
	padding:10px;
	font-size:24px;
	cursor: pointer;
}

#buildBtn:hover{
	background-color: lightgray;
}

#resultPane {
  width: 100%;
  text-align: center;
  padding: 50px 0;
}

#resultPane.correct{
	background-color: limeGreen;
}

#resultPane.incorrect{
	background-color: darkred;
	
}