@page { 
    size: auto;
    margin: 1.5cm 1cm 2cm 1cm; 
	} 

body{
	-webkit-print-color-adjust: exact !important;
	print-color-adjust: exact; 
	line-height: 1.25;
	}

.button-wrapper, .split-button-wrapper{ display: none; }
.print-only{ display: block !important; }
.no-print, #header-wrapper{ display: none !important; }
#back-to-top{ display: none !important; }

#header-wrapper{
	display: none;
	}


button, button:hover, button.red, button.red:hover {
	background-color: transparent;
	font-weight: bold;
	color: #000;
	padding: 0;
	transform: scale(1);
	}


/* link formatting */ 
footer a::after { 
	content: " (" attr(href) ") "; }
a:link, a:visited, a:hover, .link, .link:hover {
	font-weight: normal;
	color: #000;
	}	
footer a:link, footer a:visited {
	font-weight: normal;
	text-decoration: none;
	font-size: .85rem;
	}		

.top-message-wrapper{
	display: none;
	}
#inner-wrapper{ margin:0; }
.max-width{ 
	padding: 0;
	}


h1{ 
	padding:  0;
	margin: 0;
	font-size: 2rem; 
	font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
	letter-spacing: normal;
    word-spacing: normal;
    font-weight: normal;
	}
h1 + .img-right-wrapper {
	margin-top: 1rem;
	}	
h2 {
	font-size: 1.6rem;
    padding: .75rem 0 0.15rem 0;
	}
h1 + h2 {
    padding-top: 1.5rem;
	}	
p + h2, ul + h2, .img-right-wrapper + h2{
	padding-top: 1rem;
	}	
ul { margin: 0.5rem 0 0.5rem 1rem; }
li{	padding: .15rem 0; }

hr{ font-size: 1.5rem; }

hr.dotted{
	margin: 1rem 0 1rem 0;
	}

.img-right-wrapper{
	grid-template-columns: 1.5fr 1fr;
	grid-gap: 2rem;
	}
.img-right-wrapper.medium{
	grid-template-columns: 3.5fr 1fr;
	grid-gap: 2rem;
	}


/* FOOTER */ 
footer{
	margin: 2rem 0 0 0;
	}
footer li{
	padding:0;
	line-height: 1rem;
	}
footer.max-width{
	padding-top: .5rem;
	font-size: .9rem;
	margin: 1rem 0 0 0;
	}	
/* last link (About the game) isn't shown because of relative path. This removes last pipe */ 	
footer li:nth-last-child(2)::after{
	content: '';
	}

.toggle-box{ display: none; }
.toggle-box.show{ display: block; }

.toggle-title {
	background-color: transparent;
	padding: 1rem 0 0 0;
	color: #000;
	}
.toggle-title:hover{
	background-color: transparent;
	}	
.toggle-box.show .arrow{
	background-image: none;
	}	
.toggle-box .toggle-content-wrapper{
	border: none;
	padding: 0;
	}

/* HOME -------------------- */
#home-title {
    font-size: 3rem;
    line-height: 3rem;
    margin: 0;
    padding: 0;
    }
.banner {
	background-color: transparent;
    margin: 1rem;
    }    
.main-icons {
	grid-gap: 0;

	}
.main-icons > div {
	width: 170px;
	}
.main-icons > div img {
	width: 50%;
	margin-bottom: 0;
	}

/* INTRO & HOW TO PLAY --------------------- */
.icon-grid {
    grid-template-columns: 2.25rem auto;
    grid-gap: 1.5rem .75rem;
	}
.item-info-grid{
	grid-template-columns: 5rem auto;	
	break-inside: avoid;
	margin-top: .5rem;
	grid-gap: 1.5rem;
	}	

#interface-title, #game-world-title, #buttons-title{
	padding: 2rem 0 0 0;
	}
.img-center-wrapper{
	padding: 1rem 0 0 0;
	}	 
.img-center-wrapper{
	width: 70%;
	display: block;
	margin: 0 auto;
	}	

/* GAME MENU ------------------------ */
.play-menu-new-game{
	margin: 0;
	}
#saved-games-section {
    margin-top: 1.5rem;
	}
#saved-games-wrapper {
    grid-gap: 1rem;
    grid-template-columns: repeat(3, 1fr);
	}
#delete-all-wrapper{ display:none; }
#saved-games-wrapper .saved-game {
	box-shadow: none;
	border: 2px solid #ccc;
	border-radius: .75rem;
	margin-top: 3.5rem;
	padding-bottom: 1.5rem;
	font-size: .95rem;
	break-inside: avoid;
	} 
.saved-game .character-detail-wrapper, .saved-game .character-detail-wrapper, .saved-game .player-detail-wrapper, .saved-game .progress-label{
	color: #000;
	}	
.continue-button{
	display: none;
	}
.saved-game .hero-name { margin: 0 }	
.saved-game .img-wrapper {
    top: -3.25rem;
    border: 3px solid #ccc;
    width: 5.5rem;
    height: 5.5rem;
    }	
.saved-game .progress {
	height: 1.25rem;
	margin: 0;
	} 
.saved-game .score-wrapper{
	padding: .5rem;
	}	   
.saved-game .score-wrapper .game-complete {
    padding: 0.25rem 0;
    }    
.saved-game .score-wrapper .game-complete {
    font-size: 1.15rem;
    }    
.saved-game .score-wrapper .score {
    font-size: 1.3rem;
    }    


/* NEW GAME --------------------------- */
#new-game .number-title{
    margin: 2rem 0 0 0;
	}
#new-game .number-title:first-of-type{
	margin-top: 2rem;
	}	
#new-game input#player-name {
    font-size: 1.1rem;
    }	
#new-game #hero-select{
	grid-gap: 0;
	margin: .5rem 0 1rem 0;
	}
#new-game #hero-select img {
    width: 5rem;	    
	}


/* GAME ----------------------- */
#preloader-slides{
	background-color: transparent;
	}	

#message-panel .next,
#message-panel .close-wrapper, #feedback-panel .close-wrapper, #world-tips-panel .close-wrapper{
	display: none;
	}
#message-panel .close-wrapper, #feedback-panel .close-wrapper, #world-tips-panel .close-wrapper {
	padding: 0;
	}
#message-panel .title {
    padding: 0 0 .75rem 0;
    font-size: 1.5rem;
	}	
#message-panel .content{
	padding: 0;
	grid-template-columns: 1fr 4fr;
	font-size: 1.15rem;
	}
#message-panel .content p{
	padding: .5rem 0;
	}	
#message-panel button.achievements, #message-panel button.summary,
#message-panel button.achievements:hover, #message-panel button.summary:hover {
	background-color: transparent;
	}


#additional-content .toggle-box {
	margin-top: 2rem;
    border-top: 2px dotted #ccc;
	}
#additional-content .toggle-content-wrapper{
	padding: 1rem 0 0 0;
	font-size: 1rem;
	}

#feedback-panel {
    padding-top: 0;
	}
#feedback-panel .item-wrapper {
    padding: 1rem 0;
    }	
#feedback-panel .item-wrapper:first-child {
 	border: none;
	}
#feedback-panel .feedback-wrapper-img .title {
	padding: 0 0 .5rem 0;
    font-size: 1.5rem;
    }	
#feedback-panel .feedback-content {
    font-size: 1rem;
    line-height: 1.25rem;
	}        
#feedback-panel .feedback-wrapper-img{
	margin-top: 0;
	break-inside: avoid;
	grid-template-columns: 5fr 1fr;
	}
#feedback-panel .score-points{
	margin-top: 1rem;
	}
#feedback-panel .score-points img{
	animation: none;
	width: 2rem;
	}

.panel .content{
	padding: 0;
	background-color: transparent;
	}
.panel .content h2 {
	font-weight: normal;
	color: #000;
	font-size: 1.4rem;
	}
.panel .close-icon{
	display: none;
	}
.panel .heading{
	color: var(--asu-maroon);
	font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
	letter-spacing: normal;
    word-spacing: normal;
	padding: 0 0 1.5rem 0;
	background-color: transparent;
	text-transform: none;
	}
.panel .block{
	padding: 0;
	}



.progress-block-wrapper {
	font-weight: normal;
	color: #000;
	}	
.progress-block-wrapper .progress {
    height: 1rem;
    margin-top: 0.25rem;
	}

#profile-panel .content > div {margin-top: 2rem;}
#profile-panel .quest-content {
    padding: .5rem 0 0 0;
    font-size: 1rem;
    margin-bottom: 1.5rem;
	}
#profile-panel.panel .block.current-quest-content{ padding: .5rem 0 0 0; }	
#profile-panel .item-content, #profile-panel .block.expertise-content{
	padding: .5rem 0 0 0;
	}
#profile-panel .item-content{ padding-top: .5rem; }
#profile-panel .item-content img{ width: 3rem;}
#profile-panel .badge-wrapper img{ width:3rem;}
#profile-panel .item-content .title { margin-bottom: 0}



#weather-panel #day-feedback-wrapper {
	margin-top: 0;
	}	
#weather-panel #units-wrapper{
	display: none;
	}	
#weather-panel #temperature-graph-wrapper img{
	margin: 0;
	}	


#city-map-panel #key-wrapper, 
#city-map-panel #compass-wrapper{ 
	padding: 0; 
	margin: 0 0 1rem 0; 
	}
#city-map-panel #current-scene-wrapper {
    padding: 1rem 0 0 0;
    border-top: 2px solid #ccc;
    border-bottom: none;
	border-radius: 0;
	font-size: 1rem;
	}
#city-map-panel #map-wrapper {
    padding: .5rem 0 0 0;
    margin: 0 2rem;
	}
#city-map-panel #city-map-compass {
    width: 10%;
    top: 5rem;
    left: 6rem;
    }	
#city-map-panel #mini-maps img {
    width: 80%;
    display: block;
    margin: 0 auto;
	}
#city-map-panel #compass-wrapper img { max-width: 4rem; }
#city-map-panel #key-wrapper { grid-template-columns: 2rem auto; }
 

#achievements-panel ul.inline-menu{ display:none; }
#achievements-panel .progress-block-wrapper{ padding: 0; }
#achievements-panel .level-badge-wrapper{padding: 1rem 0; }
#achievements-panel .toggle-box{
	display: block;
	break-inside: avoid;
	}
#achievements-panel.panel .toggle-title {
    background-color: transparent;
    padding: 0 0 .25rem 0;
    font-size: 1.15rem;
    background-image: none;
	}
#achievements-panel.panel .toggle-box .toggle-content-wrapper{
	display: block;
	}
#achievements-panel .achievement-block{
	margin-top: 1rem;
	break-inside: avoid;
	}	
#achievements-panel .achievement-block img {
    width: 8rem;
    border-radius: .75rem;
	}
#achievements-panel .badge-wrapper{ padding: 1rem 0; }
#achievements-panel .badge-wrapper img { width: 4rem; }

#world-tips-panel .content {
	padding: 0;
	background-color: transparent;
	}	
#world-tips-panel .intro-text{
	padding-top: 0;
	}	
#world-tips-panel .world-tip-item {
    padding: .5rem 0;
    grid-template-columns: 6rem auto;
	}


#game-summary-wrapper{
	background-color: transparent;
	padding: 0;
	}
#game-summary .progress-block-wrapper{
	font-size: 1rem;
	}
#game-summary #game-details{
	padding: 0;
	margin-bottom: 1.5rem;
	}    
#game-summary .badge-wrapper img { width: 2rem; }	
#game-summary #game-details > div {
	padding: .25rem 0 0 0;
	line-height: 1.25rem;
	}  
#game-summary > #score-section-wrapper .level-feedback{
	margin-top: 0rem;
	font-size: .9rem;
	}

#game-summary > h2{
	color: #000;
	font-weight: normal;
	font-size: 1.2rem;
	}
#game-summary > #score-section-wrapper h3 {
	font-size: 1.1rem;
	margin-bottom: .25rem;
	padding-top: .75rem;
	}

#game-summary > #score-section-wrapper{
    padding: .75rem 0 0 0;
    }		
#game-summary > #score-section-wrapper .progress-block-wrapper .feedback{
	font-size: .9rem;
	} 
#game-summary > #score-section-wrapper .progress-block-wrapper .progress {
    height: .8rem;
    }	
#game-summary #score-section-wrapper .progress-details {
    font-size: .9rem;
    line-height: 1rem;
	}	
#game-summary > #score-section-wrapper > div {
    padding-bottom: 1.25rem;
	}	

#game-summary .items-found {
    font-size: .9rem;
    line-height: .9rem;
	}



#level-message-panel .save-question-feedback-wrapper{
	padding: 0;
	background-color: transparent;
	}

audio{ display:none; }