/*********************************
general page rules and layout
**********************************/

body {
	font-family: Arial, Helvetica, sans-serif ;
	counter-reset: step;
}
h1 {
	color: black;
	font-size: 24px;
    font-weight: bold;
}
h2 {
	color: black;
	font-size: 20px;
    font-weight: bold;
}
h2 {
	color: black;
	font-size: 16px;
    font-weight: bold;
}
img {
	max-width: 100%;
	width: auto;
	height: auto;
	border: 0;
}

table {
	border-collapse: collapse;
	width: 650px;
};


/* ----------- Start manufacturer_list display ------------ */
.manufacturer_list table {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
}
.manufacturer_list th {
	text-align: center;
	font-size: 20px;
	padding-top: 6px;
	padding-bottom: 6px;
}
.manufacturer_list tr {
	background-color: lightgreen;
	text-align: left;
}
.manufacturer_list tr:nth-child(2) {	/* Quick jump to machine by initial: */
	font-style: italic;
}
.manufacturer_list td {
	padding-top: 6px;
	padding-bottom: 6px;
}
/* ----------- End manufacturer_list display ------------ */


/* ----------- Start machine_list display ------------ */
.machine_list table {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	background-color: lightblue;
	border: none;
}
.machine_list th {
	font-size: 20px;
	text-align: center;
	padding-top: 6px;
	padding-bottom: 6px;
}
.machine_list td {
	padding-top: 6px;
	padding-bottom: 6px;
}
.machine_list tr:nth-child(even){background-color: #f2f2f2;}
.machine_list tr:nth-child(odd){background-color: #ffffff;}
.machine_list tr:nth-child(1) {	/* Manufacturer or Machine (Manufacturer) */
	background-color: lightblue;
	font-weight: bold;
	text-align: center;
}
.machine_list tr:nth-child(2) {	/* Quick jump to machine by initial: */
	background-color: lightblue;
	font-style: italic;
}
.machine_list tr:nth-child(3) {	/* 1 2 3 4 5 6 7 8 9 A B C D E F G H I J K L M N O P Q R S T U V W X Y Z */
	background-color: lightblue;
	/* column-span: all; */
}
.machine_list tr:nth-child(4) {	/* Name Type Year */
	background-color: lightblue;
	text-align: center;
	font-weight: bold;
}
.machine_list td:nth-child(1) {
	width: 400px;
}
.machine_list td:nth-child(2) {
	width: 100px;
}
.machine_list td:nth-child(3) {
	width: 100px;
}
/* ----------- End machine_list display ------------ */


/* ----------- Start machine display ------------ */
.machine table {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
  }
.machine tr, .machine td, .machine th {
	border: 1px solid black;
	padding: 5px;
	text-align: left;
}
/* tr:hover {background-color: #888;} */
.machine th {
	font-size: 18px;
	color: black;
	padding-top: 6px;
	text-align: center;
	padding-bottom: 6px;
	background-color: lightblue;
}
.machine tbody>tr>:nth-child(1) {
	font-style: italic;
}
.machine td:nth-child(1) {	/* Field name */
	width: 140px;
}
/* ----------- End machine display ------------ */

/* ----------- Start auction display ------------ */
.auction table {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	width: 800px;	
  }
.auction tr, .auction td, .auction th {
	border: 1px solid black;
	padding: 5px;
	text-align: left;
}
.auction th {
	font-size: 18px;
	color: black;
	padding-top: 6px;
	padding-bottom: 6px;
	background-color: yellow;
	text-align: center;
}
.auction tbody>tr>:nth-child(2) {	/* column machine name */
	white-space: nowrap;
}
.auction tbody>tr>:nth-child(4) {	/* column value */
	text-align: right;
}
.auction tbody>tr:nth-child(1)>:nth-child(4) {	/* first row column value */
	text-align: center;
}
/* ----------- End auction display ------------ */

/* ----------- Start change display ------------ */
.change table {
	/* width: 1200px; */
}
.change tr {
	<!-- padding-top: 1px; -->
	padding-bottom: 1px;
	font-size: 12px;
	height: 21px;
}
.change td {
	<!-- padding: 10px; -->
	text-align:left;
	vertical-align:top;
 }
.change td:nth-child(1) {
	width: 200px;
}
.change td:nth-child(2) {
	width: 350px;
}
.change td:nth-child(3) {
	width: 700px;
}
/* .change td:nth-child(1) { */
	/* width: 150px; */
/* } */
/* .change td:nth-child(2) { */
	/* width: 200px; */
/* } */
/* .change td:nth-child(3) { */
	/* width: 650px; */
/* } */
/* ----------- End change display ------------ */

div#sidenav {
	float: left ;
	width: 8% ;
	color: #000 ;
	background-color: #e9c9a3 ;
}
div#paddedsidenav {
    padding: 0.2em .2em 0em 0.3em;
}
div#content {
	float: right;
	width: 90%;
	color: #000;
	background-color: #fff;
    display: table-cell;

}
div#paddedcontent {
    padding: 1em;
	height: 100%;
}

@media only screen and (max-width: 800px) {
	div#sidenav {
		float: none ;
		width: 100% ;
	}
	div#content {
		float: none ;
		width: 100% ;
	}
}
div#page {
	color: inherit ;
	background-color: #fff ;

}
div#header {
	color: #000 ;
	background-color: #e9c9a3 ;
}

div#footer {
	clear: both ;
	color: #000 ;
	background-color: #fff ;
}

div#footer2 {
	clear: both ;
	color: #000 ;
	background-color: #fff ;
    font-size: 0.7em;               
}

div#copyright {
	clear: both ;
	color: #000 ;
    font-size: 0.7em;               
	background-color: #fff ;
}

/*
ul.navsection {
	list-style-type: none;
    margin-top: 1em;
	padding: 0;
    font-size: 0.9em;               
    font-weight: bold;
    color: #000000;
}
*/

ul.navitem {
    list-style-position: outside;
	list-style-type: disc;
    font-size: 0.72em; 
    padding: 0em 0em 0em 1em;
    font-weight: normal;
    text-decoration: none;
}
ul.navitem li a {
    text-decoration: none;
}



/*********************************
general content rules
**********************************/


.banner {
        font-size: 1.2em;              
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        font-weight: bold;
        color: #ffff99;
        background: #770000;
        padding: 4px;
        margin: 2px;
}

.figbox {
	display: inline-block;
	width: 22%;
	margin: 1em;
}

.figbox_med {
	display: inline-block;
	width: 50%;
	margin: 1em;
}

.figbox_big {
	display: inline-block;
	width: 77%;
	margin: 1em;
}

figure img{
	width: 100%;
}

figcaption {
font-size: .6em;              
font-family: arial, helvetica, sans-serif;                
font-weight: normal;
}


			 
.aplayer {
		  margin-top: 1em;
}

.overlib {
        color: #009900;
}

.listhead {
        color: #ffffff;
        background-color:#666699;
        text-align: center;
}

.widgetlabel {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        font-weight: bold;
        color: #000000;
        text-decoration : none;
}



.htw_navbox {
        text-align : center;
}


.tableheader {
        font-size: 12pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        font-weight: bold;
        color: #ffffff;
        background-color:#666699;
        text-align: left;
}

.tableheadersmall {
        font-size: 8pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        font-weight: bold;
        color: #ffffff;
        background-color:#666699;
        text-align: left;
}

.tablesubheader {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        color: #000000;
        background-color: #bcd0f0;
}

.tablecell {
        font-size: 10pt;               
        font-family: courier,arial, helvetica, sans-serif;                 
        font-variant: normal;
        background-color:#ffffff;
        color: #000000;
}

.tablecellsmall {
        font-size: 8pt;               
        font-family: courier;                
        font-variant: normal;
        background-color:#ffffff;
        color: #000000;
}

.tablecellbold {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        font-weight: bold;
        color: #000000;
        background-color: #bcd0f0;
}

.alttablecell {
        font-size: 10pt;               
        font-family: courier,arial, helvetica, sans-serif;                
        font-variant: normal;
        background-color: #cccccc;
        color: #000000;
}

.tablecellhighlight {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        background-color: #cccccc;
        color: #000000;
}

.alttablecellbold {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        font-weight: bold;
        color: #000000;
        background-color: #cccccc;
}

.tablecellnobgcolor {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        color: #000000;
}

.tablecellalarm {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        color: #000000;
        background-color:#ff0000;
}

.tablecellwarning {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        color: #000000;
        background-color:#ffff00;
}

.warnbox {
        color: #000000;
        background-color:#ffff00;
		  border: solid;
		  margin: 1em;
		  padding: 1em;
		  width: 80%;
}

.noteheader {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        font-weight: bold;
        color: #ffffff;
        background-color:#669966;
        text-align: left;
}

.notetext {
        font-size: 10pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        text-align: left;
}

.printtext {
        font-size: 8pt;               
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
}

.rathole
{
   background-color: #eeeeee;
   font-size: .8em;
   border-style: ridge;
   padding: 5px;
   margin: 5px;
   overflow: hidden;
}

.big_rathole
{
   border-style: ridge;
   padding: 5px;
   margin: 5px;
   width: 95%;
   background-color: #eeeeee;
   font-size: .8em;
}

.rathole_img
{
   float: right;
   margin: 0 0 1em 1em;
}

.mainpoint
{
   border-style: ridge;
   padding: 5px;
   margin: 5px;
   background-color: lightyellow;
}

.navjump
{
   padding: 5px;
   margin: 5px;
   text-align: center;
}

.testdiv
{
   padding: 5px;
   width: 70%;
   margin: 0 auto;
   background-color: #eeeeee;
   border-style: ridge;
}

.testq
{
   font-weight: bold;
}

.testa
{
   margin: 20px;
   text-decoration: none;   
}

.scrolldiv
{
   margin: 3px;
   overflow: auto;
   width: 99%;
   border-style: inset;
}

.scrolldivsmall
{
   margin: 3px;
   overflow: auto;
   width: 95%;
   height: 20em;
   border-style: inset;
}

.scrolldivmedium
{
   margin: 3px;
   overflow: auto;
   width: 95%;
   height: 40em;
   border-style: inset;
}

.navlink
{
   padding: 5px;
   margin: 5px;
   text-decoration: none;
}

.floatleft
{
   margin: 5px;
   float: left;
}

.floatright
{
   margin: 5px;
   float: right;
}

ul, ol
{
      margin-top: 1em;
}

li 
{
	margin-bottom: 1em;
}

.resourcebox
{
   float: right;
   border: red;
   border-style: ridge;
   margin-left: 5px;
   padding: 0px 5px 5px 5px;
}

.resourceboxheader
{
   text-align: center;
   background-color: red;
   color: white;
   font-size: 1.2em;
   font-weight: bold;
   margin: 0px -5px 5px -5px;

}

.gamename
{
   font-size: 1.2em;
   font-weight: bold;
}

.gamenumber_afterurl
{
   font-size: 0.7em;
}


.pagetitle
{
   font-size: 1.4em;
   font-weight: bold;
}

.pagesection
{
   font-size: 1.2em;
   font-weight: bold;
   border-top-style: solid;
   border-bottom-style: solid;
   border-width: 1px;
   width: 99%;
   clear: both;
   margin-top: 2em;
   margin-bottom: 2em;
   padding-left: 0.5em;
   background-color: #f2c545;
}

.resourcesmallprint
{
   font-size: 0.7em;
}

.imgleft
{
   float: left;
   padding: 1em;
   margin-right: 1em;
   margin-top: 1em;
   margin-bottom: 1em;
	border-style: solid;
	border-width: thin;

}

.imgleft img 
{
   width: 100%;
   display: block;
}

.imgcaption
{
   font-size: 0.7em;
   text-align: left;
}

.imgbreak
{
   clear: both;
   padding: 1em;
}

#screenshot
{
		  position:absolute;
		  border:1px solid #ccc;
		  background:#333;
		  padding:5px;
		  display:none;
}

.screenshot
{
        color: #009900;
}

.glossimage
{
   padding: 5px;
   margin: 5px;
   float: right;
   width: 30%;
}

.glossimage_wide
{
   padding: 5px;
   margin: 5px;
   float: right;
   width: 60%;
}

/*********************************
howto rules
**********************************/

.howto_title {
        font-size: 1.2em;              
        font-family: arial, helvetica, sans-serif;                
        font-variant: normal;
        font-weight: bold;
        color: #ffff99;
        background: #770000;
        padding: 0.4em;
        margin-bottom: 2em;
}
.howto_step {
        border-top-style: solid;
        border-bottom-style: solid;
        border-width: 1px;
        width: 99%;
        clear: both;
        margin-top: 2em;
        margin-bottom: 2em;
        padding-left: 0.5em;
        background-color: #f2c545;
        font-size: 1em;              
        font-variant: normal;
        font-weight: bold;
		color: #000;
        padding: 0.2em 1em;
        margin: 2em 0 1em 0;
}
.howto_step:before {
        counter-increment: step;
        content: "Step " counter(step) ": ";
}
.howto_author {
        font-size: 0.8em;              
}

/*********************************
print turn-off
**********************************/

@media print {
#navtable
{
   display: none;
}

#navfooter
{
   display: none;
}

#navheader
{
   display: none;
}

.navjump
{
   display: none;
}

.banner 
{
   page-break-before: always;
}