body {
  margin: 0;
  padding: 0;
}
#splash-screen {
  position: absolute;
  z-index: 1000;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: #f2f3f8;
}

#splash-screen img {
  margin-left: calc(100vw - 100%);
  margin-bottom: 30px;
}

#splash-screen.hidden {
  opacity: 0;
  visibility: hidden;
}

.splash-spinner {
  animation: rotate 2s linear infinite;
  margin-left: calc(100vw - 100%);
  width: 50px;
  height: 50px;
}

.colorbox-yellow {
  width:20px;
  height:20px;
  border:1px solid #000;
  background:rgba(255, 206, 86, 1);
  margin-bottom: 10px;
}
.colorbox-pink {
  width:20px;
  height:20px;
  border:1px solid #000;
  background:rgba(255, 99, 132, 1);
  margin-bottom: 10px;
}
.colorbox-blue {
  width:20px;
  height:20px;
  border:1px solid #000;
  background:rgba(54, 162, 235, 1);
  margin-bottom: 10px;
}

.colorbox-cyan {
  width:20px;
  height:20px;
  border:1px solid #000;
  background:rgba(75, 192, 192, 1);
  margin-bottom: 10px;
}

.colorbox-red {
  width:20px;
  height:20px;
  border:1px solid #000;
  background:rgba(192, 42, 75,1);
  margin-bottom: 10px;
}
.colorbox-purple {
  width:20px;
  height:20px;
  border:1px solid #000;
  background:rgba(153, 102, 255, 1);
  margin-bottom: 10px;
}
.colorbox-orange {
  width:20px;
  height:20px;
  border:1px solid #000;
  background:rgba(255, 159, 64, 1);
  margin-bottom: 10px;
}
.colorbox-green {
  width:20px;
  height:20px;
  border:1px solid #000;
  background:rgba(42, 192, 122,1);
  margin-bottom: 10px;
}

.spacer-class
{
    font-size: 0; 
    height: 30px;
    line-height: 0;
}

.spacer-columns
{
    font-size: 0; 
    height: 10px;
    line-height: 0;
}

.splash-spinner .path {
  stroke: #9b111e;
  stroke-linecap: round;
  animation: dash 1.5s ease-in-out infinite;
}

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

@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}