html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  line-height: 1.2 !important;
}

.tablecond td, .tablecond th 
{ 
  padding-left: 0.01rem; 
  padding-right: 0.01rem; 
  padding-top: 0.01rem; 
  padding-bottom: 0.01rem; 
}

.tablecond {
  margin-bottom: 0.1rem;
}
h6{
  font-weight: 600;
  margin-top: 0.2rem;
  margin-bottom: 0.1rem;
}
h6:hover{
  /* color: #777744 !important; */
  text-decoration: underline !important
}

.nounderline {
  text-decoration: none !important
}
.nounderline:hover {
  color: #3333EE !important;
  text-decoration: underline !important
}
div.dt-container div.dt-search input {
  margin: 0.5em;
}

div.dt-container div.dt-search {
  text-align: left !important;
}
.container {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}
.container > br
{
  width: 100%;
  content: '';
}
.text-secondary{
  color: #999999 !important;
}
.text-light{
  color: #CCCCCC !important;
}
.text-success{
  color: #22AA22 !important;
}

.bg-10 {
  background-color: darkcyan;
}
.bg-100 {
  background-color: olivedrab;
}
.bg-1000 {
  background-color: orange;
}
.bg-10000 {
  background-color: red;
}
.bg-100000 {
  background-color: darkred;
}
.bg-crit {
  background-color: black;
}

.lightpink {
  
}
.toprighticon {
  position: absolute;
  top: 4px;
  right: 4px;
}
.tdqm {
  position: relative;
}
.toprighticon:hover{
  color: #4466FF !important;
}

.tdqmdet td{
  background: none !important;
}

.navbar .megamenu{ padding: 1rem; }

@media all and (min-width: 992px) {
	
	 .has-megamenu{position:static!important;}
	 .megamenu{left:0; right:0; width:70%; margin-top:0;  }
	
}	
@media(max-width: 991px){
	.navbar.fixed-top .navbar-collapse, .navbar.sticky-top .navbar-collapse{
		overflow-y: auto;
	    max-height: 90vh;
	    margin-top:10px;
	}
}


/* This prevents bootstrap tooltip flickering */
.tooltip {
  pointer-events: none;
}

.progress .progress-bar {
  font-size: 12px;
  
}
.progress {
  font-family: Verdana;
  font-size: 0.6em;
  margin: 10px;
  font-weight: 400;
}

.toast-container {
  padding-top: 5rem !important;
  padding-left: 8rem !important;
}


.breathe {
    animation: breathesmall 3s linear 0s infinite;
}
.breathe-large {
    animation: breathelarge 2s linear 0s infinite;
}

@keyframes breathesmall {
  0% { transform: translate(-2px, 0px)  rotate(3deg) scale(1.1); }
  5% { transform: translate(2px, 0px) rotate(-3deg) scale(1.1); }
  10% { transform: translate(-2px, 0px) rotate(3deg) scale(1.1);}
  15% { transform: translate(2px, 0px) rotate(-3deg) scale(1.1); }
  20% { transform: rotate(0deg) scale(1); }
  100% { transform: rotate(0deg) scale(1); }
}

@keyframes breathelarge {
  0% { transform: translate(-1px, -2px) rotate(0deg) scale(1.1); }
  5% { transform: translate(2px, -3px) rotate(10deg) scale(1.6); }
  10% { transform: translate(-2px, 4px) rotate(-10deg) scale(1.6);}
  15% { transform: translate(2px, -3px) rotate(10deg) scale(1.2); }
  20% { transform: translate(0px, 0px) rotate(0deg) scale(1); }
  100% { transform: translate(0px, 0px) rotate(0deg) scale(1); }
}

.tableFixHead          { overflow: auto; height: 100px; }
.tableFixHead thead th { position: sticky; top: 0; z-index: 1; }

.popover{
    min-width: 460px !important;
}

.popover-body {
    max-height: 200px;
    overflow-y: auto;
}

.grayed-out, 
.grayed-out td {
    color: #a0a0a0 !important;
}
