html {
	height: 98%;
	font-family: "Helvetica", "Arial";
	font-size: 16px;
	-ms-overflow-style: none;
	overflow: -moz-scrollbars-none;
}

body {
	height: 100%;
	margin: 0px;
	padding: 0px;
	overflow-y: hidden;
}

#tblMainTable {
	width: 100%;
	height: 100%;
	table-layout: fixed;
	position: fixed;
}

::-webkit-scrollbar {
    display: none;
}

table {
	border-collapse: collapse;
}

select {
	font-size: 18px;
	border-radius: 8px;
	height: 35px;
	min-width: 150px;
}

input {
	font-size: 18px;
	border-radius: 8px;
}

input[type=checkbox] {
  /* All browsers except webkit*/
  transform: scale(3);

  /* Webkit browsers*/
  -webkit-transform: scale(3);
  
  margin: 20px;
}

button {
	font-size: 20px;
	margin: 5px;
	padding: 8px;
	border: 1px solid;
	border-radius: 5px;
	min-width: 50px;
	
	background: #DDD;
	background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#999));
	background: -moz-linear-gradient(top,  #FFF,  #999);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#999');
}

.button_blue {
	background: #88F;
	background: -webkit-gradient(linear, left top, left bottom, from(#CCF), to(#66F));
	background: -moz-linear-gradient(top,  #CCF,  #66F);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCF', endColorstr='#66F');
	border: 4px solid;
	font-weight: bold;
}

.button_green {
	background: #8F8;
	background: -webkit-gradient(linear, left top, left bottom, from(#CFC), to(#6F6));
	background: -moz-linear-gradient(top,  #CFC,  #6F6);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#CFC', endColorstr='#6F6');
	border: 4px solid;
	font-weight: bold;
}

.button_small {
	line-height: 12px;
	margin: 4px !important;
}

button:active {
	border: 3px solid #FF5;
}

a {
	font-weight: bold;
}

.wide_button {
	margin: 0 auto;
	width: 100%;
}

.flip { /* flip image horizontally */
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

.dark_overlay {
	background-color: rgba(50, 50, 50, 0.7);
	border: 2px solid;
	border-radius: 10px;
	padding: 3px 3px 0 3px;
	color: white;
	border-color: black;
	font-size: 18px;
}

.mil_background {
	background-color: rgba(195, 197, 196, 0.9);
}

.dark_overlay .title_element {
	margin: 5px;
}

.dark_overlay .title_element + .title_element {
	margin-left: 10px;
	margin-bottom: 10px;
}

.boldnumber {
	font-weight: bold;
	font-size: 18px;
}

.toolbar_icon {
	height: 48px;
	width: 48px;
	margin: 3px 5px 0 5px;
}

.inline_icon {
	margin-bottom: -16px;
}

.plot_bar {
	background-color: rgba(30, 30, 30, 1);
	padding: 0px;
	margin-left: -3px;
}

.text_red {
	color: black;
	padding: 5px;
	margin-left: 25px;
	line-height: 30px;
	background-color: #fdd;
}

.text_green {
	color: black;
	padding: 5px;
	margin-left: 25px;
	line-height: 30px;
	background-color: #dfd;
}

.text_yellow {
	color: black;
	padding: 5px;
	margin-left: 25px;
	line-height: 30px;
	background-color: #ffd;
}

#spanLoadingText {
	font-size: 20px;
	font-weight: bold;
	color: white;
}

#tblMainTable td {
	padding: 5px;
	border: 0px solid;
/*	background-color: #FFF;*/
}

#tblMainTable .content {
	background-color: #888;
	position: relative;
	text-align: center;
}

#divMainTarget {
	width: 100%;
	height: 100%;
	min-height: 100px; /* temp: so it is not zero */
	/* display: inline-table;  */     /* firefox needs this for some reason */
}

#imgWind {
	height: 48px;
	margin: 0 0 -10px 15px;
}

#divToolbar {
	z-index: 1;
	text-align: left;
	position: absolute;
	top: 10px;
	left: 10px;
	min-height: 57px;
    overflow-y: auto;
}

#imgServerDown {
	z-index: 2;
	position: absolute;
	top: 10px;
	right: 10px;
}

#txtStringName {
	width: 100px;
}

#divShotInfo .shot_call_table {
	margin: 0 auto;
}

#divShotInfo .shot_call_table td {
	padding: 0;
}

#divShotInfo .call_selected {
	font-weight: bold;
}

#imgStrikeShot, #imgAcceptShot, #imgSetSighter, #imgSetRecord {
	height: 60px;
	width: 60px;
}

.watermark {
	z-index: 1;
	position: absolute;
	margin: 0 auto;
	bottom: 5px;
	width: 0;
}

#divTargetRow {
	z-index: 1;
	position: absolute;
	margin: 0 auto;
	left: 0;
	right: 0;
	bottom: 5px;
	width: 0;
	overflow-x: scroll;
}

#divTargetRow table {
	text-align: center;
	margin: 0 auto;
}

#divTargetRow td {
	background-color: rgba(0, 0, 0, 0);
	border: 0px;
	padding: 5px;
	font-size: 18px;
	font-weight: bold;
}

#divTargetRow .selected {
	background-color: #FA5;
	border: none;
}

#divPlotControls {
	z-index: 1;
	text-align: left;
	position: absolute;
	bottom: 150px;
	left: 10px;
}

#tblMainTable .sidebar {
	padding: 5px;
	width: 170px;
	height: 100%;
}

#divShotList {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	overflow-y: scroll;
}

#divFrameTitle {
	width: 100%;
	font-size: 18px;
	text-align: center;
	font-weight: bold;
}

#divStringPanel {
	padding: 3px;
	margin: 3px;
	white-space: nowrap;
	text-align: center;
}

#selString {
	width: 100%;
	padding: 5px;
	margin-bottom: 5px;
}

#divShotList table {
	width: 97%;
	text-align: center;
}
#divShotList th {
	padding: 3px;
	border: 0px;
	font-size: 14px;
	font-weight: normal;
}
#divShotList td {
	padding: 5px;
	background-color: #CCC;
	border: 0px;
}
#divShotList .score {
	font-weight: bold;
	padding: 0px;
}

/*timers*/
#divShotList .addtl_event td { background-color: yellow; }
#divShotList .late_shot td { background-color: lightpink; }

#divShotList tr.top td { border-top: 2px solid; }
#divShotList tr.bottom td { border-bottom: 2px solid; }
#divShotList tr.row td:first-child { border-left: 2px solid; }
#divShotList tr.row td:last-child { border-right: 2px solid; }

/* score value for pairs/threes*/
#divShotList td .selected.score {
	font-size: 40px;
}

#divShotList td.selected {
	border: 2px solid;
}

#divShotList .measured td {
	background-color: #FF6;
}

#divShotList .focus {
	font-size: 40px;
}

#divShotList .strikeout {
/*	text-decoration: line-through; */
	color: #999;
}

#divShotList .V_ERR_TOOBIG td {
	background-color: orange;
}

#divPlotSliderX, #divPlotSliderY {
	z-index: 2;
	position: absolute;
}

#tblStringReview {
	color: black;
}

#tblStringReview td {
	background: transparent;
}

#tblStringReview tr {
	background: #ddd;
}

#tblStringReview th {
	background: #aaa;
	font-size: 14px;
}

#tblStringReview .selected {
	background: #8f8 !important;
	border: 4px solid;
}

#tblStringReview tr:nth-child(odd) {
	background: #eee;
}

#tblStringReview tr:nth-child(even) {
	background: #ddd;
}

#tdDiagTopLeft {
}

#tdDiagTopRight {
}

#tdDiagBottom {
	height: 100%;
}


#divDiagTop {
	border: 1px solid;
}

#divDiagTopLeft {
	border: 1px solid;
	height: 300px;
	overflow-y: scroll;
}

#divDiagTopRight {
	border: 1px solid;
	height: 300px;
	overflow-y: scroll;
}

#divDiagBottom {
	border: 1px solid;
	overflow-y: scroll;
	height: 100%;
}

td.targetrow-item {
    padding: 5px;
}

td.targetrow-item div.label {
}

td.targetrow-item div.thumbnail {
    height: 80px;
    max-height: 80px;
    width: 80px;
    max-width: 80px;
    margin-top: 5px;
}

/* https://stackoverflow.com/questions/1009753/pass-mouse-events-through-absolutely-positioned-element/6441884 */
.passthrough {
	pointer-events: none;
}