/* Collision Imminent! Website Stylesheet */
/* (c) 2000-2015, by the Imagineerium(tm) Team, all rights reserved. */

html {
	font: 100% Geneva;
	padding: 0;
}

/* 
	Here's for when we display this on the web 
*/
@media screen {
	html {
		margin: 2em;
	}

	article, footer, header, nav {
		display: block;
	}
	
	article {
		float: right;
		margin: 0.5em 0 0.5em 0;
		width: 79%;
	}
	
	footer {
		clear: both;
	}
	
	header {
		margin: -1em 0 0 0;
	}
	
	header img.logo {
		max-height: 90px;
	}
	
	header table.headerTable {
		border: 0;
		margin: 0;
		min-width: 100%;
		padding: 0;
	}
	
	header table.headerTable td {
		border: 0;
	}
	
	header table.headerTable td.logo {
		width: 18%;
	}
	
	header table.headerTable p {
		margin: 0;
		padding: 0;
		text-align: center;
	}
	
	header table.headerTable p.title {
		color: blue;
		font-size: 400%;
		font-weight: bold;
		text-shadow: 2px 2px 2px #2792be;
	}
	
	nav {
		float: left;
		margin: 1em 0 0.5em 0;
		width: 18%;
	}
	
	nav a {
		text-decoration: none;
	}
	
	nav ul.menu {
		background-color: rgba(0, 127, 255, 0.1); /* blue; */
		/* border: 2px solid blue; */ /* #1365bb; */
		border: 3px double blue;  /* #1365bb; */
		list-style-type: none;
		margin: 0;
		padding: 0;
		text-align: left;
		
		/*
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		*/
		/*
		-moz-box-shadow: 0px 0px 5px #00ccff;
		-webkit-box-shadow: 0px 0px 5px #00ccff;
		box-shadow: 0px 0px 5px #00ccff;
		*/
	}
	
	nav ul.menu li {
		border-bottom: 1px solid blue; /* #2792be; */
	}
	
	nav ul.menu li a {
		display: block;
		color: /* blue; */ black; /* white; */
		/* font-weight: bold; */
		padding: 5px;
		text-decoration: none;
	}
	
	nav ul.menu li a:hover {
		background-color: rgba(0, 127, 255, 0.2); /* #2792be; */
	}
	
	nav ul.menu li a:visited {
	}
}

/* 
	Here's for when we need to print the bluesheets. 
*/
@media print {
	html {
		/* 
		For the bluesheets, we can shrink the size of the font to save some
		paper.
		*/
		font-size: 10pt;
		margin: 1em 2em 2em 5em;
	}
	
	/* This takes the whole page. */
	article {
		display: block;
		margin: 0.5em 0 0.5em 0;
	}
	
	footer {
		clear: both;
		display: block;
	}
	
	/* This just disappears. */
	header {
		display: none;
	}

	/* This just disappears. */
	nav {
		display: none;
	}
}

/*
	This is the common formatting.
*/
body {
	margin: 0;
	padding: 0;
}

div.mainPageBlurb {
	margin: 0;
	padding: 0 0.25em 0 0.25em;
	text-align: center;
}

div.nextRun {
	background-color: rgba(0, 127, 255, 0.1);
	border: 3px double blue;
	margin: 0.5em 2em 0 2em;
	text-align: center;
}

div.nextRun a:link {
	color: #0000ff;
	text-decoration: none;
}

div.nextRun a:visited {
	color: #0000ff;
}

div.question,
div.salesBlurb {
	border: 3px double blue;
	font-style: italic;
	margin: 0.5em 9em 0 8em;	/* Better lineup */
	padding: 0 1em 0 1em;
}

div.question {
	background-color: rgba(0, 127, 255, 0.1);
}

div.salesBlurb {
	text-align: center;
}

footer, h4 {
	border-top: 1px solid black;
	border-left: 1px solid black;
	margin: 0.5em 0 0 0;
	padding: 0.25em;
}

footer {
	font-size: 100%;
}

h3 {
	font-size: 250%;
	margin-bottom: 0;
	margin-top: 0;
	text-align: center;
}

h4 {
	background: url("Images/favicon-32x32.png") 0.3em 0em no-repeat;
	font-size: 125%;
	padding: 4px 0 4px 2em;
	text-align: left;
}

h5 {
	font-size: 150%;
	margin-bottom: 0;
	margin-top: 0;
	text-align: center;
}

img.shipLayout {
	float: right;
	margin: 0.5em 0 0.5em 2em;
}

span.alert {
	color: #ff0033;
	font-size: 150%;
}

span.computer {
	color: #99cc99;
	font-size: 150%;
	font-style: italic;
}

span.crew {
	color: #669999;
	font-size: 125%;
	font-weight: bold;
}

span.answerer {
	font-size: 125%;
	font-weight: bold;
}

span.crewName,
span.evacuationStep,
span.GMRole,
span.planetName {
	font-size: 150%;
	font-weight: bold;
}

span.passenger1 {
	color: #3300cc;
	font-size: 75%;
	font-weight: normal;
}

span.passenger2 {
	color: #cc6666;
	font-size: 100%;
	font-style: italic;
	font-weight: normal;
}

span.salesTitle {
	color: #000099;
	font-size: 300%;
	font-style: italic;
	font-weight: normal;
}

table {
	border-bottom: 1px solid black;
	border-right: 1px solid black;
	margin: 0.5em 0;
	margin-bottom: 1em;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1em;
	min-width: 75%;
	padding: 0;
}

table.howILikeToPlayIIITable {
	border-bottom: 0;
	border-right: 0;
}

table.howILikeToPlayIIITable td {
	border-top: 0;
	border-left: 0;
}

td.author,
td.castRole,
td.facilitator {
	background: url("Images/favicon-16x16.png") 0.3em 0.4em no-repeat;
	padding: 4px 0 4px 1.5em;
}

td.mostLikeToPlay,
td.willingToPlay {
	text-align: center;
}

td {
	border-top: 1px solid black;
	border-left: 1px solid black;
	padding: 5px;
}

tr.evenRow {
	background-color: rgba(0, 127, 255, 0.1);
}

tr.headerRow {
	background-color: rgba(0, 0, 255, 0.8); /* blue; */
	color: white;
	font-weight: bold;
}

tr.oddRow {
}

ul.answerList,
ul.crewList,
ul.itinerary {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

ul.answerList li.answer,
ul.crewList li.crewMember,
ul.itinerary li.itineraryStop {
    background-image: url("Images/favicon-32x32.png");
    background-repeat: no-repeat;
    background-position: 0px top; 
    padding-left: 36px; 
}
