#new-game #top-slideshow{
	display: flex;
	flex-wrap: wrap;
	margin-top: 2rem;
	align-items: center;
	justify-content: space-between;
	}
#new-game #top-slideshow .mini-audio-player-wrapper img{ margin-top: 0; }


#new-game .opening-text{
	font-size: 1.15rem;
	}

/* TITLE ----------------------------- */
#new-game .number-title{
    display: grid;
    grid-template-columns: min-content auto;
    grid-gap: 0 .75rem;
	margin: 4rem 0 0 0;
	align-items: center;
	}
#new-game .number-title:first-of-type { margin-top: 4rem; }	

#new-game .number-title h3{
	padding-top: .5rem;
	}
#new-game .number-title .number{
	background-color: var(--asu-maroon);
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    display: grid;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: bold;
    font-size: 2rem;
    line-height: 3rem;
	}
#new-game .number-title .content{
	grid-column: 1/3;
	}	

/* SELECT MENTOR ----------------------- */
#new-game #mentor-select{
	display: flex;
	flex-wrap: wrap;
    margin: 1.5rem 0;
    justify-content: center;
    grid-gap: 1.5rem;
	}
#new-game #mentor-select img{
	cursor: pointer;
	border-radius: .5em;
	padding: .4rem .4rem .2rem .4rem;
	width: 9rem;
	border-radius: 1rem;
	}
#new-game #mentor-select .mentor-preview{
	display: grid;
	text-align: center;
	font-weight: bold;
	border-radius: .5rem;
	}

#new-game #mentor-select .mentor-preview:hover {	outline: 5px solid #ccc; }		
#new-game #mentor-select .mentor-preview.active { outline: 5px solid var(--asu-maroon); }		


#mentor-selection-feedback .character-message-wrapper {
	margin-bottom: 0;
	padding-bottom: 0;
	}

/* PLAYER NAME --------------------------- */ 
#new-game #player-name-wrapper{ margin-bottom: 4rem; }

#new-game input#player-name {
	font-size: 1.3rem;
	padding: .5rem;
	margin: .5rem 0;
	width: 100%;
    max-width: 20rem;
	}

/* PLAYED BEFORE */
#new-game .radio-wrapper.content{ margin: 0; }


#new-game #pre-quiz-radio-wrapper.radio-wrapper.content { margin-bottom: 4em; }


@media print, (min-width:420px) {
	#new-game #hero-select {
	    margin: 2.5rem 2rem;
	    grid-gap: 2rem 1.5rem;
	}
	#new-game .number-title .content{
		grid-column: 2/3;
	}	
}