html {
	height: 100%;
	font-family: Verdana, Arial, sans-serif;
	color: black;
}

body {
	overflow: hidden;
	position: fixed;
	left: 0px;
	top: 0px;
	height: 100%;
	width: 100%;
	margin: 0px;
	font-size: 0.9em;
}

:focus {
	outline: none;
}

.std {
	margin: 5px 0px 0px 5px;
	display: inline-block;
}

label.std {
	font-weight: bold;
	margin: 5px 0px 0px 5px;
	/*white-space: nowrap;*/
	display: inline-block;
}

select {
	-webkit-appearance: listbox;
}

input,select {
	font-size: 100%;
	display: inline-block;
	border-width: 2px;
	border-radius: 8px;
	border-color: #dbdbdb;
	border-style: solid;
	font-family: Verdana, Arial, sans-serif;
	padding: 5px;
	margin: 5px 0px 0px 5px;
	white-space: nowrap;
	/* box-shadow:  1px 0px 1px gray; */
	transition: border-color 0.33s;
	background: white;
}

input:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

input:focus {
	border-color: gray;
}

input[type=radio] {
	margin: 0px;
}

input[type=checkbox] {
	margin: 0px;
	vertical-align: middle;
}

select.first {
	margin-top: 0px;
}

select:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

select:focus {
	transition: border-color 0.33s;
	border-color: gray;
}

a img {
	height: 16px;
	vertical-align: top;
	position: relative;
	top: 1px;
}

div.upper {
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
}

div.header {
	position: relative;
	background: #F3F3F3;
	border-width: 1px;
	border-style: none none solid none;
	border-color: #dbdbdb;
	padding: 0px 5px 4px 0px;
	z-index: 999;
}

div.headerline {
	width: 100%;
	display: table;
	position: relative;
}

div.headerleft {
	display: table-cell;
	text-align: left;
	word-wrap: break-word;
/*	white-space: nowrap; */
}

div.headerright {
	text-align: right;
	display: table-cell;
}

a.stdbutton.menu {
	position: relative;
}

a.stdbutton.disable {
	border-color: #dbdbdb;	
}

a.menu::after {
	top: 2px;
	position: relative;
	display: inline-block;
	border-bottom: 9px double black;
	border-top: 3px solid black;
	content: "";
	height: 3px;
	width: 20px;
	background: white;
}

ul.menu {
	margin: 0px;
	list-style: none;
	padding: 0px;
}

ul.menu li {
	border-width: 2px;
	border-color: #dbdbdb;
	border-style: none solid solid solid;
	padding: 5px;
	background: white;
	cursor: pointer;
	transition: border-color 0.33s;
}

ul.menu li:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

ul.menu li.first {
	border-style: solid;
	border-radius: 8px 8px 0px 0px;
}

ul.menu li.last {
	border-radius: 0px 0px 8px 8px;
}

a.menubutton {
	color: black;
	text-decoration: none;
	cursor: pointer;
}

#smallviewmenu {
	display: none;
}

#mediumviewmenu {
	display: none;
}

div.tabs {
	background: white;
	padding: 0px;
	border: solid 1px;
	border-style: none none solid none;
	border-color: #dbdbdb;
}

ul.tableft {
	margin: 0px;
	padding: 0px 5px 0px 5px;
	list-style: none;
	list-style: none;
}

ul.tableft li {
	display: inline-block;
}

ul.tableft li a {
	display: inline-block;
	border-width: 2px;
	border-radius: 8px 8px 0px 0px;
	border-style: solid solid none solid;
	border-color: #dbdbdb;
	margin: 5px 0px 0px 1px;
	padding: 5px;
	text-decoration: none;
	color: black;
	white-space: nowrap;
	background: #F3F3F3;
	cursor: pointer;
	/* box-shadow:  1px 0px 1px gray; */
	transition: border-color 0.33s;
}

ul.tableft li.selected a {
	position: relative;
	top: 1px;
	background: white;
	font-weight: bold;
	transition: border-color 0.33s;
	border-color: #dbdbdb;
}

ul.tableft li a:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

ul.tableft li a:focus {
	transition: border-color 0.33s;
	border-color: gray;
}

div.rbgroup {
	display: table;
	margin: 5px 0px 0px 5px;
	cursor: pointer;
}

div.rbelem {
	display: table-cell;
	border-width: 2px;
	border-color: #dbdbdb;
	border-style: none solid solid solid;
	padding: 0px 5px 5px 0px;
	transition: border-color 0.33s;
}

div.rbelem:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

div.focus {
	border-color: gray;
}

div.rbelem.first {
	border-radius: 8px 8px 0px 0px;
	border-style: solid;
}

div.rbelem.last {
	border-radius: 0px 0px 8px 8px;
}

div.main {
	position: relative;
}

div#showinput {
	position: absolute;
	left: 0px;
	top: 0px;
	margin: 5px 0px 0px 0px;
	padding: 5px;
	display: block;
	border: solid 2px;
	border-radius: 0px 8px 8px 0px;
	border-style: solid solid solid none;
	border-color: #dbdbdb;
	z-index: 10;
	transition: border-color 0.33s;
	cursor: pointer;
}

div#showinput:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

div#showinput:focus {
	transition: border-color 0.33s;
	border-color: gray;
}

div#inputandhide {
	background: white;
	float: left;
	margin: 5px 5px 0px 0px;
	border: solid 2px;
	border-radius: 0px 8px 8px 0px;
	border-style: solid solid solid none;
	border-color: #dbdbdb;
	padding: 0px 5px 5px 0px;
	max-width: 400px;
	/* box-shadow:  1px 0px 1px gray; */
	transition: border-color 0.33s;
}

div#inputandhide.border {
	transition: border-color 0.33s;
	border-color: gray;
}

div#remarks {
	display: none;
}

/* Experimental not used in production. */
.slider {
	overflow-x: hidden;
	max-width: 500px; /* approximate max width */
	transition-property: all;
	transition-duration: .5s;
	transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}

.slider.closed {
	max-width: 0px;
}

div.input {
	/*	position: absolute;
	left: 0px; */
	float: left;
	/* Will be computed dynamically. */
	height: 10px;
	overflow-x: visible;
	overflow-y: auto;
	width: 100%;
}

ul.legend {
	margin: 5px 0px 0px 5px;
	list-style: none;
	padding: 0px;
}

ul.legend li {
	border-width: 2px;
	border-color: #dbdbdb;
	border-style: none solid solid solid;
	padding: 5px;
	/*	background-repeat: no-repeat; */
}

ul.legend li.first {
	border-style: solid;
	border-radius: 8px 8px 0px 0px;
}

ul.legend li.last {
	border-radius: 0px 0px 8px 8px;
}

div.hideinput {
	margin: 0px;
	padding-bottom: 3px;
	display: table;
}

span.hideinput {
	padding: 0px;
	width: 500px;
	display: table-cell;
	vertical-align: middle;
	text-align: right;
	display: table-cell;
	width: 500px;
	cursor: pointer;
}

span.hideinput a {
	margin: 5px 0px 0px 5px;
	display: inline-block;
	text-decoration: none;
	color: black;
	white-space: nowrap;
}

div.result {
	display: table;
	background: white;
	position: relative;
	float: left;
}

div.ttheader {
	padding-top: 0px;
	padding-bottom: 5px;
	position: relative;
	left: 50px;
}

.stdbutton {
	margin: 5px 0px 0px 5px;
	padding: 5px 5px 5px 5px;
	display: inline-block;
	border-width: 2px;
	border-radius: 8px 8px 8px 8px;
	border-style: solid solid solid solid;
	border-color: #dbdbdb;
	text-decoration: none;
	color: black;
	background: white;
	white-space: nowrap;
	cursor: pointer;
	/* box-shadow:  1px 0px 1px gray; */
	transition: border-color 0.33s;
}

.ollink {
	color: black;
}

.stdbutton:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

.stdbutton:focus {
	transition: border-color 0.33s;
	border-color: gray;
}

div#footer {
	position: fixed;
	left: 0px;
	right: 0px;
	bottom: 0px;
	padding: 0px 5px 5px 0px;
	border-width: 1px;
	border-style: solid none none none;
	background: #F3F3F3;
	border-color: #dbdbdb;
	z-index: 999;
}

div.roomrow {
	display: table-row;
	background: #F3F3F3;
}

div.roomrow.odd {
	background: white;
}

div.roomcell {
	display: table-cell;
	vertical-align: middle;
	padding: 0px 5px 5px 0px;
}

div.roomcell.two {
	width: 100%;
}

a.check {
	display: inline-block;
	border-radius: 8px 8px 8px 8px;
	border-style: solid solid solid solid;
	border-color: #dbdbdb;
	border-width: 2px;
	width: 20px;
	height: 20px;
	margin: 3px 0px 3px 5px;
	transition: border-color 0.33s;
	cursor: pointer;
}

a.check:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

a.check::after {
	display: inline-block;
	content: '';
	height: 4px;
	width: 9px;
	position: relative;
	top: -2px;
	left: 4px;
}

a.tick::after {
	transform: rotate(120deg);
	-webkit-transform: rotate(120deg);
	border-style: solid solid none none;
	border-width: 3px;
	border-color: black;
}

a.tick2::after {
	transform: rotate(120deg);
	-webkit-transform: rotate(120deg);
	border-style: solid solid none none;
	border-width: 3px;
	border-color: black;
	top: -2px;
	left: -4px;
}

a.check.tick.light {
	border-color: #dbdbdb;
	transition: border-color 0.33s;
}

a.check.tick.light:hover {
	transition: border-color 0.33s;
	border-color: gray;
}

a.check.tick.light::after {
	border-color: gray;
}

.lnode {
	display: block;
	cursor: pointer;
	transition: background 0.33s;
	padding: 5px 0px 5px 0px;
}

.lnode:hover {
	transition: background 0.33s;
	background: #F3F3F3;
}

.level0 {
	padding-left: 12px;
}

.level1 {
	padding-left: 24px;
}

.replevel1 {
	padding: 0px 0px 0px 24px;
}

.level2 {
	padding: 0px 0px 0px 36px;
}

.level3 {
	padding: 0px 0px 0px 57px;
}

.reslevel {
	padding: 0px 0px 0px 24px;	
}

.mtlec {
	margin-left:5px;
	position: relative;
	top: -9px;
}

#floatingCirclesG {
	position: relative;
	width: 80px;
	height: 80px;
	-webkit-transform: scale(0.6);
	transform: scale(0.6);
}

.f_circleG {
	position: absolute;
	background-color: #FFFFFF;
	height: 15px;
	width: 15px;
	-webkit-border-radius: 7px;
	-webkit-animation-name: f_fadeG;
	-webkit-animation-duration: 1.04s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: normal;
	border-radius: 7px;
	animation-name: f_fadeG;
	animation-duration: 1.04s;
	animation-iteration-count: infinite;
	animation-direction: normal;
}

#frotateG_01 {
	left: 0;
	top: 33px;
	-webkit-animation-delay: 0.39s;
	animation-delay: 0.39s;
}

#frotateG_02 {
	left: 9px;
	top: 9px;
	-webkit-animation-delay: 0.52s;
	animation-delay: 0.52s;
}

#frotateG_03 {
	left: 33px;
	top: 0;
	-webkit-animation-delay: 0.65s;
	animation-delay: 0.65s;
}

#frotateG_04 {
	right: 9px;
	top: 9px;
	-webkit-animation-delay: 0.78s;
	animation-delay: 0.78s;
}

#frotateG_05 {
	right: 0;
	top: 33px;
	-webkit-animation-delay: 0.91s;
	animation-delay: 0.91s;
}

#frotateG_06 {
	right: 9px;
	bottom: 9px;
	-webkit-animation-delay: 1.04s;
	animation-delay: 1.04s;
}

#frotateG_07 {
	left: 33px;
	bottom: 0;
	-webkit-animation-delay: 1.17s;
	animation-delay: 1.17s;
}

#frotateG_08 {
	left: 9px;
	bottom: 9px;
	-webkit-animation-delay: 1.3s;
	animation-delay: 1.3s;
}

@-webkit-keyframes f_fadeG { 

0%{
	background-color: #000000
}

100%{ 
	background-color : #FFFFFF
}
}

@keyframes f_fadeG { 

0%{
	background-color: #000000
}

100%{
background-color : #FFFFFF
}
}

@media ( min-width : 650px) {
	div.largeview {
		display: table-cell;
	}
	div.largemediumview {
		display: table-cell;
	}
	div.largemediumview.block {
		display: block;
	}
	div.largemediumview.inline {
		display: inline-block;
	}
	div.mediumview {
		display: none;
	}
	div.smallview {
		display: none;
	}
	span.smallview {
		display: none;
	}
}

@media ( max-width : 650px) {
	div.largeview {
		display: none;
	}
	div.largemediumview {
		display: table-cell;
	}
	a.largeview {
		display: none;
	}
	div.largemediumview.block {
		display: block;
	}
	div.largemediumview.inline {
		display: inline-block;
	}
	div.mediumview {
		display: table-cell;
	}
	div.smallview {
		display: none;
	}
	span.smallview {
		display: none;
	}
}

@media ( max-width : 460px), ( max-height : 460px) {
	div.largeview {
		display: none;
	}
	div.largemediumview {
		display: none;
	}
	span.largemediumview {
		display: none;
	}
	a.largeview {
		display: none;
	}
	div.largemediumview.block {
		display: none;
	}
	div.largemediumview.inline {
		display: none;
	}
	div.mediumview {
		display: none;
	}
	div.smallview {
		display: table-cell;
	}
	span.smallview {
		display: inline-block;
	}
}

.reptable {
	width: 100%;
	border: 2px solid #dbdbdb;
	border-collapse: collapse;
}

th.repth {
	background: #F3F3F3;
	border: 1px solid #dbdbdb;
	padding: 5px;
}

th.rephover:hover {
	transition: background 0.33s;
	background: #dbdbdb;
}

td.reptd {
	border: 1px solid #dbdbdb;
	padding: 5px;
}

i.arrowd {
  position: relative;
  top: -2px;
  margin-left:4px;
  border: solid gray;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

.icalpopup {
  position: relative;
  display: inline-block;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* The actual popup */
.icalpopup .popuptext {
  visibility: hidden;
  position: absolute;
  z-index: 2;
  bottom: -78px;
  left: 85px;
  margin-left: -80px;
  border-color: gray;
}

/* Popup arrow */
.icalpopup .popuptext::before {
  content: "";
  position: absolute;
  top: -15px;
  left: 50%;
  margin-left: -5px;
  border-width: 7px;
  border-style: solid;
  border-color: transparent transparent gray transparent;
}

/* Toggle this class - hide and show the popup */
.icalpopup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

.icalpopup .sel {
	text-decoration: none;
	color: black;
	display: block;
	padding: 6px;
}

.icalpopup .sel:hover {
	background: #F3F3F3;
}

img.iconimg {
	height: 16px;
	width: 16px;
	vertical-align: middle;
}