@import url("/css/main.css");
@import url("/css/ekg.chart.css");


body, body * {
	font-family: 'Lato', Verdana, Arial, Helvetica, Sans-Serif;
}

body {
	font-weight: 400;
	margin: 0px;
    font-size:10pt;
    line-height: 1.4;
	font-size: 14px;
}

h3 {
    font-size: 1.8em;
    margin: 10px 0px;
}

h3.nopagebreak {
	page-break-inside: avoid;
	margin-top: 0.8em;
	margin-bottom: 0.3em;
}

h3.pagebreakbefore {
	page-break-before: always;
	margin-top: 0.8em;
	margin-bottom: 0.3em;
}

h4 {
	margin-bottom: 0.3em;
	font-size:1.3em;
}

.medium {
	font-size: medium;
}

.nopagebreak {
	page-break-inside: avoid;
	margin-top: 0.2em;
	margin-bottom: 0em;
	white-space:nowrap;
}

.pagebreakbefore {
	page-break-before: always;
	margin-top: 0.2em;
	margin-bottom: 0em;
	white-space:nowrap;
}

.nopagebreak span {
	font-size: 0.8em;
}

.pagebreakbefore span {
	font-size: 0.8em;
}

.showOnlyInPdf {
	display:none;
}

.only-print {
	display:none;
}

@media print {
	.only-print {
		display: block;
		color: #f00 !important;
		font-weight: 500;
	}
}

.preserve-newlines {
	white-space: pre-wrap;
}

.caption {
	/*font-family: Arial, sans-serif;*/
	text-align: center;
	font-size: 0.8em;
	margin-bottom: 5px;
	white-space: nowrap;
	width: 320px;
}

td.w20 {
	font-size:0.8em;
	width: 20px;
}

td.w320 {
	width: 320px;
}

td.w490 {
	width: 490px;
}

.toolboxOne {
	/*font-family: Arial, sans-serif;*/
	font-size: 0.8em;
	margin-top: 0px;
	margin-bottom: 4px;
	white-space: nowrap;
	width: 360px;
}

br {
	padding-bottom: 0em;
	margin-bottom: 0em;
}

th {
	text-align: left;
	padding-right: 0.5em;
}
th.listingR {
	padding-right: 0;
}
th.listingR + th {
	padding-left: 0.5em;
}

td {
	
}

td.list {
	font-size: 1em;
	padding-top: 0px;
	padding-bottom: 0px;
}

td.widemenu-l, td.widemenu-r {
    color: #ffffff;
    font-size: 0.8em;
    height:32px;
    /*font-weight: 500;*/
    padding-left: 0.5em;
    padding-right: 0.5em;
}

td.widemenu-l {
	text-align: left;
}


td.widemenu-r {
	text-align: right;
}

td.formlabel {
	font-weight: 500;
    font-size:1.0em;
	padding-left: 0em;
	padding-right: 0.5em;
	vertical-align: baseline;
	padding-top: 0em;
	padding-bottom: 0em;
}

button, input[type=submit], input[type=button] {
	font-family: 'Lato', Verdana, Arial, Helvetica, Sans-Serif;
	font-weight: 400;
	
	margin-bottom: 1px;
    margin-left:1px;
    margin-right:0px;
    cursor: pointer;
    padding: 2px 10px;
    
    border: solid 1px #888;
    border-radius: 4px;
    
    background-image: -webkit-gradient(
	linear,
	left top,
	left bottom,
	color-stop(0, #FBFBFB),
	color-stop(1, #E9E9E9)
    );
    background-image: -o-linear-gradient(bottom, #FBFBFB 0%, #E9E9E9 100%);
    background-image: -moz-linear-gradient(bottom, #FBFBFB 0%, #E9E9E9 100%);
    background-image: -webkit-linear-gradient(bottom, #FBFBFB 0%, #E9E9E9 100%);
    background-image: -ms-linear-gradient(bottom, #FBFBFB 0%, #E9E9E9 100%);
    background-image: linear-gradient(to bottom, #FBFBFB 0%, #E9E9E9 100%);
}

button.bluebutton, input[type=submit].bluebutton, input[type=button].bluebutton, a.bluebutton {
	font-family: 'Lato', Verdana, Arial, Helvetica, Sans-Serif;
	border: none;
	border-radius: 0;
	background-color: #fff;
	background-image: none;
	color: #08b !important;
	
	/*font-weight:500;*/
	font-size: 1.5em;		
		
	margin-top: 10px;
	margin-bottom: 1px;
    margin-left:0px;
    margin-right:0px;
    
    padding: 4px 8px 4px 8px;
    
    cursor: pointer;
}

button.bluebutton:hover, input[type=submit].bluebutton:hover, input[type=button].bluebutton:hover, a.bluebutton:hover {
	text-decoration: underline;
}

/* Text inputs */
input:not([type=submit]):not([type=file]), select {
    border: 1px solid gray;
    border-radius:2px;
    line-height: 1.5em;
    padding-left:5px;
    margin-bottom:3px;
    height:20px;
}


/* Align checkboxes */
input[type=checkbox], input[type=radio] {
    vertical-align: middle;
    position: relative;
    bottom: 1px;
}
input[type=radio] {
    bottom: 2px;
}

td.forminput {
	padding-left: 0em;
	padding-right: 0.5em;
	vertical-align: baseline;
	padding-top: 0em;
	padding-bottom: 0em;
}
td.forminput-l {
	padding-left: 0em;
	padding-right: 0.5em;
	vertical-align: baseline;
	padding-top: 0em;
	padding-bottom: 0em;
	width: 290px;
}

td.forminput.warning {
	padding: 2px 5px;
	background-color: #fea;
}
td[title].forminput.warning {
	position: relative;
	padding-right: 25px;
}
td[title].forminput.warning.listingC {
	/* center-aligned text need equal padding on both sides */
	padding-left: 25px;
}
td[title].forminput.warning::after {
	content: "";
    background-image: url(/img/exclamation_orange.png);
    background-size: 16px 16px;
    width: 16px;
    height: 16px;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -8px;
    right: 5px;
}

input.txt {
	width: 150px;
}

input.txt-l {
	width: 290px;
}

select.txt {
	width: 245px;
}
		
select.txt-s {
	width: 150px;
}

a.disabled,
button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
	color: #333 !important;
	opacity: 0.6;
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
	background-color: #f2f2f2;
}

.disabled-hidden {
	display: none;
}



.mg-bt-xs {
	margin-bottom: 5px;
}

.color-status-good {
	color: #080;
}
.color-status-bad {
	color: #9c2727;
}



.form-group {
	display: block;
	margin: 30px 0;
	padding-left: 15px;
	width: 100%;
	max-width: 940px;
	overflow: hidden;
}
div.form-group:first-of-type {
    margin-top: 35px;
}
.form-group--submit {
    padding-left: 0;
}

.form-group h4 {
	margin: 0 0 10px -15px;
}

.form-row {
	display: block;
	width: 100%;
	overflow: hidden;
}
.form-row + .form-row {
	margin-top: 10px;
}

.form-col {
	box-sizing: border-box;
	float: left;
	display: block;
	margin-bottom: 10px;
	padding-right: 20px;
	width: 25%;
	min-width: 200px;
}
.form-col--lg {
	width: 37.5%;
}

.form-extra {
	box-sizing: border-box;
	position: relative;
	clear: both;
	display: none;
	overflow: hidden;
	max-height: 0;
	opacity: 0;
	transition: max-height 250ms ease, opacity 500ms ease;
}
.form-extra.initialized {
	display: block;
}
.form-extra.open {
	max-height: 200px;
	opacity: 1;
	transition: max-height 250ms ease, opacity 500ms ease;
}

.form-show-extra,
.form-hide-extra {
	clear: both;
}
.form-hide-extra {
	display: block;
}

.form-show-extra-container {
	clear: both;
	box-sizing: border-box;
	max-height: 80px;
	opacity: 1;
	transition: max-height 250ms ease, opacity 500ms ease;
}
.form-show-extra-container.open {
	max-height: 0;
	opacity: 0;
	transition: max-height 250ms ease, opacity 500ms ease;
}

.form-show-extra-container i {
	display: inline-block;
	padding-right: 20px;
	color: #aaa;
	cursor: pointer;
}

.form-show-extra-container .form-extra-val {
	color: #000;
}

.form-col label {
	display: block;
}

.form-col input[type=text],
.form-col select {
	height: 1.65em;
}

.form-col input[type=text],
.form-col select,
.form-col textarea {
	box-sizing: border-box;
	display: block;
	width: 100%;
	padding: 1px 1px 1px 5px;
	font-family: inherit;
	border: 1px solid #aaa;
	border-radius: 2px;
	transition: background 500ms ease;
}
.form-extra.open .form-col input[type=text],
.form-extra.open .form-col select,
.form-extra.open .form-col textarea {
	transition: none;
}

.form-col textarea {
	height: 74px;
}

input[type=submit].form-save {
	display: inline-block;
	margin-top: 25px;
	font-size: 1.2em;
}

a.back,
button.back,
input.back {
	display: inline-block;
	margin-left: 25px;
}

button.as-link,
input.as-link {
	background: none;
	color: #08b;
    border: none;
    border-radius: 0;
    padding: 0;
    font-size: inherit;
    cursor: pointer;
    text-decoration: none;
}

button.as-link:hover,
input.as-link:hover {
    text-decoration: underline;
}

.informational-nothing-to-show {
	font-style: italic;
	font-weight: normal;
	color: #888;
}



/* Style for Struts2 actionMessages */
ul.actionMessage,
ul.errorMessage {
	list-style: none;
    font-weight: normal;
    font-style: italic;
    box-sizing: border-box;
    width: 700px;
    max-width: 100%;
    margin-bottom: 30px;
	padding: 15px 15px 15px 0;
	border-radius: 8px;
    font-size: 1.1em;
    text-align: center;
}
ul.actionMessage {
	color: #399;
	background-color: rgba(51, 153, 153, 0.2);
	border: 1px solid rgb(51, 153, 153);
}
.warningContainer ul.actionMessage,
ul.errorMessage {
    padding: 10px 15px 10px 35px;
    background-size: 16px 16px;
    background-position: 10px 12px; 
    background-repeat: no-repeat;
    text-align: left;
}
ul.errorMessage {
	color: #9c2727;
	background-color: #fcc;
	background-image: url(/img/exclamation_red.png);
	border: 1px solid #bc2727;
}
.warningContainer ul.actionMessage {
	color: #bc8827;
	background-color: #fea;
	background-image: url(/img/exclamation_orange.png);
	border: 1px solid #bc8827;
}

.info-message {
	/* color: #bc8827; */
	color: #4169e1;
    font-weight: normal;
    font-style: italic;
    
    box-sizing: border-box;
    width: 680px; 
    max-width: 100%;
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 10px 15px 10px 35px;
    background-color: rgba(62, 157, 225, 0.2);
    background-image: url(/img/info_blue.png);
    background-size: 16px 16px;
    background-position: 10px 11px;
    background-repeat: no-repeat;
    /* border: 1px solid #bc8827; */
    border: 1px solid #4169e1;
	border-radius: 8px;
    font-size: 1.1em;
}
.info-message.warning {
	color: #bc8827;
	background-color: #fea;
	background-image: url(/img/exclamation_orange.png);
	border-color: #bc8827;
}
.info-message.ok {
	color: #080;
	background-color: #afa;
	border-color: #080;
}
.info-message:first-child {
	margin-top: 0;
}
.info-message:last-child {
	margin-bottom: 0;
}
.info-message + .info-message {
	margin-top: -20px;
}
.info-message p {
	margin: 0;
}
.info-message p + p {
	margin-top: 10px;
}
.info-message button {
	display: block;
	margin: 10px auto;
}


#ciCurrentStatus {
	display: inline-block;
	margin: 2px 5px;
}
#ciCurrentStatusChange {
	margin: 20px 0 30px 0;
}
#ciCurrentStatusChange p {
	margin: 0 0 5px 0;
}
#ciCurrentStatusChange button {
	min-width: 120px;
}

#nextCiPatient {
	margin-left: 5px;
	padding: 10px;
}
#nextCiPatient::before {
    content: ">";
    display: block; 
    font-size: 40px;
    font-weight: bold;
    color: #08868d;
    line-height: 30px;
    margin-bottom: 10px;
}
#nextCiPatient h4 {
	margin: 0;
}
#nextCiPatient p {
	margin: 5px 0;
}


.overview-box {
	float: left;
	box-sizing: border-box;
	padding: 15px;
	width: 700px;
	border: 1px solid #08868d;
	overflow: hidden;
	margin: 0 30px 40px 0;
}

.overview-box--large {
	width: 1200px;
}


.overview-box--small {
	width: 450px;
}

.overview-box .section,
.overview-box .section > table {
	width: 100%;
}

.overview-box .section + .section {
	margin-top: 30px;
}

.overview-box form {
	margin-top: 3px;
}

.overview-box th,
.overview-box td {
	vertical-align: top;
}

.overview-box > h4:first-child {
	margin-top: 0px;
}

		
td.spacenext {
	padding-right: 2.5em;
}

td.cellright {
	text-align: right;
}

tr.disabled {
	color: #999999;
	font-style: italic
}

.listing {
	text-align: left;
}

td.cell-error {
	/* background-color: #ffe0e0; */
	background-color: #fea;
}

.header .small {
	display: block;
	font-size: 75%;
	font-style: italic;
	margin-top: 5px;
}


.listingR {
	text-align: right;
}

.listingC {
	text-align: center;
}

.listingB {
	text-align: left;
	font-weight: 500;
}

.listingBR {
	text-align: right;
	font-weight: 500;
}

div.header {
	/*font-family: Arial, sans-serif;*/
	font-size: 0.9em;
	color: #808080;
	margin: 1em 24px 1em 24px;
}

div.content {
    margin: 24px;
}

div.footer {
    /*background-color: #187174;*/
    /*background-image: url(../img/bg_footer.png);*/
    font-size: 11px;
    text-align: center;
    background-repeat: repeat-x;
    height:70px;
    margin-top: 10px;
    padding: 55px 24px 100px 24px;
    color: #999;
}

div.footer hr {
	margin-top: 0px;
	margin-bottom: 20px;
	margin-left:auto;
	margin-right:auto;
	
	border: 0;
	height: 1px;
	/*
	background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:    -moz-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:     -ms-linear-gradient(left, #ccc, #333, #ccc); 
    background-image:      -o-linear-gradient(left, #ccc, #333, #ccc);
    */
    background-color: #ddd;
}

div.footer strong {
	margin-left:7px;
	margin-right:7px;
}

div.footer td {
	padding: 0 0 0 0;
	margin-top: 0.75em;
        
	/*font-family: Verdana, Arial, Helvetica, Sans-Serif;*/
	font-size: 0.75em;
}

td.footerL {
	vertical-align: top;
 	text-align: left;
}
td.footerR {
 	text-align: right;
}

div.errors,
.errorMessage {
	color: #d95131;
}
input.errorMessage {
	border-color: #d95131 !important;
}

hr.list {
	color: #000000;
	height: 1pt;
}

hr.footer {
	color: #000000;
	height: 1pt;
}

a.footer { 
	text-decoration: underline; 
	color: #2a8a7d;
}

a:visited.footer { 
	text-decoration: underline; 
	color: #2a8a7d;
}

a:hover.footer { 
	text-decoration: underline; 
	color: #ff6666;
}

table.menu {
	background-color: #08868d;
        /*background-image: url(../img/menu-tile.png);*/
        height: 32px;
        padding: 0px 16px 0px 16px;
}
ul.menu {
	/*font-family: Corbel, Verdana, Arial, Helvetica, Sans-Serif;*/
	font-size:1.20em;
	font-weight: 500;
	background-color: #08868d;
    /*background-image: url(../img/menu-tile.png);*/
    list-style:none;
    height: 32px;
    padding:0px 12px 0px 12px;
    margin: 0;
}

ul.menu .left:first-child a, ul.menu .right:last-child a {

}

ul.menu .left a, ul.menu .right a, ul.menu span {
    /*background-image: url(../img/menu-tile-div.png);*/
    background-repeat: no-repeat;
    background-position: right;
    text-decoration: none;
    padding: 0px 16px 0px 16px;
    margin-top:2px;
    line-height: 28px;
    display: block;

    color: #fff;
    /*color: #b9d5d5;*/
}

ul.menu span {
	padding: 0px;
}

ul.menu a:hover {
	background-color: #34a6ab;
    background-repeat: repeat-x;
    color: #fff;
}

ul.menu .left {
    float:left;
}

ul.menu .right {
    float:right;
}

.tableBasic {
	padding: none;
}

.tableBasic thead th {
	background-color: #08868d;
	padding: 5px;
	color: #fff;
}

.tableListing {
	margin: 20px 0px;
	line-height: 26px;
}

.tableListing thead {
    background-color: #08868d;
    padding: none;
}
.tableListing thead th {
	font-weight: normal;
    padding: 5px;
    color: #fff;
}

.tableListing thead a, .tableListing thead a:visited, .tableListing thead a:hover {
	text-decoration: none;
}

.tableListing span.sortDesc {
    background-image: url(../img/arrow_up.png);
    background-position: 0px 4px;
    background-repeat: no-repeat;
    margin-left:5px;
}

.tableListing tr td { 
    padding: 0px 5px 0px 5px;
}

.tableListing .clickableRow {
	cursor: pointer;
}

.tableListing tr.evenRow {
	background-color: rgba(8,134,141,0.1);
}

.tableListing tr a {
    color: #08868d;
}

.tableListing a:visited { 
	color: #08868d;
}

.tableListing a:hover { 
	color: #08868d;
}

.tableListing thead tr:first-child td { 
    border-bottom: 0px;
}

.tableListing thead th * {
    font-size: 1.0em;
    font-weight: normal;
   	color: #fff; 
}

.tableListing thead a, .tableListing thead a:visited {
	color: #fff;
}

.tableListing thead a:hover { 
	color: #fff; 
}

.patientList {
	width: 100%;
	min-width: 1150px;
}
.patientList--ci {
	margin-top: -20px;
}

.patientList th,
.patientList td {
	padding: 0 5px;
	max-width: 110px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.patientList th {
	padding-top: 5px;
	padding-bottom: 5px;
}

.patientList td.wide-padding {
	padding-left: 15px;
	padding-right: 15px;
}

.patientList select {
	width: 100%;
}

h4.warning,
.tableListing td.warning {
	background-color: #fea;
}
h4.warning {
	padding: 3px 5px;
}
h4[title].warning,
.tableListing td[title].warning {
	position: relative;
	padding-right: 25px;
}
.tableListing td[title].warning.listingC {
	/* center-aligned text need equal padding on both sides */
	padding-left: 25px;
}
h4[title].warning::after,
.tableListing td[title].warning::after {
	content: "";
    background-image: url(/img/exclamation_orange.png);
    background-size: 16px 16px;
    width: 16px;
    height: 16px;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -8px;
    right: 5px;
}

.tableListing td.info {
	background-color: rgba(62, 157, 225, 0.2);
	color: #4169e1;
}
.tableListing td[title].info {
	position: relative;
	padding-right: 25px;
}
.tableListing td[title].info.listingC {
	/* center-aligned text need equal padding on both sides */
	padding-left: 25px;
}
.tableListing td[title].info::after {
	content: "";
    background-image: url(/img/info_blue.png);
    background-size: 16px 16px;
    width: 16px;
    height: 16px;
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -8px;
    right: 5px;
}

/* Used mainly for tables to prevent wrapping in cells*/
.nowrap * {
	white-space: nowrap;
}

.bordertest {
	background : #FFFFFF;
	border-bottom : 1px solid;
	border-color : #333333;
	border-left : 1px solid;
	border-right : 1px solid;
	border-top : 1px solid;
	color : #333333;
	font-size : 0.75em;
}

.bordertestprint {
	border-bottom : 1px solid;
	border-color : #333333;
	border-left : 0px solid;
	border-right : 1px solid;
	border-top : 1px solid;
	padding-left: 0em;
	margin-left: 0em;
	color : #773300;
}

.measurement_placeholder {
	display: block;
	position: relative;
	width: 974px;
	height: 647px;
}
.measurement_placeholder .message {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	background-color: white;
    padding: 25px 45px;
    border: 1px solid #ccc;
}
.measurement_placeholder .message .actionMessage {
	margin: 0 0 15px 0;
}

.classification_markers {
	position: absolute;
	bottom: 30px;
	left: 10px;
	font-size: 0.8em;
}

.classification_marker {
    float:left;
    margin-right: 5px;
    padding: 2px;
}

.classification_marker.inactive {
    text-decoration: line-through;
}

.classification_marker.symtom {
	background-color:#fdd;
}
              
.classification_marker.sinus {
	background-color: rgba(8,134,141,0.15)
}

.classification_marker.ff {
	background-color: #f99;
}

.classification_marker.other {
	background-color: rgba(255,204,51,0.5);
}

.classification_marker.none {
	background-color: rgba(160,160,160,0.15);
}


.classification_marker.poor_quality {
	background-color: rgba(160,160,160,0.15);
}
.device_marker {
	position:absolute;
	right:12px;
	bottom:20px;
	z-index:10;
	padding:2px 2px;
	display:inline;
	font-size: 0.8em;
	min-width: 500px;
	text-align: right;
}

.tableMeasurementSettings {
	margin-left: 30px;
	width: 990px;
}

.chartimg {
	/* To keep a white block when loading/reloading ECG images */
	min-height: 182px;
}

/*            					*/
/* Specification for Displaytag */
/*       					    */



table.dt {
	border: 1px solid #C5D3BA;
	width: 80%;
	margin: 20px 0 20px 0 !important;
	
	font-size:1.5em;
}

table.dt100 {
	border: 1px solid #C5D3BA;
	width: 100%;
	margin: 20px 0 20px 0 !important;
	
	font-size:1.5em;
}

/* Tools abow table */
span.pagebanner {
	background-color: #eee;
	border: 1px dotted #999;
	padding: 2px 4px 2px 4px;
	width: 79%;
	margin-top: 10px;
	display: block;
	border-bottom: none;
}

span.pagelinks {
	background-color: #eee;
	border: 1px dotted #999;
	padding: 2px 4px 2px 4px;
	width: 79%;
	display: block;
	border-top: none;
	margin-bottom: -5px;
}

table.dt {
	border: none;
}

tr.tableRowHeader {
  	font-size: 0.6em;
  	font-weight: 500;
  	background-color: #C5D3BA;
	color: #5B7280;
}

th.tableCellHeader {
  	font-size: 0.6em;
  	font-weight: 500;
  	background-color: #08868d;
	color: #ffffff;
}

th.tableCellHeader a {
	color: #ffffff;
	text-decoration: underline;
}

tr.tableRowOdd,tr.odd {
	background-color: #ffffff;
	padding: 2px 4px 2px 4px;
}

tr.tableRowEven,tr.even {
	background-color: rgba(8,134,141,0.1);
	padding: 2px 4px 2px 4px;
	
}
table.striped tr:nth-child(2n+1) {
	background-color: rgba(8,134,141,0.1);
}

.pdffilenameeditor {
	display: none;
}

#tablePdfFilenameVariables {
	margin-top: 2em;
}

#tablePdfFilenameVariables td {
	padding: 5px;
}

td.tableCell {
  	font-size: 0.6em;
}

td.tableCellTotal {
  	font-size: 0.6em;
  	font-weight: 500;
  	border: 1px solid #C5D3BA;
	border-right: none;
	border-left: none;
	background-color: #f2f5f2;
  	padding: 2px 4px 2px 4px;
}

/* Toolbox under table */
tr.tableRowAction {
	background-color: #eee;
	border: 1px dotted #999;
	padding: 2px 4px 2px 4px;
	width: 100%;
	margin-top: 10px;
	display: block;
}

td.tableCellAction {
  	font-size: 0.8em;
  	font-weight: 500;
  	color: black;
}

.r {text-align: right}


.l {
	text-align: left;
	width: auto;
}
tr.total {
  	font-weight: 500;
  	border: 1px solid #C5D3BA;
	border-right: none;
	border-left: none;
	background-color: #f2f5f2;
  	padding: 2px 4px 2px 4px;
}


/*
	Classes for battery level warnings
*/

span.warnGreen {
	color:#00bb00;
}

span.warnYellow {
	color:#ddbb00;
}

span.warnRed {
	color:#aa0000;
}



/*
	Controls on patient view	
*/

#patientActions button,
#patientActions form input {
	display: block;
}
#patientActions.chain form input,
#patientActions.chain button {
	width: 12em;
}
#noNewMeasurements {
	margin-left: 5px;
	margin-top: 0;
}
.measDiagnosisLink {
	margin-right: 10px;
}



.support-mode-active ul.menu {
	background-color: #d60;
}
.support-mode-active #toggleSupportMode:before, .unlocked-for-admin:before {
	content: ""; 
	width: 20px;
	display: inline-block;
	height: 15px;
	background-image: url(/img/check_black_thick.png);
	background-repeat: no-repeat;
	background-size: contain;
}

td.support-mode,
tr.support-mode td:last-child {
	font-weight: bold;
	color: #d50;
}
tr.support-mode td:first-child {
	padding-left: 3px;
}
tr.support-mode td:last-child {
	padding-right: 3px;
}
td.support-mode,
tr.support-mode {
	outline: 1px solid #f3a98d;
	background-color: #fdc;
}



.user-date-tag {
	font-size: 0.9em;
	color: #999;
	margin: 3px 0;
}
.user-date-tag i {
	font-style: italic;
	color: #000;
}



/* Patient information tab on Assessment page */

table.patientInfo {
	margin-top: 10px;
}

table.patientInfo,
table.patientInfo table {
	width: 100%;
}

table.patientInfo tr,
table.patientInfo td {
	vertical-align: top;
}

table.patientInfo > tbody > tr > td:first-child {
	width: 32%;
	padding-left: 0;
	padding-right: 0.8em;
}

table.patientInfo > tbody > tr > td:nth-child(2) {
	width: 36%;
	padding: 0 0.8em;
	border-left: 1px solid #eee;
	border-right: 1px solid #eee;
}

table.patientInfo > tbody > tr > td:last-child {
	width: 32%;
	padding-left: 0.8em;
	padding-right: 0;
}

table.patientInfo > tbody > tr > td table td {
	width: 50%;
}

table.patientInfo input[type=checkbox] {
	margin-left: 0;
}

#patient_diagnosis, .setDiagnosisMenu {
	max-width: 213px;
}

/* Blocks in Patient Summary */
.block {
    float:left;
    width:262px;
	margin-top: 10px;
    margin-right: 15px;
}
.block.border-left {
	padding-left: 15px;
	border-left: 1px solid #eee;
}

.block > table {
    border-spacing: 0;
    border-collapse: separate;
    width:100%;
    margin-right: 10px;
}

.block > table td {
	padding-right: 0;
}

.value {
    text-align: left;
    padding:0;
}

.value.align-right {
	text-align: right;
}

.block h4 {
    margin: 10px 0 10px 0;
}

/* Patient summary */

.summary a {
	color: #08b !important;
	text-decoration: none;
}

.summary a:hover {
	color: #08b !important;
	text-decoration: underline;
}

/* Dropdown lists in Patient Summary */
.foldoutheader {
    cursor: pointer;
}

.arrow .foldoutbody {

}

.foldoutheader.open .arrow {
    background-image: url(/img/arrow_down.png);
    background-position: 0px 4px;
    background-repeat: no-repeat;
    width:9px;
	padding-left: 15px;
}
.foldoutheader.closed .arrow {
    background-image: url(/img/arrow_right.png);
    background-position: 0px 4px;
    background-repeat: no-repeat;
    width:9px;
	padding-left: 15px;
}

.foldoutbody {
    height:0;
	padding-left: 15px;
}

.foldoutbody table {
    width: 100%;
    border-spacing: 0px;
}

/* FLEX-specific patient summary */

#flex_recordings table + table {
	margin-top: 0.5em;
	padding-top: 0.5em;
	border-top: 1px solid #eee;
}



tr.symptom {
    background-color:rgba(255,221,221,0.5);
}

/* Signals that the page is loading */
.loading_data {
	cursor:wait !important;
}
 
/* Arrow that takes you back up to the top */
#return-to-top {
	width: 25px;
	height: 25px;
	position: fixed;
	bottom: 2px;
	left: 1024px;
	
	z-index: 999;
	cursor: pointer;
}

#return-to-top img {
	width: 25px;
	height:25px;
	opacity: 0.3;
}

#return-to-top img:hover {
	width: 25px;
	height:25px;
	opacity: 0.6;
}

#patient-tabs {
	width: 1200px;
}

@media print {
	#patient-tabs {
		width: 100%;
	}
	#tabs {
		width: 100% !important;
	}
}



/* Container with Sub-sections and adhering (left-hand side) menu, for quick access */

.container-with-sub-sections {
	margin-top: 40px;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 40px;
}

.container-with-sub-sections section.menu {
	position: sticky;
	top: 20px;
	width: 220px;
	min-width: 220px;
	max-width: 220px;
	max-height: calc(100vh - 20px);
	padding-bottom: 15px;
	overflow-y: auto;
}

.container-with-sub-sections section.menu h3 small {
	display: block;
	margin-top: 15px;
	color: #777;
	font-style: italic;
	line-height: 1.1;
}
.container-with-sub-sections section.menu h3 small::before,
.container-with-sub-sections section.menu h3 small::after {
	content: "\"";
	display: inline-block;
	color: #ccc;
	margin: 0 2px;
}

.container-with-sub-sections section.menu ul {
	list-style: none;
	margin: 30px 0 30px;
	padding: 0;
}

.container-with-sub-sections section.menu ul li {
	border-bottom: 1px solid #ddd;
}
.container-with-sub-sections section.menu ul li:last-child {
	border-bottom: none;
}

.container-with-sub-sections section.menu ul li a,
.container-with-sub-sections section.menu ul li span {
	display: block;
	padding: 5px;
}
.container-with-sub-sections section.menu ul li a.inactive {
	color: #999;
}

.container-with-sub-sections section.menu input[type=submit],
.container-with-sub-sections section.menu input[type=button].primary,
.container-with-sub-sections section.menu button.primary {
	padding: 5px 20px;
	background: #08868d;
	color: #fff;
	border: none;
	border-radius: 8px;
	box-shadow: 0 4px 10px -5px #333;
}
.container-with-sub-sections section.menu input[type=submit]:hover,
.container-with-sub-sections section.menu input[type=button].primary:hover,
.container-with-sub-sections section.menu button.primary:hover {
	background: #34a6ab;
}
.container-with-sub-sections section.menu input[type=submit]:disabled {
	color: #fff !important;
}

.container-with-sub-sections.wizard section.menu ul li span.wizard-step-past {
	color: #0b0;
}
.container-with-sub-sections.wizard section.menu ul li span.wizard-step-current {
	color: #08b;
}
.container-with-sub-sections.wizard section.menu ul li span.wizard-step-future {
	color: #999;
}

.container-with-sub-sections.wizard section.menu ul li span .f7-icons {
	font-size: 1.1em;
	margin-right: 5px;
}
.container-with-sub-sections.wizard section.menu ul li span.wizard-step-past .f7-icons::before {
	content: "checkmark_alt";
}
.container-with-sub-sections.wizard section.menu ul li span.wizard-step-current .f7-icons::before {
	content: "arrow_turn_down_right";
}
.container-with-sub-sections.wizard section.menu ul li span.wizard-step-future .f7-icons {
	display: none;
}

.container-with-sub-sections section.content {
	display: block;
	flex-grow: 1;
	max-width: 1400px;
	padding-top: 30px;
}
.container-with-sub-sections.wizard:not(.initialized) section.content {
	display: none;
}

.container-with-sub-sections section.content article:first-child {
	/* in situations when the article (boxes) are the first content,
	   we push them down a bit further to create some visual space */
	margin-top: 40px;
}
.container-with-sub-sections section.content article {
	box-sizing: border-box;
	display: block;
	padding: 0 20px 30px;
	margin-bottom: 30px;
	border: 1px solid #08868d;
	border-radius: 8px;
	overflow: hidden;
	transition: border-color 1s ease-out;
}
.container-with-sub-sections section.content:last-child article {
	width: 90%;
}
.container-with-sub-sections section.content article.inactive {
	border-color: #999;
	opacity: 0.5;
}
.container-with-sub-sections section.content article.scrolled-to {
	border-color: rgb(255,204,51);
	transition: none;
}

.container-with-sub-sections section.content article > h4 {
	display: block;
	padding: 4px 12px;
	margin: 0 -20px 20px;
	background-color: #08868d;
	color: white;
	font-weight: normal;
	font-size: 1.1em;
	transition: background-color 1s ease-out;
}
.container-with-sub-sections section.content article.inactive > h4 {
	background-color: #999;
}
.container-with-sub-sections section.content article.scrolled-to > h4 {
	background-color: rgb(255,204,51);
	transition: none;
}

.container-with-sub-sections.wizard section.content article > h4 {
	transition: none;
}
.container-with-sub-sections.wizard section.content article.wizard-step-past {
	padding: 0;
	margin-bottom: 3px;
	border-color: #ddd;
}
.container-with-sub-sections.wizard section.content article.wizard-step-past > h4 {
	margin: 0;
	background-color: #fff;
	color: #999;
}
.container-with-sub-sections.wizard section.content article.wizard-step-past :not(h4) {
	display: none !important;
}
.container-with-sub-sections.wizard section.content article.wizard-step-current:not(:first-of-type) {
	margin-top: 20px;
}
.container-with-sub-sections.wizard section.content article.wizard-step-future {
	display: none !important;
}

.container-with-sub-sections section.content article h5 {
	margin: 30px 0 15px;
}

.container-with-sub-sections section.content article table {
	width: 100%;
}
.container-with-sub-sections section.content article table th {
	font-weight: bold;
}
.container-with-sub-sections section.content article table td {
	padding-bottom: 5px;
}
.container-with-sub-sections section.content article table:not(.tableBasic) th:not(:last-child),
.container-with-sub-sections section.content article table:not(.tableBasic) td:not(:last-child) {
	min-width: 200px;
	max-width: 250px;
	width: 20%;
	padding-right: 20px;
}
.container-with-sub-sections section.content article table td.formlabel {
	vertical-align: top;
}

.container-with-sub-sections section.content article input:not([type="submit"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]):not([type="image"]),
.container-with-sub-sections section.content article select,
.container-with-sub-sections section.content article textarea {
	box-sizing: border-box;
	width: 80%;
	min-width: 250px;
	min-height: 28px;
	border: 1px solid #999;
	border-radius: 5px;
}

.container-with-sub-sections section.contextual-info {
	align-self: stretch;
	margin: 20px 0 0;
}
.container-with-sub-sections section.contextual-info,
.container-with-sub-sections div.contextual-info-content {
	width: 350px;
	min-width: 350px;
	max-width: 350px;
}
.container-with-sub-sections div.contextual-info-content {
	background-color: #fff;
}

.container-with-sub-sections div.contextual-info-content .sticky-header {
	position: sticky;
	top: 0;
	z-index: 3;
	margin: 0;
	padding: 20px 0 20px;
	background-color: #fff;
}
.container-with-sub-sections div.contextual-info-content h2 {
	margin: 0;
	font-size: 18px;
	font-weight: normal;
 }



/* file upload styling */

.container-with-sub-sections section.content article .file-preview-container {
	position: relative;
	width: 80%;
	min-width: 250px;
}
.container-with-sub-sections section.content article .file-preview-container img {
	display: block;
	margin: 20px 0;
	height: 41px;
}
.container-with-sub-sections section.content article .file-preview-container.removed img {
	opacity: 0.5;
}
.container-with-sub-sections section.content article .file-preview-container.removed img:hover {
	opacity: 1;
}
.container-with-sub-sections section.content article .file-preview-container::after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	padding: 6px 10px 0 40px;
	border-radius: 5px;
	font-style: italic;
	color: #fff;
	text-align: right;
}
.container-with-sub-sections section.content article .file-preview-container.removed::after {
	content: var(--label-will-be-removed);
	background: linear-gradient(to right, transparent, #ca2d2a);
}
.container-with-sub-sections section.content article .file-preview-container.added::after {
	content: var(--label-will-be-added);
	background: linear-gradient(to right, transparent, #2a8a7d);
}



/* styling for sticky, scrollable containers with height that adjusts to window size */

.sticky-scrollable-container {
	position: relative;
	margin: 0;
	padding: 0;
}
.sticky-scrollable-container-content {
	margin: 0;
	padding: 0;
	overflow-y: auto;
}
.sticky-scrollable-container-content.pos-bottom {
	position: fixed;
	top: 0;
	bottom: auto;
}
.sticky-scrollable-container-content.pos-middle {
	position: fixed;
	top: 0;
	bottom: 0;
}
.sticky-scrollable-container-content.pos-top {
	position: absolute;
	top: 0;
	bottom: auto;
	max-height: 100vh;
}



/* image-based icons */

.img-icons {
	display: inline-block;
}

.img-icons::before {
	content: " ";
	white-space: pre;
	display: inline-block;
	background-position: center left;
	background-repeat: no-repeat;
}
.img-icons:not(:last-child)::before {
	margin-right: 5px;
}

/* generic device icon */
/* DEPRECATED! use more type-specific variants below instead */

.img-icons.device::before {
	width: 28px;
	height: 20px;
	background-size: 28px 18px;
	background-image: url("/img/device-icon-alpha.png");
}
.img-icons.device.small::before {
	width: 25px;
	height: 16px;
	background-size: 25px 16px;
}

/* device-specific icons */

.img-icons.device.ekg2device::before,
.img-icons.device.flexdevice::before {
	width: 30px;
	height: 25px;
	background-size: 30px;
}

.img-icons.device.ekg2device::before {
	background-image: url("/img/device/30px/one-outline-black.png");
}
.img-icons.device.ekg2device.specific::before {
	background-image: url("/img/device/30px/one-solid.png");
}

.img-icons.device.flexdevice::before {
	background-image: url("/img/device/30px/flex-outline-black.png");
}
.img-icons.device.flexdevice.specific-360::before {
	background-image: url("/img/device/30px/flex-solid-360.png");
}
.img-icons.device.flexdevice.specific-180::before {
	background-image: url("/img/device/30px/flex-solid-180.png");
}
.img-icons.device.flexdevice.specific-180l::before {
	background-image: url("/img/device/30px/flex-solid-180.png");
}

/* retina-specific stuff */
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
	.img-icons.device.ekg2device::before {
		background-image: url("/img/device/128px/one-outline-black.png");
	}
	.img-icons.device.ekg2device.specific::before {
		background-image: url("/img/device/128px/one-solid.png");
	}

	.img-icons.device.flexdevice::before {
		background-image: url("/img/device/128px/flex-outline-black.png");
	}
	.img-icons.device.flexdevice.specific-360::before {
		background-image: url("/img/device/128px/flex-solid-360.png");
	}
	.img-icons.device.flexdevice.specific-180::before {
		background-image: url("/img/device/128px/flex-solid-180.png");
	}
	.img-icons.device.flexdevice.specific-180l::before {
		background-image: url("/img/device/128px/flex-solid-180.png");
	}
}

/* smaller device-specific icons */

.img-icons.device.ekg2device.small::before {
	width: 25px;
	height: 18px;
	background-size: 26px;
}
.img-icons.device.flexdevice.small::before {
	width: 20px;
	height: 20px;
	background-size: 24px;
}

/* headings with device icons */

h1 .img-icons.device.ekg2device::before,
h1 .img-icons.device.flexdevice::before,
h2 .img-icons.device.ekg2device::before,
h2 .img-icons.device.flexdevice::before,
h3 .img-icons.device.ekg2device::before,
h3 .img-icons.device.flexdevice::before {
	width: 40px;
	height: 35px;
	background-size: 40px;
}

/* certificate icons for Native app certificates */

.img-icons.certificate.small::before {
	width: 20px;
	height: 20px;
	background-size: 16px;
}

.img-icons.certificate::before {
	width: 30px;
	height: 35px;
	background-size: 28px;
	background-image: url("/img/certificate_icon.png");
}

/* Used for selecting the assessment type */
.assessment-type-indicator {
	display: inline-block;
	width: 119px;
	height: 52px;
	background-size: contain;
	background-position: top left;
	background-repeat: no-repeat;
}

.assessment-type-indicator.ekg2device {
	background-image: url("/img/device/zenicor-one.svg");
}
.assessment-type-indicator.flexdevice {
	background-image: url("/img/device/zenicor-flex.svg");
}

.assessment-type-indicator.selected {
	/*box-shadow: 0 4px 10px -5px #999;*/
}
.assessment-type-indicator.unselected {
	opacity: 0.3;
}

.patient-assessment-type-indicator {
	position: absolute;
	top: 10px;
	left: 50%;
	z-index: 10;
	margin-left: -55px;
	background-color: white;
}