html, body {
  min-height: 100%;
  padding: 0;
  margin: 0;
  color:rgba(19,34,48,0.7);
}
/* Fixes that bottom white strip issue on certain mobile views */
html, body {
  background: #F0F7FD;
}

nav {
  height:64px;
}

footer {
  font-size: 12px;
  padding: 16px;
  color:rgba(54, 94, 133, 0.5);
  background: #F0F7FD;
}

/*

TYPOGRAPHY

*/

/* Basics */

h1, h2, h3 { font-weight: 300; color:rgb(54, 94, 133);}
h1 {
  margin: 16px 0px;
  font-size:36px;
}
p { margin-top: 0px;}

/* Sizes */
.md-display-1, .md-display-2 {font-weight: 300;}
.md-display-1 { font-size: 60px;}
.md-display-2 { font-size: 48px;}
.md-display-3 { font-size: 36px; font-family: "Lucida Handwriting";}
.font-24 { font-size: 24px;}
.font-96 { font-size: 96px;}

/* Specific instances */

.landing-display {
  color:white;
  font-size: 48px;
  padding: 16px;
  border-bottom: none;
  font-weight:400;
  margin-top: 0;
}

.landing-hyperlink {
  color:white;
  font-size: 25px;
  padding: 16px;
  margin-top: 16px;
}

/* Styles */
.bold         { font-weight: bold; }
.text-center  { text-align: center;}
.capitalize   { text-transform: capitalize;}
.text-shadow  { text-shadow: 1px 1px 8px rgba(54, 94, 133, 0.7);}

/* terms styles */
.terms-header {
  font-size: 22px;
  font-weight: bold;
}

.margin-left-alignment {
  margin: 0px 0px 20px 40px;
  display: inline-block;
}

.margin-left-alignment span {
  float: left;
  clear: both;
}

/* HOME PAGE */

body.home {
  background-image:none;
  background-color: #67afd2;
  height: auto;
}

body.home p {
  margin-top: 1rem;
  line-height: 1.618rem;
}

body.home header {
  background:none;
}

body.home nav a {
  color:rgba(255,255,255, 0.7);
  font-size:18px;
}

body.home nav a:hover {
  color:rgba(255,255,255, 1);
}

body.home nav .sidenav-menu a {
  color: #3f6d9b;
}

body.home nav a:hover {
  color:hsl(210, 100%, 40%)
}

body.home nav a.font-24 {
  font-size:24px;
}

body.home footer {
  display:none;
}

body.home #learn-more {
  background:#fff;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  text-align:center;
  padding:24px;
}

/*

NOTIFICATIONS - TOASTS

*/

.status-tag {
  background: #A9D1F8;
  color: #F0F7FD;
  padding: 4px 16px;
  border-radius:16px;
}

md-toast.md-success-toast-theme, md-toast.md-error-toast-theme {
  position: fixed;
  top: 0px;
  width: 100%;
  z-index: 9999
}

md-toast .md-toast-content {
  border-left: 4px solid #63ABF3;
  background: #fff;
}

md-toast .icon {
  color: #63ABF3;
}

md-toast.success-toast .md-toast-content {
  border-color: #9EE493;
}
md-toast.success-toast .icon {
  color: #9EE493;
}
md-toast.error-toast .md-toast-content {
  border-color: #D81159;
}
md-toast.error-toast .icon {
  color: #D81159;
}
md-toast.warning-toast .md-toast-content {
  border-color: #F7EF81;
}
md-toast.warning-toast .icon {
  color: #F7EF81;
}

md-toast.position-top-padding {
  top: 65px !important;
  left: unset;
  width: unset;
  max-width: unset;
  min-width: unset;
  border-radius: unset;
  bottom: unset;
  padding: 8px;
}

md-toast .iconButton .material-icons {
  font-size: 20px;
  float: right
}

.browsehappy {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* Everything but the jumbotron gets side spacing for mobile first views */
.header,
.footer {
  padding-left: 15px;
  padding-right: 15px;
}

/* Custom page header */
.header {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 10px;
}
/* Make the masthead heading the same height as the navigation */
.header h3 {
  margin-top: 0;
  margin-bottom: 0;
  line-height: 40px;
  padding-bottom: 19px;
}

/* Custom page footer */
.footer {
  padding-top: 24px;
  color: #2D4E6F;
}

.container-narrow > hr {
  margin: 30px 0;
}

.validation-messages {
  font-size: 12px;
  color: rgb(221,44,0);
  margin: 0 0 0 25px;
}

.patient-input-border {
  border:1px solid black;
  border-color: rgba(0,0,0,0.54);
  border-radius: 10px 10px 10px 10px;
  margin-bottom:20px;
}

.agreementContent {
  border:1px solid lightgray;
  padding: 10px;
  height: 300px;
  overflow-y: scroll;
}

.viewBodyContainer {
  min-height: calc(100vh - 122px) !important;
}

.mainMDContentTitle{
  padding: 15px;
  margin-bottom: 15px;
}
.mainMDContentTitle h1{
  margin: 0px 0px;
}
.mainMDContentContainer{
  padding: 15px;
}

.sectionMainHeader i.material-icons {
  margin-right: 10px;
  color: #fff;
  font-size: 40px;
}
.sectionMainHeader h2 {
  width: 100%;
  text-align: left;
  font-size: 26px;
}

.md-button.md-primary.sidebarIconButton {
  min-width: inherit;
  background: none;
  padding: 0px 12px;
}

md-backdrop.md-dialog-backdrop, md-backdrop.md-sidenav-backdrop { background: #000000;}

.sidenav-menu { background: white }
.sidenav-menu .md-toolbar-tools {
  height: 64px;
  background: #B8D8F9;
}

.current {
  background-color: rgba(158,158,158,0.2);
}

.gridCards figure {
  border: 1px solid #ccc;
  background: #eee;
  text-align: center
}
.gridCards figure:hover { cursor: pointer; border: 1px solid #555; background: #ddd; }
.gridCards figure:hover .customGridTileHeading{ border-color: #555; }

.customGridTileHeading { width: 100%; margin: 0px 0px 5px 0px; padding: 0px 0px 5px 0px; font-size: 18px; border-bottom: 1px solid #ccc }
.customChips { border-radius: 15px; padding: 5px 10px; margin: 5px 0px; color: #fff; }
.chipStatusCompleted { background: #9BC53D; }
.chipStatusPending { background: #06AED5; }
.chipStatusCancelled { background: #DD1C1A; }

/*

ICONS

*/

.material-icons {
  font-size: 35px; vertical-align: middle; font-weight: bold;
}

.menuListIcon { font-size: 35px !important; color: #ccc; float: left; }


.iconError { color: rgb(216,67,21); }
.iconSuccess { color: rgb(0,105,92); }

md-list-item.md-no-proxy, md-list-item .md-no-style { padding: 0px 14px; }


md-card md-card-title md-card-title-media .md-media-sm { width: 60px; height: 60px; }
md-card md-card-title md-card-title-media { margin-top: 0px; }
md-card md-card-title { padding: 10px 20px; }
md-card-title-text .md-headline { font-size: 18px; font-weight: inherit; line-height: inherit; }
md-card md-card-title md-card-title-text .md-subhead { color: #fff !important; ;line-height: inherit; padding: 2px 0px; }
md-card md-card-title md-card-title-text:only-child .md-subhead { padding: 2px 0px; }

md-card .md-actions, md-card md-card-actions { margin: 0px 20px 10px 20px; }


.registerDetailsCaptured {
  margin-top: -10px;
  margin-right: 10px;
  float: left;
  color: rgb(33,150,243);
}
.registerDetailsCaptured i {
  font-size: 40px !important;
  outline: none;
}
.registerDetailsCaptured:hover{
  cursor: pointer;
}

/*table.md-table:not(.md-row-select) td.md-cell:nth-child(n+2):nth-last-child(n+2), table.md-table:not(.md-row-select) th.md-column:nth-child(n+2):nth-last-child(n+2){
  padding: 5px;
}*/

.procDate{
  float: left;
  clear: both;
}

.procDate:hover,
.procCode:hover {
  cursor: pointer;
}

md-tooltip {
  font-weight: bold;
  color: #fff;
  background: #365E85;
  letter-spacing: 0.8px;
  margin-left: 0px !important;
}

/*

BUTTONS & LINKS

*/

a, a:hover {
  transition: 0.3s all ease-in;
}

button, a {
  cursor: pointer;
}

a, a h2 {
  color:rgba(16,80,255,0.7);
  text-decoration: none;
}

a:hover {
  color:rgba(16,80,255,1);
}

/* TODO - reduce selectors below */

.md-button {
  cursor: pointer;
  background:#fff;
  color:rgba(16,80,255,0.7);
  padding:0 24px;
  text-transform: none;
}

.md-button:hover              { color:rgba(16,80,255,1);}

.md-button.md-primary         { background: #63ABF3; color:#fff; }
.md-button.md-primary:hover   { background: #5EA2E6; }
.md-button.md-primary[disabled] {
  background: #939393;
}

.md-button.md-secondary       { background: #DAE6F2; color: #365e85;}
.md-button.md-secondary:hover { background: #CFDAE6;}

/* Turns off Form-Builder keyboard shortcut underline */
button strong u {
  text-decoration: none;
}

md-switch .md-bar            { background-color: rgb(158, 158, 158) }
md-switch.md-checked .md-bar { background-color: rgb(0, 179, 98) }
md-switch .md-thumb          { background-color: rgb(255, 255, 255) }
md-switch.overlay, .overlay  { z-index: 10 }

.dashboard-overlay-toggle md-switch {
  margin: 0px;
}

/*

FORMS

*/

.register-procedure .layout-column {
  width: 100%;
}

.questionnareNoPermissionDiv {
  padding: 40px;
  color: red;
}

.questionnaire .layout-column {
  width: 100%;
}

.question-box {
  width:800px;
  margin: auto;
}

.FormBuilderUserForm h3 {
  text-align: center;
  padding: 10px 25px !important;
  font-size: 28px;
}

.md-on, md-checkbox.md-checked .md-icon {
  background: #1050FF;
  background: rgb(0, 179, 98);
}

.md-on, md-checkbox.md-checked .md-icon:after {
  color:#fff;
}

.md-checked {
  color: #1050FF;
  color: rgb(0, 179, 98);
}

md-radio-group.layout-row md-radio-button,
md-radio-group.layout-xs-row md-radio-button,
md-radio-group.layout-gt-xs-row md-radio-button,
md-radio-group.layout-sm-row md-radio-button,
md-radio-group.layout-gt-sm-row md-radio-button,
md-radio-group.layout-md-row md-radio-button,
md-radio-group.layout-gt-md-row md-radio-button,
md-radio-group.layout-lg-row md-radio-button,
md-radio-group.layout-gt-lg-row md-radio-button,
md-radio-group.layout-xl-row md-radio-button {
  margin-right: 4px;
  margin-bottom: 4px;
}

md-radio-button {
  background: rgba(16,80,255,0.1);
  border: 1px solid rgba(16,80,255,0.2);
  border-radius: 4px;
  box-shadow: 0 0 2px #ccc;
  color: hsl(224, 80%, 23%);
  float: left;
  margin: 2px;
  position: relative;
}

md-radio-button .md-container {
  left:8px;
}

.md-checked {
  color: #1050FF;
  color: rgb(0, 179, 98);
}
md-radio-button.md-checked {
  background: rgba(0, 179, 98, 0.2);
  border-color: rgba(0, 179, 98, 0.4);
}

md-radio-button {
  padding: 8px;
  min-width:100px;
  border-radius:2px;
}

md-option:hover {
  color: #1050FF;
  background-color:rgba(16,80,255,0.1);
}

.md-datepicker-calendar,
.md-select-menu-container.md-active {
  background:#fff;
}

.mdp-datepicker-year{
  font-size: 2.5rem;
}

.md-select-value span:first-child {
  white-space: normal;
}

.FormBuilderMsg.success,
md-progress-linear {
  background: #9EE493;
}

md-input-container .md-input-focused .md-input,
md-input-container:not(.md-input-invalid).md-input-focused .md-input,
md-input-container.md-default-theme:not(.md-input-invalid).md-input-resized .md-input,
md-input-container:not(.md-input-invalid).md-input-resized .md-input {
  background: rgba(16, 84, 255, 0.1);
  border-color: #1050FF;
}

md-input-container .md-input-focused label,
md-input-container .md-input-focused md-icon {
  color: #1050FF;
}

/* FormBuilder DatePicker style override */
.md-datepicker-input-container {
  width: calc(100% - 70px) !important;
}

.md-datepicker-input {
  max-width: 100% !important;
}

.FormBuilderMsg {
  position: absolute !important; /* update in FormBuilder */
  width: calc(100% - 20px);
  height: 28px;
  padding-top: 15px !important;
  font-size: 18px;
  z-index: 99;
}

/* VALIDATONS */

input.md-input {
  background: rgba(16, 84, 255, 0.01);
  border-bottom: 2px solid rgba(90, 90, 90, 0.25);
}
.md-input-messages-animation.ng-active,
label ~ input.ng-invalid,
input.ng-invalid ~ div.ng-active,
md-select.ng-invalid ~ div.ng-active  {
  color: #D81159;
}

input.ng-touched.ng-invalid {
  color: #D81159;
  background: rgba(216, 17, 90, 0.05);
  border-bottom: 2px solid rgba(216, 17, 90, 0.25);
}

md-select.ng-touched.ng-valid,
input.ng-touched.ng-valid {
  background: rgba(0, 221, 118, 0.05);
  border-bottom: 2px solid rgba(0, 221, 118, 0.25);
}

md-select.ng-touched.ng-valid > md-select-value {
  border-bottom: 0
}

/* FormBuilder DatePicker style override */

/*

NAVIGATION

*/

header {
  height: 64px;
  background:#B8D8F9;
}

header a.md-button, header .md-button, header a  {
  color: #3f6d9b;
}

header a:hover  {
  color: hsl(210, 100%, 40%);
}

header a {
  padding: 16px;
}

.action-bar {
  background: #345A80;
  box-shadow: 0 4px 4px rgba(54, 94, 133, 0.7);
}

.action-bar a {
  width: 20%;
  padding: 16px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  display: flex;
  align-items: center;
}

.action-bar a.current {
  border-bottom: 4px solid #fff;
}

.full-white-bar {
  margin: -32px -32px 16px -32px;
  padding: 24px;
}

md-tabs-wrapper {
  background: rgba(99, 171, 243, 0.4);
  border-bottom:none;
}

.md-tab {
  text-transform: capitalize;
}

.md-tab.md-active {
  /* color: blue; */
  border-top: 2px solid blue;
  background:#fff;
}

/*

TABLES

*/

table thead {border-bottom: 1px solid #333;}

table.md-table:not(.md-row-select) td.md-cell:nth-child(n+2):nth-last-child(n+2),
table.md-table:not(.md-row-select) th.md-column:nth-child(n+2):nth-last-child(n+2),
table.md-table td.md-cell:last-child, table.md-table th.md-column:last-child {
  padding:0;
}

table.md-table tbody.md-body>tr.md-row,
table.md-table tfoot.md-foot>tr.md-row {
  height: 57px;
  border-top: 1px solid #eee;
}

table.md-table th.text-center {
  text-align: center;
}

table.md-table td.text-center {
  text-align: center;
}

table.md-table td.md-cell {
  color:inherit;
}

th.todo-col.md-column {
  width:104px !important;
}

td.table-btn {
  padding: 4px 0  4px  4px !important;
  width:100px;
}

td.table-btn div a{
  font-weight: bold;
  text-align: center;
  display: block;
  height: 48px;
  padding: 16px;
  box-sizing: border-box;
  margin-right:0px;
}

.table-btn a {
  border-radius: 4px;
  box-shadow:1px 1px 2px rgba(0,0,0,0.2);
}

.table-btn a {
  font-weight:normal;
}

.table-btn a.done {
  color: hsl(111, 69%, 31%);
  background-color: rgba(183, 239, 173, 0.8);
}
.table-btn a.done:hover {
  background-color: rgb(183, 239, 173);
}

.table-btn a.wait {
  color: hsla(216, 44%, 69%, 1);
  background-color: hsla(216, 44%, 79%, 0.3);
}
.table-btn a.wait:hover {
  background-color: hsla(216, 44%, 79%,0.5);
}

.table-btn a.todo {
  color: hsl(44, 86%, 30%);
  background-color: rgba(255, 214, 101, 0.8);
}
.table-btn a.todo:hover {
  background-color: rgb(255, 214, 101);
}

a, a:hover,
.table-btn a.wait,
.table-btn a.wait:hover,
.table-btn a.todo,
.table-btn a.todo:hover {
  -webkit-transition: background 0.2s ease-in;
  -moz-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}

.listingTable .md-button {
  min-width: 60px;
}

table.md-table th.md-column {
  white-space: unset;
}

table.md-table:not(.md-row-select) td.md-cell.iconRow, table.md-table:not(.md-row-select) th.md-column.iconRow {
  width: 25px;
  padding: 0 15px 0 10px;
}

table.md-table:not(.md-row-select) td.md-cell.iconRow .material-icons, table.md-table:not(.md-row-select) th.md-column.iconRow .material-icons {
  color: #cecece;
  font-size: 25px;
}

.procedure {
  clear: both;
  float: left;
}

/* LAYOUT */

.center-xy {
  left:50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.md-toolbar-tools, md-dialog {
  background: #fff;
  max-height: 90%;
}

/* FormBuilder */
.md-whiteframe-5dp {
  background:#fff;
  box-shadow: 0px 3px 5px -1px rgba(19, 34, 48, 0.25),
  0px 5px 8px 0px rgba(19, 34, 48, 0.04),
  0px 1px 14px 0px rgba(19, 34, 48, 0.02) !important;
}

.md-calendar.md-default-theme, .md-calendar{
  background:rgb(255,255,255);
  color:rgba(0,0,0,0.87)
}
.md-calendar.md-default-theme tr:last-child td, .md-calendar tr:last-child td{
  border-bottom-color:rgb(238,238,238)
}
.md-default-theme .md-calendar-day-header, .md-calendar-day-header{
  background:rgb(224,224,224);
  color:rgba(0,0,0,0.87)
}
.md-calendar-date.md-focus .md-default-theme .md-calendar-date-selection-indicator, .md-calendar-date.md-focus .md-calendar-date-selection-indicator,.md-default-theme .md-calendar-date-selection-indicator:hover, .md-calendar-date-selection-indicator:hover{
  background:rgb(224,224,224)
}
.md-default-theme .md-calendar-date-disabled, .md-calendar-date-disabled,.md-default-theme .md-calendar-month-label-disabled, .md-calendar-month-label-disabled{
  color:rgba(0,0,0,0.435)
}
.md-default-theme .md-datepicker-calendar-pane, .md-datepicker-calendar-pane{
  border-color:rgb(255,255,255)
}
.md-default-theme .md-datepicker-calendar, .md-datepicker-calendar{
  background:rgb(255,255,255)
}
.md-default-theme .md-datepicker-input-mask-opaque, .md-datepicker-input-mask-opaque{
  box-shadow:0 0 0 9999px rgb(255,255,255)
}
.md-default-theme .md-datepicker-open .md-datepicker-input-container, .md-datepicker-open .md-datepicker-input-container{
  background:rgb(255,255,255)
}

/*

UTILITY CLASSES

*/

.img-fill {
  min-width:100%;
  min-height:100%;
}

.pull-right {
  float: right;
}

tr.text-center th {
  text-align: center;
}

md-select[disabled] .md-select-value[class=md-select-value] > span {
  color: #FAFAFA /* used to set color same as background for extra commas that are shown in the list */
}
md-select[disabled] .md-select-value > span > div {
  float: left;
  white-space: initial;
  clear: both;
  color: rgba(0,0,0,0.38)
}

.popupLinkContainer {
  text-align: right;
}

.popupLinkContainer a {
  color: rgb(41,98,255);
}

.controlDisplayMessage md-content {
  padding: 10px;
  background: #00e9ff;
  color: royalblue;
  font-size: 14px;
}

/* disabled tab transition */
[role="tabpanel"], md-tabs {
  transition: none;
}

.FormBuilderMsg.processing, .FormBuilderMsg.success {
  display: none;
}
/* FormBuilder */

.min-w-inherit {
  min-width: inherit;
}

.pad-16   { padding: 16px; }
.pad-l-16 { padding-left: 16px; }

.pad-24   { padding:24px;}
.pad-l-24 { padding-left:24px;}

.pad-60 {padding: 60px;}

.margin-0 {margin: 0; }
.margin-t-0 { margin-top:0; }

.margin-b-12 { margin-bottom:12px; }
.margin-b-24 { margin-bottom:24px; }

.margin-y-8 { margin-top:8px; margin-bottom:8px; }

.margin-x-auto { margin-left: auto; margin-right: auto;}

.width-100 { width: 100%; }
.width-90 { width: 90%; }
.width-80 { width: 80%; }
.width-60 { width: 60%; }
.width-40 { width: 40%; }
.width-30 { width: 30%; }

.top-10 { top: 10%; }
.top-20 { top: 20%; }
.top-30 { top: 30%; }
.top-60 { top: 60%; }
.top-80 { top: 80%; }
.top-90 { top: 90%; }

.left-30 { left: 30%; }

.border-btm {
  border-bottom: 2px solid #eee;
}

/*

COLORS

*/

.bg-primary-20 { background-color: rgba(99, 171, 243, 0.2)}
.bg-primary-30 { background-color: rgba(99, 171, 243, 0.3)}

.bg-white   { background-color: #fff;}
.bg-lt-blue { background-color: #BDC1CB;}

.white { color: white; }
.black { color: black; }

.inset-panel {
  margin-left: -8px;
  margin-right: -8px;
  box-shadow: inset 0 2px 6px rgba(99, 171, 243, 0.2);
}

/* TODO - Determine if this is needed for consistency

consent management styles */

.consentContainer {
  margin-bottom: 20px;
}

.consent-header {
  font-size: 22px;
  font-weight: bold;
}

.consent-subheader {
  font-size: 18px;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
  padding-bottom: 5px;
}

.consent-person-consenting {
  padding: 10px;
  background: #eee;
  margin: 0px 0px 20px 0px;
}

.consent-person-consenting > p {
  margin-bottom: 5px
}

.consent-person-consenting > div {
  height: 32px;
  margin: 15px 0px 0px 0px;
}

.consent-person-consenting > div > md-radio-group {
  margin-right: 20px;
}

.consent-submit-control {
  padding: 10px;
  background: #eee;
  margin: 20px 0px;
}

.consent-checkbox-options {
  padding: 10px;
  background: #eee;
  margin: 0px 0px 20px 0px;
}

.consent-checkbox-options-heading {
  padding: 10px;
  background: #eee;
}

.consent-checkbox-options-heading p {
  margin: 0px;
}

.consent-checkbox-options > section {
  margin-left: 10px;
}

/* consent management styles */


/* Admin - Dashboard */
.adminDashboardActionsDiv .md-button{
  padding: 25px 50px;
  font-size: 20px;
}

.adminDashboardActionsDiv .md-button i{
  margin-right: 10px;
  float: left;
  margin-top: 5px;
}

.provider-pdf {
  height: 80vh;
  width: 80vw
}

.anaesthetistInfoModalContent {
  background: rgb(238, 238, 238);
  overflow: hidden
}

.procedureEditModalContent {
  background: rgb(238, 238, 238);
  overflow: auto
}

.block {
  display:block;
}

/*

MEDIA QUERIES

*/

@media screen and (max-width: 480px) {
  .action-bar {
    width: 100%;
    flex-wrap: wrap;
  }

  .action-bar a {
    font-size: 14px;
    padding: 16px 0;
    min-width: 33% !important;
    width: 33%;
  }

  md-dialog .md-dialog-content {
    padding: 8px
  }

  .xs-pad-t-16 {
    padding-top:16px;
  }

  .xs-hide {
    display:none;
  }

  .xs-block {
    display:block;
  }

  .container,
  body.home .layout-column.flex-50 {
    min-width: 100%;
  }

  body.home #learn-more {
    text-align: center;
    background: #fafafa;
  }

  .mobile-flex-column {
    flex-direction: column;
  }

  /* Spacing Shrink */
  .pad-24 {
    padding:16px;
  }

  body.home .md-display-2 {
    font-size: 40px;
    line-height: 56px;
    margin-top:0px;
  }

  .md-headline {
    font-size: 16px;
    line-height: 24px;
  }

  /* responsive table */
  .responsiveTable table {
    border: 0;
  }

  .responsiveTable table caption {
    font-size: 1.3em;
  }

  .responsiveTable table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }

  .responsiveTable table tr {
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    padding: .35em;
    display: block;
    margin-bottom: .625em;
  }

  .responsiveTable table td {
    border-bottom: 1px solid #ddd;
    display: inline-block;
    width: 100%;
    font-size: .8em;
    text-align: right;
  }

  .responsiveTable table td.actionButtons {
    width: 90px;
    border-bottom: none;
  }

  .responsiveTable table td.actionButtons:before {
    display: block;
    text-align: center;
    float: none;
    margin: 5px 0px;
  }

  .responsiveTable table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
  }

  .responsiveTable table td:last-child {
    border-bottom: 0;
  }

  .responsiveTable table.md-table td.md-cell {
    border-top: none;
  }

  .responsiveTable table.md-table tbody.md-body>tr.md-row,
  .responsiveTable table.md-table tfoot.md-foot>tr.md-row {
    height: auto
  }

  .responsiveTable table.md-table:not(.md-row-select) td.md-cell:nth-child(n+2):nth-last-child(n+2),
  .responsiveTable table.md-table:not(.md-row-select) th.md-column:nth-child(n+2):nth-last-child(n+2),
  .responsiveTable table.md-table td.md-cell:first-child,
  .responsiveTable table.md-table th.md-column:first-child
  .responsiveTable table.md-table td.md-cell:last-child,
  .responsiveTable table.md-table th.md-column:last-child {
    padding: 8px 0;
  }

  .responsiveTable table.md-table:not(.md-row-select) td.md-cell:first-child,
  .responsiveTable table.md-table:not(.md-row-select) th.md-column:first-child {
    padding: 8px 0;
  }

  .responsiveTable table.md-table td.md-cell,
  .responsiveTable table.md-table th.md-column {
    text-align: right;
  }

  .responsiveTable table.md-table:not(.md-row-select) td.md-cell.iconRow:before,
  .responsiveTable table.md-table:not(.md-row-select) th.md-column.iconRow:before {
    margin-top: 5px;
  }

  .responsiveTable table.md-table:not(.md-row-select) td.md-cell.iconRow,
  .responsiveTable table.md-table:not(.md-row-select) th.md-column.iconRow {
    width: 100%;
    padding: 0px 0px 5px 0px;
  }
  /* responsive table */
}

.animationDurationShort {
  animation-duration: 0.5s;
  animation-delay: 0s;
  -webkit-animation-duration: 0.5s;
  -webkit-animation-delay: 0s;
  -moz-animation-duration: 0.5s;
  -moz-animation-delay: 0s;
  -o-animation-duration: 0.5s;
  -o-animation-delay: 0s;
}

.landing-page-container {
  margin-bottom: 4.75rem;
}

.landing-page-container .white {
  color: #ffffff;
}

.landing-page-container h4 {
  margin: 0!important;
  width: 100%;
  text-align: left;
}

.landing-page-container img {
  max-height: 60px;
  width: auto;
  margin: 0 0.5rem;
}

.landing-page-container .info-container p {
  margin-top: 0 !important;
  text-align: left;
}

.landing-page-container .md-display-3 {
  font-family: "Dancing Script", serif;
}

.landing-page-container .md-display-3.welcome {
  font-size: 50px;
  font-weight: 500;
}

.landing-page-container .text-display {
  color: #fff;
  text-shadow: 1px 1px 8px rgba(54, 94, 133, 0.7);
}

.landing-page-container .button-container {
  width: 100%;
}

.landing-page-container .button-container .md-button {
  width: 100%;
  justify-content: center;
}

.white-opacity {
  /*background-color: rgba(255,255,255,0.2);*/
}

.info-container {
  max-width: 100%;
}

@media screen and (min-width:424px) and (max-width:768px) {
  .action-bar {
    flex-wrap: wrap;
  }
  .action-bar a {
    min-width: 25% !important;
    width: 25%;
  }
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 424px) {
  .landing-display {
    font-size: 30px;
  }
}

/* Responsive: Portrait/landscape tablets and up */
@media screen and (min-width: 768px) {

  body.home {
    background: linear-gradient(-180deg, rgba(103,175,210,0.9) 0%, rgba(0,212,255,0) 100%), url("/app/images/PSHR-background.png") no-repeat bottom right fixed;
    height: auto;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }

  /* Typography */

  .landing-display {
    font-size: 48px;
    padding: 20px;
    border-bottom: 1px solid #fff;
    margin-top:0;
    font-weight:300;
  }

  .container {
    max-width: 730px;
  }

  /* Remove the padding we set earlier */
  .header,
  .marketing,
  .footer {
    padding-left: 0;
    padding-right: 0;
  }
  /* Space out the masthead */
  .header {
    margin-bottom: 30px;
  }
  /* Remove the bottom border on the jumbotron for visual effect */
  .jumbotron {
    border-bottom: 0;
  }
}

@media screen and (max-height: 639px) {
  body.home .md-display-2 {
    font-size: 32px;
    line-height: 40px;
  }
}

@media screen and (min-height: 1200px) {
  .landing-display {
    margin-top:20vh;
  }
}

@media screen and (min-width: 1200px) {
  .landing-display {
    font-size: 48px;
  }
}

/* FireFox Specific Style fixes */

@-moz-document url-prefix() {
  .layout-xs-column > .flex {
    min-height: auto;
  }
}

/* FireFox Specific Style fixes */

/* Internet Explorer 11 Specific Style fixes */

:root .layout-column > .flex,
:root .layout-xs-column > .flex,
:root .layout-sm-column > .flex  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-5,
:root .layout-xs-column > .flex-5,
:root .layout-sm-column > .flex-5  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-10,
:root .layout-xs-column > .flex-10,
:root .layout-sm-column > .flex-10  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-15,
:root .layout-xs-column > .flex-15,
:root .layout-sm-column > .flex-15  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-20,
:root .layout-xs-column > .flex-20,
:root .layout-sm-column > .flex-20  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-25,
:root .layout-xs-column > .flex-25,
:root .layout-sm-column > .flex-25  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-30,
:root .layout-xs-column > .flex-30,
:root .layout-sm-column > .flex-30  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-33,
:root .layout-xs-column > .flex-33,
:root .layout-sm-column > .flex-33  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-35,
:root .layout-xs-column > .flex-35,
:root .layout-sm-column > .flex-35  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-40,
:root .layout-xs-column > .flex-40,
:root .layout-sm-column > .flex-40  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-45,
:root .layout-xs-column > .flex-45,
:root .layout-sm-column > .flex-45  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-50,
:root .layout-xs-column > .flex-50,
:root .layout-sm-column > .flex-50,
:root .layout-md-column > .flex-50,
:root .layout-gt-md-column > .flex-50  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-55,
:root .layout-xs-column > .flex-55,
:root .layout-sm-column > .flex-55  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-60,
:root .layout-xs-column > .flex-60,
:root .layout-sm-column > .flex-60  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-65,
:root .layout-xs-column > .flex-65,
:root .layout-sm-column > .flex-65  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-66,
:root .layout-xs-column > .flex-66,
:root .layout-sm-column > .flex-66  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-70,
:root .layout-xs-column > .flex-70,
:root .layout-sm-column > .flex-70  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-75,
:root .layout-xs-column > .flex-75,
:root .layout-sm-column > .flex-75  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-80,
:root .layout-xs-column > .flex-80,
:root .layout-sm-column > .flex-80  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-85,
:root .layout-xs-column > .flex-85,
:root .layout-sm-column > .flex-85  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-90,
:root .layout-xs-column > .flex-90,
:root .layout-sm-column > .flex-90  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-95,
:root .layout-xs-column > .flex-95,
:root .layout-sm-column > .flex-95  {
  flex: 1 0 auto;
}

:root .layout-column > .flex-100,
:root .layout-xs-column > .flex-100,
:root .layout-sm-column > .flex-100  {
  flex: 1 0 auto;
}

:root #FormBuilder .md-chips md-chip .md-chip-content {
  white-space: pre-line;
  line-height: normal
}

/* Internet Explorer 11 Specific Style fixes */

/* Manual media query hack for missing resolution - Angular Material CSS */
@media (min-width: 595px) and (max-width: 600px) {
  .hide:not(.show-gt-xs):not(.show-sm):not(.show), .hide-gt-xs:not(.show-gt-xs):not(.show-sm):not(.show) {
    display: none;
  }

  .hide-sm:not(.show-gt-xs):not(.show-sm):not(.show) {
    display: none;
  }

  .layout-xs-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column;
  }

  .layout-xs, .layout-xs-column, .layout-xs-row {
    box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
  }

  .layout-row > .flex-sm-80 {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    flex: 1 1 100%;
    max-width: 80%;
    max-height: 100%;
    box-sizing: border-box;
  }

  .layout-xs-column > .flex-xs-100 {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    flex: 1 1 100%;
    max-width: 100%;
    max-height: 100%;
    box-sizing: border-box;
  }
}

@media (min-width: 1275px) and (max-width: 1280px) {
  :not(.show-gt-xs):not(.show):not(.show-md):not(.show-gt-sm).hide,
  :not(.show-gt-xs):not(.show):not(.show-md):not(.show-gt-sm).hide-gt-xs,
  :not(.show-gt-xs):not(.show):not(.show-md):not(.show-gt-sm).hide-gt-sm {
    display: none;
  }

  .layout-row > .flex-md-60 {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    flex: 1 1 100%;
    max-width: 60%;
    max-height: 100%;
    box-sizing: border-box;
  }

  .layout-row > .flex-md-70 {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    flex: 1 1 100%;
    max-width: 70%;
    max-height: 100%;
    box-sizing: border-box;
  }
}

@media (max-width: 600px) {
  .landing-page-container .button-container .md-button {
    margin-left: 0;
  }
}
/* Manual media query hack for missing resolution - Angular Material CSS */

.patient-search-note {
  padding: 1rem;
}