/* APP
--------------------------------------------- */
html,
body {
    height: 100%;
}

.app-container {
    height: 100%;
}

/* HEADER
--------------------------------------------- */
.user-account {
    border-right: 1px solid #ccc;
}

.user-item {
    padding: 0 15px;
}

.user-item-border {
    border-left: 1px solid #ccc;
}

.header-branding {
    padding-right: 15px;
    font-size: 24px;
    line-height: 1;
}

.user-controls {
    align-items: center;
}
.user-name {
    padding-left: 5px;
}

/* System independent color scheme */
.header-container {
    border-bottom: 1px solid var(--primary-branding-color);
    background-color: var(--tertiary-branding-color);
    padding: 3px 15px;
    color: #fff;
}

a.logout-item {
    color: #fff !important;
}

a.logout-item:visited,
a.logout-item:focus,
a.logout-item:active {
    color: #fff;
}

a.logout-item:hover {
    color: #fff;
}

a.logo-link {
    color: #fff;
    text-decoration: none;
}

a.logo-link:visited,
a.logo-link:focus,
a.logo-link:active {
    color: #fff;
}

/* Entry color scheme */
.view-Entry .header-container {
    border-bottom: 1px solid var(--primary-branding-color);
    background-color: var(--tertiary-branding-color);
    padding: 5px 15px;
    color: #fff;
}

.view-Entry a.logout-item {
    color: #fff;
}

.view-Entry a.logout-item:visited,
.view-Entry a.logout-item:focus,
.view-Entry a.logout-item:active {
    color: #fff;
}

.view-Entry a.logo-link {
    color: #fff;
    text-decoration: none;
}

.view-Entry a.logo-link:visited,
.view-Entry a.logo-link:focus,
.view-Entry a.logo-link:active {
    color: #fff;
}

/* Admin color scheme */
.view-Admin .header-container {
    border-bottom: 1px solid var(--primary-branding-color);
    background-color: var(--tertiary-branding-color);
    padding: 5px 15px;
    color: #fff;
}

.view-Admin a.logout-item {
    color: #fff;
}

.view-Admin a.logout-item:visited,
.view-Admin a.logout-item:focus,
.view-Admin a.logout-item:active {
    color: #fff;
}

.view-Admin a.logo-link {
    color: #fff;
    text-decoration: none;
}

.view-Admin a.logo-link:visited,
.view-Admin a.logo-link:focus,
.view-Admin a.logo-link:active {
    color: #fff;
}

/* CONTENT
--------------------------------------------- */
.content-container {
}

/* LEFT-MENU
--------------------------------------------- */
.left-menu-container {
    border-right: 1px solid #adb5bd;
    background-color: #eaeaea;
    width: 250px;
}

.left-menu-inner {
    padding-top: 10px;
}

.patient-block-container {
    padding: 5px;
}

.patient-block {
}

.patient-name {
    font-size: 22px;
    padding: 0 5px;
}

.left-patient-btn {
    padding: 3px 6px;
    cursor: pointer;
    background-color: var(--tertiary-branding-color);
    color: #fff !important;
    border-radius: 5px;
}

#return-top-btn {
    position: fixed;
    bottom: 10px;
    left: 5px;
    cursor: pointer;
    background-color: #ddd;
    padding: 5px 10px;
    border-radius: 5px;
}

#return-top-btn:hover {
    background-color: #ccc;
}

.left-patient-btn:hover {
    background-color: #0f1a24;
    text-decoration: none;
}

.patient-btn-container {
    padding: 3px;
}

.dropdown-pt-detail {
    padding: 0 5px;
    display: inline-block;
}

.hospital-block-container {
    padding: 5px;
}

.hospital-block {
    border-bottom: 2px solid #ccc;
}

.left-patient-dropdown {
    margin: 0;
}

.patient-section {
    margin-top: 15px;
}

.patient-name-container {
    font-size: 24px;
    padding: 0 5px;
    line-height: 1.2;
}

.patient-id-container {
    font-size: 18px;
    padding: 0 5px;
    line-height: 1.2;
}

.left-form-list {
}

.no-forms-notes {
    padding: 5px 15px;
    display: block;
}

.add-form-dropdown {
    margin-left: 30px;
}

.left-form-item {
    margin-bottom: 2px;
    border: 1px solid #ddd;
}

.left-form-link {
    /* display: inline-grid; */
    padding: 7px 10px;
    background-color: #fff;
    width: 100%;
    line-height: 1;
    color: var(--tertiary-branding-color) !important;
    font-size: 19px;
    overflow-wrap: break-word;
    overflow: hidden;
}

.left-form-link:hover {
    background-color: #eee;
    text-decoration: none;
    color: #555 !important;
}

.left-form-link-title {
    word-break: break-all;
}

.form-item-summary {
    margin-bottom: -5px;
}

.form-summary-single {
    position: relative;
}

.form-summary-label {
    font-size: 13px;
    color: #888;
    position: absolute;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    line-height: 1;
    display: inline-block;
    padding-left: 5px;
    width: 100%;
}

.form-summary-value {
    display: inline-block;
    margin-top: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 15px;
    color: #555;
    line-height: 1;
    padding-left: 5px;
    width: 100%;
}

.left-patient-btns {
    padding: 0 5px;
    width: 100%; /*make select look more like chosen*/
    color: #999;
}

.left-form-status-indicator {
    width: 7px;
    flex: 0 0 auto;
}

/* NAV
--------------------------------------------- */
.nav-container {
    background-color: #fafafa;
    box-shadow: 1px 1px 2px #ccc;
}

.nav-inner {
}

a.add-pt-btn {
    border: 1px solid var(--primary-btn-hover-color);
    background-color: var(--primary-btn-color);
    border-radius: 10px;
    padding: 3px 25px;
    color: #fff !important;
    display: block;
    text-align: center;
}

a.add-pt-btn .material-icons {
    font-size: 20px;
}

a.add-pt-btn:visited,
a.add-pt-btn:focus,
a.add-pt-btn:active {
    color: #fff;
}

a.add-pt-btn:hover {
    filter: brightness(0.9);
    text-decoration: none;
    color: #fff;
}

.add-pt-container {
    padding: 4px 15px;
}

.select-hospital {
    border: none;
    background-color: transparent;
    font-size: 22px;
    margin: 0;
    padding: 0;
}

.select-hospital:focus {
    box-shadow: none;
}

.select-hospital option {
    font-size: 1rem;
    padding: 15px;
}

/*.select-patient {
	border: none;
	background-color: transparent;
	font-size: 22px;
	margin: 0;
	padding: 0;
}

.select-patient:focus {
	box-shadow: none;
}

.select-patient option {
	font-size: 1rem;
	padding: 15px;
}*/

.nav-item {
    /* font-size: 18px; */
    /* line-height: 1.2; */
    display: inline-block;
    vertical-align: middle;
}

.nav-item-link span {
    vertical-align: middle;
}

a.nav-item-link {
    color: #555 !important;
    display: inline-block;
    padding: 5px 15px 2px 15px;
    border-bottom: 3px solid transparent;
}

.nav-item-nolink {
    color: #555;
    display: inline-block;
    padding: 5px 15px;
}

a.nav-item-link:hover {
    text-decoration: none;
}

a.nav-item-link:hover,
.active-nav-item {
    border-bottom-color: var(--primary-branding-color) !important;
}

a.nav-item-link:visited,
a.nav-item-link:focus,
a.nav-item-link:active {
    color: #555;
}

.nav-item .material-icons {
    font-size: 18px;
}

.active-form-menu {
    background-color: #ddd;
}

.view-select-container {
}

.view-select-btn {
    padding: 5px 10px;
    width: 50%;
    text-align: center;
    display: block;
}

.view-select-btn:hover {
    background-color: var(--secondary-branding-color);
    color: #fff;
    text-decoration: none;
}

.view-admin.Admin,
.view-entry.Entry {
    background-color: var(--secondary-branding-color);
    color: #fff;
}

.nav-toggle-container {
    background-color: #fff;
    /* padding: 5px; */
    /* margin-right: -1px; */
    margin-top: -1px;
}

.view-admin,
.view-entry {
    /* border: 1px solid var(--secondary-branding-color); */
}

.view-admin {
    /* border-top-left-radius: 5px;
    border-bottom-left-radius: 5px; */
    border-right: 1px solid var(--tertiary-branding-color);
}

.view-entry {
    /* border-top-right-radius: 5px;
    border-bottom-right-radius: 5px; */
    border-left: 1px solid var(--tertiary-branding-color);
}

.nav-section {
}

.nav-section-container {
}

.nav-label {
    font-weight: bold;
}

.nav-divider {
    border-bottom: 2px solid #888;
}

/* FOOTER
--------------------------------------------- */
.footer-container {
    border-top: 1px solid #adb5bd;
    padding: 10px;
    text-align: center;
}

.footer-inner {
}

/* MAIN
--------------------------------------------- */
.main-container {
    max-width: 1300px;
}

.main-container-full-width {
    max-width: 100%;
    min-width: 100%;
    width: 100%;
}

.main-inner {
    padding: 15px;
    height: 100%;
}

.body-container {
    height: 100%;
}

/* DASHBOARD */
.data-info-container {
}

.data-visualization-container {
    padding: 20px;
    border: 1px solid #aaa;
    box-shadow: 1px 1px 2px #888;
}

.details-container {
    /* min-height: 200px; */
    padding-right: 10px;
}

.data-visualization-container img {
    height: 100%;
    width: 100%;
}

.details-title {
    font-size: 28px;
    line-height: 1.2;
    margin-bottom: 5px;
}

.details-item {
    padding: 3px 5px;
}

.announcements-container {
    margin-bottom: 20px;
}

.announcements-box {
    border: 1px solid #c1e1ff;
    background-color: #e2f1ff;
    border-radius: 15px;
    padding: 10px 15px;
    margin-bottom: 10px;
}

.announcement-title {
    font-weight: bold;
}

.announcement-body {
}

.close-announcement-btn .material-icons {
    font-size: 18px;
    cursor: pointer;
}

.dashboard-list-container {
    margin-top: 25px;
}

.dashboard-list-container-inner {
    border: 1px solid #aaa;
    box-shadow: 1px 1px 2px #888;
    border-top: 4px solid var(--tertiary-branding-color);
    position: relative;
}

.dashboard-list {
    display: none;
}

.dashboard-list-inner {
}

.dashboard-list-inner table {
}

.dashboard-list-container .tab {
    display: inline-block;
    font-size: 20px;
    margin-left: 5px;
    margin-right: 5px;
    border: 1px solid #ccc;
    background-color: #eee;
    padding: 2px 15px;
    color: #555;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: none;
    cursor: pointer;
}

.dashboard-list-container .tab.active-tab {
    background-color: var(--tertiary-branding-color);
    color: #fff;
}

.active-list {
    display: block;
}

.helper-note {
    color: #192a38;
    font-weight: bold;
}

.dashboard-tab-hide {
    display: none;
}

.dashboard-column-45 {
    width: 45%;
}

.dashboard-column-25 {
    width: 25%;
}

.dashboard-column-20 {
    width: 20%;
}

.dashboard-column-10 {
    width: 10%;
}

.dashboard-column-5 {
    width: 5%;
}
/* ERROR
--------------------------------------------- */
.field-validation-error {
    color: red;
    font-weight: bold;
    padding: 2px 6px;
}

/* ADMIN
--------------------------------------------- */
.admin-display {
    padding: 10px 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #fafafa;
    margin-bottom: 20px;
}

.app-variable-text {
    word-break: break-all;
}

.admin-selection-display {
    /* padding: 5px 15px; */
}

.admin-selection-display select {
    width: 100%;
}

.admin-header {
    margin-bottom: 5px;
}

.admin-body {
    padding: 5px;
}

.admin-subtext {
    color: #777;
}

a.manage-btn {
    display: inline-block;
    padding: 3px 10px;
    background-color: var(--primary-branding-color);
    color: #fff;
    border-radius: 5px;
}

a.manage-btn:visited,
a.manage-btn:focus,
a.manage-btn:active {
    color: #fff;
}

a.manage-btn:hover {
    text-decoration: none;
    filter: brightness(0.9);
}

.records-count {
    font-size: 20px;
    padding: 0 10px;
}

.fieldAnnotation {
    display: none;
    font-size: 12px;
}

.subtext {
    color: #777;
}

/* FORM TYPES */

.form-type-display {
}

.form-type-heading {
    /* background-color: #fafafa;
	border: 1px solid #bbb; */
    padding: 5px 10px;
    border-bottom: 2px solid var(--tertiary-branding-color);
}

.formRow {
    padding: 5px 10px;
    /* border: 1px solid #ccc; */
    /* margin: 5px 0; */
    border-radius: 5px;
    /* background-color: #fafafa; */
}

.form-type-section {
    margin-bottom: 30px;
    /* border-bottom: 1px solid var(--tertiary-branding-color); */
}

.form-type-controls {
    padding: 10px 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #fafafa;
}

.clear-search-btn {
}

/* .formRow:nth-child(odd) {
	background-color: #f2f2f2;
} */

.formRow:hover {
    background-color: #eee;
}

.formLinkText {
    font-size: 18px;
    font-weight: bold;
    color: #555;
}

.formLinkDate {
}

.viewformslinks {
}

a.formlink {
    padding-left: 10px;
    padding-right: 10px;
}

.viewformslinks {
}

.form-type-date {
    color: #777;
    margin-left: 5px;
}

.create-btn {
    background-color: var(--primary-branding-color);
    padding: 3px 5px;
    color: #fff;
    vertical-align: bottom;
    border-radius: 5px;
}

.create-btn:hover {
    text-decoration: none;
    filter: brightness(0.9);
}

/* PAGE */
.page-heading {
    margin-bottom: 20px;
}

/* EDITOR TEMPLATES
--------------------------------------------- */

/* display only */
.displayRow {
}

.display-only {
    padding: 20px 10px 0 10px;
    border-bottom: 1px solid var(--tertiary-branding-color);
    flex: 1 0 0;
}

.displayText {
}

.displayTitle {
    color: var(--secondary-branding-color);
    font-size: 26px;
    line-height: 1.2;
}

.displaySubtext {
    font-size: 18px;
    color: #888;
    line-height: 1.2;
}

.displayDescription {
}

.displayAdditionalInfo {
}

/* SUBMIT BTN
--------------------------------------------- */

.submitButton,
.actionButton {
    margin-left: 5px;
    margin-right: 5px;
}

.btn-container {
    text-align: center;
    padding-top: 30px;
}

/* FORM EDIT
--------------------------------------------- */
.edit-form-preview-container {
    min-height: 100%;
    width: 100%;
}

.add-label {
    font-size: 24px;
    color: var(--tertiary-branding-color);
}

.add-subtext {
    padding-left: 10px;
    color: #888;
}

.form-edit-container {
}

.form-edit-control-btn {
    margin-top: 2px;
    margin-bottom: 2px;
}

.panel {
    padding: 10px;
}

.form-edit-specify-container,
.missing-reason-container {
    width: 100%;
}

.form-edit-border-top {
    border-top: 1px solid #ccc;
}

.form-edit-delete-specify .material-icons {
    font-size: 16px !important;
    vertical-align: middle;
}

a.form-edit-add-option {
    width: 100%;
    background-color: var(--secondary-branding-color);
    padding: 5px 10px;
    display: block;
    color: #fff !important;
    border-radius: 4px;
    text-align: center;
}

a.form-edit-add-option:hover {
    text-decoration: none;
    background-color: var(--secondary-branding-color-light);
}

.form-add-button-group {
    padding: 10px;
    border: 1px solid #ccc;
    background-color: #fafafa;
    border-radius: 5px;
}

.form-edit-status-bar {
    position: sticky;
    top: 5px;
    z-index: 10;
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 1px 1px 2px #555;
    width: 100%;
    padding: 5px 10px;
    border-radius: 5px;
}

.status-label {
    font-weight: bold;
}

.status {
    font-weight: bold;
}

.status-good {
    color: green;
}

.status-bad {
    color: red;
}

.editor-input {
    display: block;
}

.handle {
    width: 20px;
    height: 25px;
    margin: 0;
    background-image: url('../../images/updown.png');
    background-repeat: no-repeat;
}

.handle-fade {
    opacity: 0.4;
}

.question-editor-row {
    border: 1px solid #ccc;
    padding: 8px;
    margin-bottom: 15px;
    background: #fff;
    position: relative;
    min-height: 50px;
    box-shadow: 1px 1px 1px #ccc;
    border-top: 3px solid var(--tertiary-branding-color);
    background-color: #fafafa;
}

.add-option-icon {
    vertical-align: middle;
}
/* 
[data-is-collapsed='false'] .question-collapse-view,
[data-is-collapsed='true'] .question-expand-view {
	display: none;
}

[data-is-collapsed='true'] .question-collapse-view,
[data-is-collapsed='false'] .question-expand-view {
	display: block;
} */

.collapse-all-btn {
    display: inline-block;
    cursor: pointer;
    padding: 0px 8px;
    border-radius: 4px;
    background-color: #fafafa;
    border: 1px solid #ddd;
}

.collapse-all-btn:hover {
    background-color: #eee;
}

.collapse-all-btn .material-icons {
    vertical-align: middle;
}

.form-edit-input-container {
    padding-right: 10px;
    margin-bottom: 5px;
}

.form-edit-input-container input,
.form-edit-input-container select,
.form-edit-input-container textarea {
    margin: 0;
    min-width: initial;
}

.form-edit-label-text {
    font-size: 14px;
    text-align: right;
}

.form-edit-input-container .material-icons {
    font-size: 15px;
    align-self: center;
}

.form-edit-input-label {
    /* background-color: #fafafa;
	padding: 0 14px 0 10px;
	margin-right: -2px;
	border: 1px solid #ccc; */
    z-index: 1;
    /* border-top-left-radius: 4px;
	border-bottom-left-radius: 4px; */
    line-height: 1;
    /* background-color: #eee; */
    display: inline-flex;
    height: 100%;
    padding-right: 5px;
    font-weight: bold;
}

.form-edit-add-btn,
.form-edit-open-btn {
    display: inline-block;
    padding: 3px 10px;

    color: #fff !important;
    margin-bottom: 2px;
    border-radius: 4px;
    font-size: 14px;
}

.form-edit-add-btn {
    background-color: var(--secondary-branding-color) !important;
}

.form-edit-add-btn:hover {
    text-decoration: none;
    background-color: var(--secondary-branding-color-light) !important;
    cursor: pointer;
}

.form-edit-open-btn {
    background-color: var(--tertiary-branding-color) !important;
}

.form-edit-open-btn:hover {
    text-decoration: none;
    background-color: var(--tertiary-branding-color-light) !important;
    cursor: pointer;
}

.collapsible-placeholder {
    line-height: 1.1;
}

.condition-editor-active-list {
    border-top: 1px solid #ccc;
}

.ui-dialog-titlebar.form-edit-dialog,
.warning-dialog .ui-dialog-titlebar {
    background-color: var(--tertiary-branding-color) !important;
    color: #fff;
}

.warning-dialog .ui-dialog-titlebar-close {
    display: none;
}

.form-edit-add-btn a {
    color: #fff;
    text-decoration: none;
}

.step-label {
    font-size: 22px;
    color: #888;
}

.form-edit-input-field {
    /* margin-top: -5px; */
}

.question-option-row {
    /* margin-left: 10px;
    padding: 5px;
    border-bottom: 1px solid #bbb;
    background: #fff; */
}

.condition-editor-box {
    background-color: #fafafa;
    border: 1px solid #ddd;
    padding: 5px 15px;
    min-height: 50px;
}

.editortextbox-container {
    padding-bottom: 5px;
}

input.editortextbox {
    width: 100%;
    margin: 0;
}

select.editor-select {
    margin: 0;
}

select.form-control {
    margin: 0;
}

.question-editor select {
    margin: 0;
}

.editor-label {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: -6px;
    display: block;
    position: relative;
    z-index: 2;
}

.background-secondary-branding-color {
    background-color: var(--secondary-branding-color);
    color: #fff;
}

.small-right-corner,
.small-left-corner {
    display: inline-block;
    font-size: 14px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
}

a.small-right-corner {
    color: var(--primary-text-color);
}

.small-right-corner a {
    color: var(--primary-text-color);
}

.question-type-tag {
    font-size: 14px;
    margin-top: -11px;
    padding: 0 5px;
}

.editor-flags {
    margin-top: -11px;
    margin-bottom: 2px;
}

.question-type-tag-editor {
    font-size: 14px;
    padding: 0 5px;
}

.question-type-tag-form {
    font-size: 14px;
    /* margin-top: -5px; */
    padding: 0 5px;
}

.question-optional-background {
    background-color: rgb(177 121 203);
    color: #fff;
}

.form-edit-question-controls {
    /* margin-bottom: -5px; */
}

.small-right-corner {
    margin-top: -10px;
}

.small-left-corner {
    margin-top: -5px;
}

.show-optional-tag-True {
    display: block;
}

.show-optional-tag-False {
    display: none;
}

.small-right-corner:hover,
.small-left-corner:hover {
    background-color: #eee;
    border-radius: 4px;
}

.question-option-container {
    border: 1px solid #ccc;
}

.dialog-pdf-fixed {
    position: fixed;
}

.dialog-help-hide {
    display: none;
}

.dialog-help-icon {
    color: black;
    vertical-align: text-bottom;
}

.main-device-help-icon {
    vertical-align: middle;
}

/* PATIENT SUMMARY
--------------------------------------------- */
.patient-dashboard-container {
}

.patient-form-container {
    padding: 5px 10px;
}

.patient-form-bar {
    padding: 5px 10px;
    line-height: 1.2;
}

.patient-form-bar-label {
    font-weight: bold;
}

.patient-form-bar-value {
    font-weight: normal;
}

.patient-dashboard-container .patient-form-bar-label {
    padding: 0 10px;
}

.patient-form-inner {
    background-color: #fafafa;
    border: 1px solid #ccc;
    align-items: stretch;
}

.patient-form-item {
    padding: 2px 10px;
}

.form-status-indicator {
    width: 10px;
}

.summaryFormStatus {
    font-size: 22px;
    font-weight: bold;
    line-height: 1;
}

a.patient-form-title {
    font-size: 24px;
    color: #555;
}

.patient-form-subtext {
    color: #888;
    font-size: 16px;
}

.patient-type-title {
    color: #fff;
    display: inline-block;
    padding: 5px 10px;
}

/* magic numbers for patient type background colors */
.patient-type-1 {
    /* arch branch */
    background-color: hsl(78 55% 53% / 1);
    color: #fff;
}

.patient-type-2 {
    /* branch fenestrated */
    background-color: hsl(212deg 79% 67%);
    color: #fff;
}

/* ADD FORM */
.add-form-container {
    text-align: right;
    position: relative;
    margin-bottom: 15px;
}

.add-form-inner {
    display: inline-block;
}

.add-icon {
    vertical-align: middle;
}

.add-form-btn {
}

.add-form-dropdown {
    position: absolute;
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 1px 1px 2px #888;
    right: 0;
    text-align: left;
}

.add-form-dropdown-left {
    position: absolute;
    background-color: #fff;
    border: 1px solid #192a38;
    box-shadow: 1px 1px 3px #aaa;
    text-align: left;
    min-width: 250px;
    z-index: 5;
    margin-left: 5px;
}

a.add-form-item {
    padding: 7px 15px;
    font-size: 18px;
    display: block;
    line-height: 1.2;
    color: #6d7277;
}

a.add-form-item:hover {
    background-color: #eee;
    text-decoration: none;
    color: #6d7277;
}

a.add-form-item:not(:last-child) {
    border-bottom: 1px solid #ddd;
}

/* LOGIN PAGE
--------------------------------------------- */
.login-page-container {
    text-align: center;
    margin-top: 100px;
    font-size: 17px;
}

.login-page-inner {
    border: 1px solid #aaa;
    display: inline-block;
    border-radius: 10px;
    background-color: #fefefe;
    box-shadow: 1px 1px 2px #ccc;
    max-width: 450px;
}

.login-title {
    font-size: 36px;
}

.login-subtitle {
    font-size: 28px;
    color: #888;
}

.login-error,
.login-info {
    font-size: 20px;
}

.login-error {
    color: red;
}

.login-info {
    color: blue;
    max-width: 600px;
    margin: 0 auto;
}

.login-message-container {
    padding: 5px;
}

.login-form {
}

.login-input-container {
    padding: 20px 35px;
    max-width: 350px;
}

.login-btn-container {
    margin: 20px 0;
}

.login-btn {
    width: 100%;
}

.login-input {
}

.login-input input {
    margin: 15px 0 0 0;
    width: 100%;
    padding: 10px 15px;
}

.login-branding {
    padding: 20px 35px 0 35px;
    color: var(--tertiary-branding-color);
}

.forgot-password {
    text-align: right;
}

a.login-links {
    text-decoration: none;
    color: var(--tertiary-branding-color);
}

a.login-links:hover {
    text-decoration: underline;
}

a.login-links:visited,
a.login-links:focus,
a.login-links:active {
    color: var(--tertiary-branding-color);
}

.password-reset-msg {
    padding: 5px 0;
}

.password-reset-error {
    color: red;
    padding-bottom: 10px;
}

.register-container {
    background-color: #f2f2f2;
    border-top: 1px solid #ccc;
    padding: 15px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.footer-version {
    color: rgba(0, 0, 0, 0);
    position: absolute;
}

.session-dialog {
    background-color: var(--secondary-branding-color);
    color: #fff;
}

.session-dialog-text {
    text-align: center;
    font-size: 20px;
}

.session-warning-dialog .ui-button,
.warning-dialog .ui-button {
    padding: 10px 15px;
}

#session-dialog-timer {
    font-size: 24px;
    text-align: center;
}

/* HOSPITAL LIST PAGE */
.new-hospital-container {
    margin-bottom: 20px;
}

.conditional-highlight {
    background-color: #cfffcf;
}

.conditional-info {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.5);
    display: block;
}

.pt-dashboard-notice {
    background-color: #e05050;
    color: #fff;
    display: inline-block;
    padding: 5px 10px;
}

.enrollment-status-tag {
    background-color: #0094ff;
}

.notice-item-container {
    display: inline-block;
    padding: 3px 10px;
    background-color: #fff;
    border: 1px solid #ccc;
}

.notice-item {
    margin-bottom: 2px;
}

a.view-notice-btn:hover {
}

.left-item-notice.material-icons {
    color: #e05050;
    font-size: 19px;
    margin-right: -10px;
    background-color: transparent;
}

.integrity-check-true,
.integrity-check-True {
    border: 1px solid #e05050;
}

.integrity-check-false,
.integrity-check-False {
    border: 1px solid #ccc;
}

.show-checks-btn {
    cursor: pointer;
    background: #e05050;
    color: #fff;
    padding: 3px 8px;
    display: inline-block;
}

.show-checks-btn:hover,
.show-checks-btn:focus {
    text-decoration: none;
    background-color: #ca4949;
    color: #fff;
}

.hospital-details-container {
    /* border: 1px solid #adb5bd;
	border-radius: 4px;
	background-color: #fafafa;
	box-shadow: 1px 1px 2px rgb(0 0 0 / 10%); */
    padding: 5px 15px;
}

/* TABLES */

/* .in-progress-table {
	width: 100%;
	table-layout: fixed;
}
.in-progress-table tr {
	width: 100%;
}

.in-progress-table td {
	max-height: 40px;
}

.in-progress-table td:nth-of-type(1) {
	width: 40%;
}

.in-progress-table td:nth-of-type(2) {
	width: 15% !important;
}
.in-progress-table td:nth-of-type(3) {
	width: 15%;
}
.in-progress-table td:nth-of-type(4) {
	width: 15%;
}
.in-progress-table td:nth-of-type(5) {
	width: 15%;
}

.dashboard-table-cell {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


.patient-list-table {

}
*/
.dashboard-checks-container {
    padding: 5px;
}

.dashboard-checks-title {
    padding: 5px 10px;
    font-size: 26px;
    color: #e05050;
}

.integrity-checks-table {
    width: 100%;
    border: 1px solid #ffbcbc;
    background-color: #ff000008;
}

.integrity-checks-table th {
}

.integrity-checks-table th,
.integrity-checks-table td {
    padding: 5px 10px;
}

.integrity-checks-table tbody tr:hover {
    background-color: #ffeeee;
}

/* User account page */
.user-account-label {
    text-align: right;
    font-weight: bold;
}

.user-account-input-container {
}

.user-account-input-text {
    min-width: 400px;
}

.change-password-input-text {
    min-width: 300px;
}

.user-account-tabs {
    padding: 20px 20px 0 20px;
    border-bottom: 1px solid #ccc;
}

.user-account-toggle {
    padding: 5px 15px;
    border: 1px solid #ccc;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    display: inline-block;
    margin-bottom: -1px;
    background-color: #fafafa;
    cursor: pointer;
}

.user-account-toggle:hover,
.user-account-toggle.active-tab {
    box-shadow: 0 0 1px #555;
}

.tab-content-container {
    position: relative;
    z-index: 1;
    background-color: #fff;
    padding-top: 20px;
}

.user-account-toggle.active-tab {
    background-color: #fff;
    border-bottom-color: #fff;
}

.user-account-textarea {
    min-width: 400px;
}

.tab-pane.active-tab {
    display: block;
}
.tab-pane {
    display: none;
}

.hospital-dashboard-title {
    font-size: 34px;
    margin-bottom: 10px;
    color: #485d77;
}

/* export */
.datapreview {
    padding: 10px;
    overflow-x: auto;
}

#global-loading {
    z-index: 5;
    position: absolute;
    width: 100%;
    height: 100%;
    /*background: #fff;*/
    padding: 10px;
    text-align: center;
}

.form-section {
    position: relative;
}

/* Meter Graphic */
.meter-container {
    /* box-shadow: 1px 1px 2px #eee;
	border: 1px solid #ddd; */
    padding: 5px 15px;
}

.meter-graphic-container {
}

.meter-tick-container {
    position: relative;
    height: 20px;
}

.meter-graphic {
    height: 30px;
    background-color: #fafafa;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #ddd;
    box-shadow: 1px 1px 2px #eee;
}

.meter-ticks div {
    font-size: 14px;
    text-align: right;
    position: absolute;
}

.meter-ticks div:not(:first-child) {
    margin-left: 10px;
}

.meter-subtext {
    line-height: 1.2;
    font-size: 15px;
    font-weight: bold;
    color: #dc3545;
}

.meter-text {
    font-size: 14px;
    text-align: right;
    font-weight: bold;
}

.meter-title {
    font-size: 20px;
    color: var(--secondary-branding-color);
}

.filled-meter {
    width: 0%;
    background-color: lightgreen;
    height: 100%;
}

.meter-detail-value {
    font-weight: bold;
    color: var(--tertiary-branding-color);
}

.meter-detail {
    padding: 0 5px;
}

/* patient type widget 
-------------------------------------------------------------- */

.patient-type-count-container {
    padding: 0 25px;
}

.pie-chart-container {
    padding: 20px 50px;
}

.patient-type-pie-chart {
    height: 120px;
    width: 120px;
    border-radius: 50%;
    border: 1px solid rgb(121, 134, 203);
}

.pie-color-key {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    margin-right: 10px;
    border: 1px solid #fff;
}

/* app settings page
-------------------------------------------------------------- */

.app-settings-input {
    width: 350px;
}

.app-settings-label {
    font-weight: bold;
    text-align: right;
}

.app-settings-descrition {
    color: #999;
    text-align: right;
    font-size: 14px;
}

.app-settings-textarea {
    min-height: 100px;
    min-width: 350px;
}

.app-settings-note {
    color: red;
    float: left;
}