table.dataTable tbody tr:hover {
    background-color: #ffa;
  }

table.dataTable tbody tr:hover > .sorting_1 {
  background-color: #ffa;
}

img.logo-xxl {
  width: auto;
  height: 190px;
}

img.logo-xl {
  width: auto;
  height: 175px;
}

img.logo-lg {
  width: auto;
  height: 120px;
}

img.logo-md {
  width: auto;
  height: 80px;
}

.logo-sm {
  width: auto;
  height: 40px;
}

.logo-xs {
    width: auto;
    height: 30px;
}

.logo-xxs {
  width: auto;
  height: 25px;
}

table {
  font-size: 14px;
}

.fa-stack.qicon.xxs {
  font-size: 0.2em;
}
.fa-stack.qicon.xs {
  font-size: 0.25em;
}
.fa-stack.qicon.sm {
  font-size: 0.30em;
}
.fa-stack.qicon.md {
  font-size: 0.35em;
}
.fa-stack.qicon.lg {
  font-size: 0.4em;
}
.fa-stack.qicon.xl {
  font-size: 0.45em;
}
.fa-stack.qicon.xxl {
  font-size: 0.5em;
}
.fa-stack.qicon.xxxl {
  font-size: 0.6em;
}


i.qicon {
  vertical-align: middle;
}
a.qicon {
  color: inherit;
}
a.lockicon {
  color: inherit;
}

div.dt-buttons>.dt-button.filter-active {
  background-color: lightblue;
}

div.dt-buttons>.dt-button.filter-active {
  background-color: lightblue;
}
div.dt-buttons>.dt-button.filter-active:hover:not(.disabled) {
  background-color: lightblue;
}

div.dt-buttons>.dt-button.advanced-active {
  background-color: lightblue;
}
div.dt-buttons>.dt-button.advanced-active:hover:not(.disabled) {
  background-color: lightblue;
}

div.dt-processing > div {
  display: none;
}

/* https://stackoverflow.com/questions/7273927/image-greyscale-with-css-re-color-on-mouse-over */
img.grayscale {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

/*undo grayscale on button above it hover (not image hover) */
button:hover img.grayscale {
  filter: none;
  -webkit-filter: none;
}

.btn-img-selected {
  border-color: green;
  border-width: 2px;
}

.btn-img-selected:hover {
  border-color: rgba(0, 128, 0, 0.8);
  border-width: 2px;
}

.btn-img-unselected {
  border-color: lightgrey;
  border-width: 2px;
}

.btn-img-unselected:hover {
  border-color: green;
  border-width: 2px;
}

/*https://stackoverflow.com/questions/14859322/css3-spin-animation */
@-moz-keyframes spin {
  from { -moz-transform: rotate(0deg); }
  to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  from { -webkit-transform: rotate(0deg); }
  to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
  from {transform:rotate(0deg);}
  to {transform:rotate(360deg);}
}
.spin {
  animation: spin 1000ms linear infinite;
}
.uppercase {
  text-transform: uppercase;
}