/*****************/
/*** VARIABLES ***/
/*****************/

:root
{
	--backcol: #111;
	--textcol: #eee;
}


/*******************/
/*** INPUT FORMS ***/
/*******************/

fieldset
{
	border-radius: 0.25rem;
	border: 4px solid red;
	background: var(--backcol);
	padding: 0.5rem;
}

legend
{
	color: yellow;
	padding: 0.25rem 0.5rem;
	background-color: var(--backcol);
	border-radius: 0.25rem;
}

input
{
	font-size: 1rem;
	padding: 0.25rem 0.5rem;
	min-width: 50%;
	text-transform: uppercase;
	outline: none;
	background-color: var(--backcol);
	color: var(--textcol);
}

/*********************/
/*** MISCELLANEOUS ***/
/*********************/

div.responses
{
	border-radius: 0.25rem;
	padding: 0.5rem;
	text-align: center;
	background-color: var(--backcol);
	color: var(--textcol);
	width: 100%;
	border: 4px solid lime;
}

div.location
{
	border-radius: 0.25rem;
	padding: 0.5rem;
	background-color: var(--backcol);
	color: var(--textcol);
	width: 90%;
	border: 4px solid magenta;
	margin: 1rem 0;
}

div.modes
{
	font-size: 75%;
	text-align: right;
	border-bottom: white;
	color: #999;
}

div.description
{
	margin: 0.5rem 0;
}

div.exititems
{
	margin: 0 2rem 1rem;
	background-color: rgba(255,255,255,0.35);
	padding: 0 1rem;
	border-radius: 0.5rem;
	border: 1px solid white;
	font-size: 85%;
}

div.command
{
	width: 100%;
}

p
{
	margin: 1rem 0;
}

span.commandtext
{
	font-family: sans-serif;
	color: cyan;
	text-transform: uppercase;
}

span.exits
{
	color: lime;
	text-transform: uppercase;
}

span.floatingnoun
{
	color: yellow;
}

span.dirtext
{
	color: lime;
	text-transform: uppercase;
}

span.answertext
{
	color: red;
	text-transform:uppercase;
}