.ci_menuCard {
   padding: 25px 10px;
   margin-bottom: 15px;
   background: #f5f5f5;
   user-select: none;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   border: 0px;
   color: #337ab7;
   text-align: center;
   border-radius: 4px;
}
.ci_menuCard:hover {
   background: #eee;
   color: #23527c;
   }
.ci_menuCard i {
   color: #bbb;
   display: block;
   text-align: center;
   margin-bottom: 5px;
}
.ci_menuBadge {
   position: absolute;
   top: 10px;
   right: 17px;
   display: inline;
   padding: .2em .6em .3em;
   /* font-size: 75%; */
   font-size: 100%;
   font-weight: 700;
   line-height: 1;
   color: #fff;
   /* background-color: #5bc0de; */
   text-align: center;
   white-space: nowrap;
   vertical-align: baseline;
   border-radius: .25em;
   font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; /* replace bootstrap 4's font choice */ 
}
.row {
   margin-left: -9px;
   margin-right: -9px;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
   padding-left: 9px;
   padding-right: 9px;
}
.container-fluid {
   padding-left: 20px;
   padding-right: 20px;
}
html {
   font-size:14px; /* reduce bootstrap 4's default size */
}

/* change background of highlighted row in Datatables  */
.even.selected td {
   background-color: rgb(91,192,222); !important; /* Add !important to make sure override datables base styles */
}

.odd.selected td {
   background-color: rgb(91,192,222); !important; /* Add !important to make sure override datables base styles */
}

/* change background of scrollbody (drawn by scroller extension of datatables) */
div.DTS div.dataTables_scrollBody {
   /* background: repeating-linear-gradient(45deg, #edeeff, #edeeff 10px, white 10px, white 20px); */
   background:0;
}
/* splashlist table hover */
.splashTable {
   
}
.splashTable tr:hover {
   background-color:lightblue;
}
/* these apply to big screens */
@media only screen and (min-width: 769px) {
   .notPhonePaddingLeft30 {
      padding-left: 30px;
   }
   .notPhonePaddingRight30 {
      padding-right: 30px;
   }
   .onlyPhoneDisplay {
      display:none;
   }
   .notPhoneDisplay {
   }
}
/* these apply to phones */
@media only screen and (max-width: 768px) {
   .notPhonePaddingLeft30 {
   }
   .notPhonePaddingRight30 {
   }
   .notPhoneHeight30 {
   }
   .onlyPhoneDisplay {
   }
   .notPhoneDisplay {
      display:none;
   }
   /* make scrollbars permanent on phone */
   ::-webkit-scrollbar {
      -webkit-appearance:none;
      width: 8px;
   }
   ::-webkit-scrollbar-thumb {
         border-radius: 4px;
      background-color: rgba(0,0,0,.5);
      /* background-color: rgba(255,0,0,1); */
      box-shadow: 0 0 1px rgba(255,255,255,.5);
   }
   /* momentum scrolling on phone */
   div {
      -webkit-overflow-scrolling: touch;
   }
}
 
 /* progress spinner */
.lds-ring {
   display: inline-block;
   position: relative;
   width: 64px;
   height: 64px;
}
.lds-ring div {
   box-sizing: border-box;
   display: block;
   position: absolute;
   width: 51px;
   height: 51px;
   margin: 6px;
   border: 6px solid #fff;
   border-radius: 50%;
   animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
   border-color: #fff transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
   animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
   animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
   animation-delay: -0.15s;
}
@keyframes lds-ring {
   0% {
      transform: rotate(0deg);
   }
   100% {
      transform: rotate(360deg);
   }
}
 


 /* small progress spinner */
.lds-ring-small {
   display: inline-block;
   position: relative;
   width: 20px;
   height: 20px;
}
.lds-ring-small div {
   box-sizing: border-box;
   display: block;
   position: absolute;
   width: 20px;
   height: 20px;
   margin: 0px;
   border: 3px solid #fff;
   border-radius: 50%;
   animation: lds-ring-small 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
   border-color: #999 transparent transparent transparent;
}
.lds-ring-small div:nth-child(1) {
   animation-delay: -0.45s;
}
.lds-ring-small div:nth-child(2) {
   animation-delay: -0.3s;
}
.lds-ring-small div:nth-child(3) {
   animation-delay: -0.15s;
}
@keyframes lds-ring-small {
   0% {
      transform: rotate(0deg);
   }
   100% {
      transform: rotate(360deg);
   }
}

/* ungrid.css */
/* @media (min-width: 30em) { */
/*     .row { width: 100%; display: table; table-layout: fixed; } */
/*     .col { display: table-cell; } */
/* } */

/* adapted ungrid.css */
/* ------------------ */
/* desktop size screens */
/* @media only screen and (min-width: 769px) { */
@media (min-width: 769px) {
   .urow { width: 100%; display: table; table-layout: fixed;border-collapse:separate;
   /* border:1px solid black; */
   }
   .ucol { display: table-cell;
   /* border:1px solid black;  */
   }
}
/* less than screen break -m (mobile) */
/* @media only screen and (max-width: 768px) { */
@media (max-width: 768px) {
   .urow-m { width: 100%; display: table; table-layout: fixed;border-collapse:separate; }
   .ucol-m { display: table-cell;
   /* border:1px solid black;  */
   }
}
/* without screen breaks -a (all) */
/* @media only screen and (min-width: 0px) { */
@media (min-width: 0px) {
   .urow-a { width: 100%; display: table; table-layout: fixed;border-collapse:separate;
   /* border:1px solid black; */
   }
   .ucol-a { display: table-cell;
   /* border:3px dotted red;  */
   }
}
/* .xa { */
/*    border:3px dotted red;  */
/* } */
/* .xb { */
/*    border:3px dotted green;  */
/* } */
/* .xc { */
/*    border:3px dotted blue;  */
/* } */
/* .xd { */
/*    border:3px dotted orange;  */
/* } */
/* .xe { */
/*    border:3px dotted purple;  */
/* } */
/* .xf { */
/*    border:3px dotted cyan;  */
/* } */
/* cut off at width, showing ellipses */
.ulip {
   white-space:nowrap;
   overflow:hidden;
   text-overflow:ellipsis;
}
/* cut off at width */
.ucut {
   white-space:nowrap;
   overflow:hidden;
}
/* cut off after two lines, showing ellipses */
.ulip2lines {
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
}

/* rounded table and panel table */
.ci_table {
   overflow-y:overlay;
   user-select:none;
   overflow-x:auto;
   border-color: rgb(208, 208, 208);
   border-style:solid;
}

.ci_roundedtable {
   border-width:1px;
   border-radius:2%;
}

.ci_paneltable {
   border-width:0px;
   border-radius:0%;
}

.ci_table table {
   width:100%;
   table-layout:fixed;
   /* border-collapse: separate; */
   border-spacing:0px;
}

/* ci_table made up of .urow's */
.ci_table table > .urow {
   border-top:1px solid rgb(208, 208, 208);
}
.ci_roundedtable table .urow:first-child {
   border-top:0px;
}
.ci_paneltable table .urow:first-child {
   border-top:1px;
}
.ci_table table > .urow:nth-child(odd) {
   background-color: #f9f9f9
}
.ci_table table .tablerow.selected {
   background-color: rgb(91,192,222); 
}

table>div.tablerow {
   border:1px dotted red;
}

/* makes printing better */
body {
  -webkit-print-color-adjust: exact !important;
  color-adjust:exact !important;
}

@media print{
   .noprint, .noprint * {
       display:none;
   }
}

/* Extra small devices Phones (< 768px),
 * Small devices Tablets (≥768px),
 * Medium devices Desktops (≥992px),
 * Large devices Desktops (≥1200px).
*/


/* fade-in animation */

.fade-in {
  animation: fadeIn ease 1s;
  -webkit-animation: fadeIn ease 1s;
  -moz-animation: fadeIn ease 1s;
  -o-animation: fadeIn ease 1s;
  -ms-animation: fadeIn ease 1s;
}
@keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
@-moz-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
@-o-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
@-ms-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
   }    
}

/* fade-in2 */

.fade-in2 {
  animation: fadeIn2 2s ease-in-out forwards;
}
@keyframes fadeIn2 {
  0% {
     opacity:0.2;
  }
  100% {
     opacity:1;
  }
}


/* scrollbar changes - transparent bar, show thumb*/

#scrollingcontainer {
    overflow: auto; /* Ensure scrollbar appears when needed */
}

#scrollingcontainer::-webkit-scrollbar {
    background: transparent !important;
    width: 9px !important;
}

#scrollingcontainer::-webkit-scrollbar-track {
    background: transparent !important;
}

#scrollingcontainer::-webkit-scrollbar-thumb {
    background: rgb(43, 218, 218) !important;
    border-radius: 5px !important;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5) !important;
}


/* pulse animation for #recordlight */
@keyframes pulse {
   0% {
     opacity: 1;
     transform: scale(1);
   }
   
   50% {
     opacity: 1;
     transform: scale(0.75);
   }
   
   100% {
     opacity: 1;
     transform: scale(1);
   }
}

/* blinking text */
.blink {
  animation: blinker 0.8s step-start infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

/* animated checkmark */

.checkmark-wrapper {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color:#eee;
}

.animated-check {
    height: 29px;
    width: 29px;
}

.animated-check path {
    fill: none;
    stroke: #7ac142;
    stroke-width: 4;
    stroke-dasharray: 23;
    stroke-dashoffset: 23;
    animation: draw 0.7s linear forwards;
    stroke-linecap: round;
    stroke-linejoin: round
}

@keyframes draw {
    to {
        stroke-dashoffset: 0
    }
}

/* fix bootstrap on chrome */
.btn:focus,
.btn:active:focus,
.btn.active:focus {
    outline: none;
    box-shadow: none;
}
/* .btn:active, */
/* .btn.active { */
/*     border: none; */
/*     box-shadow: none; */
/* } */
