html
{
  /*height: 100%;*/
}

body {

  font-family: sans-serif;
  background: #d7dee4;
  background-image: url(../images/logo_big_transp_Trans_20.png);
  background-position: center;
  background-size: 100%;
}
.row {
  margin-right: 0;
  margin-left: 0;
}
#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;
    background-size: cover;
    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); }
}

.domainName
{
  position: absolute;
  top: 10px;
  right: 68px;
  font-size: x-large;
  color: #8cb2d4;
  font-style: italic;
}

.btn-success {
    color: #fff;
    background-color: #378237;
    border-color: #3e8c3e;
}
.btn-danger {
  color: #fff;
  background-color: #ad1a16;
  border-color: #d43f3a;
}
.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;
}

.glyphicon {
  position: relative;
  top: 3px;
}

.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;
}

.form-check-input, .form-check-label {
  cursor: pointer;
}
.form-check-label {
  user-select: none;
}

.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: #e72c2c;
}

.checkmarkOrange
{
  background-color: #f3af1c!important;
}

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

/* 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!important;
  color: black;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.blackTag {
  background-color: black!important;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.blueTag {
  background-color: rgb(0, 102, 255)!important;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.yellowTag {
  background-color: yellow!important;
  color: black;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.redTag {
  background-color: red!important;
  color: black;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.greenTag {
  background-color: rgb(0, 102, 0)!important;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.lightgreenTag {
  background-color: rgb(0, 209, 0)!important;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.brownTag {
  background-color: rgb(128, 77, 0)!important;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.pinkTag {
  background-color: rgb(228, 0, 171)!important;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.purpleTag {
  background-color: rgb(79, 0, 124)!important;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.greyTag {
  background-color: rgb(104, 104, 104)!important;
  color: white;
  text-align: center;
  border: 1px solid #9c9c9c;
}
.orangeTag {
  background-color: rgb(223, 89, 0)!important;
  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;
}

.btn-dark {
  color: #fff;
  background-color: #343a40;
  border-color: #343a40;
}

.btn-dark:hover {
  color: #fff;
  background-color: #23272b;
  border-color: #1d2124;
}

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

.btn-dark:not(:disabled):not(.disabled):active, .show>.btn-dark.dropdown-toggle {
  color: #fff;
  background-color: #1d2124;
  border-color: #171a1d;
}

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;
    background-image: linear-gradient(#385e7f, #0b3254);
}
.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;
    background-image: linear-gradient(#4679a5, #133f65);
}


.panel-primary>.panel-heading {
  color: #fff;
  background-color: #3e719c;
  border-color: #337ab7;
  background-image: linear-gradient(#385e7f, #0b3254);
}

.panel-secondary {
  border-color: #9d1212;
}
.panel-secondary>.panel-heading {
  color: #fff;
  background-color: #780b0b;
  border-color: #9d1212;
  background-image: linear-gradient(#bb3b38, #200606);
}
/* 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!important;
}

.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;
    color: #000;
}
.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;
}

.list-group-numbered {
  list-style-type: none;
  counter-reset: section;
}
.list-group-numbered > li::before {
  content: counters(section, ".") ". ";
  counter-increment: section;
}

@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;
  }
}