

@font-face {
	font-family: belwe;
	font-weight: normal;
	src: url("BelweMediumBT.ttf");
} 
@font-face {
	font-family: belwe;
	font-weight: bold;
	src: url("BelweBoldBT.ttf");
}

@font-face {
	font-family: belwe;
	font-style: italic;
	src: url("Belwe_Italic.ttf");
}

body.vers_font_belwe i { font-weight: bold; letter-spacing: 1px; }

@font-face {
	font-family: belwe_ie;
	font-weight: normal;
	src: url("BelweMediumBT.eot");
} 
@font-face {
	font-family: belwe_ie;
	font-weight: bold;
	src: url("BelweBoldBT.eot");
}


@font-face {
	font-family: ibm;
	src: url("Nouveau_IBM.ttf");
}
@font-face {
	font-family: ibm_ie;
	src: url("Nouveau_IBM.eot");
}


@media (orientation: landscape){
	div#scroller {
		height: 75%;
	}
} 

div#score {
	padding-right: 4%;
}

body {
	background-color: #000000;
	font-family: belwe, Serif;
	font-size: 12pt;
	/* font-weight: bold; */
	/* color: #000000; */
}

body[data-theme="light"] {
	background-color: #ffffff;
	color: #000000;
}

a {
	/* color: #ffffff; */
}

button {
	font-family: belwe, Serif;
	color: #bbbbbb;
	border: 1px solid #888888;
}

div#title {
	padding-left: 4%;
	text-transform: none;
}
a.noun {
	color: inherit;
	cursor: pointer;
}
a.noun:hover {
	text-decoration: underline;
	text-decoration-style: dotted;
}


div#top_bar {
	background-color: #cccccc;
	/* color: #000000; */
}

div#scroller {
	height: 60%;
	background-color: #000000;
	border: 1px solid #888888;
	/* color: #000000; */
	/* line-height: 1.25; */
}
body[data-theme="light"] div#scroller {
	background-color: #ffffff;
	color: #000000;
}
div#scroller a {
	/* background-color: #000000; */
}
div#scroller button {
	/* background-color: #000000; */
}
div#scroller p {
	margin: 0;
	padding: 0;
	/* text-indent: 1em; */
}

span.prompt {
	color: #cccccc;
	text-transform: none;
}
span.old_message {
	color: #bbbbbb;
}
span.old_prompt {
	color: #888888;
	text-transform: none;
}

body[data-theme="light"] span.prompt {
	color: #333333;
	text-transform: none;
}
body[data-theme="light"] span.old_message {
	color: #444444;
}
body[data-theme="light"] span.old_prompt {
	color: #888888;
	text-transform: none;
}

span.treasure {
	color: #ffff00;
}
button:disabled span.treasure {
	color: #888888;
}

div#prompt {
	display: none;
	text-align: center;
}
span#chevron {
	position: relative;
	display: inline-block;
	vertical-align: middle;
}
textarea#text_in {
	position: relative;
	margin-top: 4px;
	border: 1px solid #333;
	display: none;
	color: #ffffff;
	font-family: inherit;
	background-color: #000000;
	font-size: 12pt;
	display: inline-block;
	vertical-align: middle;
	width: 90%;
	overflow-x: hidden;
}
body[data-theme="light"] textarea#text_in {
	background-color: #ffffff;
	color: #000000;
}
button#do_command {
	color: #ffffff;
	background-color: #000000;
	position: relative;
	vertical-align: middle;
	font-family: belwe;
	font-weight: normal;
	border: 1px solid #333333;
	padding: 0px 8px 0px 8px;
	corner-radius: 4px;
}
body[data-theme="light"] button#do_command {
	background-color: #ffffff;
	color: #000000;
}

div#conversation {
	background-color: #ffffff;
	padding: 8px;
	
	display: none;
}
div#conversation_container {
	/* background-color: #ffffff; */
}

div#conversation a {
	/* background-color: #000000 */
}
div#conversation button {
	/* background-color: #000000 */
	color: #000000;
}

div#room_description {
	background-color: #000000;
	display: none;
}
div#room_description_container {
	/* background-color: #cccccc; */
}
div#right-column {
	/* background-color: #cccccc; */
}

div#room_description a {
	/* background-color: #222222; */
}
div#room_description button {
	/* background-color: #222222; */
}
div#room_description span.unavailable_exit {
	/* color: #666666; */
}
div#wait {
	/* background-color: #cccccc; */
}
div#wait a {
	/* background-color: #222222; */
}
div#wait button {
	/* background-color: #222222; */
}

div#holding {
	display: none;
	background-color: #000000;
}
div#holding_container {
	display: none;
	background-color: #000000;
}

div#holding a {
	/* background-color: #222222; */
}
div#holding button {
	/* background-color: #222222; */
}
div#holding ul {
	display: inline-block;
}

div#inventory {
	background-color: #000000;
}
div#inventory_container {
	background-color: #000000;
}
body[data-theme="light"] div#inventory {
	background-color: #ffffff;
	color: #000000;
}
body[data-theme="light"] div#inventory_container {
	background-color: #ffffff;
	color: #000000;
}

div#inventory a {
	/* background-color: #222222; */
}
div#inventory button {
	/* background-color: #222222; */
}

div#save_load_container {
	margin-top: 0px !important;
}
div#save_load_container p {
	margin-top: 0px;
	margin-bottom: 0px;
}

div#save_load a {
	/* background-color: #111111; */
	text-align: center;
	
}
div#save_load button {
	/* background-color: #111111; */
}
body[data-theme="light"] div#save_load button {
	background-color: #eeeeee;
	color: #000000;
}

div#saved_games {
	/* background-color: #111111; */
	/* color: #ffffff; */
}
div#saved_games a {
	/* background-color: #000000; */
}
div#saved_games button {
	/* background-color: #000000; */
}

div#options {
	background-color: #333333;
	color: #ffffff;
}

div#options a {
	/* background-color: #222222; */
}
div#options button {
	background-color: #222222;
}

div#credits {
	background-color: #222222;
	color: #ffffff;
}

div#credits a {
	color: #ccccff
}
div#credits button {
	background-color: #222222;
}



a.button {
	display: inline-block;
	text-decoration: none;
	padding: 0.1cm 0.5cm 0.1cm 0.5cm !important; */
	border-radius: 0.25cm;
	border: 0px;
	margin: 2px;
	white-space: nowrap;
}

/*
ul.room_contents_in_scroller {
	display: inline;
}
ul.room_contents_in_scroller li {
	display: inline;
}
*/

div#splashscreen {
	width: 99%;
	height: 100%;
	position: absolute;
	top: 0;
	background-color: #000000;
	text-align: center;
}

div#splashscreen img {
	max-height: 70%;
}
div#splashscreen button {
	/* background-color: #cccccc; */
	color: #000000;
	margin: 12px;
	border: 1px solid #222222;
}
div#splashscreen a {
	
}

img#grue_title {
	max-width: 90%;
	margin: 0px;
	top: 0;
}

h2.hints {
	text-align: center;
	margin-top: 3em;
}

div.hintsGroup {
	text-align: center;
	margin-bottom: 8px;
	border-bottom: 1px solid #888888;
}

div.hintsGroupTitle {
	text-transform: uppercase;
	font-size:16pt;
	/* color: #222222; */
}

div.hintsGroup button {
	/* background-color: #444444; */
}



.fade-in {
animation: fadeIn ease 20s;
-webkit-animation: fadeIn ease 20s;
-moz-animation: fadeIn ease 20s;
-o-animation: fadeIn ease 20s;
-ms-animation: fadeIn ease 20s;
}
@keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

@-moz-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

@-webkit-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

@-o-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}

@-ms-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}




div#hints {
	border: 1px solid #cccccc;
	display: none;
	border-collapse: always;
	top: 0;
	left: 0;
	overflow-x: hidden;
	overflow-y: auto;
	background-color: #000000;
	text-align: center;
	padding: 8px;
}
div#hint_groups {
	height: 60%;
	overflow-x: hidden;
	overflow-y: auto;
	padding-right: 8px;
}
div#hints button {
	background-color: #000000;
	font-size: 12pt;
	vertical-align: middle;
}
div#hints button#hints_title_hide {
	background-color: #cccccc;
	color: #000000;
}

div#hints_title {
	border: 0px;
	font-size: 24pt;
}
div#hints div#hints_preamble {
	margin: 1em auto 4px auto;
	border: 1px solid #cccccc;
	border-radius: 0.25cm;
	padding: 8px;
	background-color: #000000;
}

div.hint_group {
	margin-top: 1em;
	border: 1px solid #cccccc;
	border-radius: 0.25cm;
	padding: 4px; 8px 4px 8px;
	background-color: #333333;
}

span.hint_title {
	font-size: 14pt;
}

div#hints div.hint_step {
	display: none;
}

div#hints button.show_hint {
	background-color: #999999;
	color: #000000;
}
div#hints button.hide_hint_title {
	display: none;
}

div#hints button.done_hint {
	background-color: #999999;
	color: #000000;
	font-size: 11pt;
}

div#hints button.next_hint {
	font-size: 11pt;
}

div#hints button#hide_hints {
	margin-top: 1em;
	background-color: #cccccc;
	color: #000000;
}

body[data-theme="light"] div#hints {
	border: 1px solid #333333;
	background-color: #ffffff;
}
body[data-theme="light"] div#hints button {
	background-color: #ffffff;
}
body[data-theme="light"] div#hints button#hints_title_hide {
	background-color: #333333;
	color: #ffffff;
}
body[data-theme="light"] div#hints div#hints_preamble {
	background-color: #ffffff;
}
body[data-theme="light"] div.hint_group {
	border: 1px solid #333333;
	background-color: #cccccc;
}
body[data-theme="light"] div#hints button.show_hint {
	background-color: #666666;
	color: #ffffff;
}
body[data-theme="light"] div#hints button.done_hint {
	background-color: #666666;
	color: #ffffff;
}
body[data-theme="light"] div#hints button#hide_hints {
	background-color: #333333;
	color: #ffffff;
}
body[data-theme="light"] div#hints button.next_hint {
	color: #000000;
}



div.save_prompt {
	display: none;
	text-align: center;
	margin: 2px;
	padding: 8px;
	background-color: #333333;
}
div.save_prompt button {
	color: #000000;
}
div.restart_prompt {
	display: none;
	text-align: center;
	margin: 2px;
	padding: 8px;
	background-color: #333333;
}
div.restart_prompt button {
	color: #000000;
}
input#save_name {
	width: 40%;
	font-family: inherit;
	font-size: inherit;
}
#saved_games button.confirm_delete {
	background-color: #cccccc;
	color: #000000;
	display: none;
}

body[data-theme="light"] div.save_prompt {
	background-color: #cccccc;
	color: #000000;
}
body[data-theme="light"] div.save_prompt button {
	color: #000000;
}
body[data-theme="light"] div.restart_prompt {
	background-color: #cccccc;
}
body[data-theme="light"] div.restart_prompt button {
	color: #ffffff;
}
body[data-theme="light"] #saved_games button.confirm_delete {
	background-color: #333333;
	color: #ffffff;
	display: none;
};
