/*Global variables and MIXINS only
    PLEASE DO NOT CREATE STYLES HERE
    Globl Styles are to go into Site.scss
*/
/*Color Variables*/
/*#region Theme Colours*/
/*#endregion*/
/*#region Eye Colours*/
/*#endregion*/
/*Mix Ins - 
 * usage:   .box { @include border-radius(10px); }  
*/
/*@import 'Site.scss';*/
/* For the drug advice panels, we need markdown-generated p to be a bit bigger*/
.drug-advice {
  /* handles the bulleted lists for clinical criteria, etc */
}
.drug-advice p {
  font-size: medium;
}
.drug-advice ul {
  font-size: medium;
}

/*Try to sort the toolbar for the preview editor in clinical   
    if it works here then we can create a new scss for the editor

*/
/*div[id^="markDownEditor"] {
    height: 400px;
    overflow-y: auto;
    border: 1px solid #ccc;
    position: relative;
    padding-top: 40px;*/ /* Space for toolbar */
/*}

div[id^="toolbarDiv"] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: max-content;
    background-color: #f0f0f0;
    z-index: 1;
    border-bottom: 1px solid #ccc;
}

#editorContent {
    padding: 10px;
    min-height: 100%;
}*/
/*END */
.dox-curved-border-style, .clinical-patient-chart-controls {
  /*border-bottom-style: ridge;*/
  border-width: 2px;
  border-top-style: solid;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
  padding: 15px;
  margin: 1px 10px;
}

/*#region Pathway*/
.clinical-pathway-list-mini {
  width: calc(100% - 5px);
  height: calc(100% - 15px);
  overflow-x: hidden;
  overflow-y: auto;
  /*background-color:#6189BB;*/
  /*border-style: groove;
  border-width: 1px;*/
  margin: 2px;
  position: relative;
}

.clinical-menu-patient-button-holder .btn-group {
  max-width: 158px;
  width: calc(100% - 5px);
  margin-left: 10px;
}
.clinical-menu-patient-button-holder .btn-group button {
  width: auto;
  font-size: 15px;
  margin-right: 0;
  border-radius: 3px;
}

.clinical-menu-holder {
  width: calc(100% - 10px);
  overflow-y: auto;
  padding-bottom: 0;
  margin-bottom: 0;
}
.clinical-menu-holder button {
  max-width: 158px;
  margin: 3px;
  float: right;
  width: calc(100% - 5px);
}
.clinical-menu-holder .clinical-menu-button-holder {
  /* float: left;
  height: 40px;
  text-align: right;
  display: inline-block; */
  position: absolute;
  bottom: 0;
  right: 5px;
}
.clinical-menu-holder .clinical-bottom-menu {
  position: relative;
  bottom: -80px;
  left: 40px;
  margin-left: 5px;
  /* float: left; */
  width: calc(100% - 100px);
}
.clinical-menu-holder .clinical-bottom-menu .btn-group {
  display: inline-block;
  width: 160px;
  vertical-align: top;
  position: relative;
}
.clinical-menu-holder .clinical-top-menu {
  position: relative;
  top: 1px;
  left: 255px;
  margin-left: 5px;
  /* float: left; */
  width: calc(100% - 270px);
}
.clinical-menu-holder .clinical-top-menu .btn-group {
  display: inline-block;
  width: 160px;
  vertical-align: top;
  position: relative;
}

.clinical-pathway-list-mini-header {
  background: #D8E3F0; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left top, #9ED3E8, #D8E3F0); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(bottom right, #9ED3E8, #D8E3F0); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(bottom right, #9ED3E8, #D8E3F0); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to bottom right, #9ED3E8, #D8E3F0); /* Standard syntax */
  font-weight: 600;
  padding-top: 5px;
  padding-left: 15px;
  margin-left: 5px;
  margin-right: 2px;
  margin-top: 2px;
  border-radius: 5px;
  border-bottom-style: solid;
  border-color: #192674;
  height: 40px;
  cursor: pointer;
  width: calc(100% - 10px);
}
.clinical-pathway-list-mini-header:hover {
  background: #9ED3E8; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left top, #9ED3E8, #9ED3E8); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(bottom right, #9ED3E8, #9ED3E8); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(bottom right, #9ED3E8, #9ED3E8); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to bottom right, #9ED3E8, #9ED3E8); /* Standard syntax */
  color: #003471;
}
.clinical-pathway-list-mini-header::before {
  font-weight: 100;
  content: "\f090";
  font-family: FontAwesome;
  left: 10px;
  text-align: left;
  padding-right: 5px;
  font-size: large;
}

.clinical-pathway-list-mini-data {
  width: calc(100% - 2px);
  margin-left: 5px;
  margin-top: 1px;
  border: 1px;
  border-bottom-style: groove;
  text-align: left;
  font-size: small;
}
.clinical-pathway-list-mini-data .badge {
  width: 75px;
  border-radius: 0 10px;
  background-color: transparent;
  font-size: inherit;
  color: inherit;
}
.clinical-pathway-list-mini-data div {
  border-radius: 4px;
  background-color: rgba(100, 149, 237, 0.2);
  border-bottom-style: groove;
  margin-right: 10px;
  color: black;
  border-bottom-color: #192674;
  border-bottom-width: 1px;
}
.clinical-pathway-list-mini-data div:hover {
  background-color: #204780;
  cursor: pointer;
  color: white;
}

.picklist-explanation {
  margin-top: -3px;
  border: 2px solid lightgrey;
  border-radius: 4px;
  margin-left: 0px;
  margin-right: -1px;
  background-color: #ececec;
}

.clinical-module-panel {
  border-width: 0px;
  margin-bottom: 0;
}
.clinical-module-panel.panel-info {
  border-color: black;
  padding-left: 2px;
}
.clinical-module-panel.panel-info > .panel-body {
  border: 1px solid rgba(80, 127, 234, 0.2196078431);
  padding: 0px 5px 5px 5px;
  box-sizing: content-box;
  margin-bottom: 2px;
}
.clinical-module-panel.panel-info > .panel-heading {
  background: rgba(80, 127, 234, 0.2196078431); /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left top, rgba(68, 133, 230, 0.2196078431), rgba(80, 127, 234, 0.2196078431)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(bottom right, rgba(68, 133, 230, 0.2196078431), rgba(80, 127, 234, 0.2196078431)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(bottom right, rgba(68, 133, 230, 0.2196078431), rgba(80, 127, 234, 0.2196078431)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to bottom right, rgba(68, 133, 230, 0.2196078431), rgba(80, 127, 234, 0.2196078431)); /* Standard syntax */
  background-repeat: repeat-x;
  padding-bottom: 0px;
  padding-top: 6px;
}
.clinical-module-panel.panel-info > .panel-heading.has-no-allergy {
  background: rgba(125, 234, 80, 0.27); /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left top, rgba(80, 234, 88, 0.3215686275), rgba(125, 234, 80, 0.27)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(bottom right, rgba(80, 234, 88, 0.3215686275), rgba(125, 234, 80, 0.27)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(bottom right, rgba(80, 234, 88, 0.3215686275), rgba(125, 234, 80, 0.27)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to bottom right, rgba(80, 234, 88, 0.3215686275), rgba(125, 234, 80, 0.27)); /* Standard syntax */
}
.clinical-module-panel.panel-info > .panel-heading > .panel-title {
  /*color: white;*/
  padding-bottom: 5px;
  padding-top: 2px;
  display: inline-block;
  vertical-align: top;
  font-size: large;
}
.clinical-module-panel.panel-danger {
  border-color: red;
}
.clinical-module-panel.panel-danger > .panel-heading {
  background: rgba(183, 41, 27, 0.2196078431); /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left top, rgba(139, 0, 0, 0.31), rgba(183, 41, 27, 0.2196078431)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(bottom right, rgba(139, 0, 0, 0.31), rgba(183, 41, 27, 0.2196078431)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(bottom right, rgba(139, 0, 0, 0.31), rgba(183, 41, 27, 0.2196078431)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to bottom right, rgba(139, 0, 0, 0.31), rgba(183, 41, 27, 0.2196078431)); /* Standard syntax */
  background-repeat: repeat-x;
  padding-bottom: 0px;
  padding-top: 6px;
}
.clinical-module-panel.panel-danger > .panel-heading > .panel-title {
  /*color: white;*/
  padding-bottom: 5px;
  padding-top: 2px;
  display: inline-block;
  vertical-align: top;
  font-size: large;
}
.clinical-module-panel.panel-danger > .panel-body {
  border: 1px solid rgba(139, 0, 0, 0.31);
  padding: 0px 5px 5px 5px;
  box-sizing: content-box;
  margin-bottom: 2px;
}
.clinical-module-panel.panel-warning {
  border-color: #faebcc;
}
.clinical-module-panel.panel-warning > .panel-heading {
  background: #fcf8e3; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left top, #faf2cc, #fcf8e3); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(bottom right, #faf2cc, #fcf8e3); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(bottom right, #faf2cc, #fcf8e3); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to bottom right, #faf2cc, #fcf8e3); /* Standard syntax */
  background-repeat: repeat-x;
  padding-bottom: 0px;
  padding-top: 6px;
}
.clinical-module-panel.panel-warning > .panel-heading > .panel-title {
  /*color: white;*/
  padding-bottom: 5px;
  padding-top: 2px;
  display: inline-block;
  vertical-align: top;
  font-size: large;
}
.clinical-module-panel.panel-warning > .panel-body {
  border: 1px solid rgba(139, 0, 0, 0.31);
  padding: 0px 5px 5px 5px;
  box-sizing: content-box;
  margin-bottom: 2px;
}
.clinical-module-panel .panel .panel-heading {
  padding-top: 2px;
  padding-bottom: 2px;
  min-height: 34px;
}
.clinical-module-panel .panel .panel-body {
  padding: 2px;
}

.clinical-pathway-current .status-icon {
  content: "\e013";
  font-family: "Glyphicons Halflings";
  font-size: xx-large;
  color: green;
}

.clinical-pathway-expired .status-icon {
  content: "\e086";
  font-family: "Glyphicons Halflings";
  font-size: xx-large;
  color: #dbbe1e;
}

.clinical-pathway-deleted .status-icon {
  content: "\e014";
  font-family: "Glyphicons Halflings";
  font-size: xx-large;
  color: red;
}

.clinical-pathway-edit {
  /*  @include linear-gradient-background(rgba(141, 162, 185, 0.1),rgba(100, 149, 237, 0.2));*/
  border-color: darkred;
  /*@include border-radius(5);*/
  border: 1px solid;
}
.clinical-pathway-edit .status-icon {
  content: "\e013";
  font-family: "Glyphicons Halflings";
  font-size: xx-large;
  color: blue;
}

/*#endregion*/
/*#region Perscription*/
.clinical-patient-perscription-mini {
  float: right;
  text-align: right;
  display: inline-block;
  position: relative;
}

/*#endregion*/
/*#region Patient Notes*/
.clinical-patient-note-mini {
  float: right;
  height: 40px;
  width: 155px;
  text-align: right;
  display: inline-block;
  position: relative;
  top: 0;
}

/*#endregion*/
/*#region Workflow Indicator*/
.clinical-patient-screen-workflow {
  display: inline-block;
  float: left;
  left: 10px;
  width: auto;
  height: 40px;
  position: relative;
  text-align: right;
  top: 0;
}

/*#endregion*/
/*#region Todays Modules*/
.clinical-patient-screen-modules-today {
  height: calc(100% - 1px - 30px - 30px);
  padding-top: 45px;
}

.clinical-patient-screen-modules-today-module {
  height: 100%;
  width: 100%;
  vertical-align: top;
}

/*#endregion*/
.clinical-popup-header-text {
  font-weight: bold;
  color: #003471;
  display: inline-block;
  width: 30%;
  vertical-align: central;
  height: 100%;
  text-align: center;
  font-size: x-large;
}

.clinical-patient-information {
  min-height: 50px;
  margin-bottom: 1px;
  position: relative;
  /*  overflow: hidden;*/
  background-color: rgba(0, 50, 250, 0.7);
  font-size: large;
  color: white;
  border: 1px solid rgba(19, 104, 140, 0.37);
}
.clinical-patient-information a {
  color: white;
}
.clinical-patient-information .nav > li > a:hover,
.clinical-patient-information .nav > li > a:focus {
  text-decoration: none;
  /*background-color: #0B408B;*/
}

.clinical-patient-information-name {
  text-wrap: none;
  position: absolute;
  font-weight: 600;
}

.clinical-patient-screen-left {
  display: inline-block;
  width: 400px;
  vertical-align: top;
  height: 100%;
  float: left;
  background-color: unset;
}

.clinical-patient-screen-centre {
  display: inline-block;
  vertical-align: top;
  height: 100%;
}

.clinical-patient-screen-right {
  display: inline-block;
  vertical-align: top;
  margin-right: 2px;
  padding: 5px;
  border-style: groove;
  border-width: 1px;
  height: 100%;
}

.clinical-patient-screen-modules-button {
  width: 75px;
  float: left;
}

.clinical-patient-screen-modules-patient {
  float: right;
  display: inline-block;
  vertical-align: top;
  overflow-y: auto;
  border: 1px solid rgba(19, 104, 140, 0.37);
  -webkit-border-radius: 5px 0 0 5px;
  -moz-border-radius: 5px 0 0 5px;
  border-radius: 5px 0 0 5px;
  padding-bottom: 1px;
  margin-top: -2px;
  border: 0;
}

.clinical-patient-screen-plot-area {
  height: 300px;
  width: 100%;
  margin-right: 2px;
  float: right;
}

.clinical-patient-plot-episode {
  width: 160px;
  height: 60px;
  display: inline-block;
  border: 1px lightgray solid;
  border-radius: 5px;
  background-color: white;
  position: sticky;
  left: 0;
  top: 0;
  z-index: 3;
}

.clinical-patient-chart-controls {
  /*height: 50px;*/
  vertical-align: top;
  width: 100%;
  text-align: center;
  padding: 3px;
  display: inline-block;
  margin: 5px;
  overflow-x: hidden;
  background-color: rgba(145, 146, 146, 0.05);
}

.clinical-tile-matrix-view {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.clinical-tile-matrix-view-start {
  position: relative;
  height: 100%;
  width: 100%;
}

.clinical-tile-matrix-first-row {
  height: 60px;
  overflow: hidden;
  position: sticky;
  top: 0;
  left: 150px;
  width: calc(100% - 150px);
  /*border-bottom-style:solid;
  border-bottom-color: lightgray;
  border-bottom-width:1px;*/
}

.clinical-tile-matrix-column-header-collapsed {
  height: 100%;
  width: 75px;
  display: inline-block;
  vertical-align: top;
  border-left-style: solid;
  border-left-color: lightgray;
  border-left-width: 1px;
  overflow: hidden;
  position: sticky;
  top: 0;
  background-color: ghostwhite;
  z-index: 2;
}

.clinical-tile-matrix-column-header-expanded {
  height: 100%;
  width: 160px;
  display: inline-block;
  vertical-align: top;
  text-align: center;
  border-bottom-style: solid;
  border-bottom-color: lightgray;
  border-bottom-width: 1px;
  font-size: large;
  border-left-style: solid;
  border-left-color: lightgray;
  border-left-width: 1px;
  padding-top: 5px;
  color: cornflowerblue;
  position: sticky;
  top: 0;
  background-color: ghostwhite;
  z-index: 2;
}

.cancelled-tile-header {
  background-color: #eff1ef;
  position: relative;
  border: 1px solid lightgray;
}
.cancelled-tile-header:before {
  font-family: FontAwesome;
  content: "\f05e";
  color: darkred;
  font-size: xx-small;
  position: absolute;
  left: 4px;
  top: 2px;
}

.has-draft-tile-header {
  background-color: #eff1ef;
  position: relative;
  border: 1px solid darkorange;
}
.has-draft-tile-header:after {
  font-family: FontAwesome;
  content: "\f0c7";
  color: white;
  font-size: smaller;
  font-weight: normal;
  border-radius: 13px;
  background-image: linear-gradient(to bottom, #f0964e 0, #601515 100%);
  padding: 6px;
  position: absolute;
  z-index: 1;
  right: -5px;
  bottom: -3px;
}

.clinical-tile-matrix-first-row .clinical-tile-matrix-column-header-expanded:last-of-type {
  border-right-style: solid;
  border-right-color: lightgray;
  border-right-width: 1px;
}

.clinical-tile-matrix-data-row-transform {
  height: 100%;
  width: 100%;
  display: block;
  position: relative;
  /*-moz-transform-origin: top left;
  -ms-transform-origin: top left;
  -o-transform-origin: top left;
  -webkit-transform-origin: top left;
  transform-origin: top left;
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  font-size: x-large;*/
}
.clinical-tile-matrix-data-row-transform .clinical-tile-data-doubtful {
  background: #efeded;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
  padding: 0;
  transition: opacity 0.5s;
}
.clinical-tile-matrix-data-row-transform .clinical-tile-data-doubtful:before {
  font-family: FontAwesome;
  content: " \f128";
  color: white;
  /* font-size: large; */
  border-radius: 16px;
  position: absolute;
  left: 3px;
  background-image: linear-gradient(to bottom, #f0ad4e 0, #ec971f 100%);
  width: 16px;
  text-align: center;
  position: absolute;
  bottom: 0;
  right: 0;
}
.clinical-tile-matrix-data-row-transform .clinical-tile-data-doubtful p {
  color: #fff;
  line-height: 150px;
  font-family: "arial";
  text-align: center;
}
.clinical-tile-matrix-data-row-transform .clinical-tile-data-deleted {
  background: #e2dede;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  position: absolute;
  padding: 0;
  transition: opacity 0.5s;
}
.clinical-tile-matrix-data-row-transform .clinical-tile-data-deleted:before {
  font-family: FontAwesome;
  content: " \f00d";
  color: white;
  /* font-size: large; */
  border-radius: 16px;
  position: absolute;
  left: 3px;
  background-image: linear-gradient(to bottom, #eac5bf, #ed2e2e 100%);
  width: 16px;
  text-align: center;
  position: absolute;
  bottom: 0;
  right: 0;
}
.clinical-tile-matrix-data-row-transform .clinical-tile-data-deleted p {
  color: #fff;
  line-height: 150px;
  font-family: "arial";
  text-align: center;
}
.clinical-tile-matrix-data-row-transform:hover .clinical-tile-data-doubtful {
  opacity: 0.9;
  transition: opacity 0.5s;
}
.clinical-tile-matrix-data-row-transform:hover .clinical-tile-data-deleted {
  opacity: 0.9;
  transition: opacity 0.5s;
}

.clinical-tile-matrix-first-column {
  width: 150px;
  position: absolute;
  top: 0px;
  overflow: hidden;
  height: 100%;
  text-align: right;
  display: inline-block;
  vertical-align: middle;
}

.clinical-today-episode-highlight {
  border: 2px solid #c3ccda;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05) inset, 0px 0px 8px rgba(32, 71, 128, 0.6);
  font-weight: bold;
  /*font-size: smaller;*/
  background-color: rgba(225, 216, 236, 0.4784313725);
}
.clinical-today-episode-highlight > button {
  background-color: rgba(0, 50, 250, 0.7);
  color: white;
}
.clinical-today-episode-highlight > button > .clinical-tile-matrix-day {
  color: white;
}

.clinical-active-episode-highlight {
  border: 2px solid #dddaef;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05) inset, 0px 0px 3px rgba(32, 71, 128, 0.6);
  font-weight: bold;
  /*font-size: smaller;*/
  background-color: #fff2e5;
}
.clinical-active-episode-highlight > button {
  background-color: rgba(0, 50, 250, 0.7);
  color: white;
}
.clinical-active-episode-highlight > button > .clinical-tile-matrix-day {
  color: white;
}

.clinical-tile-matrix-row-header {
  width: 160px;
  min-height: 80px;
  height: 100%;
  vertical-align: top;
  border-style: solid;
  border-color: lightgray;
  border-width: 1px;
  font-size: large;
  position: sticky;
  left: 0;
  z-index: 2;
  font-weight: 600;
  display: inline-grid;
  color: cornflowerblue;
  padding: 5px;
  border-left-style: solid;
  border-left-color: lightgray;
  border-left-width: 1px;
  background-color: ghostwhite;
}

.clinical-tile-matrix-data-row {
  position: relative;
  /*border-bottom-style:solid;
  border-bottom-color: lightgray;
  border-bottom-width:1px;*/
}
.clinical-tile-matrix-data-row:hover {
  background-color: rgba(141, 162, 185, 0.1);
}

.clinical-tile-matrix-data-missing {
  font-weight: 100;
  color: lightgray;
  font-size: small;
  height: 100%;
}

.clinical-tile-matrix-data-row-collapsed {
  height: 100%;
  width: 75px;
  display: inline-block;
  vertical-align: top;
  border-left: 1px dashed darkgrey;
  border-bottom: 1px dashed darkgrey;
}

.clinical-tile-matrix-data-row-expanded {
  height: 100%;
  width: 160px;
  display: inline-block;
  vertical-align: top;
  overflow-y: hidden;
  overflow-x: hidden;
  border-bottom-style: solid;
  border-bottom-color: lightgray;
  border-bottom-width: 1px;
  border-left-style: solid;
  border-left-color: lightgray;
  border-left-width: 1px;
}

.clinical-tile-matrix-data-row .clinical-tile-matrix-data-row-expanded:last-of-type {
  border-right-style: solid;
  border-right-color: lightgray;
  border-right-width: 1px;
}

.clinical-tile-matrix-month {
  font-weight: 600;
}

.clinical-tile-matrix-day {
  color: gray;
}

.clinical-tile-data-block {
  /*border-color: cornflowerblue;
  border: 1px;
  border-style: outset;
  @include linear-gradient-background(rgba(100, 149, 237, 0.2),rgba(141, 162, 185, 0.1));
  @include border-radius(3px);
  padding: 2px;
  color: darkblue;
  font-size:large;
  font-weight:bold;*/
}

.prescription-pending-panel {
  background-image: linear-gradient(to bottom, #fcf8e3 0, #f8efc0 100%);
  background-repeat: repeat-x;
  border-color: darkred;
  border-radius: 10px;
  border-style: solid;
  border-bottom-width: 1px;
  margin-bottom: 10px;
  font-weight: 500;
  font-size: larger;
  vertical-align: middle;
}
.prescription-pending-panel .panel-heading {
  font-size: large;
  font-weight: 600;
  padding: 10px;
  margin: 0;
  color: darkred;
  left: 50px;
}
.prescription-pending-panel .panel-heading :before {
  font-weight: 100;
  font-family: FontAwesome;
  content: "\f071                ";
  color: orangered;
}
.prescription-pending-panel .panel-body .badge {
  font-weight: 600;
  font-size: larger;
  background-color: transparent;
  color: darkred;
}
.prescription-pending-panel .panel-body .table {
  border: solid lightgray 1px;
  background-color: white;
}
.prescription-pending-panel .panel-body .table tbody {
  border: 2px solid transparent;
}
.prescription-pending-panel .panel-body .table tbody tr:hover {
  background-color: rgba(141, 162, 185, 0.1);
  border: darkred 2px solid;
}

.clinical-date-heading-month {
  color: cornflowerblue;
  font-weight: bold;
}

.clinical-date-heading-day {
  color: gray;
}

.clinical-drawing-tools {
  height: calc(100% - 1px);
  max-width: 250px;
  display: inline-block;
}

.clinical-drawing-tools-container {
  background-color: lightsteelblue;
  bottom: 10px;
  width: 100%;
  overflow-wrap: break-word;
  overflow-x: hidden;
  overflow-y: hidden;
  height: calc(100% - 1px);
  margin-bottom: 15px;
  padding: 2px;
}

.clinical-drawing-tools-button-container {
  background-color: aliceblue;
  border-color: rgba(19, 104, 140, 0.37);
  border: 1px solid;
  overflow-y: auto;
  height: calc(100% - 40px);
}

.clinical-drawing-tools-button-toolbar {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
}

.clinical-custom-fields {
  width: calc(100% - 10px);
  /*  max-height: calc(100% - 270px);
  overflow-y: auto;*/
  height: 100%;
}
.clinical-custom-fields .input-group .input-group-addon {
  min-width: 120px;
  text-align: left;
}
.clinical-custom-fields .input-group .input-group-addon.addon-150 {
  min-width: 150px;
}
.clinical-custom-fields .col-sm-12 {
  padding: 0;
}

.clinical-common-fields {
  width: 100%;
  overflow-y: unset;
  /* max-height:220px;
  */
}
.clinical-common-fields .input-group-addon {
  min-width: 150px;
  text-align: left;
}
.clinical-common-fields .view-mode.dox-pre {
  width: 180% !important;
}
.clinical-common-fields .view-mode.dox-pre .dox-left-side {
  left: -calc(90%);
}

.eye-doodle-item {
  display: inline-block;
  overflow-x: auto;
  width: 100%;
  height: 35px;
  overflow-y: hidden;
}

.eye-doodle-button {
  height: 34px;
  margin: 0;
  padding: 0;
}

.show-doodle-components {
  display: inline-block;
  float: right;
}

.clinical-doodle-instance-button {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  /*@include radial-gradient-background( grey,lightgrey,white);*/
  background-color: lightgrey;
  color: black;
  border: 1px solid grey;
}
.clinical-doodle-instance-button.selected {
  background-color: rgba(19, 104, 140, 0.37);
}

.clinical-va-offset {
  font-size: xx-small;
  color: darkblue;
}

.clinical-va-prescription {
  color: darkgrey;
}

.dox-eye-left, .dox-eye-left-large, .clinical-left-eye {
  position: relative;
  border: solid darkred 2px;
  border-radius: 5px;
  padding: 1px;
  display: inline-block;
  min-width: 70px;
  font-weight: normal;
  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  /*@include  radial-gradient-background($left-eye-colour-faded,white 70%,$left-eye-colour-faded);*/
}
.dox-eye-left::before, .dox-eye-left-large::before, .clinical-left-eye::before {
  display: inline-block;
  clear: both;
}
.dox-eye-left.show-label::after, .show-label.dox-eye-left-large::after, .show-label.clinical-left-eye::after {
  /*@extend .reset;*/
  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  content: "OS" !important;
  font-size: larger;
  color: darkred;
  left: 42px;
  position: absolute;
  top: 10px;
  position: absolute;
}
.dox-eye-left > .showLabel, .dox-eye-left-large > .showLabel, .clinical-left-eye > .showLabel {
  position: absolute;
  top: 11px;
  left: 40px;
}
.dox-eye-left > .showLabel::before, .dox-eye-left-large > .showLabel::before, .clinical-left-eye > .showLabel::before {
  /*@extend .reset;*/
  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  content: "OS" !important;
  font-size: larger;
  color: darkred;
  vertical-align: top;
  margin-top: -2px;
  float: right;
}
.dox-eye-left.dox-has-note::after, .dox-has-note.dox-eye-left-large::after, .dox-has-note.clinical-left-eye::after {
  font-family: FontAwesome;
  content: "\f06e" !important;
  font-size: larger;
  color: darkred;
  display: inline-block;
  float: right !important;
  vertical-align: top;
  z-index: 1;
}
.dox-eye-left.dox-has-note::before, .dox-has-note.dox-eye-left-large::before, .dox-has-note.clinical-left-eye::before {
  font-family: FontAwesome;
  content: "" !important;
  font-size: larger;
  color: darkred;
  display: inline-block;
  float: right !important;
  vertical-align: top;
  z-index: 1;
}

.dox-eye-left-large, .clinical-left-eye {
  /*@include  radial-gradient-background($left-eye-colour-faded,white 70%,$left-eye-colour-faded);*/
  border-width: 3px;
  padding-left: 5px;
  /* padding-top: 50px;
  position: absolute;
    top: 20px;
    bottom: 50px;
    left: calc(50% + 10px);*/
  height: calc(100% - 1px);
  overflow-y: hidden;
}
.dox-eye-left-large::before, .clinical-left-eye::before {
  /*@extend .reset;*/
  font-family: FontAwesome;
  content: "\f06e" !important;
  font-size: xx-large;
  color: darkred;
  vertical-align: top;
  margin-top: -2px;
  float: left;
}
.dox-eye-left-large > .dox-eye-large-full-screen-toggle, .clinical-left-eye > .dox-eye-large-full-screen-toggle {
  float: left;
  margin-left: -34px;
  width: 35px;
  height: 25px;
  margin-top: 5px;
  background-color: transparent !important;
}
.dox-eye-left-large > .dox-eye-large-full-screen-toggle button, .clinical-left-eye > .dox-eye-large-full-screen-toggle button {
  background-color: transparent;
  border: none;
}
.dox-eye-left-large.hidden, .hidden.clinical-left-eye {
  width: 0;
  display: none;
}
.dox-eye-left-large.full-screen, .full-screen.clinical-left-eye {
  width: 100%;
}

.two-eye-draw .dox-eye-right-large, .two-eye-draw .clinical-right-eye {
  width: calc(50% - 20px);
  position: relative;
}
.two-eye-draw .dox-eye-right-large > .dox-eye-large-full-screen-toggle, .two-eye-draw .clinical-right-eye > .dox-eye-large-full-screen-toggle {
  float: right;
  margin-right: -34px;
  width: 35px;
  height: 25px;
  margin-top: 5px;
  background-color: transparent !important;
}
.two-eye-draw .dox-eye-right-large > .dox-eye-large-full-screen-toggle button, .two-eye-draw .clinical-right-eye > .dox-eye-large-full-screen-toggle button {
  background-color: transparent;
  border: none;
}
.two-eye-draw .dox-eye-right-large.full-screen .drawing-controls-component, .two-eye-draw .full-screen.clinical-right-eye .drawing-controls-component {
  height: 100%;
  max-width: 300px;
  max-height: 100%;
  position: absolute;
  top: 0;
}
.two-eye-draw .dox-eye-right-large.full-screen .eye-draw-component, .two-eye-draw .full-screen.clinical-right-eye .eye-draw-component {
  float: right;
}
.two-eye-draw .dox-eye-right-large .fields-component, .two-eye-draw .clinical-right-eye .fields-component {
  width: 100%;
  max-width: 300px;
  float: left;
  overflow: auto;
  max-height: calc(100% - 20px);
  vertical-align: top;
  transform-origin: 0 0;
}
.two-eye-draw .dox-eye-right-large .drawing-controls-component, .two-eye-draw .clinical-right-eye .drawing-controls-component {
  max-width: 300px;
  max-height: 300px;
  height: 50%;
  position: absolute;
  bottom: 0;
}
.two-eye-draw .dox-eye-right-large .drawing-controls-component .full-screen, .two-eye-draw .clinical-right-eye .drawing-controls-component .full-screen {
  height: 100%;
}
.two-eye-draw .dox-eye-right-large .eye-draw-component, .two-eye-draw .clinical-right-eye .eye-draw-component {
  float: left;
}
.two-eye-draw .dox-eye-right-large .eye-draw-component.full-screen, .two-eye-draw .clinical-right-eye .eye-draw-component.full-screen {
  float: right;
}
.two-eye-draw .dox-eye-left-large, .two-eye-draw .clinical-left-eye {
  width: calc(50% - 20px);
}
.two-eye-draw .dox-eye-left-large > .dox-eye-large-full-screen-toggle, .two-eye-draw .clinical-left-eye > .dox-eye-large-full-screen-toggle {
  float: left;
  margin-left: -34px;
  width: 35px;
  height: 25px;
  margin-top: 5px;
  background-color: transparent !important;
}
.two-eye-draw .dox-eye-left-large > .dox-eye-large-full-screen-toggle button, .two-eye-draw .clinical-left-eye > .dox-eye-large-full-screen-toggle button {
  background-color: transparent;
  border: none;
}
.two-eye-draw .dox-eye-left-large .fields-component, .two-eye-draw .clinical-left-eye .fields-component {
  max-width: 300px;
  float: right;
  overflow: auto;
  max-height: calc(100% - 20px);
}
.two-eye-draw .dox-eye-left-large .drawing-controls-component, .two-eye-draw .clinical-left-eye .drawing-controls-component {
  float: right;
  max-width: 300px;
  max-height: 300px;
}
.two-eye-draw .dox-eye-left-large .eye-draw-component, .two-eye-draw .clinical-left-eye .eye-draw-component {
  float: left;
}

.dox-eye-right, .dox-eye-right-large, .clinical-right-eye {
  position: relative;
  border: solid darkgreen 2px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 1px 1px 1px 1px;
  min-width: 70px;
  display: inline-block;
  font-weight: normal;
  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  /*@include radial-gradient-background($right-eye-colour-faded ,white 60%,  $right-eye-colour );*/
}
.dox-eye-right.dox-has-note::before, .dox-has-note.dox-eye-right-large::before, .dox-has-note.clinical-right-eye::before {
  /*@extend .reset;*/
  font-family: FontAwesome;
  content: "\f06e" !important;
  font-size: larger;
  color: darkgreen;
  vertical-align: top;
  float: left;
  top: 0;
  z-index: 1;
}
.dox-eye-right.show-label::after, .show-label.dox-eye-right-large::after, .show-label.clinical-right-eye::after {
  /*@extend .reset;*/
  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  content: "OD" !important;
  font-size: larger;
  color: darkgreen;
  vertical-align: top;
  margin-top: 5px;
  position: absolute;
  right: 45px;
  top: 5px;
}
.dox-eye-right > .showLabel, .dox-eye-right-large > .showLabel, .clinical-right-eye > .showLabel {
  position: absolute;
  top: 11px;
  right: 40px;
}
.dox-eye-right > .showLabel::before, .dox-eye-right-large > .showLabel::before, .clinical-right-eye > .showLabel::before {
  /*@extend .reset;*/
  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  content: "OD" !important;
  font-size: larger;
  color: darkgreen;
  vertical-align: top;
  margin-top: -2px;
  float: right;
}

.dox-eye-right-large, .clinical-right-eye {
  border-width: 3px;
  padding-right: 5px;
  /*  padding-top: 50px;
  position: absolute;
  top: 20px;
  bottom: 50px;*/
  height: calc(100% - 1px);
  overflow-y: hidden;
}
.dox-eye-right-large::before, .clinical-right-eye::before {
  /*@extend .reset;*/
  font-family: FontAwesome;
  content: "\f06e" !important;
  font-size: xx-large;
  color: darkgreen;
  vertical-align: top;
  margin-top: -3px;
  float: right;
}
.dox-eye-right-large.dox-has-note::before, .dox-has-note.clinical-right-eye::before {
  /*@extend .reset;*/
  font-family: FontAwesome;
  content: "" !important;
  font-size: larger;
  color: darkred;
  display: inline-block;
  float: left !important;
  vertical-align: top;
  z-index: 1;
}
.dox-eye-right-large .dox-has-note, .clinical-right-eye .dox-has-note {
  display: inline-block;
}
.dox-eye-right-large .dox-has-note::before, .clinical-right-eye .dox-has-note::before {
  font-family: FontAwesome;
  content: "\f0c6";
  font-size: larger;
  color: grey;
  float: left;
  z-index: 1;
}
.dox-eye-right-large > .dox-eye-large-full-screen-toggle, .clinical-right-eye > .dox-eye-large-full-screen-toggle {
  float: right;
  margin-right: -34px;
  width: 35px;
  height: 25px;
  margin-top: 5px;
  background-color: transparent !important;
}
.dox-eye-right-large > .dox-eye-large-full-screen-toggle button, .clinical-right-eye > .dox-eye-large-full-screen-toggle button {
  background-color: transparent;
  border: none;
}
.dox-eye-right-large.hidden, .hidden.clinical-right-eye {
  width: 0;
  display: none;
}
.dox-eye-right-large.full-screen, .full-screen.clinical-right-eye {
  width: 100%;
}

.dox-eye-both {
  border: solid rgb(0, 52, 113) 2px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 1px 1px 1px 1px;
  min-width: 70px;
  display: inline-block;
  font-weight: normal;
  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  /*@include radial-gradient-background($right-eye-colour-faded ,white 60%,  $right-eye-colour );*/
}
.dox-eye-both.dox-has-note::before {
  /*@extend .reset;*/
  font-family: FontAwesome;
  content: "\f06e" !important;
  font-size: larger;
  color: rgb(0, 52, 113);
  vertical-align: top;
  float: left;
  top: 0;
  z-index: 1;
}

.dox-eye-drawing-tile {
  position: absolute;
  top: 0;
  left: 0;
  height: calc(100% - 10px);
  min-height: 60px;
}

.dox-form.euroquo-form span .form-control {
  min-width: 60px;
}
.dox-form.euroquo-form .row {
  margin: 1px;
  margin-left: 1px;
  border-left: 1px solid cornflowerblue;
  border-right: 1px solid cornflowerblue;
}
.dox-form.euroquo-form .col-sm-4 {
  margin: 1px;
  padding: 1px;
}
.dox-form.euroquo-form .form-section-header {
  border-top: solid 1px cornflowerblue;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-left: solid 1px cornflowerblue;
  border-bottom: solid 1px cornflowerblue;
  height: 43px;
  display: inline-block;
  width: calc(100% - 1px);
  font-size: large;
  color: white;
  background-color: cornflowerblue;
  vertical-align: middle;
  padding: 10px 10px;
  margin: 0 -38px 1px -16px;
}
.dox-form.euroquo-form .form-main-eye {
  border: 1px solid cornflowerblue;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.dox-form.euroquo-form .form-main-eye .row {
  margin-left: -15px;
  border-left: 1px solid cornflowerblue;
  border-right: 1px solid cornflowerblue;
}
.dox-form.euroquo-form .form-fellow-eye {
  border: 1px solid gray;
}
.dox-form.euroquo-form .form-fellow-eye .form-section-header {
  background-color: gray;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.dox-form.euroquo-form .form-fellow-eye .form-section-header .row {
  margin-left: -15px;
  border-left: 1px solid gray;
  border-right: 1px solid gray;
}
.dox-form.euroquo-form .form-label {
  display: table-cell;
  vertical-align: middle;
  border-radius: 3px 0 0 3px;
  border: 1px #ebebeb solid;
  height: 100%;
  background: #ebebeb;
  padding-left: 12px;
  padding-top: 7px;
  margin: 1px;
  min-height: 34px;
}
.dox-form.euroquo-form .form-label.required {
  /*@extend .required;*/
}

/*#clinicalChart{
    max-height:300px;
}*/
/* The Overlay (background) */
.overlay {
  /* Height & width depends on how you want to reveal the overlay (see JS below) */
  height: 100%;
  width: 0;
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  background-color: rgb(0, 0, 0); /* Black fallback color */
  background-color: rgba(0, 0, 0, 0.9); /* Black w/opacity */
  overflow-x: hidden; /* Disable horizontal scroll */
  transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content {
  position: relative;
  top: 25%; /* 25% from the top */
  width: 100%; /* 100% width */
  text-align: center; /* Centered text/links */
  margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
}

/* The navigation links inside the overlay */
.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: #818181;
  display: block; /* Display block instead of inline */
  transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}

/* Position the close button (top right corner) */
.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 40px;
}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
  .overlay a {
    font-size: 20px;
  }
  .overlay .closebtn {
    font-size: 40px;
    top: 15px;
    right: 35px;
  }
}
.clinical-full-screen-modal {
  width: 92vw !important;
  position: fixed !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -46vw !important;
  height: 97vh !important;
  margin-right: -40vw !important;
  top: -1vw !important;
  z-index: 100000 !important;
}

/* Pseudo classes to use for module resizing*/
.clinical-use-component-height {
  /*use the component height*/
  height: auto;
  padding: 2px;
  overflow-x: hidden;
  overflow-y: auto;
}

.clinical-use-clinic-view-height {
  /*Use the space provided full screen on the clinic module*/
  overflow-x: hidden;
  overflow-y: auto;
  height: 100%;
  /*padding: 2px;*/
  padding: 0;
}

.clinical-use-content-height {
  /*use the component height*/
  overflow-x: hidden;
  overflow-y: auto;
  height: auto;
  padding: 2px;
}

/* Classes to crop images in the fields analysis 3 part bits */
.hfa-image-div, #hfa-pattern-deviation-left, #hfa-total-deviation-left, #hfa-test-image-left, #hfa-pattern-deviation-right, #hfa-total-deviation-right, #hfa-test-image-right {
  overflow: hidden;
  display: inline;
  height: 100%;
  width: 30%;
  float: left;
  object-fit: cover;
  background-size: 366%;
}
.hfa-image-div > img, #hfa-pattern-deviation-left > img, #hfa-total-deviation-left > img, #hfa-test-image-left > img, #hfa-pattern-deviation-right > img, #hfa-total-deviation-right > img, #hfa-test-image-right > img {
  transform-origin: top left;
  height: 1000px;
}

#hfa-test-image-right {
  /*& > .single-field-analysis {
      transform: translate(-50%, -18%);
  }*/
}
#hfa-test-image-right.single-field-analysis {
  background-position-x: -62%;
  background-position-y: 27%;
}
#hfa-test-image-right.single-field-analysis-hfa-860 {
  background-position-x: -67%;
  background-position-y: 35%;
  background-size: 310%;
}

#hfa-total-deviation-right {
  /*& > .single-field-analysis {
          transform: translate(-16%, -87%) scale(1.45)
      }*/
}
#hfa-total-deviation-right.single-field-analysis {
  background-position-x: -124%;
  background-position-y: 76%;
}
#hfa-total-deviation-right.single-field-analysis-hfa-860 {
  background-position-x: -124%;
  background-position-y: 74%;
  background-size: 390%;
}

#hfa-pattern-deviation-right {
  /*& > .single-field-analysis {
          transform: translate(-58%, -86%) scale(1.45);
      }*/
}
#hfa-pattern-deviation-right.single-field-analysis {
  background-position-x: -82%;
  background-position-y: 76%;
}
#hfa-pattern-deviation-right.single-field-analysis-hfa-860 {
  background-position-x: -215%;
  background-position-y: 74%;
  background-size: 390%;
}

#hfa-test-image-left {
  /*& > .single-field-analysis {
      transform: translate(-50%, -18%);
  }*/
}
#hfa-test-image-left.single-field-analysis {
  background-position-x: -59%;
  background-position-y: 27%;
}
#hfa-test-image-left.single-field-analysis-hfa-860 {
  background-position-x: -67%;
  background-position-y: 35%;
  background-size: 310%;
}

#hfa-total-deviation-left {
  /*& > .single-field-analysis {
      transform: translate(-16%, -87%) scale(1.45)
  }*/
}
#hfa-total-deviation-left.single-field-analysis {
  background-position-x: -127%;
  background-position-y: 76%;
}
#hfa-total-deviation-left.single-field-analysis-hfa-860 {
  background-position-x: -124%;
  background-position-y: 74%;
  background-size: 390%;
}

#hfa-pattern-deviation-left {
  /*& > .single-field-analysis {
      transform: translate(-58%, -86%) scale(1.45);
  }*/
}
#hfa-pattern-deviation-left.single-field-analysis {
  background-position-x: -82%;
  background-position-y: 76%;
}
#hfa-pattern-deviation-left.single-field-analysis-hfa-860 {
  background-position-x: -215%;
  background-position-y: 74%;
  background-size: 390%;
}

.dox-clinic-module-button {
  /*font-variant: small-caps;*/
  font-weight: normal;
  /*font-size: smaller;*/
  display: inline-block;
  padding-top: 3px;
  text-overflow: ellipsis;
  overflow: hidden;
  text-align: left;
}
.dox-clinic-module-button > span {
  margin-top: 4px;
  margin-left: 4px;
  margin-right: 10px;
  float: left;
}

.clinical-tile-has-document {
  /*background-image: linear-gradient(to bottom, #4e79f0 0, #94b0e8 100%);
  border-radius: 20px;
  padding: 6px;
  color: white;
  font-weight: bold;*/
}
.clinical-tile-has-document:before {
  font-family: FontAwesome;
  content: "\f0f6";
  color: #f5f5f5;
  font-size: large;
  font-weight: normal;
  border-radius: 13px;
  background-image: linear-gradient(to bottom, #4e79f0 0, #94b0e8 100%);
  padding: 6px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.clinical-tile-has-marked-document {
  /*:hover{
      content: 'I have ';
  }*/
}
.clinical-tile-has-marked-document:before {
  font-family: FontAwesome;
  content: "\f1c5";
  color: #f5f5f5;
  font-size: large;
  border-radius: 13px;
  background-image: linear-gradient(to bottom, #30963c 0, #bae894 100%);
  padding: 6px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.clinical-tile-has-comment:before {
  font-family: FontAwesome;
  content: "\f086";
  color: #f5f5f5;
  font-size: large;
  border-radius: 13px;
  background-image: linear-gradient(to bottom, #c74ef0 0, #94b0e8 100%);
  padding: 6px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}

/*Main Module View*/
.clinical-right-side-panel {
  float: right;
  width: calc(100% - 255px);
  height: calc(100% - 40px);
  overflow-y: auto;
}
.clinical-right-side-panel.show-additional-side-panel {
  width: calc(100% - 510px);
}
.clinical-right-side-panel.hidden-side-panel {
  width: 100%;
}

.clinical-left-side-panel {
  display: inline-block;
  position: absolute;
  width: 250px;
  top: 0;
  bottom: 20px;
  left: 0;
  overflow-x: hidden;
  height: calc(100% - 40px);
  overflow: hidden;
}
.clinical-left-side-panel.show-additional-side-panel {
  width: 505px;
}
.clinical-left-side-panel.main-side-panel {
  width: 250px;
  float: left;
}
.clinical-left-side-panel .panel-heading {
  padding-top: 2px;
  padding-bottom: 2px;
  font-weight: bold;
  font-size: smaller;
}
.clinical-left-side-panel .panel-body {
  padding: 1px;
}
.clinical-left-side-panel > .clinical-side-panel {
  width: 250px;
  float: right;
  width: 250px;
  float: left;
  overflow-y: auto;
  height: 100%;
  border-right: 1px solid darkgrey;
}

/*Clinical Page styles*/
.clinical-page-instance {
  border: 1px grey groove;
  position: relative;
  height: 100%;
}
.clinical-page-instance > .clinical-page {
  position: relative;
  border: 1px solid lightgrey;
}
.clinical-page-instance > .clinical-page.page-today {
  border: 2px forestgreen solid;
}
.clinical-page-instance > .clinical-page.page-today > .clinical-page-instance-header {
  background-color: forestgreen;
}
.clinical-page-instance > .clinical-page.page-today > .clinical-page-instance-header > ul.dropdown-menu {
  color: black;
}
.clinical-page-instance > .clinical-page > .clinical-page-instance-header {
  background: rgba(180, 189, 197, 0.31); /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left top, rgba(196, 181, 179, 0.219608), rgba(180, 189, 197, 0.31)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(bottom right, rgba(196, 181, 179, 0.219608), rgba(180, 189, 197, 0.31)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(bottom right, rgba(196, 181, 179, 0.219608), rgba(180, 189, 197, 0.31)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to bottom right, rgba(196, 181, 179, 0.219608), rgba(180, 189, 197, 0.31)); /* Standard syntax */
  top: 0;
  left: 0;
  right: 0;
  height: 36px;
  position: absolute;
}
.clinical-page-instance > .clinical-page > .clinical-page-instance-header > .page-definition-name {
  color: dimgrey;
  text-align: right;
  width: 100%;
}

.clinical-module-region {
  border: 1px dotted lightgrey;
  height: 100%;
  width: calc(100% - 20px);
}

.clinical-tile-region {
  border: 1px dotted lightgrey;
  height: 100%;
  width: calc(100% - 0px);
}

.clinical-paged-view {
  height: 100%;
  width: auto;
  overflow-x: auto;
  min-width: 100%;
}

.clinical-two-eye-grid {
  display: grid;
  grid-template-areas: "header header" "righteye lefteye" "footer footer";
  grid-template-rows: fit-content(35%) 1fr fit-content(35%);
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 5px;
}

.clinical-right-eye {
  grid-area: righteye;
}

.clinical-left-eye {
  grid-area: lefteye;
}

.hide-captiondiv.hide-caption {
  display: none !important;
}