﻿html {
	-webkit-text-size-adjust: 100%;
}

body {
	text-align: center; /*Needed for IE*/
	height: 100%;
	font-size: 100%;
}

body, form, fieldset, ul, li, a, p {
	padding: 0px;
	margin: 0px;
}

ul, ol {
	text-align: left;
	font-size: 18px;
}

body.design {
	font-size:100%;
}

#content {
	position: relative;
	float: left;
	width: 100%;
	height: 90%;
}

#content_main,
#content_extra {
	float: none;
	display: inline-block;
	padding: 5%;
	margin: 0px;
	width: 60%;
	font-size: 20px;
	padding-bottom: 0px;
	text-align: left;
}

#content_right {
	float: right;
	padding: 5% 2%;
	margin: 0px;
	position: absolute;
	right: 0px;
	top: 0px;
	bottom: 0px;
	width: 25%;
}

.main {
	width: 100%;
	display: inline-block;
	text-align: center;
	min-width: 280px;
	max-width: 1450px;
	padding-bottom: 50px;
}

.main h2 {
	text-align: left;
	margin: 15px 20px;
	width: 90%;
}

.login .main {
	margin-left: auto;
}

.collapse h2 img {
	left: -30px;
}

/* Page Header */
.header {
	border-bottom: 1px solid #465B74;
	position: relative;
	clear: left;
	overflow: hidden;
	padding: 10px 20px 2px 20px;
	min-height: 46px;
	text-align: right;
	_height: 56px;
	_display: inline-block;
	_width: 100%;
	z-index: 20;
	color: white;
}

.header, .foot, .popup-titlebar, .dialog-titlebar {
	background-color: #3070A8;
}

.header .note {
	position: absolute;
	text-align: left;
	left: 50%;
	top: 5px;
	width: 140px;
	margin-left: -70px;
}

.header h1 {
	float: left;
	display: inline-block;
	margin: 5px 0px 0px 5px;
	min-height: 15px;
	font-size: 140%;
	text-overflow: ellipsis;
	line-height: normal;
	z-index: 10;
}

.header h1 em {
	font-size: 95%;
	display: inline-block;
	vertical-align: text-bottom;
	white-space: nowrap;
	max-width: 20em;
	overflow-x: hidden;
	text-overflow: ellipsis;
	margin-left: 0.5em;
}

.header strong {
	font-family: Arial;
	font-weight: normal;
	z-index: 10;
	color: white;
}

.header .header-icon {
	float: left;
	display: inline-block;
	height: 35px;
	width: 35px;
	vertical-align: bottom;
	background-size: 100%;
	background-repeat: no-repeat;
	margin-right: 10px;
}

.header .header-links {
	display:inline;
}

.header-links a .alert {
	display: inline-block;
	width: auto;
	font-weight: bold;
	font-size: 60%;
	padding: 0px 2px;
	min-width: 1em;
	color: white;
	background-color: goldenrod;
	border: 1px solid white;
	border-radius: 50%;
	vertical-align: top;
	height: 1.6em;
	padding: 0 3px;
}

.header a {
	display: inline-block;
	height: 28px;
	margin-top: 0px;
	margin-left: 10px;
	margin-bottom: 4px;
	vertical-align: middle;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 90%;
	font-weight: bold;
	outline: 0px none;
	color: white;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background: none;
	box-shadow: none;
}

.header a.button {
	padding: 6px;
	line-height: 14px;
	vertical-align: text-top;
}

.header a.yellow {
	color: #FADB4E;
}

.header a:active {
	box-shadow: inset rgba(0, 0, 0, 0.3) 0px -1px 4px 0px;
	-webkit-box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 4px 0px;
	color: #DDD;
}

.header a:focus {
	box-shadow: 0px 0 9px rgba(255,255,255,0.5);
}

.header a .name {
	display: inline-block;
	padding: 7px 10px;
	margin: 0px;
	font-size: 90%;
	vertical-align: middle;
}

.header a .icon {
	margin-right: 0px;
}

.header .status {
	float:right;
	display: inline-block;
	vertical-align: middle;
	margin-top: 0px;
	margin-left: 10px;
	margin-bottom: 4px;
}

.header a.highlight,
.header a.highlighted {
	border-color: rgb(61, 86, 109);
	color: #222;
	text-shadow: 0px 1px 1px white;
}

.header a.stage {
	float: left;
	padding: 0px 6px 2px 6px;
	text-shadow: none;
	box-shadow: inset 0 1px 3px rgba(0,0,0,0.3), inset 0px -18px 30px -14px rgba(0, 0, 0, 0.2);
	color: black;
}

#onlineStatus {
	margin-left: 60px;
}

#onlineStatus img {
	filter: brightness(0) invert(1);
	-o-filter: brightness(0) invert(1);
	-moz-filter: brightness(0) invert(1);
	-webkit-filter: brightness(0) invert(1);
}

.foot {
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	font-size: 12px;
	line-height: 17px;
	max-height: 25%;
	min-height: 50px;
	overflow-y: auto;
	font-weight: 200;
	padding: 20px;
	background-color: #87657D;
	color: #FFFFFF;
}

.foot .statement {
	font-weight: bold;
	font-style: italic;
	margin: 10px 15%;
	max-width: 1200px;
	padding: 0px 5%;
}

.foot img.logo {
	position: absolute;
	bottom: 20px;
	left: 20px;
	height: 40px;
	width: auto;
}

img {
	border: none;
}

th {
	font-size: 110%;
}

hr {
	clear: both;
	margin-top: 24px;
	border-top: 1px ridge #DDD;
}

hr.whole {
	position: absolute;
	left: 0px;
	right: 0px;
	border: 1px solid #CCC;
}

.text-cropped {
	overflow: hidden;
	word-break: break-word;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.collapsed {
	display: none;
}

.expand .collapsed {
	display: block;
}

.hidden {
	display: none;
}

.subtle {
	color: gray;
	font-weight: normal;
	font-size: 90%;
}

.subtle i {
	line-height: 2em;
	font-size: 90%;
	color: darkslategray;
}

.code {
	display: inline-block;
	white-space: pre-line;
	text-align: left;
	font-weight: normal;
	font-family: 'Courier New', Consolas, sans-serif;
}

.reject {
	max-width: 400px;
	color: darkred;
}

.message {
	color: black;
	font-weight: bold;
	vertical-align: middle;
	font-size: 20px;
}

.message.success {
	color: #1e8ca2; /*darkgreen;*/
}


.time-dial {
	font-size: 1.1em;
	font-family: monospace;
	font-style: normal;
	color: darkblue;
}

.white {
	filter: brightness(0) invert(1);
	-o-filter: brightness(0) invert(1);
	-moz-filter: brightness(0) invert(1);
	-webkit-filter: brightness(0) invert(1);
}

.splash {
	position: absolute;
	left: 0px;
	right: 0px;
	height: 100%;
	width: 100%;
	background-image: url('../images/splash.png?v=3');
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center center;
	background-color: #FFF;
	background-size: auto 100%;
}

.left, .right, .centre {
	width: 50%;
	display: inline-block;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}

.left {
	float: left;
	clear: left;
}

.right {
	float: none;
	clear: none;
}

.centre {
	display: block;
	float: none;
	clear: both;
	margin: auto;
}

.preview {
	display: inline-block;
	min-height: 210px;
	width: 100%;
	border: 1px solid silver;
	background-color: white;
	background-repeat: no-repeat;
	background-position: center center;
}

.preview img {
	display: block;
	width: 100%;
	height: auto;
	border: 0px;
	padding: 0px;
	margin: 0px;
}

#camera_row img.photo-preview {
	margin: 0px 20px;
	vertical-align: top;
	max-height: 120px;
}

.force-show {
	display: block !important;
}

.force-hide {
	display: none !important;
}

/* Control Panel */

.control-panel {
	margin: 10px auto;
	width: 1000px;
}

.control-panel .Panel,
.control-panel .Section {
	display: inline-block;
	vertical-align: top;
	width: 26%;
	margin: 2%;
	padding: 1%;
}

.screen-panel {
	margin: 10px auto;
	min-height: 500px;
	width: 90%;
	border: 1px outset #F8F8F8;
}

.screen-panel .Section {
	width: 44%;
	max-width: 500px;
	margin: 2% 3% 0% 1%;
	margin-bottom: 0px;
}

.screen-data table.Results {
	width: 100%;
}

.screen-data {
	height: 100%;
	height: calc(100% - 30px);
	overflow-y: auto;
	clear: both;
	text-align: center;
}

.screen-data.chart {
	max-height: 700px;
	padding: 10px 0px;
}

.screen-bar {
	width: 100%;
	margin: 0px;
	height: 36px;
}

.screen-bar button {
	margin: 4px;
	height: 30px;
	min-width: 30px;
	padding: 1px;
}

.screen-bar .tab {
	margin: 4px;
	height: 27px;
	padding: 1px;
	width: 1px;
	border-left: 2px groove silver;
}

.screen-bar select {
	margin: 4px;
	height: 30px;
	padding: 1px;
}

.screen-bar button.selected {
	border-style: inset;
}

/* Headings */

.title {
	font-size: larger;
	font-weight: bold;
}

.title img {
	vertical-align: middle;
	margin: 1px 5px 5px 1px;
	height: 1.2em;
}

.title .name {
	white-space: normal;
	line-height: 0.9em;
	vertical-align: middle;
}

.title .extra {
	font-weight: normal;
	font-style: italic;
	margin: 0px;
}

.subtitle {
	margin: 8px 0px 4px 0px;
	color: rgb(20, 75, 100);
	font-style: italic;
}

.subtitle.right {
	clear: right;
}

.subtitle.left {
	clear: left;
}

.user-message {
	font-style: italic;
	display: inline-block;
	text-align: center;
}

.no-data {
	display: block;
	margin: auto;
	border: 1px solid #EEE;
	padding: 4em;
	background-image: url(../images/chart-faded.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	color: dimgray;
	font-size: 20px;
	font-style: italic;
	text-align: center;
}

/* Page Bar */

.bar {
	position: absolute;
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 38px;
	font-size: 22px;
	font-family: Verdana;
	overflow: hidden;
	text-align: center;
	z-index: 35;
	border-bottom: 1px solid gray;
	box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.1);
	zoom: inherit;
}

.bar, .silver, .record-list thead tr, .grid th, .data-view thead tr th {
	background-color: #E4E4E4;
}

.bar h2 {
	position: absolute;
	display: inline-block;
	left: 0px;
	margin: 6px;
	margin-top: 8px;
	width: auto;
	text-align: left;
	vertical-align: middle;
	font-weight: bold;
	font-size: 20px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: #015173; /* #3070A8;*/
}

.bar img.logo {
	position: absolute;
	right: 0px;
	margin: 8px;
	height: 60%;
	max-width: 30%;
	max-height: 24px;
}

.bar .status {
	min-width: 60px;
	margin: 0px auto;
	min-height: 100%;
	padding: 0.4em;
	vertical-align: middle;
	border-left: 2px groove #E0E0E0;
	border-right: 2px groove #E0E0E0;
	border-left: 1px solid #A0A0A0;
	border-right: 1px solid #E0E0E0;
}

.status {
	display: inline-block;
	font-size: 0.75em;
	line-height: 1em;
	text-align: center;
	vertical-align: top;
	font-size: 0.6em;
	-webkit-transition: width 0.5s;
	cursor: pointer;
}

.status.amber {
	color: #A09525;
}

.stage {
	display: inline-block;
	color: black;
	padding: 2px 6px;
	margin-left: 1em;
	font-size: 18px;
	font-size: 16px;
	vertical-align: bottom;
}

.onlineGreen {
	color: green;
}

.onlineAmber {
	color: goldenrod;
}

.onlineGrey {
	color: gray;
}

.onlineRed {
	color: red;
}

.report-message {
	color: gray;
	font-size: 15px;
	font-style: italic;
}

.report-status {
	margin: 12px;
	margin-bottom: 0px;
	vertical-align: middle;
	font-size: 18px;
	font-style: italic;
}

.report-status.warning {
	color: goldenrod;
}

.report-status .name {
	display: inline;
}

.report-status button .name {
	display: inline-block;
}

.popup .report-status {
	min-width: 600px;
}

.achived {
	background-color: #9CB0C6;
}

.lightblue {
	background-color: #4E8BF0;
}

.aqua {
	background-color: #6EAFAF;
}

.blue {
	background-color: #C0E0E5;
}

.purple {
	background-color: #9C4FCA;
}

.green {
	background-color: #90B87E;
}

.orange {
	background-color: #E7AE30;
}

.red {
	background-color: #F95E30;
}

.darkred {
	background-color: #CE1B1B;
}

.indianred {
	background-color: indianred;
}

.amber {
	background-color: #E0D065;
}

/* Navigation Bar */

.navbar {
	position: absolute;
	position: fixed;
	bottom: 0px;
	left: 0px;
	top: auto;
	z-index: 30;
	box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 100%;
	min-height: 57px;
	margin-left: 0px;
	overflow: visible;
	background-clip: border-box;
	background-color: rgb(120, 120, 123);
}

.navbar-list {
	width: 100%;
	overflow: visible;
	display: inline-block;
	margin-bottom: -4px;
	max-width: 1400px;
}

.navbar-item {
	border: 0;
	float: left;
	min-height: 1px;
	list-style: none;
}

.navbar-item a {
	display: block;
	height: 56px;
	border: 1px solid #333;
	border-top: 0px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	color: white;
	white-space: nowrap;
}

.navbar-item a:hover {
	background-color: #AAA;
}

.navbar-item a:active {
	color: silver;
}

.navbar-item a.disabled {
	background: #676666 !important;
	cursor: default;
}

.navbar-item a .icon {
	display: inline-block;
	margin: 6px;
	vertical-align: middle;
	margin-top: 18px;
}

.navbar-item a.glow {
	color: #99EEFF;
}

.navbar-item a .name {
	position: static;
	display: inline-block;
	white-space: nowrap;
	font-weight: bold;
	z-index: 1;
	width: auto;
	vertical-align: middle;
	font-size: 18px;
	margin-top: 20px;
	margin-left: 2px;
}

.navbar-item a.disabled .name {
	color: #111;
	text-shadow: silver 1px 1px 0px;
}

.navbar .list-items {
	position: absolute;
	bottom: 60px;
	box-shadow: rgba(0, 0, 0, 0.6) 0px 2px 8px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.6) 0px 2px 8px 0px;
}

.navbar-pager {
	position: absolute;
	position: fixed;
	bottom: 70px;
	left: 2%;
	top: auto;
	z-index: 30;
	height: 26px;
	line-height: 23px;
	opacity: 0.3;
	transition: opacity 0.5s;
	font-weight: bold;
	white-space: nowrap;
	background: white;
	box-shadow: 0 0 4px 2px white;
	border-radius: 10px;
}

.navbar-pager:hover {
	opacity: 0.6;
}

.navbar-pager a {
	display: inline-block;
	height: 20px;
	width: 20px;
	margin-left: 10px;
	margin-right: 10px;
	text-decoration: none;
	vertical-align: middle;
	line-height: 22px;
	border-radius: 10px;
	background: rgba(0,0,0,0.2);
	box-shadow: 0px 0px 3px rgba(0,0,0,0.6);
	color: navy;
}

.navbar-pager a:hover {
	background: rgba(0,0,80,0.4);
}

.navbar-pager a.current {
	background: navy;
	border: 2px solid navy;
	color: white;
}
/*
.ipad form,
.iphone form,
.nav-top form {
	padding-bottom: 0px;
	padding-top: 56px;
}

.ipad .navbar,
.iphone .navbar,
.nav-top .navbar {
	top: 39px;
	bottom: auto;
	box-shadow: 0px 1px 3px rgba(0,0,0,0.5);
	min-height: 55px;
}*/

.ipad .ribbon,
.iphone .ribbon,
.nav-top .ribbon {
	top: 120px;
	transform: matrix(0.707107, 0.707107, -0.707107, 0.707107, 0, 0);
	zoom: 0.9;
}

/* Web controls */

label {
	display: inline-block;
	min-height: 1em;
	margin: 2px;
	margin-right: 0.5em;
	padding: 0px;
	font-weight: bold;
	text-align: left;
}

xxxblockquote {
	border: 2px solid #CCC;
	background: white;
	box-shadow: rgba(0, 0, 0, 0.2) 1px 1px 6px 0px;
	color: rgb(66, 66, 66);
	overflow: hidden;
	border-collapse: collapse;
}

input, textarea, select, keygen, .file-control, blockquote, .value, .output {
	display: inline-block;
	font-size: 1em;
	line-height: 22px;
	min-height: 34px;
	text-align: left;
	margin: 2px;
	padding: 5px;
	padding-right: 1px;
	outline-width: 0px;
	background: white;
	box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	vertical-align: middle;
}

input[type=checkbox] {
	min-height: 0px;
	background: none;
	zoom: 1.6;
	box-shadow: none;
	min-width: 0px;
}

input[type=radio] {
	border: 0px none white;
	background: none;
	box-shadow: none;
	min-height: 0px;
}

input[type=number] {
	text-align: right;
	padding-right: 8px;
}

.chrome input[type=number] {
	padding-right: 2px;
}

input[type=color] {
	height: 38px;
	padding: 2px;
	cursor: pointer;
	/*Backwards Compatibility*/
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
	text-align: center;
}

input[type=color].blank::-webkit-color-swatch {
	background-color: transparent !important;
}

input[type=date] {
	min-height: 34px;
	-webkit-appearance: listbox;
}

input[type=search] {
	padding-right: 5px;
}

input[type=image] {
	margin: 0px;
	padding: 0px;
	border: 0px;
	box-shadow: none;
	background: none;
}

input[type=file] {
	position: relative;
	appearance: textfield;
	-ms-appearance: textfield;
	-moz-appearance: textfield;
	-webkit-appearance: textfield;
	padding: 2px;
}

input[type=file]:focus {
	box-shadow: inset 0px 1px 4px 0px rgba(0, 0, 0, 0.3);
}

input[type=file]::-webkit-file-upload-button {
	float: left;
	margin: 1px !important;
	cursor: pointer;
}

/* Highlights */

input.highlight, .dropdown.highlight, textarea.highlight {
	background-color: lightyellow;
}

input.highlight:read-only, .dropdown.highlight:read-only {
	background-color: cornsilk !important;
	background-image: linear-gradient(white, cornsilk);
}

.suggestions.highlight input {
	background-color: cornsilk !important;
}

tr.highlight td {
	background-color: cornsilk;
}

/* Disabled and Invalid */
input.disabled, li.disabled {
	background: rgb(240,240,240) !important;
	cursor: default;
}

.disabled, .disabled .title {
	color: #777 !important;
}

.invalid {
	color: #B00 !important;
}

.invalid .title {
	color: #900 !important;
}

li.archived .title {
	color: grey;
}

/* Form Controls */

form {
	position: relative;
	top: 38px;
	text-align: center;
	padding-bottom: 70px;
}

div form {
	padding-bottom: 0px;
}

form.popup-window {
	position: static;
	top: 0px;
	padding-bottom: 10px;
	padding-top: 0px;
}

form.popup-window .bar,
form.popup-window .navbar,
form.popup-window .ribbon,
form.popup-window .system-note {
	display: none;
}

form.popup-window .main {
	padding-bottom: 0px;
	max-height: 600px;
	zoom: 90%;
}

form.popup-window .window {
	zoom: 90%;
}

fieldset {
	width: 98%;
	min-width: 250px;
	border: 0px;
	display: inline-block;
	text-align: left;
	vertical-align: top;
	padding: 0px;
	margin: 1%;
}

fieldset.basic {
	display: inline-block;
	width: auto;
	margin: 3px;
}

fieldset legend {
	width: 300px;
	font-size: 135%;
	padding: 35px 0px 20px 30px;
	font-weight: bold;
	vertical-align: middle;
	text-align: left;
}

fieldset.basic legend {
	width: auto;
	padding: 0px;
	color: #0A556E;
	font-size: 18px;
	margin-left: 15px;
	background-image: none;
}

fieldset.fixed {
	position: fixed;
	right: 0px;
}

fieldset.left legend,
fieldset.right legend {
	text-align: left;
}

fieldset legend button {
	display: inline-flex;
}

fieldset .legend-panel {
	position: relative;
	float: right;
	width: 250px;
	margin-right: 30px;
	text-align: right;
	z-index: 1;
}

fieldset h4 {
	margin-left: 10px;
}

details summary {
	padding: 10px;
	font-size: 20px;
	font-weight: bold;
	text-align: left;
	cursor: pointer;
}

.labelstyle {
	font-size: 20px;
	margin-left: 20px;
	margin-top: 20px;
	padding: 10px 20px;
	position: relative;
	top: 10px;
}

.form-row {
	margin: 10px 20px;
	text-align: left;
	clear: left;
}

.form-row.message,
.form-row.controls {
	text-align: center;
	padding-top: 10px;
}

.form-row.controls button {
	max-width: 220px;
	min-width: 25%;
	white-space: nowrap;
}

.form-row.controls button.command {
	width: auto;
	min-width: 140px;
}

.form-row label {
	display: inline-block;
	width: 98%;
	line-height: 24px;
}

.form-row label.checkbox-label {
	width: 60%;
}

.form-row-button {
	position: absolute;
	margin-left: 4px;
	z-index: 1;
}

.form-row .list-box {
	display: inline-block;
}

.form-row input,
.form-row select,
.form-row keygen,
.form-row textarea,
.form-row blockquote,
.form-row .value,
.form-row .output,
.form-row .dropdown,
.form-row .suggestions,
.form-row .date-control,
.form-row .form-row-group,
.form-row .preview,
.form-row .file-control,
.form-row .attachments,
.form-row .list-box,
.form-row .yes-no {
	width: 99.5%;
	clear: left;
	margin: 1px 0;
	vertical-align: middle;
}

.column .form-row input,
.column .form-row select,
.column .form-row keygen,
.column .form-row textarea,
.column .form-row blockquote,
.column .form-row .value,
.column .form-row .output,
.column .form-row .dropdown,
.column .form-row .suggestions,
.column .form-row .date-control,
.column .form-row .form-row-group,
.column .form-row .preview,
.column .form-row .file-control,
.column .form-row .attachments,
.column .form-row .list-box,
.column .form-row .yes-no,
.column .form-row label,
.column legend {
	max-width: 500px;
}

.column .form-row {
	max-width: 500px;
	margin: 10px auto;
}

.column {
	max-width: 500px;
	margin:auto;
}

.column .form-row.details textarea {
	margin-top: 5px;
}

.form-row input[type=checkbox],
.form-row input[type=radio] {
	width: auto;
	zoom: 120%;
	min-height: 0px;
	margin: 3px 6px;
}

.form-row input[type=checkbox].slide {
	zoom: 100%;
}

.form-row-group {
	display: inline-block;
}

.form-row-label {
	display: inline-block;
}

.form-row var {
	padding: 5px;
	font-size: 20px;
}

.form-row h4 {
	margin: 18px;
	font-size: 18px;
	font-style: italic;
	text-align: center;
}

.form-summary {
	position: relative;
	margin: 10px;
	padding: 5px;
	line-height: normal;
	zoom: 0.9;
	font-size: 15px;
	clear: left;
}

.form-summary input {
	min-width: 160px;
}

.form-summary input[type=checkbox] {
	min-width: 0px;
}

.form-row-special {
	position: relative;
	display: inline-block;
	margin: 4px;
	padding: 8px;
	vertical-align: middle;
	font-size: 15px;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	text-shadow: 0px 1px 0px white;
	outline-width: 0px;
	border: 1px solid rgb(204, 204, 204);
	border-radius: 30px;
}

.form-row-special .title {
	margin: 10px;
	font-size: 18px;
	vertical-align: middle;
}

.form-row-special img {
	height: 40px;
	vertical-align: middle;
}

.form-summary div,
.form-row-special div {
	margin-left: 10px;
	margin-right: 10px;
	white-space: nowrap;
	display: inline-block;
}

.form-section {
	margin: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 5px;
	min-height: 100px;
	max-width: 1200px;
}

.form-section.tabbed {
	position: relative;
	border: 1px outset #999;
	background-color: white;
}

.form-section.column {
	margin-top: 0px;
}

.form-section-tag {
	position: relative;
	float: right;
	right: 21px;
	bottom: 47px;
	height: 20px;
	background: white;
	opacity: 0.8;
	padding: 2px;
	border: 1px solid gray;
	border-bottom-right-radius: 7px;
	cursor: pointer;
}

.column.fixed {
	height: auto;
	position: fixed;
	top: 100px;
	bottom: 100px;
	z-index: 15;
}

.form-section.fixed {
	position: fixed;
	top: 200px;
}

.form-section .form-row {
	margin: 15px;
}

.form-section.center {
	padding: 20px;
	max-width: 800px;
	margin: 20px auto;
	margin-left: auto;
	margin-right: auto;
}

.form-section h3,
.form-section .title {
	margin-top: 4px;
	color: rgb(20, 75, 100);
}

.form-section .note {
	margin: 20px 26px;
}

.form-section .note .name {
	display: inline;
}

.form-document {
	position: relative;
	background: white;
	padding: 20px;
	max-width: 800px;
	min-height: 100px;
	margin: 20px auto;
	margin-left: auto;
	margin-right: auto;
	border: 2px solid #CCC;
	box-sizing: border-box;
	box-shadow: rgba(0, 0, 0, 0.2) 1px 1px 6px 0px;
}

.form-document p,
.form-document textarea {
	font-family: Verdana;
	font-size: 13pt;
	text-align: left;
	margin: 0.6em 0.2em;
}

.form-document p.field {
	font-style: italic;
	margin-left: 0.4em;
}

.form-document .form-row {
	margin: 15px;
}

ul.attachments {
	padding: 5px;
	line-height: normal;
	font-size: 14px;
	display: inline-block;
	outline-width: 0px;
	min-height: 28px;
	border: 1px solid rgb(204, 204, 204);
}

ul.attachments li {
	float: left;
	display: inline-block;
	white-space: nowrap;
	list-style: none;
	margin: 0px;
	padding: 3px 12px;
	text-align: left;
	margin-left: 0px;
	padding-left: 6px;
}

ul.attachments li button {
	margin: 0px;
	font-size: 16px;
	font-style: italic;
	height: 35px;
}

ul.attachments li.file {
	overflow: hidden;
	color: #222;
	text-overflow: ellipsis;
	max-width: 250px;
	cursor: pointer;
}

ul.attachments li.file:hover {
	color: navy;
	text-decoration: underline;
	background-color: #DDD;
}

ul.attachments li.file var {
	vertical-align: middle;
	text-overflow: ellipsis;
	font-size: 1.2em;
	text-decoration: inherit;
}

ul.attachments li.file img {
	height: 2.5em;
	vertical-align: middle;
}

ul.attachments li.file img.photo {
	border: 1px solid white;
	box-shadow: rgba(0, 0, 0, 0.7) 0px 1px 3px 0px;
	min-width: 2em;
	background-color: gainsboro;
}

ul.attachments li.file img.photo:hover {
	position: absolute;
	height: auto;
	width: 250px;
	opacity: 0.75;
	margin: 0px;
	padding: 0px;
	box-shadow: rgba(0, 0, 0, 0.5) 0px 4px 9px 0px;
	border: 4px solid whitesmoke;
}

ul.attachments li.file input {
	display: none;
}

#popupAttachment h3 {
	padding: 4px;
	max-width: 500px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.collapse {

}

.collapse h2 {
	vertical-align: middle;
	margin-left: 5px;
	cursor: pointer;
}

.collapse h2:hover {
	text-decoration: underline;
}

.collapse h2 img {
	position: absolute;
	height: 1.2em;
	vertical-align: middle;
	margin: 0px;
	margin-right: 3px;
	left: -10px;
}

.required input {
	border-color: #0A556E;
}

.required.form-row::after {
	content: "*";
	position: absolute;
	display: inline-block;
	vertical-align: middle;
	font-size: 1.8em;
	margin: 4px;
	line-height: 30px;
	color: #0A556E;
	z-index: 0;
}

.required.note {
	right: 4px;
	position: absolute;
	vertical-align: middle;
	font-size: 0.9em;
	margin: 4px;
	display: inline-block;
	line-height: 30px;
	color: #0A556E;
	z-index: 0;
}

.filled input, input.invalid {
	border: 1px solid darkred;
}

.filled input:focus, input.invalid:focus {
	border: 1px solid darkred;
	box-shadow: 0 0 12px rgba(180, 20, 20, 0.8);
}

.filled::after {
	content: "MAX " attr(maxlength);
	width: 3em;
	position: absolute;
	color: darkred;
	right: -3em;
	top: 3px;
	text-align: center;
	text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
}

td.filled::after {
	position: initial;
}

.char-count {
	color: grey;
	text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
}

/* Tree Structure */

.tree {
	padding: 10px;
	position: relative;
	background: white;
	overflow-y: scroll;
	overflow-x: visible;
	max-height: 80%;
	min-height: 250px;
}

.tree .branch {
	margin: 5px;
	margin-left: 25px;
}

.tree .node {
	display: inline-block;
	padding-right: 10px;
	cursor: pointer;
	border-radius: 4px;
}

.tree .node.selected {
	color: #FFF;
	border: 1px solid #2373A5;
	border-color: #2373A5;
	background-color: #5393C5;
}

.tree .node.inactive {
	color: #777;
}

.tree .node.disabled {
	color: #888;
	cursor: default;
}

.tree .node.parent {
	cursor: pointer;
	font-weight: bold;
}

.tree .node:hover {
	background: #F5F8FF;
}

.tree .node.inactive:hover {
	background: none;
}

.tree .node.selected:hover {
	background: #5393C5;
	color: #EEF;
}

code.records {
	display: inline-block;
	padding: 2px 4px;
	border: 1px solid silver;
	margin-left: 1em;
	border-radius: 2px;
	background: white;
	color: black;
}

/* yes-no  */

.yes-no {
	display: inline-block;
}

.form-row .yes-no label {
	width: auto;
	margin: 4px;
	vertical-align: middle;
	white-space: nowrap;
	height: 1.4em;
	font-size: 1.2em;
	font-weight: normal;
}

.form-row .yes-no input {
	width: auto !important;
	zoom: 150%;
	vertical-align: middle;
	margin-right: auto;
	margin-left: 4px;
	height: auto;
	padding: 3px;
	min-height: 0px;
	/**/ background: none;
	/**/ box-shadow: none;
	/**/ border-style: solid;
	/**/ border-width: 1px;
}

/* Search Control */

.row-search {
	position: relative;
	text-align: left;
	white-space: nowrap;
	clear: both;
}

.row-search input {
	width: 98%;
	padding-left: 30px;
}

.row-search button {
	position: absolute;
	right: 0px;
	height: 36px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}

.search-before {
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	height: 18px;
	width: 18px;
	margin-top: -10px;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
	z-index: 20;
	background-color: #999;
	background-image: url('../images/icons.png?v=4');
	background-repeat: no-repeat;
	background-position: -612px 50%;
	opacity: 0.8;
}

.search-button {
	position: absolute;
	top: 0px;
	right: 0px;
	margin: 0px;
}

.search-button .icon {
	margin: 0px;
}

/* File Control */

.file-control {
	text-align: left;
	padding: 1px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.file-upload {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	overflow: hidden;
	cursor: pointer;
}

.file-control.sign {
	overflow: visible;
	text-overflow: initial;
}

.file-control input[type=file] {
	width: 100px;
	height: 40px;
	border: 0px;
	background: none;
	box-shadow: none;
	cursor: pointer;
}

.file-control input[type=text] {
	border: 0px;
	padding: 2px;
	background: none !important;
	box-shadow: none;
	vertical-align: middle;
	width: auto;
}

.file-upload input[type=image] {
	height: 40px;
	width: 40px;
}

.file-control button {
	vertical-align: middle;
	margin: 2px;
	padding: 2px 8px;
}

.file-control button img {
	width: auto;
	height: 100%;
	vertical-align: middle;
	padding: 0px;
	margin: -1px;
}

canvas.draw {
	width: 90%;
	margin: auto;
	margin-top: 1em;
	border: 1px inset gray;
	border-radius: 6px;
	background: white;
	cursor: pointer;
}

.sign .preview {
	border: 0px;
	padding: 5px 0px;
	background: none;
	min-height: 80px;
}

.sign .preview img {
	height: 80px;
	width: auto;
	margin-left: 5px;
}

/* Tab Controls */

.tabbed {
	position: relative;
	margin-top: 50px;
}

.tabs, .list-tabs {
	position: absolute;
	width: 100%;
	top: -38px;
	white-space: nowrap;
	overflow: visible;
	overflow-x: auto;
	padding-top: 2px;
}

.tab {
	position: relative;
	width: 17.5%;
	line-height: 18px;
	vertical-align: top;
	display: inline-block;
	white-space: nowrap;
	padding: 8px 5px;
	overflow: hidden;
	cursor: pointer;
	z-index: 25;
	text-align: center;
	text-overflow: ellipsis;
	border: 1px solid rgb(128, 128, 128);
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	font-weight: normal;
	text-decoration: none;
	background-color: #F8F8FA;
}

.list-tabs .tab {
	font-weight: bold;
	font-size: 20px;
	color: #555;
	text-shadow: 0px 1px #FFF;
}

a.tab:hover {
	padding-bottom: 11px;
	top: -2px;
}

.tab.add {
	font-weight: bold;
	color: white;
	width: 50px;
	left: -10px;
	z-index: 20;
	font-size: 30px;
	padding-left: 10px;
}

.tab.selected {
	font-weight: bold;
	border-bottom: 0px;
	padding-bottom: 10px;
	background-color: white;
}

/* Buttons */

button, input[type=button], input[type=submit], a.button {
	height: 38px;
	margin: 2px;
	margin-left: 10px;
	line-height: normal;
	font-size: 15px;
	font-weight: bold;
	padding: 1px 12px;
	cursor: pointer;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

button.toggle {
	border-style: inset;
}

button.command {
	width: 65%;
	max-width: 300px;
	min-width: 130px;
	margin: 10px;
	font-size: 18px;
	white-space: nowrap;
}

button.side {
	position: absolute;
	width: auto;
	right: 6px;
	padding: 2px;
}

button.link {
	height: auto;
	min-width: 100px;
	padding: 5px;
	text-decoration: underline;
}

button .icon {
	float: left;
	background-color: rgb(110, 175, 220);
	box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4);
	margin-right: 0px;
	margin-left: 0px;
}

body a.button {
	padding: 9px 18px;
	vertical-align: middle;
	display: inline-block;
	box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	text-decoration: none;
}

body a.button .name {
	margin: 8px;
}

li a.button {
	float: right;
	height: 32px;
	padding: 1px 4px;
}

li a.button .name {
	margin: 6px;
}

a.link {
	color: rgb(20, 105, 140);
	text-decoration: underline;
	cursor: pointer;
}

a.resource {
	color: rgb(20, 105, 140);
	font-weight: bold;
	margin: 0px 5px;
	font-size: 105%;
	cursor: pointer;
}

a.resource:hover {
	text-decoration: underline;
}

.form-row-group button {
	margin-left: 0px;
}

/* Checkbox */

input[type=checkbox]::-ms-check {
	height: 30px;
	width: 30px;
	padding: 2px;
	display: inline-block;
	font-size: 18px;
	line-height: 22px;
	text-align: left;
	margin: 2px;
	padding: 6px;
	padding-right: 1px;
	border: 1px solid gray;
	border-radius: 9px;
	outline-width: 0px;
	box-shadow: inset 0px 1px 4px 0px rgba(0, 0, 0, 0.3);
	background: white;
	vertical-align: middle;
}

input[type=checkbox].tick {
	height: 30px;
	width: 30px;
	display: inline-block;
	font-size: 18px;
	line-height: 22px;
	text-align: left;
	margin: 10px;
	padding: 4px;
	padding-right: 1px;
	border: 1px solid gray;
	border-radius: 9px;
	outline-width: 0px;
	box-shadow: inset 0px 1px 4px 0px rgba(0, 0, 0, 0.3);
	background: white;
	vertical-align: middle;
}

/* Date or Time Control */

.timexxx {
	float: left;
	display: inline-block;
	border: 1px solid black;
	background: white;
	padding: 1px 2px;
	margin: 1px 3px;
	margin-bottom: 0px;
	vertical-align: middle;
	color: #335;
}

.timexxx.highlighted {
	background-color: #d8e7f6;
}

.date-control {
	position: relative;
	display: inline-block;
}

.date-control input {
	width: 100% !important;
	min-height: 35px;
}

.date-control button {
	position: absolute;
	height: auto;
	right: 0px;
	top: 2px;
	bottom: 2px;
	padding: 0px 10px;
	margin: 4px;
	/**/ border-radius: 10px;
}

/* Lists */

.column-list {
	float: left;
	margin: 10px;
	margin-left: 20px;
	width: 96%;
}

.column-list li {
	float: left;
	width: 40%;
}

.dropdown, .output {
	cursor: pointer;
	min-height: 38px;
	outline: 0px;
	margin: 2px;
	padding: 8px;
	padding-right: 1px;
	width: 240px;
	overflow: visible;
	vertical-align: middle;
	border: 1px solid #CCC;
}

.dropdown .list-items {
	max-width: 500px;
}

.output {
	color: #555;
	height: auto;
	white-space: pre-wrap;
	white-space: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	cursor: default;
}

.detail {
	font-size: 16px;
	padding: 5px;
}

.dropdown:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	height: 18px;
	width: 18px;
	margin-top: -10px;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
	z-index: 20;
	background-color: #999;
	background-image: url('../images/icons.png?v=4');
	background-repeat: no-repeat;
	background-position: -216px 50%;
}

.dropdown.search:after {
	background-position: -612px 50%;
}

ul.alert {
	margin: 10px;
	text-align: left;
	overflow: hidden;
	min-height: 140px;
}

ul.alert {
	white-space: pre-line;
}

.container.dragover,
.control.dragover {
	border-top: 2px solid black !important;
}

td.dragover {
	background: #f6f8ff;
}

.list-items li.dragover,
.list-view li.dragover,
.list-box li.dragover {
	border-top: 2px dotted black;
}

.list-items dfn,
.list-view dfn,
.list-box dfn,
.list dfn {
	font-size: 0.8em;
	font-weight: normal;
	font-style: normal;
	margin-left: 0.62em;
}

.list-items,
.list-view,
.list-box {
	margin: 0px;
	padding: 0px;
	overflow: hidden;
	border: 1px solid #CCC;
}

.list-box {
	margin: 4px 1px;
}

.list-items.scroll,
.list-view.scroll,
.list-box.scroll {
	max-height: 360px;
	overflow-y: auto;
}

.list-items .group,
.list-view .group,
.list-box .group {
	padding: 5px;
	border: 1px solid #BBB;
	border-width: 0px 0px 1px 0px;
	color: #222;
	text-align: center;
	text-overflow: ellipsis;
	font-weight: bold;
	cursor: default;
}

.list-items li,
.list-view li,
.list-box li,
.list-items tr,
.list-menu-rows .menu-item,
.record-list thead tr {
	position: relative;
	border: 1px solid #CCC;
	border-width: 0px 0px 1px 0px;
	cursor: pointer;
	white-space: nowrap;
	list-style: none;
	margin: 0px;
	padding: 11px 15px;
	padding: 8px;
	padding-right: 0px;
	overflow: hidden;
	text-align: left;
	color: #222;
	background-color: #FFF;
}

.list-items li code,
.list-view li code,
.list-box li code {
	color: #567a86;
}

.list-view li code,
.list-box li code {
	float: right;
	margin-right: 20px;
	opacity: 0.75;
	font-size: 0.9em;
	vertical-align: middle;
	margin-top: 1px;
}

.list input[type=search],
.list-items input[type=search] {
	width: 100% !important;
	margin-bottom: 6px;
}

.dropdown span b {
	color: #567a86;
}

.record-list thead tr button {
	background: none;
	position: absolute;
	right: 3px;
	top: 2px;
}

.group em,
.group span {
	margin: 5px 4px;
	display: inline-block;
}

.group.collapsible {
	position: relative;
	text-align: left;
	vertical-align: middle;
	cursor: pointer;
}

.group.collapsible img {
	display: inline-block;
	vertical-align: middle;
	height: 20px;
	line-height: 20px;
	margin: 5px;
	margin-right: 0px;
}

.record-list thead tr,
.data-view thead tr,
.results thead tr,
.grid th,
.panel {
	color: #222;
	border-color: #AAA;
	background-color: #DDD;
	text-shadow: none;
}

.list-items li:hover,
.list-view li:hover,
.list-box li:hover,
.list-items tr:hover,
.list-menu-rows .menu-item:hover {
	color: #2F3E46;
	border-color: #BBB;
	background-color: #F8F8FA;
}

.list-items li.selected,
.list-view li.selected,
.list-box li.selected,
.list-items tr.selected {
	color: #FFF;
	border-color: #2373A5;
	background-color: #5393C5;
}

.list-items .selected .title,
.list-view .selected .title {
	color: #FFF;
}

.list-items li.selected.disabled,
.list-view li.selected.disabled,
.list-box li.selected.disabled,
.list-items tr.selected.disabled {
	color: #EEE !important;
	border-color: #84A8BE;
	background-color: #9BB9D0 !important;
}

.list-items li.empty,
.list-view li.empty,
.list-box li.empty {
	font-style: italic;
	background: rgb(240,240,240);
}

.list-items li dfn,
.list-view li dfn,
.list-box li dfn {
	display: block;
	margin: 0px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.list-items li img,
.list-view li img,
.list-box li img {
	width: auto;
	height: 2em;
	vertical-align: middle;
	margin-right: 10px;
}

.list-box li img {
	float:left;
	vertical-align: middle;
	margin: 0px;
	margin-right: 0.6em;
}


.list-items.large li,
.list-view.large li,
.list-box.large li {
	padding: 8px 11px;
}

.list-items.large li img,
.list-view.large li img,
.list-box.large li img {
	width: auto;
	height: 2em;
}

.list-items li img.checkbox,
.list-view li img.checkbox,
.list-box li img.checkbox {
	height: 1.2em;
	width: 1.2em;
}

.list-items input[type=checkbox],
.list-view input[type=checkbox],
.list-box input[type=checkbox] {
	float: right;
	height: 20px !important;
	width: 20px !important;
	min-height: 20px;
	background: none;
	background: #F0F0F0;
	min-width: 0px;
	margin: 2px;
	border-radius: 4px;
}

.list-items input[type=checkbox]:after,
.list-view input[type=checkbox]:after,
.list-box input[type=checkbox]:after,
.list-items input[type=checkbox]:before,
.list-view input[type=checkbox]:before,
.list-box input[type=checkbox]:before {
	content: none;
}

.list-view .group {
	padding: 7px;
	font-size: 17px;
}

/* list-box */

.list-box li {
	font-size: 0.9em; /*16px*/
	font-weight: bold;
}

.list-box li:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	height: 18px;
	width: 18px;
	margin-top: -10px;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
	z-index: 20;
	background-color: #999;
	background-image: url('../images/icons.png?v=4');
	background-repeat: no-repeat;
	background-position: -108px 50%;
}

/* Selection List */

.list-box.selection li:after,
.list-view.selection li:after {
	background-color: darkred;
	background-position: -72px 50%;
}

/* Multi Select List */

.list-box.multiselect li:after,
.list-view.multiselect li:after {
	content: none;
}

.list-box.multiselect li.chosen:after,
.list-view.multiselect li.chosen:after {
	content: "";
	background-color: darkred;
	background-position: -72px;
}

.list-box.multiselect li.selected:after,
.list-view.multiselect li.selected:after {
	content: "";
	background-color: #1e8ca2; /*darkgreen;*/
	background-position: -252px;
}

/* Check List */

.list-box.checklist,
.list-view.checklist {
	overflow-y: auto;
}

.list-box.checklist li.selected,
.list-view.checklist li.selected {
	content: "";
	background-color: #FAFAFA;
}

.list-box.checklist li:after,
.list-view.checklist li:after {
	content: "";
	background-color: rgba(240, 240, 240, 0.7);
	background-position: -683px;
	border-radius: 2px;
	box-shadow: inset 1px 1px 2px rgba(0,0,0,0.4);
}

.list-box.checklist li.selected:after,
.list-view.checklist li.selected:after {
	content: "";
	background-position: -648px;
}

.list-box.checklist.left li {
	padding-left: 35px;
}

.list-box.checklist.left li:after,
.list-view.checklist.left li:after {
	left: 10px;
}

/* Disabled List */

.list-box.disabled li:after,
.list-view.disabled li:after,
.list-box.results li:after,
.list-view.results li:after {
	content: none;
}

/* List box */

.list-box.results li,
.list-view.results li {
	cursor: auto;
	white-space: normal;
}

.list-box li.empty:after {
	content: none;
}

.list-box li span.icon {
	margin: 0px;
	margin-right: 4px;
	vertical-align: middle;
	margin-bottom: 4px;
}

.list-box li span.command {
	float: right;
	margin: 0px;
	margin-top: 2px;
	cursor: pointer;
}

.list-box li span.command:hover {
	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.8);
}

textarea.code,
.list-box li code,
.listbox.code li {
	font-family: consolas;
	font-size: 1.1em;
	font-weight: normal;
}

/* list-view */

.list-view {
	margin: 10px;
	clear: both;
}

.list-view li {
	padding: 10px;
	padding-right: 50px;
	font-size: 15px;
}

.list-view li.green {
	box-shadow: inset 0px -30px 30px rgba(40,180,40,0.1);
}

.list-view li.amber {
	box-shadow: inset 0px -30px 30px rgba(160,130,40,0.1);
}

.list-view li.red {
	box-shadow: inset 0px -30px 30px rgba(180,40,40,0.1);
}

.traffic-light-grey,
.list-view li.grey .traffic-light {
	color: darkgray;
}

.traffic-light-green,
.list-view li.green .traffic-light {
	color: darkgreen;
}

.traffic-light-amber,
.list-view li.amber .traffic-light {
	color: darkgoldenrod;
}

.traffic-light-red,
.list-view li.red .traffic-light {
	color: darkred;
}

.list-view li:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 9px;
	margin-top: -6px;
	width: 18px;
	height: 18px;
	border-radius: 9px;
	background-color: rgba(0, 0, 0, 0.4);
	background-image: url('../images/icons.png?v=4');
	background-position: -108px 50%;
	background-repeat: no-repeat;
	background-size: auto;
}

.list-view li p {
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 90%;
	overflow: hidden;
}

.list-view li p.title {
	float: left;
	clear: left;
	width: auto;
	min-width: 200px;
}

.list-view li label {
	width: auto;
	text-shadow: none;
	font-size: inherit;
}

.list-view li a.expand {
	display: inline-block;
	color: #424242;
	cursor: pointer;
	font-weight: bold;
	clear: left;
}

.list-view li a.expand:hover {
	color: #809fb5;
	text-decoration: underline;
}

.list-view li .icon {
	box-shadow: inset 1px 1px 5px rgba(0,0,0,0.4);
}

.list-view.multiselect li:after {
	content: none;
}

.list-view.condense li {
	white-space: normal;
}

.list-view.condense li p {
	display: inline-block;
	width: auto;
	max-width: 75%;
}

.list-view.condense li p.title {
	font-size: 16px;
	margin: 3px;
}

.list-view.condense li p.condense {
	min-width: 220px;
}

.list-view.condense li p.no-condense {
	display: block;
	padding-left: 240px;
	white-space: normal;
	clear: left;
}

#lstListview.condense li p.title {
	min-height: 49px;
}

li.archived .title {
	color: gray;
	color: #a4a29c;
}

li img.icon-extra {
	position: absolute;
	right: 40px;
	top: 50%;
	height: 30px;
	width: 30px;
	margin-top: -15px;
}

li .list-item-extra {
	position: absolute;
	top: 50%;
	height: 30px;
	margin-top: -15px;
	right: 40px;
}

li .list-item-extra img {
	height: 30px;
	width: auto;
}

li img.archived {
	position: static;
	height: 1.2em;
	width: auto;
	vertical-align: middle;
	margin: 6px;
	margin-top: 0;
}

/* Dropdown */

.list, .dropdown, .output {
	position: relative;
	display: inline-block;
	box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

.list .list-items {
	display: none;
	position: absolute;
	top: 40px;
	left: 50%;
	min-width: 180px;
	margin-left: -125px;
	overflow: visible;
	padding: 6px;
	color: #FFF;
	border: 1px solid #444;
	z-index: 40;
	overflow-y: auto;
	background-color: white;
	box-shadow: rgba(0, 0, 0, 0.6) 0px 2px 8px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.6) 0px 2px 8px 0px;
}

/* width */
.list .list-items::-webkit-scrollbar {
	width: 10px;
}

/* Track */
.list .list-items::-webkit-scrollbar-track {
	background: #f1f1f1;
}

/* Handle */
.list .list-items::-webkit-scrollbar-thumb {
	background: #888;
}

/* Handle on hover */
.list .list-items::-webkit-scrollbar-thumb:hover {
	background: #555;
}

.list.suggestions .list-items {
	top: 36px;
	left: 50%;
	height: auto;
	min-width: 100%;
	margin-left: -50%;
	padding: 0px;
	border: 1px solid #AAA;
}

.list.suggestions input {
	width: 98% !important;
	clear: left;
	vertical-align: middle;
}

.list input[type=search] {
	width: 98% !important;
	margin-bottom: 6px;
	margin: 4px;
}

.list-content {
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	padding-right: 5px;
	line-height: 20px;
	width: 90%;
}

.list-content img {
	height: 75%;
	vertical-align: middle;
	margin: 0px;
	float: left;
	position: absolute;
	left: 7px;
	top: 5px;
}

/* Record List */

table.record-list {
	position: relative;
	display: inline-block;
	min-height: 200px;
	font-size: 95%;
	table-layout: fixed;
	width: 100%;
	margin: 0 auto;
	padding: 0px;
	overflow: hidden;
	border: 1px solid #CCC;
	border-bottom: 1px solid #BBB;
	border-collapse: collapse;
	border-radius: 6px;
	-webkit-border-radius: 6px;
}

table.record-list caption {
	z-index: 200;
	width: 100%;
}

table.record-list thead {
	position: absolute;
	display: table;
	height: 32px;
	width: 100%;
	z-index: 10;
}

table.record-list tbody {
	position: absolute;
	display: table;
	bottom: 0px;
	top: 36px;
	margin: 0px;
	width: 100%;
	height: auto;
	max-height: 100%;
	overflow: auto;
	overflow-y: scroll;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #DDD;
	border-color: #DDD #DDD #CCC #BBB;
	border-spacing: 1px;
	border-radius: 0px;
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
	background: white;
	box-shadow: inset 0px 0px 3px rgba(0,0,0,0.7);
	/* Grid Display Settings:
	display: grid;
	justify-content: start;
	justify-items: stretch;
	 */
	/* New Display Settings: */
	display: flow;
}

table.record-list tfoot {
	position: absolute;
	display: block;
	bottom: 0px;
	width: 100%;
}

table.record-list thead tr {
	display: table-row;
}

table.record-list tbody tr {
	display: table-row;
	/* New Display Settings: */
	display: table;
	table-layout: fixed;
}

table.record-list tr button {
	width: 36px;
	height: 34px;
	float: right;
	padding: 0px;
	margin: 0px;
	margin: -2px;
	text-align: center;
	border-radius: 10px;
}

table.record-list tr button .icon {
	margin: 1px;
	float: none;
}

table.record-list.report tbody tr {
	background: white;
}

table.record-list tr {
	min-width: 100%;
	border: 0px solid #AAAAAA;
	box-shadow: 0px 1px 1px rgba(0,0,0,0.6);
}

table.record-list tr th {
	height: 30px;
	padding: 3px;
	padding-left: 5px;
	text-align: center;
	vertical-align: middle;
	font-size: 107%;
	cursor: default;
	border-bottom: 1px solid gray;
	border-bottom: 2px groove #DDD;
	color: #144B64;
	overflow: hidden;
	text-overflow: ellipsis;
}

table.record-list tr th.selecter {
	width: 45px;
}


table.record-list tr td {
	height: 30px;
	padding: 3px;
	padding-left: 5px;
	text-align: center;
	line-height: 1.3em;
	white-space: normal;
	vertical-align: middle;
	font-size: 100%;
	cursor: pointer;
	border-top: 1px solid #AAAAAA;
}

table.record-list td input,
table.record-list td select {
	width: 100%;
}

table.record-list tr td img {
	height: 1.3em;
	width: auto;
	padding: 5px;
	vertical-align: middle;
}

table.record-list tbody td.selecter {
	width: 30px;
	padding-right: 12px;
}

tr.noted td:nth-child(4) {
	background-image: url('../images/file.png');
	background-position: 0% 50%;
	background-size: 24px;
	background-repeat: no-repeat;
}

table.record-list .record-body tr td {
	border-left: 1px solid #E0E0E0; /* E9E9EF */
	border-bottom: 1px solid #E0E0E0;
	background-color: white;
	color: #444444;
}

table.data-grid {
	border-collapse: collapse;
	border: 1px solid silver;
	font-size: 15px;
	margin: auto;
}

table.data-grid th {
	padding: 6px;
	border-left: 1px solid #BBB; /* E9E9EF */
	border-bottom: 1px solid #BBB;
	text-align: center;
	vertical-align: middle;
}

table.data-grid td {
	padding: 4px;
	border-left: 1px solid #CCC; /* E9E9EF */
	border-bottom: 1px solid #CCC;
}

table.data-grid th.subheader.y {
	min-width: 30px;
}

table.data-grid .subheader th {
	text-align: left;
}

table.data-grid td {
	min-width: 80px;
}

table.data-grid thead th {
	font-size: 16px;
}

table.data-grid td,
table.data-grid th {
	padding: 4px;
}

table.data-grid.form td,
table.data-grid.form th {
	padding: 4px;
	border-left: 0px solid #E0E0E0; /* E9E9EF */
	border-bottom: 0px solid #E0E0E0;
}

table.data-view td.total,
table.data-grid td.total {
	background-color: #F8F8FF;
	font-weight: bold;
}

table.data-view td.grand.total,
table.data-grid td.grand.total {
	background-color: #F0F0FF;
	font-weight: bold;
}

th.subheader,
.subheader th {
	background: silver;
	text-align: left;
}


.data-view div.records {
	border: 1px solid #CCC;
	border-bottom: 1px solid #BBB;
	border-collapse: collapse;
	font-size: 15px;
}

table caption {
	padding: 6px;
	font-weight: bold;
	font-style: italic;
	margin-top: 10px;
	font-size: 15px;
}

/* Data View */

.data-view {
	position: relative;
	width: 100%;
	margin: 2px;
	padding: 0px;
	font-size: 15px;
	border: 1px solid #CCC;
	border-bottom: 1px solid #999;
	border-collapse: collapse;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #DDD;
	border-color: #DDD #DDD #CCC #BBB;
	border-spacing: 1px;
	background: white
}

table.data-view thead tr {
	border: 1px solid #CCC;
	border-width: 0px 0px 1px 0px;
	cursor: pointer;
	margin: 0px;
	padding: 11px 15px;
	text-align: center;
	box-shadow: 0px 1px 1px rgba(0,0,0,0.6);
	color: #222;
}

table.data-view tr th {
	height: auto;
	padding: 5px;
	padding-left: 8px;
	text-align: left;
	vertical-align: middle;
	cursor: default;
	border-bottom: 2px groove #DDD;
	background-color: #F4F5F6;
	color: #144B64;
	cursor: pointer;
}
/*table.data-view tr[title] th:hover */
table.data-view tr[title] th:hover {
	text-decoration: underline;
}

table.data-view tr td {
	padding: 3px;
	border-left: 1px solid #E0E0E0; /* E9E9EF */
	border-bottom: 1px solid #E0E0E0;
	background-color: white;
	color: #444444;
}

table.data-view th.subheader,
table.data-view .subheader th {
	background: #d4ccc7; /* sand */
	color: white;
}


table td.lookup {
	color: black;
	font-weight: bold;
	text-shadow: 1px 1px rgba(255,255,255,0.3);
}


.data-section-0 {
	max-width: 1100px;
	min-width: 60%;
	text-align: left;
	margin: auto;
	margin-bottom: 30px;
	padding-bottom: 20px;
}

.data-section-1 {
	max-width: 48%;
	min-width: 45%;
	display: inline-block;
	text-align: center;
	margin: auto;
	margin-bottom: 20px;
	padding-right: 20px;
	vertical-align: top;
}

.data-section-1 td,
.data-section-1 th {
	font-size: smaller;
}

.data-section-2 {
	max-width: 32%;
	min-width: 30%;
	margin: 0px;
	display: inline-block;
	vertical-align: top;
	overflow-x:auto;
	float:left;
}

.data-section-2 td, 
.data-section-2 th {
	font-size: 10px;
}

.data-section-2 h2,
.data-section-2 caption {
	font-size: 19px;
}

.data-section-0 .form-chart img {
	width: 94%;
}

.data-message {
	text-align:center;
	font-style:italic;
}

.data-message code {
	font-size:105%;
}

/* Results Table */
.results {
	width: 100%;
	margin: 0px;
	padding: 0px;
	font-size: 14px;
	-webkit-overflow-scrolling: touch;
	border-collapse: collapse;
	border: 1px solid #DDD;
	border-color: #DDD #DDD #CCC #BBB;
	border-spacing: 1px;
	background: white;
}

table.results thead tr {
	border: 1px solid #CCC;
	border-width: 0px 0px 1px 0px;
}

table.results tr th {
	padding: 2px;
	text-align: left;
	vertical-align: middle;
	border-bottom: 2px groove #DDD;
}

table.results tr td {
	padding: 2px;
	text-align: left;
	border-bottom: 1px solid #E0E0E0;
	color: #444444;
}

/* Login */

form.login {
	max-width: 600px;
	*width: 600px; /*Needed for IE*/
}

form.login .header {
	box-shadow: none;
	-webkit-box-shadow: none;
}

form.login .main {
	padding-bottom: 0px;
}

form.login .sign {
	position: absolute;
	left: 6px;
	top: 6px;
}

.login-panel {
	width: 480px;
	width: 470px;
	margin: auto;
	padding: 10px;
	text-align: left;
	max-width: 94%;
}

.login-logo {
	padding-top: 20px;
	margin: auto;
}

.login-info {
}

.login-info h2 {
	margin: 0px;
	font-size: 1.8em;
	font-weight: normal;
}

.login-info hr {
	clear: left;
	border: 0px none;
	margin: 40px 0px;
	text-align: left;
}

.login-icon {
	float: right;
	height: 120px;
	*border: 1px solid silver;
	box-shadow: 0px 1px 2px rgba(0,0,0,0.4);
	border-radius: 20px;
	vertical-align: middle;
	margin: 5px;
}

.landing {
	padding-top: 80px;
	text-align: left;
	max-width: 1700px;
	margin: auto;
}

.landing .bar {
	height: 80px;
	box-shadow: none;
	border: none;
}

.landing #PageLogo {
	height: 28px;
	padding: 18px 25px;
}

.landing #PageTitle {
	margin: 22px 30px;
	padding: 1px;
	font-size: 28px;
	vertical-align: middle;
	height: auto;
}

.landing .login {
	margin: 0px;
	float: right;
	margin: 0px;
	left: auto;
	right: 0px;
	top: 0%;
	width: 25%;
	box-shadow: none;
	min-width: 370px;
	margin: 5% 5% 5% 0%;
}

.landing #content_main,
.landing #content_extra {
	width: 50%;
}

.landing #nav_Legals {
	display: none;
}

.landing #version {
	display: none;
}

/* Sections */

.section {
	margin: 10px 20px;
	clear: left;
}

.panel {
	margin: 2px;
	overflow: hidden;
	border: 1px solid #CCC;
	padding: 20px;
	overflow: visible;
}

.panel h1,
.panel h2,
.panel h3,
.panel h4,
.panel h5 {
	padding: 0px;
	margin: 4px 0px 12px 0px;
}

.record {
	position: relative;
	text-align: left;
	min-width: 250px;
	margin: 10px;
	padding: 5px;
	vertical-align: top;
	font-size: 17px;
	border: 1px solid #999;
	background: white;
	color: #444;
	overflow: hidden;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-collapse: collapse;
	max-height: 130px;
	/**/ border: 2px solid #CCC;
	/**/ box-shadow: rgba(0, 0, 0, 0.2) 1px 1px 6px 0px, inset 0px -6px 6px rgba(255,255,255,0.4);
	/**/ border-radius: 9px;
	/**/ transition: height 1s, max-height 1s;
}

.record table {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	border-spacing: 0px;
}

.record table.data-view {
	width: auto;
}

.record table.data-view th {
	font-size: 100%;
}

.record td {
	padding: 0px;
}

.record ul {
	margin: 4px;
	padding: 0px 12px;
}

.record var {
	margin: 4px 0px;
	margin-left: 2px;
	font-style: italic;
}

.record var button {
	height: 32px;
	margin: 0px 4px;
}

.record label {
	margin: 3px;
	display: inline-block;
}

.record label:after {
	content: ": ";
}

.record .expand,
.record .collapse,
.form-summary .expand,
.form-summary .collapse {
	position: absolute;
	bottom: 4px;
	right: 4px;
	cursor: pointer;
	background-color: rgb(128, 159, 181);
}

.record hr {
	clear: both;
	float: left;
	width: 100%;
}

.bullet {
	display: inline-block;
	vertical-align: middle;
	margin: 4px;
	width: 10px;
	height: 10px;
	border-radius: 5px;
	background:silver;
}

.list-content .bullet {
	float:left;
}

.name,
.caption {
	vertical-align: middle;
	display: inline-block;
	text-overflow: ellipsis;
	text-decoration: inherit;
	margin: 6px;
}

.note .name,
.note .caption {
	display: inline;
}

.icon, .icon-simple {
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	margin: 6px;
	width: 18px;
	height: 18px;
	line-height: 19px;
	padding: 0px;
	border: 0px none;
}

.icon-simple {
	height: 28px;
	width: auto;
}

.action, .icon-action {
	cursor: pointer;
	vertical-align: middle;
}

.input-extra {
	position: absolute;
	height: 20px;
	margin: 4px;
	margin-top: -12px;
	right: 5px;
	bottom: 0px;
	width: auto;
}

.icon-text {
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	margin: 0px 2px;
	height: 1em;
	width: auto;
	border: 0px none;
}

img.icon-help {
	display: inline-block;
	vertical-align: middle;
	margin: 5px;
	width: 16px;
	height: auto;
	line-height: 19px;
	padding: 0px;
	border: 0px none;
	cursor: help;
}

.icon {
	border-radius: 9px;
	background-color: rgb(102, 102, 102);
	background-image: url('../images/icons.png?v=4');
	background-position: 0px 50%;
	background-repeat: no-repeat;
	background-color: rgba(0, 0, 0, 0.4);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
	-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
}

.icon.add {
	background-position: 0px;
	background-color: green;
}

.icon.alert {
	background-position: -504px;
	background-color: goldenrod;
}

.icon.highlighted {
	background-position: -540px;
	background-color: goldenrod;
}

.icon.info {
	background-position: -540px;
	background-color: lightseagreen;
}

.icon.risk {
	background-position: -504px;
	background-color: chocolate;
}

.icon.recreate {
	background-position: -396px;
	background-color: darkgoldenrod;
}

.icon.cancel {
	background-position: -144px;
	background-color: silver;
}

.icon.back {
	background-position: -396px;
	background-color: silver;
}

.icon.forward {
	background-position: -360px;
	background-color: olivedrab;
}

.icon.previous {
	background-position: -396px;
}

.icon.next {
	background-position: -360px;
}

.icon.open {
	background-position: -360px;
}

.icon.remove {
	background-position: -72px;
	background-color: darkred;
}

.icon.update {
	background-position: -252px;
	background-color: green;
}

.icon.refresh {
	background-position: -324px;
	background-color: darkblue;
}

.icon.delete {
	background-position: -216px;
	background-color: darkred;
}

.icon.expand {
	background-position: -216px;
	background-color: rgb(128, 159, 181);
}

.icon.collapse {
	background-position: -180px;
	background-color: rgb(128, 159, 181);
}

.icon.notification {
	background-position: -252px;
	background-color: silver;
}

.icon.locked {
	background-position: -792px;
	background-color: purple;
}

.name.locked {
	color: purple;
}

.icon.checkedOut {
	background-position: -792px;
	background-color: mediumseagreen;
}

.icon.cross {
	background-position: -72px;
}

.icon.load {
	background-position: -108px;
	background-color: teal;
}

.icon.exit {
	background-position: -108px;
	background-color: purple;
}

.icon.email {
	background-position: -827px;
}

.icon.camera {
	background-position: -864px;
	background-color: cadetblue;
}

.icon.edit {
	background-position: -288px;
}

.icon.selecter {
	background-position: -108px;
}

.icon.followup {
	background-position: -360px;
	background-color: steelblue;
}

.icon.action {
	background-position: -432px;
}

.icon.search {
	background-position: -612px;
}

.icon.blank {
	background-position: 72px;
}

.icon.edited {
	background-position: -252px;
	background-color: #84C81C;
}

.icon.edited2 {
	background-position: -648px;
	background-color: greenyellow;
}

.icon.upload {
	background-position: -180px;
	background-color: purple;
	background-color: rebeccapurple;
}

.icon.download {
	background-position: -216px;
	background-color: green;
}

.icon.sync {
	background-position: -180px;
	background-color: goldenrod;
}

.icon.up {
	background-position: -180px;
}

.icon.down {
	background-position: -216px;
}

.icon.dark {
	background-color: rgba(0, 0, 0, 0.4);
}

.icon.help {
	background-position: -972px;
}

.icon.logout {
	background-position: -1044px;
}

img.checkbox {
	display: inline-block;
	vertical-align: middle;
	background-color: rgb(102, 102, 102);
	background-image: url('../images/icons.png?v=4');
	background-position: 0px 50%;
	background-repeat: no-repeat;
	background-color: rgba(240, 240, 240, 0.7);
	background-position: -684px;
	border-radius: 3px;
	min-width: 1.2em;
	min-height: 1.2em;
}

.checkbox.ticked {
	background-position: -647px;
}

.checkbox.unticked {
	background-position: -683px;
}

/* Design change */

.design .main h2 {
	text-shadow: #FFF 0px 1px 0px;
}

.design label {
	color: rgb(66, 66, 66);
}

.login-panel label {
	color: #1A3954;
	text-shadow: 0px -1px #FFF;
}

.datagridcolumn .alert {
	background: blue;
	color: #FFF;
	position: absolute;
	border-radius: 2em;
	font-size: 80%;
	font-weight: bold;
	border: 1px solid blue;
	padding: 4px 3px 2px 3px;
	line-height: 110%;
	min-width: 1.1em;
}

/* Menu System */

#menu {
	max-width: 80%;
}

.menu {
	display: inline-block;
	max-width: 1100px;
	padding: 2%;
	margin: auto;
	z-index: 30;
}

.menu h2 {
	margin: 20px;
	margin-top: 8px;
	font-size: 28px;
	text-align: left;
}

.menu h3 {
	margin: 20px;
	font-size: 22px;
	text-align: left;
}

.menu p {
	margin: 20px;
	font-size: 110%;
	text-align: left;
	line-height: 1.4;
}

.sub-menu {
	padding-top: 10px;
	display: inline-block;
	margin: auto;
	white-space: pre-wrap;
}

.menu-image {
	display: none;
	position: relative;
	padding: 10px;
	font-size: 1.2em;
}

.menu-details {
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	padding: 5%;
	background: rgba(245,245,245,0.7);
	font-size: 1.5em;
	overflow: visible;
	overflow-x: visible;
	overflow-y: auto;
}

.menu-image .controls {
	position: absolute;
	bottom: 10px;
	right: 10px;
	left: 10px;
	padding: 14px 15px 15px;
	margin: 0px;
	min-height: 33px;
	text-align: right;
	background-color: #F5F5F5;
	z-index: 20;
}

.menu-details #version_history {
	padding-bottom: 60px;
}

.menu-item {
	width: 160px;
	height: 120px;
	margin: 30px 10px 20px 40px;
	border-radius: 15px;
	text-decoration: none;
	font-size: 1.4em;
}

.menu-item {
	display: block;
	position: relative;
	float: left;
	width: 140px;
	height: 150px;
	margin: 30px 34px;
	text-decoration: none;
	font-size: 22px;
	cursor: pointer;
}

.menu-item.selected {
	outline-color: deeppink;
	outline-width: 2px;
	outline-style: auto;
}

.menu-item img {
	width: 100%;
	height: auto;
}

.menu .menu-item img {
	width: 80%;
}

.menu-item span {
	position: static;
	margin-left: 3%;
	text-align: center;
	color:black;
}

.list-menu .menu-item:hover {
	top: -3px;
	background: rgba(240, 250, 255, 0.1);
	box-shadow: 0 0 8px 8px rgba(240, 250, 255, 0.1);
	color: rgb(240, 240, 255);
}

.list-menu-rows .menu-item:hover {
	background: rgba(240, 250, 255, 0.1);
	box-shadow: 0 0 8px 8px rgba(240, 250, 255, 0.1);
	color: rgb(240, 240, 255);
	font-weight: bold;
}

.menu-item.disabled:hover {
	top: 0px;
	background: none;
	box-shadow: none;
}

.menu-item.disabled {
	opacity: 0.5;
	cursor: default;
}

.menu-option {
	display: block;
	position: relative;
	float: left;
	white-space: nowrap;
	width: 260px;
	height: auto;
	margin: 10px 2px 20px 50px;
	border-radius: 15px;
	color: white;
}

.menu-option img {
	width: 60px;
	height: 60px;
	vertical-align: middle;
}

.menu-option button {
	width: 200px;
	vertical-align: middle;
}

/* File Menu */

.file-menu .menu-item {
	width: 140px;
	margin: 10px;
	padding-bottom: 10px;
}

.file-menu .menu-item span {
	position: static;
	margin-bottom: 10px;
	display: inline-block;
	width: 100%;
	margin: 2px;
	font-size: 16px;
	text-align: center;
	color: #000;
	line-height: 18px;
	text-shadow: none;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
}

.file-menu .menu-item img {
	width: 80%;
	padding: 0 10%;
}

/* list menu */

.list-menu .menu-item {
	display: block;
	position: relative;
	float: left;
	width: 178px;
	height: 160px;
	margin: 25px 20px;
	margin-bottom: 5px;
	text-align: center;
	padding-bottom: 20px;
	text-decoration: none;
	color: white;
}

.list-menu.gallery .menu-item {
	width: auto;
	margin-left: 25px;
}

.list-menu .menu-item img {
	width: auto;
	height: 80%;
	min-height: 100px;
}

.list-menu .menu-item img.preview {
	margin-top: 4px;
	box-shadow: 0px 2px 8px -1px rgba(0,0,0,0.3);
}

.list-menu .menu-item span {
	display: block;
	position: relative;
	top: 0px;
	width: 100%;
	max-width: 200px;
	font-size: 0.8em;
	margin: 0px;
	color: #124;
}

.list-menu .menu-item span.info {
	display: none;
}

.list-menu .menu-item span .extra {
	position: absolute;
	left: auto;
	right: 20px;
	top: -50px;
	display: inline-block;
	width: 50px;
	height: 50px;
	background-image: none;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.list-menu .menu-item span .extra.flag {
	width: 60px;
	height: 30px;
	top: -40px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.8);
}

.list-menu .menu-item span .count {
	position: absolute;
	left: 20px;
	top: -40px;
	display: inline-block;
	width: auto;
	height: 24px;
	font-weight: bold;
	font-size: 21px;
	padding: 0px 2px;
	min-width: 22px;
	color: white;
	background-color: goldenrod;
	border: 1px solid white;
	border-radius: 14px;
}

.list-menu.compact .menu-item {
	width: 130px;
	height: 100px;
	margin: 15px 2px 2px 15px;
	font-size: 19px;
}

.list-menu.compact .menu-item img {
	width: auto;
	height: 80%;
	min-height: 90px;
}

.list-menu.compact .menu-item span .extra {
	right: 10px;
	top: -10px;
	display: inline-block;
	width: 40px;
	height: 40px;
}

.list-menu.compact .menu-item span .extra.flag {
	top: -25px;
	width: 40px;
	height: 20px;
}

.list-menu.documents {
	font-size: 13px;
}

.list-menu.documents .menu-item {
	width: 150px;
	height: 120px;
	margin: 10px;
	margin-bottom: 35px;
}

.list-menu.documents .menu-item .extra {
	height: 30px;
	width: 30px;
	top: -33px;
}

/* list menu rows */

.list-menu-rows {
	display: block;
	margin: 40px auto;
	width: 90%;
}

.list-menu-rows .menu-item {
	display: inline-block;
	position: relative;
	float: none;
	box-sizing: border-box;
	width: 100%;
	height: 65px;
	margin: 0px;
	margin-bottom: -1px;
	padding: 6px;
	text-align: left;
	text-decoration: none;
	vertical-align: middle;
	border: 1px solid #dbdbdb;
	border-radius: 0px;
	color: white;
	width: 100%;
}

.list-menu-rows .menu-item:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	height: 21px;
	width: 21px;
	margin-top: -10px;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 11px;
	z-index: 20;
	background-color: #87657D;
	background-image: url('../images/icons.png?v=4');
	background-repeat: no-repeat;
	background-position: -127px 50%;
	background-size: auto 100%;
}

.list-menu-rows .menu-item img {
	width: auto;
	height: 100%;
	min-height: 0px;
	vertical-align: middle;
	margin-right: 0.5em;
}

.list-menu-rows .menu-item span.item,
.list-menu-rows .menu-item span.item-name {
	position: static;
	display: inline-block;
	font-size: 0.85em;
	margin: 0px;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: left;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
	text-shadow: 0px 1px 1px #FFF;
	color: #124;
	width: auto;
	width: 50%;
}

.list-menu-rows .menu-item span.item-name {
	overflow: hidden;
	white-space: normal;
	text-overflow: ellipsis;
	vertical-align: middle;
	width: 60%;
}

.list-menu-rows .menu-item span.info {
	display: inline-block;
	font-size: 0.7em;
	width: auto;
	color: darkgray;
}

.list-menu-rows .menu-item span .extra {
	position: absolute;
	left: auto;
	right: 20px;
	top: 12px;
	display: inline-block;
	width: 40px;
	height: 40px;
	background-image: none;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.list-menu-rows .menu-item span .extra.flag {
	top: 20px;
	height: 25px;
	width: 50px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.8);
}

.list-menu-rows .menu-item span .count {
	position: absolute;
	left: 20px;
	top: -40px;
	display: inline-block;
	width: auto;
	width: 50px;
	height: 24px;
	font-weight: bold;
	text-shadow: 0px 1px black;
	font-size: 21px;
	padding: 0px 2px;
	min-width: 22px;
	color: white;
	background-color: goldenrod;
	border: 1px solid white;
	border-radius: 14px;
	box-shadow: 0px 1px 7px rgba(0,0,0,0.7), inset 0px 0px 2px 4px rgba(0,0,0,0.2);
}

.list-menu-rows.compact .menu-item {
	height: 36px;
	padding: 2px;
	font-size: 19px;
}

/* list menu rows - documents */

.list-menu-rows.documents {
	font-size: 13px;
	border: 0px none;
}

.list-menu-rows.documents .menu-item {
	width: 100%;
	border: 0px none;
}

.list-menu-rows.documents .menu-item .extra {
	height: 30px;
	width: 30px;
	top: 16px;
}

.list-menu-rows.documents .menu-item span {
	width: 60%;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: middle;
}

.list-menu-rows.documents .menu-item span.info {
	width: 20%;
	display: none;
}

/* list menu rows - blocks */

.list-menu-rows.blocks {
	font-size: 14px;
	border: 0px none;
	margin: 20px auto;
}

.list-menu-rows.blocks .menu-item {
	width: 100%;
	border: 0px none;
	margin-bottom: 20px;
	overflow:visible;
	height: 100px;
}

.list-menu-rows.blocks .menu-item:after {
	content: none;
}

.list-menu-rows.blocks .menu-item img {
	float: left;
	height: 80%;
	margin: 1%;
}

.list-menu-rows.blocks .menu-item .extra {
	height: 30px;
	width: 30px;
	top: 16px;
}

.list-menu-rows.blocks .menu-item .item-name,
.list-menu-rows.blocks .menu-item span.item {
	margin: 14px;
	text-overflow: ellipsis;
	display: inline-block;
	width: auto;
	min-width: 120px;
	text-align: left;
}

.list-menu-rows.blocks .menu-item span.info {
	width: 60%;
	display: inline-block;
	text-align: left;
	margin: 4px 14px;
	float: left;
	color: #015174;
	font-weight: bold;
}



/* Dialog Controls */

.mask {
	position: absolute;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 50;
	min-width: 100%;
	min-height: 100%;
	background: rgb(200, 200, 255);
	opacity: 0.5;
	cursor: wait;
}

.dialog {
	left: 50%;
	top: 50%;
	z-index: 65;
	height: auto;
	*width: 330px;
	min-width: 330px;
	max-width: 450px;
	overflow: hidden;
	margin-left: -150px;
	margin-top: -100px;
	font-size: 14px;
	cursor: default;
	*border: 1px outset silver;
	color: black;
}

.dialog,
.floating,
.tooltip {
	position: absolute;
	position: fixed;
	z-index: 60;
	border: 0 solid #A9A9A9;
	background-color: #FFF;
	-webkit-box-shadow: 0 1px 20px rgba(0,0,0,0.75);
	-moz-box-shadow: 0 1px 20px rgba(0,0,0,0.75);
	box-shadow: 0 1px 20px rgba(0,0,0,0.75);
	font-size: 1rem;
}

.dialog.moving, floating.moving {
	-webkit-box-shadow: 0px 2px 30px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: 0px 2px 30px rgba(0, 0, 0, 0.6);
	box-shadow: 0px 2px 30px rgba(0, 0, 0, 0.6);
	color: #444;
	z-index: 70;
	zoom: 1.01;
}

.field-note {
	/*position: relative !important;*/
	position: absolute;
	left: 10px;
	zoom: 0.6;
	opacity: 0.7;
	padding: 6px;
	top: 30px;
	left: 90%;
	border: none;
	filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.7));
}

.field-note:before {
	content: "";
	border: 15px solid white;
	border-color: transparent white transparent transparent;
	position: absolute;
	left: -27px;
	top: 7px;
}

.moving {
	z-index: 70;
}

.dialog-titlebar {
	left: 1px;
	top: 1px;
	position: relative;
	text-align: center;
	margin: -2px -2px 2px -2px;
	padding: .8em .3em .8em 1em;
	font-weight: bold;
	color: white;
	cursor: move;
	border: 0 solid #AAA;
}

.dialog.help .dialog-titlebar {
	cursor:default;
}

.dialog.error .dialog-titlebar {
	/**/ background-color: rgb(200, 50, 50);
}

.dialog.warning .dialog-titlebar {
	/**/ background-color: rgb(180, 140, 40);
}

.dialog.success .dialog-titlebar {
	/**/ background-color: rgb(30, 150, 65);
}

.dialog-close {
	position: absolute;
	right: 8px;
	top: 16px;
	margin: -8px 2px 0 0;
	padding: 0;
	font-size: 18px;
	font-weight: normal;
	height: 25px;
	width: 27px;
	color: #FFF;
	text-decoration: none;
	background: none;
	border-radius: 4px;
	font-family: verdana;
	vertical-align: top;
}

.dialog-title {
	margin: .1em 0 .2em;
	font-size: 1.2em;
	font-weight: normal;
}

.dialog-message {
	height: 100%;
	padding: 10px;
	padding-top: 5px;
	font-family: Arial;
	font-weight: normal;
	color: #0D0D0D;
	font-size: 1.15em;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	height: auto;
	width: auto;
}

.dialog-details {
	padding: 10px;
	min-height: 30px;
	font-size: 0.9em;
	line-height: 16px;
	border-top: 1px solid #A9A9A9;
}

.dialog-details img {
	height: 1.2em;
	vertical-align: bottom;
	margin: 0px 2px;
}

.dialog-content {
	display: block;
	width: auto;
	min-height: 0px;
	height: auto;
	max-height: 800px;
	margin-bottom: -5px;
	position: relative;
	overflow: auto;
	text-align: left;
	border: 0;
	padding: .5em;
	color: #222;
}

.dialog-controls {
	padding: 14px 15px 15px;
	margin: 0;
	text-align: right;
	background-color: #F5F5F5;
	border-top: 1px solid #DDD;
	-webkit-border-radius: 0 0 6px 6px;
	-moz-border-radius: 0 0 6px 6px;
	border-radius: 0 0 6px 6px;
	-webkit-box-shadow: inset 0 1px 0 #FFF;
	-moz-box-shadow: inset 0 1px 0 #fff;
	box-shadow: inset 0 1px 0 #FFF;
	border-width: 1px 0 0 0;
	color: #222;
}

.dialog-button {
	font-size: 14px;
	font-weight: normal;
}

#dialogWaitUpdate {
	font-size: smaller;
	margin-top: 3px;
	color: #808080;
	font-style: italic;
}


/* Toast */

.toaster {
	position: absolute;
	position: fixed;
	bottom: 10px;
	left: 0px;
	right: 0px;
	text-align: center;
	z-index: 70; /*Above popups */
}

.toast {
	position: absolute;
	position: fixed;
	display: inline-block;
	left: 50%;
	bottom: 20px;
	z-index: 60;
	height: auto;
	width: auto;
	font-size: 15px;
	width: 400px;
	margin-left: -200px;
	max-height: 300px;
	overflow: hidden;
	background: #FFF;
	cursor: default;
	border: 1px outset white;
	z-index: 70; /*Above popups */
	-webkit-box-shadow: 0 2px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 2px 10px rgba(0,0,0,0.5);
	box-shadow: 0 2px 10px rgba(0,0,0,0.5);
	animation-fill-mode: forwards;
}

.toaster .toast {
	position: static;
	display: block;
	margin: 10px auto;
	left: auto;
	bottom: auto;
	margin-left: auto;
}

.toast-titlebar {
	position: relative;
	padding: 5px;
	vertical-align: middle;
	min-height: 20px;
}

.toast-title {
	font-size: 100%;
	font-weight: normal;
	vertical-align: middle;
}

.toast-message {
	display: inline-block;
	vertical-align: middle;
	padding: 5px;
	font-family: Arial;
	font-weight: normal;
	color: #0D0D0D;
	font-size: 100%;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	height: auto;
	width: auto;
	width: calc(100% - 2.2em - 20px);
}

.toast-details {
	padding: 8px 0px 0px 8px;
	line-height: 16px;
	font-size: 90%;
	font-style: italic;
	border-top: 1px solid #A9A9A9;
}

.toast-content img {
	height: 1.2em;
	height: 2.2em;
	width: auto;
	vertical-align: middle;
	margin: 5px;
}

.toast-content {
	display: block;
	width: auto;
	min-height: 0px;
	height: auto;
	position: relative;
	overflow: auto;
	text-align: left;
	border: 0;
	padding: 8px;
	color: #222;
}

.toast-extra {
	display: block;
	width: 100%;
	overflow: hidden;
	word-break: break-word;
	text-overflow: ellipsis;
	max-width: 400px;
	margin-top: 0.5em;
}

.toast-controls {
	display: block;
	margin: 0;
	text-align: right;
	color: #222;
	margin-left: 1px;
	padding: 10px;
}

.toast-controls progress {
	width: 100%;
	min-width: 70px;
}

.toast-button {
	font-weight: normal;
	line-height: 20px;
	padding: 2px 10px;
	margin: 0px;
	height: 23px;
	border-radius: 0px;
}

.toast-close {
	font-size: 120%;
	font-weight: normal;
	color: #FFF;
	text-decoration: none;
	background: none;
	border-radius: 4px;
	font-family: verdana;
	vertical-align: top;
	float: right;
	line-height: 20px;
}

.toast-mini {
	transform:scale(94%);
}

.toast-mini .toast-content {
	padding:2px;
}

/* Animations to fade the toast in and out */
@keyframes showToast {
	from {
		bottom: -300px;
		opacity: 0;
	}
	to {
		bottom: 10px;
		opacity: 1;
	}
}
@keyframes hideToast {
	from {
		bottom: 10px;
		opacity: 1;
	}
	to {
		bottom: -300px;
		opacity: 0;
	}
}

.tooltip {
	display: none;
	position: absolute;
	left: auto;
	right: auto;
	padding: 10px;
}

img.loading,
progress.loading {
	width: 85%;
	/* max-height: 20px; */
	margin: 0px 8%;
}

progress {
	-webkit-appearance: none;
	appearance: none;
}

progress::-webkit-progress-bar {
	background-color: transparent;
	background-repeat: repeat-x;
	background-size: 100% auto;
	box-shadow: 0 1px 4px rgba(0,0,0,0.3) inset;
}

progress[value]::-webkit-progress-bar {
	background-image: none;
}

progress::-webkit-progress-value {
	background-color: #DFBEC2;
	background-image: none;
}

.data {
	margin-left: 10px;
	font-size: 14px;
	font-family: Consolas, sans-serif;
	text-align: left;
	padding-left: 15px;
}

ul.data li {
	margin-top: 5px;
	font-size: 18px;
}

table.data {
	border: 1px solid gray;
	table-layout: auto;
	border-collapse: collapse;
	background: white;
	min-width: 200px;
}

table.data td,
table.data th {
	border: 1px solid gray;
	max-width: 1000px;
	max-height: 100px;
	vertical-align: top;
	white-space: pre;
	word-break: break-word;
	vertical-align: middle;
}

table.data th {
	padding: 2px;
	font-size: 12px;
	font-family: Verdana;
	font-weight: bold;
	background-color: silver;
	background-image: linear-gradient(#DDD, #888);
	text-shadow: 0px -1px darkgray;
	color: white;
}

table.data th.subheader,
table.data .subheader th {
	background: silver;
}

table.data-grid th {
	border-left: 1px solid grey; /* E9E9EF */
	border-bottom: 1px solid grey;
	text-align: center;
	vertical-align: middle;
}

table.data-grid td {
	border-left: 1px solid #999;
	border-bottom: 1px solid #999;
}

table.records {
	width: 100%;
	margin: 0 auto;
	padding: 2px;
	overflow: hidden;
	overflow-y: scroll;
	border-collapse: collapse;
	font-family: Verdana, Tahoma, Arial;
	font-size: 14px;
	color: #424242;
	margin: 0px;
	background: white;
}


table.records th {
	text-align: center;
	text-shadow: #FFF 0px 1px 0px;
	background-color: #FAFAFA;
	color: black;
	border-bottom: 1px solid silver;
	/*
	background-color: rgb(250, 250, 250);
	background-image: linear-gradient(rgb(255, 255, 255), rgb(241, 241, 241));
	background-image: -webkit-gradient(linear, top, bottom, from(#FFF),to(#F1F1F1));
	background-image: -webkit-linear-gradient(#FFF,#F1F1F1);
	background-image: -moz-linear-gradient(#FFF,#F1F1F1);
	background-image: -ms-linear-gradient(#FFF,#F1F1F1);
	background-image: -o-linear-gradient(#FFF,#F1F1F1);
	background-image: linear-gradient(#FFF,#F1F1F1);
	filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr='#FFFFFF', endColorstr='#F1F1F1', gradientType='0');
	-ms-filter: 'progid:DXImageTransform.Microsoft.Gradient(startColorstr=#FFFFFF, endColorstr=#F1F1F1, gradientType=0)';
*/
}

table.records td,
table.records th {
	padding: 4px;
	max-width: 1000px;
	border: 1px solid silver;
	border-width: 1px 0px;
	white-space: pre-line;
	word-break: break-word;
	cursor: default;
}

/* Popup Window */

.window {
	position: absolute;
	position: fixed;
	width: auto;
	right: 5%;
	left: 5%;
	top: 5%;
	bottom: 5%;
	overflow: hidden;
	z-index: 80;
	max-height: 800px;
}

.window .main {
	display: block;
	width: auto;
	max-width: none;
	padding-bottom: 0px;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	height: 90%;
	height: calc(100% - 60px);
}

.window iframe {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0px auto;
	border: 0px;
}

.window .controls {
	padding: 10px;
	border-top: 1px solid #808080;
	margin: 0px;
	text-align: center;
	/**/ background-image: -webkit-gradient(linear, top, bottom,from(#555),to(#222));
	/**/ background-image: -webkit-linear-gradient(#555,#222);
	/**/ background-image: -moz-linear-gradient(#555,#222);
	/**/ background-image: -ms-linear-gradient(#555,#222);
	/**/ background-image: -o-linear-gradient(#555,#222);
	/**/ background-image: linear-gradient(#555,#222);
	/**/ -ms-filter: 'progid:DXImageTransform.Microsoft.Gradient(startColorstr=#555555, endColorstr=#222222, gradientType=0)';
}

.window .controls button {
	width: 25%;
}

.window .controls button.side {
	width: auto;
}

.window.fullscreen {
	position: absolute;
	position: fixed;
	left: 49%;
	width: 98%;
	margin-left: -48%;
	max-height: 100%;
	top: 1%;
	margin-top: 0px;
	margin-bottom: 0px;
	bottom: 1%;
}

.window.fullscreen .main,
.window.fullscreen iframe {
	position: absolute;
	max-height: none;
	width: 100%;
	height: 100%;
	left: 0px;
	right: 0px;
	bottom: 0px;
	top: 0px;
}

.window.fullscreen .controls {
	left: 0px;
	right: 0px;
	bottom: 0px;
	position: absolute;
}

/* HL7 Message */

.hl7message {
	padding: 5px;
	text-shadow: 0px 1px 0px white;
	outline-width: 0px;
	border: 1px solid rgb(204, 204, 204);
	border-radius: 30px;
	background: #EEE;
	box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px 0px;
	margin: 10px;
}

.hl7message {
	/**/ background-color: rgb(250, 250, 250);
	/**/ background-image: linear-gradient(top,#FFF,#F0F0F0);
	/**/ background-image: -o-linear-gradient(top,#FFF,#F0F0F0);
	/**/ background-image: -ms-linear-gradient(top,#FFF,#F0F0F0);
	/**/ background-image: -moz-linear-gradient(top,#FFF,#F0F0F0);
	/**/ background-image: -webkit-linear-gradient(top,#FFF,#F0F0F0);
	/**/ background-image: -webkit-gradient(linear, top, bottom, from(#FFFFFF), to(#F0F0F0));
	/**/ -ms-filter: 'progid:DXImageTransform.Microsoft.Gradient(startColorstr=#FFFFFF, endColorstr=#F0F0F0, gradientType=0)';
	/**/ box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px 0px;
	/**/ -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px 0px;
}

.hl7message h2 {
	font-weight: bold;
	line-height: 1.6em;
	padding-left: 1.6em;
	background-image: url('../images/event-attachment.png');
	background-position: 0 50%;
	background-size: 1.2em;
	background-repeat: no-repeat;
}

.hl7message dt {
	margin-left: 2em;
	float: left;
	width: 5em;
	font-weight: bold;
}

.hl7message dd {
	padding-left: 4em;
}

/* Datepicker */

#datepicker, #timepicker {
	white-space: nowrap;
	text-align: center;
	color: white;
	margin: 0 auto;
	padding: 5px;
	border-radius: 10px;
}

#datepicker {
	*width: 28em;
	max-width: 30em;
}

#datepicker table {
	height: 240px;
	border-spacing: 6px;
}

#datepicker th {
	width: 4em;
	color: #207CB5;
}

#datepicker td {
	margin: 6px;
	padding: 6px;
	text-align: right;
	background: #6EAFDC;
	border: 1px silver inset;
	border-radius: 6px;
	box-shadow: inset 0px 0px 0.2em rgba(0,0,0,0.8), inset 0px -1em 1em rgba(0,0,0,0.3);
	cursor: pointer;
}

#datepicker td:hover {
	font-weight: bold;
	background: rgb(100, 200, 255);
	text-decoration: underline;
}

#datepicker td.highlight,
#datepicker td.highlighted {
	background: #55CCDD;
}

#datepicker td.chosen {
	color: Navy;
	font-weight: bold;
	border: 1px inset navy;
	background: #9FFFFF;
	box-shadow: inset 0px 0px 1em rgba(60,60,160,0.8), inset 0px 1.2em 1em rgba(0,0,0,0.3);
}

#datepicker td.empty {
	opacity: 0.6;
	color: black;
}

#datepicker label,
#datepicker select {
	display: inline-block;
	max-width: 12em;
	margin: 0.2em;
	font-size: 1.2em;
	font-weight: bold;
	vertical-align: bottom;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#datepicker label {
	cursor: pointer;
}

#datepicker label:hover {
	text-decoration: underline;
}

/* Timepicker */

#timepicker div {
	white-space: nowrap;
	clear: both;
}

#timepicker_time {
	border: 3px outset silver;
	border-color: #EEE Silver Silver Silver;
	margin: 0.5em 1em;
	clear: both;
}

#timepicker button.time {
	width: 2em;
	height: 1em;
	font-size: 2.5em;
	line-height: 0.8em;
	margin: 0.2em;
}

#timepicker button.up {
	background-image: url('../images/arrow-up.png');
	background-repeat: no-repeat;
	background-position: center center;
}

#timepicker button.down {
	background-image: url('../images/arrow-down.png');
	background-repeat: no-repeat;
	background-position: center center;
}

#timepicker span {
	width: 1em;
	font-size: 2.5em;
	margin: 2px;
	text-align: center;
}

#timepicker input {
	width: 2em;
	font-size: 2.5em;
	margin: 2px;
	text-align: center;
}

/* Browser Specific */

.ff input[type=checkbox],
.ie input[type=checkbox] {
	*height: 36px;
	*width: 40px;
	width: auto;
	height: auto;
	min-width: 0px;
	vertical-align: middle;
	border-radius: 10px;
	margin: 0px;
	padding: 2px;
	zoom: 0.7 !important;
}

.ie #datepicker_window {
	/* IE - set width */
	_width: 28.4em;
	*width: 28.4em;
}

.ie #timepicker_window {
	/* IE - set width */
	_width: 18.4em;
	*width: 18.4em;
}

.ie #timepicker {
	/* IE - set width */
	_width: 18em;
	*width: 18em;
}

.ie.v9 .header a {
	border-radius: 0px;
}

.ff input[type=checkbox] {
	border-radius: 10px;
	min-width: 30px;
	min-height: 30px;
	width: auto;
	background: initial;
}

.ff #calendar table td .bullet {
	position: static;
	float: right;
	margin-left: -12px;
}

.ff .form-section {
	border: 2px ridge silver;
}

#datepicker_window #timepicker {
	font-size: 12px;
}

#datepicker_window #timepicker_title {
	display: none;
}

#datepicker_window #timepicker_time {
	background: none;
	border: none;
	margin: 0px 0px 10px 0px;
	color: black;
}

/* Picker Gradients */

#datepicker_window, #timepicker_window, .fade {
	background-color: #F9F9F9;
	/**/ background-image: -o-linear-gradient(top,#F9F9F9,#E9E9E9);
	/**/ background-image: -ms-linear-gradient(top,#F9F9F9,#E9E9E9);
	/**/ background-image: -moz-linear-gradient(top,#F9F9F9,#E9E9E9);
	/**/ background-image: -webkit-linear-gradient(top,#F9F9F9,#E9E9E9);
	/**/ background-image: -webkit-gradient(linear, top, bottom, from(#F9F9F9), to(#E9E9E9));
	/**/ -ms-filter: 'progid:DXImageTransform.Microsoft.Gradient(startColorstr=#F9F9F9, endColorstr=#E9E9E9, gradientType=0)';
}

#timepicker_time {
	background-color: #9C9D9F;
	/**/ background-image: -o-linear-gradient(top,#C0C0C0,#909399);
	/**/ background-image: -ms-linear-gradient(top,#C0C0C0,#909399);
	/**/ background-image: -moz-linear-gradient(top,#C0C0C0,#909399);
	/**/ background-image: -webkit-linear-gradient(top,#C0C0C0,#909399);
	/**/ background-image: -webkit-gradient(linear, top, bottom, from(#C0C0C0), to(#909399));
	/**/ -ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr=#C0C0C0, endColorstr=#909399)';
}

/* Canender */

#calendar {
	padding: 10px;
	margin: 10px auto;
	text-align: center;
	max-width: 1000px;
}

#calendar h2 {
	text-align: center;
	margin: 10px;
}

#calendar table {
	margin: auto;
	width: 100%;
	font-size: 21px;
	border-collapse: separate;
	border-spacing: 0px;
	-webkit-border-horizontal-spacing: 0px;
	-webkit-border-vertical-spacing: 0px;
}

#calendar table th,
#calendar table td {
	width: 14%;
	padding: 10px;
}

#calendar table td {
	position: relative;
	border: 2px solid rgba(0, 0, 0, 0);
	cursor: pointer;
}


#calendar table th {
	position: relative;
	padding: 5px;
	border-bottom: 1px solid silver;
	color: #222;
}

#calendar table td:hover {
	background: rgba(110, 175, 220, 0.1);
}

#calendar table td.empty {
	color: #888;
}

#calendar table td.chosen {
	border: 1px solid #07D;
	border-radius: 5px;
	box-shadow: 0px 0px 2px 2px rgba(0, 100, 150, 0.3);
}

#calendar table td.highlight,
#calendar table td.highlighted {
	color: darkmagenta;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

#calendar table td .bullet {
	position: absolute;
	right: 2px;
	top: 2px;
	z-index: 1;
}

button.previous,
#calendar #btnCalendarPrevious {
	float: left;
	background-image: url('../images/arrow-left.png') !important;
	background-repeat: no-repeat;
	background-position: center center;
	width: 45px;
}

button.next,
#calendar #btnCalendarNext {
	float: right;
	background-image: url('../images/arrow-right.png') !important;
	background-repeat: no-repeat;
	background-position: center center;
	width: 45px;
}

#calendar #btnCalendarToday {
	float: left;
	padding-left: 10px;
	padding-right: 10px;
}

/* Full page calendar */

#calendar.full table {
	font-size: 16px;
	border-collapse: collapse;
	border: 1px solid silver;
}

#calendar.full {
	max-width: none;
}


#calendar.full h2 {
	font-size: 28px;
	font-weight: bold;
	font-style: italic;
	text-align: left;
	margin-left: 30px;
	float: left;
	width: auto;
}

#calendar.full table td {
	border: 1px solid silver;
	font-size: 90%;
	text-align: left;
	padding: 5px;
	background: #F7F7F7;
	vertical-align: top;
	max-height: 200px;
}

#calendar.full table td:hover {
	background: rgba(110, 175, 220, 0.1);
}

#calendar.full table td.chosen {
	border: 1px solid #07D;
	border-color: rgb(0, 100, 150);
	border-radius: 0px;
	box-shadow: none;
	background-color: rgba(0, 100, 150, 0.15);
}

#calendar.full table td.empty {
	opacity: 0.7;
}

#calendar.full #btnCalendarNext {
	float: left;
}

/* Calendar single day options */

#calendar .calendar-day {
	min-height: 100px;
	overflow-x: hidden;
	overflow-y: auto;
	max-height: 130px;
}

#calendar .calendar-day label {
	width: 100%;
	display: inline-block;
	text-align: left;
	font-size: 16px;
}

#calendar .highlight label,
#calendar .highlighted label {
	font-weight: bold;
	color: darkmagenta;
}

#calendar .calendar-day a {
	display: block;
	white-space: nowrap;
	text-decoration: none;
	color: navy;
}

#calendar .calendar-day .name {
	white-space: normal;
	white-space: pre-wrap;
	margin: 4px;
}

#calendar .calendar-day a:hover {
	text-decoration: underline;
}

#calendar .calendar-day::-webkit-scrollbar {
	width: 10px;
	border: 1px solid #CCC;
}

#calendar .calendar-day::-webkit-scrollbar-track {
	width: 8px;
	margin-right: 2px;
	border: 1px solid #CCC;
	box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
	/**/ background-color: #F1F1F1;
	/**/ background-image: -webkit-gradient(linear, left, right, from(#F1F1F1),to(#FFF));
	/**/ background-image: -webkit-linear-gradient(left, #F1F1F1,#FFF);
	/**/ background-image: linear-gradient(from left, #F1F1F1,#FFF);
}

#calendar .calendar-day::-webkit-scrollbar-thumb {
	width: 8px;
	margin-right: 2px;
	border-radius: 1px;
	border: 1px outset silver;
	box-shadow: inset 0 0 5px rgba(0,30,60,0.4);
	background: #946eb9 /*rgba(210,200,240,0.5);*/
}

/* Calendar Week-view adjustment */

#calendar.full table td.weekview {
	max-height: none;
}

#calendar.full table td.weekview .calendar-day {
	max-height: none;
	min-height: 600px;
	transition: min-height 1s, height 1s;
}


/* Popup */

.popup {
	position: absolute;
	position: fixed;
	left: 50%;
	top: 50%;
	height: auto;
	min-width: 600px;
	max-width: 800px;
	margin-left: -300px;
	margin-top: -260px;
	background-color: #FFF;
	border: 0 solid #A9A9A9;
	overflow: hidden;
	z-index: 60;
	-webkit-box-shadow: 0 1px 20px rgba(0,0,0,0.75);
	-moz-box-shadow: 0 1px 20px rgba(0,0,0,0.75);
	box-shadow: 0 1px 20px rgba(0,0,0,0.75);
	/**/ -webkit-border-radius: 20px;
	/**/ border-radius: 20px;
	/**/ font-family: "Lucida Grande","Arial","Helvetica","sans-serif";
	/**/ font-size: 14px;
	/**/ color: #222;
}

.popup-titlebar {
	position: relative;
	text-align: center;
	margin: 0px;
	padding: .8em .3em .8em 1em;
	border: 0 solid #AAA;
	color: white;
	font-weight: bold;
	cursor: move;
	border-bottom: 1px solid #68809D;
	position: relative;
	clear: left;
	overflow: hidden;
	padding: 0px 20px;
	min-height: 56px;
	text-align: left;
}

.popup-controls {
	padding: 14px 15px 15px;
	margin: 0;
	min-height: 33px;
	text-align: right;
	background-color: #F5F5F5;
	border-top: 1px solid #DDD;
	border-width: 1px 0 0 0;
	/**/ -moz-box-shadow: inset 0 1px 0 #fff;
	/**/ box-shadow: inset 0 1px 0 #FFF;
}

.popup-controls {
	/**/ -webkit-border-radius: 0 0 6px 6px;
	/**/ -moz-border-radius: 0 0 6px 6px;
	/**/ border-radius: 0 0 6px 6px;
	/**/ -webkit-box-shadow: inset 0 1px 0 #FFF;
	/**/ color: #222;
}

.popup.default .popup-titlebar {
	background-color: #6EAFDC;
	background-image: linear-gradient(#6EAFDC, #486A8D);
	background-image: linear-gradient(#6EAFDC 10%, #60A0CA, #486A8D);
}

.popup.error .popup-titlebar {
	background-color: rgb(200, 50, 50);
	background-image: linear-gradient(rgb(250, 100, 80),rgb(200, 50, 30));
}

.popup.warning .popup-titlebar {
	background-color: rgb(180, 140, 40);
	background-image: linear-gradient(rgb(230, 190, 90),rgb(180, 140, 40));
}

.popup.success .popup-titlebar {
	background-color: rgb(30, 150, 65);
	background-image: linear-gradient(rgb(80, 200, 115),rgb(30, 150, 65));
}

.popup .form-row label,
.popup .form-row .value {
	font-size: 16px;
}

.popup .form-row-group {
	width: 60%;
	vertical-align: top;
	font-size: 18px;
}

.popup .form-row-label {
	width: 36%;
	margin-left: 2%;
}

.popup .row-search {
	display: block;
	width: 96%;
	margin: 2%;
}

.popup ul.alert {
	margin: 10px;
	text-align: left;
	overflow: hidden;
	min-height: 140px;
}

.popup.large {
	top: 5%;
	left: 5%;
	right: 5%;
	margin: 0px;
	width: 90%;
	max-width: none;
	max-height: none;
}

.popup.large .popup-content {
	max-height: none;
	min-height: 600px;
}

.popup.large .popup-controls {
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
}

noscript.popup {
	margin-top: -100px;
}

.popup form {
	top: 0px;
}

.popup.whole {
	width: 98%;
	left: 1%;
	margin-left: 0px;
	min-height: 400px;
}

.popup.whole .popup-content {
	padding: 0.5em;
	overflow: auto;
	min-height: 250px;
	max-height: 500px;
	color: #424242;
	font-family: Arial;
	font-size: 20px;
}

.popup-title {
	margin: 15px;
	font-weight: normal;
	font-family: Arial;
	font-size: 22px;
	font-style: normal;
	display: inline-block;
	margin-left: 5px;
}

.popup-titlebar img {
	height: 35px;
	margin: 10px;
	margin-left: 0px;
	vertical-align: bottom;
}

.popup-search {
	position: relative;
	display: block;
	text-align: left;
	width: 100%;
	margin: 10px;
}

.popup-search input {
	width: 95%;
}

.popup-message {
	font-size: 1.15em;
}

.popup-content {
	padding: 0.5em;
	min-height: 100px;
	max-height: 500px;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

.popup-content .list-box {
	max-width: 100%;
}

.popup-button {
	-webkit-appearance: none;
	line-height: 14px;
	font-size: 14px;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
}

.popup-close, .dialog-close, .closeButton {
	float: right;
	box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	text-align: center;
	height: 26px;
	width: 26px;
	line-height: 18px;
	font-size: 18px;
	vertical-align: top;
	padding: 3px;
	text-decoration: none;
	background: none;
	vertical-align: middle;
	font-size: 16px;
}

.popup-close, .dialog-close {
	position: absolute;
	right: 20px;
	top: 16px;
	color: #FFF;
}

.popup p {
	margin: 10px;
	font-size: 80%;
	font-size: 18px;
	color: #444;
	max-width: none;
}

.controls {
	padding-top: 10px;
	text-align: center;
}

.ribbon {
	position: absolute;
	position: fixed;
	background-color: darkgray;
	display: block;
	filter: none;
	font-size: 14px;
	height: 24px;
	padding: 2px 0px;
	right: -60px;
	top: 70px;
	transform: matrix(0.707107, 0.707107, -0.707107, 0.707107, 0, 0);
	width: 300px;
	z-index: 21;
	color: white;
	text-align: center;
	font-weight: bold;
	line-height: 25px;
	opacity: 0.8;
	*top: auto;
	/**/ font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	/**/ background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.14902));
	/**/ background-image: -webkit-linear-gradient(top, rgb(188, 213, 238), rgb(157, 178, 200));
	/**/ box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.5);
}

.ribbon span {
	display: inline-block;
	width: 100%;
	border: 1px dashed white;
	line-height: 20px;
	padding-left: 1.5em;
	color: white;
	/**/ color: #0A556E;
	/**/ text-shadow: 1px 1px 3px #FFF;
}

.post-note {
	position: absolute;
	position: fixed;
	background-color: lightyellow;
	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.14902));
	box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.498039);
	display: block;
	filter: none;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 14px;
	height: 100px;
	line-height: 20px;
	padding: 2px 0px;
	right: 55px;
	top: 80px;
	transform: rotate(4deg);
	width: 100px;
	z-index: 1;
	color: #005;
	text-align: center;
	font-weight: bold;
	line-height: 25px;
	font-family: sans-serif;
	text-transform: uppercase;
	font-style: italic;
	padding: 5px;
}

.post-note span {
	display: inline-block;
	width: 100%;
	margin: 2px 0px;
	line-height: 20px;
	margin-top: 1em;
}

.system-note {
	font-style: italic;
	text-shadow: 0px 1px white;
	font-weight: normal;
	text-align: center;
	line-height: 14px;
	color: #2b4555;
}

.header .system-note {
	float: left;
	width: 60px;
	position: relative;
	right: 14px;
	color: #2b4555;
	text-shadow: 0px 1px rgba(255,255,255,0.6);
}

form .system-note {
	position: absolute;
	left: 6px;
	top: 90px;
	top: 65px;
}

.login .system-note {
	top: 6px;
}

.show-password {
	position: relative;
}

/* Hide browser show password in edge */
.show-password input::-ms-reveal,
.show-password input::-ms-clear {
	display: none;
}

.legal {
	text-align: left;
	font-size: 15px;
	margin: 30px;
}

.legal dt {
	display: inline-block;
	float: left;
	clear: left;
	width: 40px;
}

.legal dd {
	display: block;
	text-align: left;
	margin-bottom: 10px;
}

.legal h1 {
	text-align: center;
}

.legal h2 {
	margin: 5px;
	font-size: 17px;
	text-align: left;
}

/* Medium or larger screens */

@media screen and (min-width:1025px) {

	/* Make menu items larger */

	#menu {
		max-width: 1400px;
	}

	.menu-item {
		width: 200px;
		height: 180px;
		margin: 30px 10px 30px 60px;
	}

	.navbar-item a {
		white-space: normal;
	}

	.navbar-item a .name {
		display: inline-block;
		white-space: nowrap;
		vertical-align: middle;
		font-size: 18px;
	}

	/* Set header links to be larger */
	.header a .name {
		padding: 7px 10px;
		padding-left: 5px;
	}

	/* Condensed popup fields */

	.condense .form-row input,
	.condense .form-row select,
	.condense .form-row keygen,
	.condense .form-row textarea,
	.condense .form-row blockquote,
	.condense .form-row .value,
	.condense .form-row .ouput,
	.condense .form-row .dropdown,
	.condense .form-row .suggestions,
	.condense .form-row .date-control,
	.condense .form-row .form-row-group,
	.condense .form-row .preview,
	.condense .form-row .file-control {
		width: 32%;
		max-width: 500px;
		vertical-align: top;
	}

	.condense .form-row .form-row-label {
		width: 60%;
	}

	.condense .form-row label {
		width: 60%;
	}

	/* Uncondense List View */

	.list-view li {
		padding: 8px;
	}

	.list-view.condense li p {
		text-overflow: ellipsis;
		white-space: nowrap;
		width: auto;
		overflow: hidden;
		display: inline-block;
		vertical-align: middle;
		margin: 4px 6px;
	}

	.list-view.condense li p.title {
		min-width: 180px;
		padding: 4px;
		font-size: 16px;
	}

	.list-view.condense li p label:after {
		content: ':';
	}

	.list-view {
		margin: 10px 20px;
	}

	.record, h2, .form-section {
		margin-left: 20px;
		margin-right: 20px;
	}

	.tabbed {
		margin-top: 50px;
	}

	fieldset legend {
		margin-right: 20px;
	}

	.header a, .header .status {
		margin-top: 2px;
		margin-bottom: 10px;
	}

	.toast {
		max-width: 40%;
	}
}

/* Small Devices such as smart phones */

@media screen and (max-width:600px) {

	.dialog {
		left: 10%;
		right: 10%;
		top: 50%;
		z-index: 65;
		height: auto;
		width: auto;
		min-width: 200px;
		max-width: none;
		overflow: hidden;
		margin-left: 0px;
		margin-top: -100px;
	}

	.header {
		padding: 10px 10px 0px 10px;
		padding-right: 10px;
	}

	.navbar-item a .name {
		white-space: pre-line;
		/*font-size: 84%;*/
	}


	/* Make menu items smaller */

	.menu {
		padding: 2%;
		width: 100%;
		grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	}

	.menu-item {
		font-size: 0.8em;
	}

	.sub-menu .list-menu .menu-item {
		width: 150px;
		height: 120px;
		margin: 20px 1% 20px 2%;
		min-height: 90px;
		font-size: 20px;
	}

	.file .menu-item {
		width: 110px;
		height: 90px;
		margin: 20px 1% 20px 1%;
	}

	form.login {
		margin: 1%;
		top: 38px;
		position: static;
		margin-top: 40px;
		width: 98%
	}

	.form-row {
		padding: 0px;
		margin: 4px;
	}

	.header a .name {
		padding: 7px 8px;
		padding-left: 4px;
	}

	/* Set form fields to display in one column */

	.login-panel {
		width: 100%;
	}

	.left, .right {
		width: 100%;
		min-width: 90%;
		float: none;
	}

	fieldset.fixed {
		position: static;
	}

	.form-section {
		position: static !important;
		width: auto !important;
	}

	/* Set popups to fill the whole screen */

	.window, .popup {
		left: 1%;
		top: 1%;
		right: 1%;
		margin: 0px;
		min-width: 98%;
	}

	.popup-content {
		max-height: 90%;
		height: calc(100% - 148px);
	}

	.window iframe {
		width: 100%;
		height: 100%;
	}

	.screen {
		zoom: 0.7;
	}

	#onlineStatus {
		margin-left: 10px;
	}
}

/* Small Screens, larger than a phone */

@media screen and (min-width:760px) {

	/* Make menu items smaller */

	#menu {
		max-width: 90%;
	}

	.menu-item {
		width: 200px;
		height: 160px;
		margin: 20px 2px 0px 40px;
		width: 200px;
		height: 180px;
		margin: 30px 10px 30px 60px;
	}

	.menu-item span {
		top: 25%;
	}

	.tab,
	.list-tabs .tab {
		font-size: 16px;
	}

	.title {
		font-size: 1.1em;
	}
}

/* Large screens */

@media screen and (min-width:1400px) {

	/* Condense List View */

	.list-view li {
		padding: 8px;
	}

	.list-view.condense li p {
		text-overflow: ellipsis;
		white-space: nowrap;
		width: auto;
		overflow: hidden;
		display: inline-block;
		vertical-align: middle;
		margin: 4px 6px;
	}

	.list-view.condense li p.title {
		min-width: 200px;
		padding: 6px;
		font-size: 16px;
	}

	.list-view.condense li p label:after {
		content: ':';
	}

	.list-view {
		margin: 10px 20px;
	}

	.login-icon {
		float: right;
		height: 200px;
		box-shadow: 0px 1px 2px rgba(0,0,0,0.4);
		border-radius: 100px;
		vertical-align: middle;
		margin: 30px;
	}

	.menu.large,
	.list-menu.large,
	.list-menu-rows.large {
		display: inline-block;
		height: 40%;
		height: 500px;
		width: 39%;
		margin: 0px;
		margin-right: -2px;
		margin-top: 3%;
		margin-left: 5%;
		padding: 3%;
		padding-bottom: 3px;
		overflow-y: auto;
	}

	.menu-image {
		display: inline-block;
		height: 40%;
		height: 500px;
		width: 38%;
		margin: 0px;
		margin-left: -2px;
		margin-top: 3%;
		margin-right: 5%;
		padding: 3%;
		padding-bottom: 3px;
		background-color: #87657D;
		background-image: url('../images/argo-large-white.png');
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
		background-size: 70% auto;
	}

	.menu-image.main {
		background-image: url('../images/arjo-background.jpg');
		background-size: cover;
	}

	.menu-image.home {
		background-image: url('../images/cvi-image-6.jpg');
		background-size: cover;
		background-position: center right;
	}

	.menu-image.reports {
		background-image: url('../images/cvi-image-7.jpg');
		background-size: cover;
		background-position: center center;
	}

	.menu.large .menu-item {
		width: 150px;
		margin: 16px 40px 20px 40px;
		font-size: 22px;
	}
}

/* large Portrait devices such as an iPad */

@media all and (orientation:portrait) and (min-width:760px) {

	div.main.design {
		padding-left: 0px;
	}

	.design .screen {

	}

	form.login {
		width: 600px;
		position: absolute;
		top: 50%;
		left: 50%;
		margin-left: -300px;
		margin-top: -300px;
	}

	form.login button {
		width: 80%;
		margin-top: 8px;
	}

	.landing .detail {
		clear: right;
		width: 90%;
	}

	.menu {
		max-width: 600px;
		margin-top: 20px;
	}

	.header {
		padding: 10px 10px 0px 10px;
	}

	/* Condense the form summary */

	.form-summary {
		margin: 0px;
		border-radius: 0px;
	}

	.form-summary div {
		margin-left: 7px;
		margin-right: 7px;
	}

	.form-summary label {
		margin-right: 3px;
		font-size: 14px;
	}

	.screen {
		zoom: 0.80;
	}

	.window .main {
		height: 740px;
		max-height: 100%;
	}

	.window iframe {
		max-height: 740px;
	}
}
/* Chome Web App adjustments */

@media (display-mode:standalone) {
	.header {
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
	}

	.login .header {
		border-top-left-radius: 20px;
		border-top-right-radius: 20px;
	}
}

/* Arjo Login Screen */

@media screen and (max-width:1300px) {

	.login {
		position: static;
		margin: 2%;
	}

	.login-icon {
		float: none;
		margin-top: 5%;
		height: 80px;
	}

	.landing {
		padding-left: 5%;
		margin-bottom: 150px;
	}

	.landing #content_main, 
	.landing #content_extra {
		padding: 5% 0px;
		display: inline;
	}

	.landing .foot {
		max-height: 160px;
		font-size: 11px;
		padding: 12px;
	}
}

@media screen and (max-width:800px) {

	.login {
		position: static;
		float: none;
		margin: 4% auto;
	}

	.landing .login {
		min-width: 290px;
	}

	.landing form.login .main {
		min-width: 290px;
	}

	.landing .detail {
		display: inline-block;
		font-size: 17px;
		padding: 8px;
		padding-right: 0px;
	}

	.landing h1,
	.landing h2,
	.landing hr {
		padding-right: 0px;
	}

	.landing .foot {
		max-height: 128px;
		font-size: 10px;
		padding: 12px;
	}
}

/* iPad specific adjustments */

.ipad .header {
	width: auto;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}

.ipad .login .header {
	width: auto;
}

.ipad .form-summary input {
	max-width: 160px;
	font-size: 16px;
}

.ipad form.login,
.ipad .popup form {
	padding: 0px;
}

.ipad form.popup-window {
	padding-top: 0px;
}

.ipad input[type=radio] {
	border: initial;
}

.ipad a.button {
	padding: 4px 18px;
}

/* Nav Top */

.column.fixed {
	top: 155px;
	bottom: 45px;
}

.form-section.fixed {
	top: 255px;
}

/*
.ipad .header {
	position:absolute;
	position:fixed;
	top:0px;
	left:0px;
	right:0px;
	z-index:30;
}

.ipad .main {
	padding-top:60px;
}

.ipad .login .header {
	position:static;
}

.ipad .login .main,
.ipad .window .main {
	padding-top:0px;
}

z-indexs:
titles 10
fixed sections 15
ribbon 18
icons, header 20
tabs, controls 25
menu 30
menu item 31
bar 35
dropdowns 40
mask 50
popups 60
dialog popups 65
moving popup 70
toasts 70
iframe window 80

@media (device-width:320px){
	body {
		background: red;
	}
}

@media (device-width:320px) and (-webkit-device-pixel-ratio:2){
	body {
		background: orange;
	}
}
    
@media (device-width:768px) and (orientation:portrait){
	body {
		background: yellow;
	}
}
    
@media (device-width:768px) and (orientation:landscape){
	body {
		background: green;
	}
}

@media (device-width:1536px) and (orientation:portrait) and (-webkit-device-pixel-ratio:2){
	body {
		background: blue;
	}
}

@media (device-width:1536px) and (orientation:landscape) and (-webkit-device-pixel-ratio:2){
	body {
		background: purple;
	}
}
*/
