html {
	margin-left: 10px;
}
body {
	font-family: "Liberation Sans" verdana sans-serif;
	color: #606060;
}
button.submitbutton {
	color: white;
	font-family: "Liberation Sans" verdana sans-serif;
	font-weight: bold;
background: #787878; /* Old browsers */
background: -moz-linear-gradient(top,  #787878 0%, #5e5e5e 50%, #707070 51%, #838383 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#787878), color-stop(50%,#5e5e5e), color-stop(51%,#707070), color-stop(100%,#838383)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* IE10+ */
background: linear-gradient(to bottom,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#787878', endColorstr='#838383',GradientType=0 ); /* IE6-9 */
	border: 1px solid #797979;
	padding: 2px 2px;
	border-radius: 5px;
	margin: 1px -1px;
	/* Smooth hover animation */
	transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}
select {
	color: white;
	font-family: "Liberation Sans" verdana sans-serif;
	font-weight: bold;
background: #787878; /* Old browsers */
background: -moz-linear-gradient(top,  #787878 0%, #5e5e5e 50%, #707070 51%, #838383 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#787878), color-stop(50%,#5e5e5e), color-stop(51%,#707070), color-stop(100%,#838383)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* IE10+ */
background: linear-gradient(to bottom,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#787878', endColorstr='#838383',GradientType=0 ); /* IE6-9 */
	border: 1px solid #797979;
	padding: 2px 2px;
	border-radius: 5px 5px 5px 5px;
	max-width: 300px;
}
option {
	color: black;
}
button.submitbutton:hover {
	cursor: pointer;
	/* Lighten the gradient on hover */
	background: #8a8a8a; /* Old browsers */
	background: -moz-linear-gradient(top,  #8a8a8a 0%, #6e6e6e 50%, #808080 51%, #989898 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8a8a8a), color-stop(50%,#6e6e6e), color-stop(51%,#808080), color-stop(100%,#989898)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #8a8a8a 0%,#6e6e6e 50%,#808080 51%,#989898 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #8a8a8a 0%,#6e6e6e 50%,#808080 51%,#989898 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #8a8a8a 0%,#6e6e6e 50%,#808080 51%,#989898 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #8a8a8a 0%,#6e6e6e 50%,#808080 51%,#989898 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a8a8a', endColorstr='#989898',GradientType=0 ); /* IE6-9 */
	border-color: #a0a0a0;
	box-shadow: 0 0 6px rgba(255,255,255,0.3) inset, 0 1px 4px rgba(0,0,0,0.2);
}
form.inline {
	margin: 0;
	display: inline-block;
}
.float-right {
	float: right;
}
.verticalalign {
	margin-top: auto;
	margin-bottom: auto;
}
div.center {
	margin: auto;
}
div.header {
	border-bottom: 2px solid #b6b6b6; 
}
div.header span {
	margin-left: 40px;
	font-size: 16pt;
	color: #b6b6b6;
}
/* div.header img { */
/* 	vertical-align: middle; */
/* } */

.menu ul {
background: #787878; /* Old browsers */
background: -moz-linear-gradient(top,  #787878 0%, #5e5e5e 50%, #707070 51%, #838383 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#787878), color-stop(50%,#5e5e5e), color-stop(51%,#707070), color-stop(100%,#838383)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* IE10+ */
background: linear-gradient(to bottom,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#787878', endColorstr='#838383',GradientType=0 ); /* IE6-9 */
	border: 1px solid #797979;
	padding: 0px 6px;
	border-radius: 5px 5px 5px 5px;
	list-style: none;
	display: inline-block;
	white-space: nowrap;
}

.menu ul li:first-of-type {
	border-left: 0 solid black;
}

.menu ul li {
	display: inline;
	border-left: 2px solid #a9a9a9; 
	padding: 4px 0;
}

.menu ul button {
	background: none;
	border: 0;
	font-family: "Liberation Sans" verdana sans-serif;
	font-weight: bold;
	color: white;
	cursor: pointer;
	padding: 4px 0;
}
div.list {
	border: 1px solid #b6b6b6;
	display: inline-block;
	margin-left: 5px;
	padding: 0px 4px;
	vertical-align: top;
	max-width: 450px; /* fixed width */
	max-height: 400px;
	overflow-y: auto;
	overflow-x: auto; /* show horizontal slider if content is wider */
	padding-right: 10px;  
    box-sizing: border-box;
}
div.list ul {
	list-style: none;
	padding-left: 2px;
	white-space: nowrap; /* prevent wrapping so wide items trigger horizontal scroll */
}
div.list button, button.list {
	border: none;
	background: none;
	color: #b6b6b6;
	font-family: "Liberation Sans" verdana sans-serif;
	font-size: 14pt;
}
.detail {
    display: inline-block;
    width: auto;
    margin-top: 12px;
}

td.number, th.number {
	text-align: right;
	padding-right: 3px;
}
table.report {
	font-size: 9pt;
	border-collapse: collapse;
}
table.report td {
	padding: 0 5px 0 5px;
	font-size: 9pt;
}
table.report th {
	/* border-bottom: 1px solid #ededed;*/
	padding: 25px 5px 0 5px;
}
tr.date-value {
	border-top: 1px solid #ededed;
	background: #ededed;
}
table.report1 {
	font-size: 7pt;
}
table.report1 td {
	padding: 0 0 0 5px;
}
table.report1 tr{
	background: white;
}
.alert {
	font-size: 14pt;
	color: red;
}
svg {
	display: block;
	-fs-keep-with-inline: keep;
	page-break-inside:avoid;
}
.pagebreak {
	page-break-before: always;
}
.logI td {
	background-color: #e2ffe2;
	padding: 5px;
	font-weight: bold;
}
.logW td {
	background-color: #dfe068;
	padding: 5px;
	font-weight: bold;
}
.logE td {
	background-color: #fb1e1e;
	color: white;
	padding: 5px;
	font-weight: bold;
}
.datepicker {
	position: absolute;
	background-color: white;
	border: 1px solid #797979;
	padding: 4px 6px;
	border-radius: 5px 5px 5px 5px;
}
.datepicker .nav {
	text-align: center;
}
.datepicker .navl {
	float: left;
	cursor: pointer;
}
.datepicker .navr {
	float: right;
	cursor: pointer;
}
.datepicker td:hover {
	background-color: #F0F0F0;
	cursor: pointer;
}
.datepicker td,.datepicker th {
	width: 15px;
	text-align: center;
	border: 1px solid white;
}
.datepicker .om {
	color: #d0d0d0;
}
.datepicker .im {
	color: #797979;
}
.datepicker .cur {
	color: #797979;
	border: 1px solid #797979;
}
.datepicker .tod {
	border: 1px solid #45a5ff;
}
.clicker {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
.indate {
	border: 1px solid #797979;
	padding: 4px 6px;
	border-radius: 5px 5px 5px 5px;
}
.indate:hover {
	cursor: pointer;
}
.report-buttons{
	width: 100%;
	margin: 8px auto 1px auto;
	text-align: left;
}
table.formtable {
  text-align: left;
}
table.formtable th,
table.formtable td {
  text-align: left !important;
  padding-right: 4px;
}
.add-new-button {
	text-align: left !important;
}
.programcontent {
  width: 70%;          
  margin: 0 auto;       
  box-sizing: border-box;
  padding-bottom: 64px;
}
form.menu {
	width: 100%;
	margin: 2px auto;
}
.admin-buttons {
	width: 72%;
	margin: 0 auto;
	text-align: center !important;
}

/* Hidden button hover cue: slide right and show a small leading dot */
button.hidden-button {
	position: relative;
	overflow: visible;
	transition: transform 120ms ease;
}
button.hidden-button::before {
	content: '';
	position: absolute;
	left: -2px;
	top: 50%;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #606060;
	transform: translateY(-50%);
	opacity: 0;
	transition: opacity 120ms ease, transform 120ms ease;
}
button.hidden-button:hover {
	transform: translateX(6px);
}
button.hidden-button:hover::before {
	opacity: 1;
	transform: translateY(-50%);
}
.expand-column{
	border: 1px solid #797979;
	border-radius: 2px; /* square with rounded corners */
	width: 20px;
	height: 20px;
	display: inline-flex; /* center + inside */
	align-items: center;
	justify-content: center;
	box-sizing: border-box; /* include border in the size */
	flex: 0 0 auto; /* don't grow/shrink in flex layouts */
	background-clip: padding-box; /* avoid border bleed */
	padding: 5px;
	margin: 0px;
	line-height: 1; /* avoid text baseline shifting */
	font-size: 12px; /* readable + size */
	text-align: center;
	vertical-align: middle;
	color: white;
	background: #787878; /* Old browsers */
	background: -moz-linear-gradient(top,  #787878 0%, #5e5e5e 50%, #707070 51%, #838383 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#787878), color-stop(50%,#5e5e5e), color-stop(51%,#707070), color-stop(100%,#838383)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #787878 0%,#5e5e5e 50%,#707070 51%,#838383 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#787878', endColorstr='#838383',GradientType=0 ); /* IE6-9 */
}

/* Keep border thickness constant across states */
.expand-column:hover,
.expand-column:active,
.expand-column:focus {
	border-width: 1px !important;
	border-style: solid;
	border-color: #797979;
	outline: none;
	cursor: pointer;
	background: #8a8a8a; /* Old browsers */
	background: -moz-linear-gradient(top,  #8a8a8a 0%, #6e6e6e 50%, #808080 51%, #989898 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8a8a8a), color-stop(50%,#6e6e6e), color-stop(51%,#808080), color-stop(100%,#989898)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #8a8a8a 0%,#6e6e6e 50%,#808080 51%,#989898 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #8a8a8a 0%,#6e6e6e 50%,#808080 51%,#989898 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #8a8a8a 0%,#6e6e6e 50%,#808080 51%,#989898 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #8a8a8a 0%,#6e6e6e 50%,#808080 51%,#989898 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a8a8a', endColorstr='#989898',GradientType=0 ); /* IE6-9 */
}
.counters{
	border-collapse: collapse;
}
.counters th{
	background: #EFEFEF;
}
.emulator-header{
	border-bottom: 2px solid black;
	padding-bottom: 5px;
	margin-bottom: 3px;
}

.user-roulette-table {
    width: auto;
    table-layout: auto;      
    margin-top: 8px;     
    border-spacing: 0px;    
}

.user-roulette-table td:nth-child(1) {
    width: auto;             
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	padding-right: 12px;
}

.user-roulette-table td:nth-child(2) {
    width: auto;
    padding: 1px 12px;
}
.user-roulette-table tr {
    transition: background-color 120ms ease;
}

.user-roulette-table tr:hover {
    background-color: #f0f0f0;
}

#owner {
	max-width: 180px;
}