html
{
    position: relative;
    min-height: 100%;
    -webkit-touch-callout: none;
    -webkit-user-select: none; /* Webkit */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE 10  */
    -o-user-select: none;
    user-select: none;
}

body
{
    font-family: "Lato", "sans-serif";
    margin-bottom: 50px;
}

.navbar
{
    margin-bottom: 0px;
    border: none;
}

.navbar-brand
{
    padding-top: 9px;
}

.navbar-logo 
{
     height: 60px;
     width: auto;
     margin: 0 auto;
     padding-right: 5px;
}

.footer
{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50px;
    color: #edefef;
    background-color: #153842;
    padding-top: 16px;
    font-width: normal;
    text-align: center;
}

.hidden
{
    display: none;
}

/* after here should be split into different css files */

.jumbotron
{
  color: #edf0f1;
  background-color: #2d5869;
  border-color: #edf0f1;
}

.table-responsive 
{
    overflow-x: auto;
}

.btn-like:hover
{
  color: #f7941f;
  cursor: pointer;
}

.btn-like
{
  cursor: pointer;
  cursor: hand; 
}

.lead 
{
    font-weight: 300;
}

.btn
{
    font-weight: 300;
}

/* bjp(15.11.08) removed because I don't think they're necessary anymore.
 * .navbar
 * {
 *     z-index: 1000;
 * }
 * 
 * 
 * @media screen and (min-width: 768px)
 * {
 *     p
 *     {
 *         font-size: 16px;
 *     }
 * }
*/

.scrollable-table
{
  height: auto;
  max-height: 642px;
  overflow-x: hidden;
  overflow: auto;
}

.scrollable-menu
{
    height: auto;
    max-height: 200px;
    overflow-x: hidden;
}

input::-ms-clear
{
  width : 0;
  height: 0;
}

.well
{
  background-color: #153842;
  border-color: #153842;
  border-radius: 0px;
}

.panel-primary
{
  border-color: #153842;
}

.panel-primary .panel-heading
{
  background-color: #153842;
  border-color: #153842;
}

.modal
{
    overflow-y: auto;
}

.nav-tabs > li > a:hover
{
  color: #f4bb4a;
}

.orange-on-hover:hover
{
  color: #f4bb4a;
}

/* NOTE:  If you use this class, you probably need to explicitly set the background-color on the glyphicon 
          in order to prevent IE9 black outline */
.glyphicon-flip
{
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

.caret-right
{
  display: inline-block;
  width: 0;
  height: 0;
  vertical-align: middle;
  border-left: 4px solid;
  border-bottom: 4px solid transparent;
  border-top: 4px solid transparent;
}

.patient-table-caret
{
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #000000;
}

.patient-table-caret-right
{
  border-left: 5px solid;
  border-bottom: 5px solid transparent;
  border-top: 5px solid transparent;
}

#my-app label
{
  font-size: 14px;
  font-weight: bold;
}

.btn-sm, .btn-group-sm > .btn
{
  font-size: 12px;
}

.form-control
{
  font-size: 14px;
}

.modal-backdrop
{
  z-index: -1;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus
{
    background-color: #2d5869;
    color: white;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus  
{
    background-color: #2d5869;
    color: white; 
} 

canvas:focus
{
    outline: none;
}

.inactive-patient-panel-tab
{
  background-color: green;
}

.nearest-neighbor-interpolation 
{
  image-rendering: optimizeSpeed;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: optimize-contrast;
  -ms-interpolation-mode: nearest-neighbor; 
}

/*for some reason the default that we had for this was really light grey on white.  It was almost unreadable*/
.popover-content
{
  color: rgb(84, 86, 86);
}