html
{
  height: 100%;
}

body {
  font-family: sans-serif;
  background: #d7dee4;
  background: -webkit-linear-gradient(#d7dee4, #ffffff 90%, #d7dee4); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#d7dee4, #ffffff 90%, #d7dee4); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#d7dee4, #ffffff 90%, #d7dee4); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#d7dee4, #ffffff 90%, #d7dee4); /* Standard syntax */
}
#bg
{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url(../images/logo_big_transp.png);
  background-repeat: no-repeat;
  background-position:center;
  opacity: 0.1;
}

.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 100px;
  height: 100px;
  animation: spin 1.5s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.btn-success {
    color: #fff;
    background-color: #46a046;
    border-color: #3e8c3e;
}

.nowrap {
  white-space: nowrap;
}

.modal-body {
    overflow-x: auto;
}

.control-label {
  white-space: nowrap;
}

ol, ul {
  margin-top: 0;
  margin-bottom: 0px;
  padding-inline-start: 28px;
}

li {
    font-weight: normal;
}

input {
    border: none;
    border-bottom: 1px solid #8cbde6;
    padding: 2px 5px;
}


.signature-pad--actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 8px;
}

.checkboxcontainer {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.lightBorder {
  border: 1px solid rgb(223, 237, 241);;
}

/* Hide the browser's default checkbox */
.checkboxcontainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.checkboxcontainer:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.checkboxcontainer input:checked ~ .checkmark {
  background-color: #1fa96e;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.checkboxcontainer input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkboxcontainer .checkmark:after {
  left: 8px;
  top: 4px;
  width: 9px;
  height: 13px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.shadow
{
  -webkit-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.5);
  box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.5);
}

.whiteTag {
  background-color: white;
  color: black;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.blackTag {
  background-color: black;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.blueTag {
  background-color: blue;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.yellowTag {
  background-color: yellow;
  color: black;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.redTag {
  background-color: red;
  color: black;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.greenTag {
  background-color: green;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}

.signatureBox
{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: table;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.65);
}
.signatureBoxContainer
{
  padding-top: 70px;
  width: 500px;
  margin: auto;
}

button.close {
  padding: 0 5px;
}

.w-100
{
  width: 100%;
}

hr {
    margin-top: 12px;
    margin-bottom: 12px;
}
.form-group {
    margin-bottom: 6px;
}
.navbar-inverse {
    background-color: #385e7f;
    border-color: #214e75;
}
.navbar-inverse .navbar-nav>li>a {
    color: #d4d4d4;
    letter-spacing: 0.5px;
}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover {
    color: #fff;
    background-color: #395369;
}

.panel-primary>.panel-heading {
    color: #fff;
    background-color: #3e719c;
    border-color: #337ab7;
}
/* Remove the navbar's default margin-bottom and rounded borders */
.navbar
{
  margin-bottom: 0;
  border-radius: 0;
}
/* Set height of the grid so .sidenav can be 100% (adjust as needed) */
.row.content {height: 450px}

/* Set gray background color and 100% height */
.sidenav
{
  padding-top: 20px;
  background-color: #f1f1f1;
  height: 100%;
}
/* Set black background color, white text and some padding */

a { cursor: pointer; }

.asteriskField
{
  color: red;
}

.mainbox
{
  margin-top: 15px;
}
.panel {
  margin-bottom: 0;
}
.panel-footer
{
  text-align: center;
}

.table>thead>tr>th
{
  border-bottom: 1px solid #ddd;
  white-space: nowrap;
}

.table
{
  margin-bottom: 0px;
}

tbody {
    background-color: white;
}

.reportIcon
{
  color: #ab008c;
  padding: 6px;
}

.reportIcon.old
{
  color: #7590a9;
  padding: 6px;
}

.reportIcon:hover
{
  color: #337ab7;
}

div#usersBox {
    width: fit-content;
    min-width: 100%;
    width: -moz-fit-content;
}
.modal
{
  padding-top: 50px;
}

.modal-footer
{
  text-align: center;
  background-color: #f7f7f7;
}

.panel-footer td
{
  text-align: left;
}

.pageContainer
{
  padding: 15px;
}

span.glyphicon, span.fas
{
  font-size: 16px;
}
span.listIcon
{
  font-size: 15px;
}

.nav-tabs {
    border-bottom: 1px solid #f1f1f1;
}

.backBtn
{
  padding-bottom: 10px;
  padding-left: 10px;
}

.colorGreen
{
  color: #319835;
}

a {
  padding: 5px;
}

.nav>li>a {
  padding: 15px 10px;
}
.nav-tabs>li>a {
  background-color: #f1f1f1;
  padding: 9px 13px;
}

.nav-tabs {
    background-color: #f1f1f1;
}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    border: 0px solid #ddd;
}
.nav-tabs>li>a {
    border-radius: 0;
}
.nav-tabs>li>a {
  border: 0px solid transparent;
}
.table>thead>tr>th {
  border-bottom: 1px solid #ddd;
  white-space: nowrap;
}

.text-left
{
  text-align: left;
}

.modal-footer {
  padding: 8px;
}

.tablesorter thead .disabled
{
  display: none
}


.tablesorter-bootstrap > tbody > tr.odd td.primary {
  background-color: #ecebeb;
}
.tablesorter-bootstrap > tbody > tr td.primary, .tablesorter-bootstrap > tbody > tr.even td.primary {
  background-color: #f5f4f4;
}
.tablesorter-bootstrap > tbody > tr.odd td.primary {
  background-color: #ecebeb;
}

.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
    background-color: #334c61;
}

.navbar-inverse .navbar-toggle {
    border-color: #334d63;
}
button.navbar-toggle {
   background-color: #395369;
}
.navbar-toggle .icon-bar {
    height: 3px;
}


@media (min-width: 768px)
{
	#modalViewEq.modal-dialog {
    width: 90%;
  }
}
/* On small screens, set height to 'auto' for sidenav and grid */
@media screen and (max-width: 767px)
{
  .sidenav
  {
    height: auto;
    padding: 15px;
  }
  .row.content {
  	height:auto;
  }
}