@charset "UTF-8";

:root {
  --duration: 1.5s;
  --container-size: 250px;
  --box-size: 33px;
  --box-border-radius: 15%;
}




body {
    background: #fff;
}

.newloadcontainer {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
}

.loader {
    width: 150px;
    height: 150px;
    line-height: 150px;
    margin: 100px auto;
    position: relative;
    box-sizing: border-box;
    text-align: center;
    z-index: 0;
    text-transform: uppercase;
    font-family: sans-serif;
    font-size: 14px;
    color: #1D8FE1;
}

    .loader:before,
    .loader:after {
        opacity: 0;
        box-sizing: border-box;
        content: "\0020";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 100px;
        border: 1px solid #1D8FE1;
        box-shadow: 0 0 50px #22E1FF, inset 0 0 50px #1D8FE1;
    }

    .loader:after {
        z-index: 1;
        -webkit-animation: gogoloader 1.5s infinite 1s;
    }

    .loader:before {
        z-index: 2;
        -webkit-animation: gogoloader 1.5s infinite;
    }



.loader2 {
  width: 150px;
  height: 150px;
  line-height: 150px;
  margin: 100px auto;
  position: relative;
  box-sizing: border-box;
  text-align: center;
  z-index: 0;
  text-transform: uppercase;
  font-family: sans-serif;
  font-size: 14px;
  color: #1D8FE1;
}

  .loader2:before,
  .loader2:after {
    opacity: 0;
    box-sizing: border-box;
    content: "\0020";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 100px;
    border: 1px solid #DA3512;
    box-shadow: 0 0 50px #22E1FF, inset 0 0 50px #1D8FE1;
  }

  .loader2:after {
    z-index: 1;
    -webkit-animation: gogoloader 1.5s infinite 1s;
  }

  .loader2:before {
    z-index: 2;
    -webkit-animation: gogoloader 1.5s infinite;
  }







.loader3 {
  width: 150px;
  height: 150px;
  line-height: 150px;
  margin: 100px auto;
  position: relative;
  box-sizing: border-box;
  text-align: center;
  z-index: 0;
  text-transform: uppercase;
  font-family: sans-serif;
  font-size: 14px;
  color: #F5E00A;
}

  .loader3:before,
  .loader3:after {
    opacity: 0;
    box-sizing: border-box;
    content: "\0020";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 100px;
    border: 1px solid #1D8FE1;
    box-shadow: 0 0 50px #22E1FF, inset 0 0 50px #1D8FE1;
  }

  .loader3:after {
    z-index: 1;
    -webkit-animation: gogoloader 1.5s infinite 1s;
  }

  .loader3:before {
    z-index: 2;
    -webkit-animation: gogoloader 1.5s infinite;
  }







@-webkit-keyframes gogoloader {
    0% {
        -webkit-transform: scale(0);
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(1.5);
        opacity: 0;
    }
}






.greentored {
  background: linear-gradient(to right, green, red);
}

.yellowtored {
  background: linear-gradient(to right, yellow, red);
}

.blacktext {
  color: black !important;
}

.redtext {
  color: red !important;
}

.greentext {
  color: green !important;
}

.cred {
  color: red;
}

.cgreen {
  color: green;
}

.cyellow {
  color: goldenrod;
}

.corange {
  color: darkorange;
}




.min_div_size_1000 {
  min-height: 1000px
}

.expanded_1000 {
  max-width: 1000px !important;
}



.btn {
  text-transform: unset !important;
}



.ShowCursor {
  cursor: pointer;
}










.dataTables_info {
  color: red !important;
}

.paginate_button .page-link {
  color: red !important;
}











.jumpingloadcontainer {
  width: var(--container-size);
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  top: 50%;
  margin: 0 auto;
  display: flex;
}

.📦 {
  width: var(--box-size);
  height: var(--box-size);
  position: relative;
  display: block;
  transform-origin: -50% center;
  border-radius: var(--box-border-radius);
}

  .📦:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-color: lightblue;
    border-radius: var(--box-border-radius);
    box-shadow: 0px 0px 10px 0px rgba(28, 159, 255, 0.4);
  }

  .📦:nth-child(1) {
    animation: slide var(--duration) ease-in-out infinite alternate;
  }

    .📦:nth-child(1):after {
      animation: color-change var(--duration) ease-in-out infinite alternate;
    }

  .📦:nth-child(2) {
    animation: flip-1 var(--duration) ease-in-out infinite alternate;
  }

    .📦:nth-child(2):after {
      animation: squidge-1 var(--duration) ease-in-out infinite alternate;
    }

  .📦:nth-child(3) {
    animation: flip-2 var(--duration) ease-in-out infinite alternate;
  }

    .📦:nth-child(3):after {
      animation: squidge-2 var(--duration) ease-in-out infinite alternate;
    }

  .📦:nth-child(4) {
    animation: flip-3 var(--duration) ease-in-out infinite alternate;
  }

    .📦:nth-child(4):after {
      animation: squidge-3 var(--duration) ease-in-out infinite alternate;
    }

  .📦:nth-child(5) {
    animation: flip-4 var(--duration) ease-in-out infinite alternate;
  }

    .📦:nth-child(5):after {
      animation: squidge-4 var(--duration) ease-in-out infinite alternate;
    }

  .📦:nth-child(2):after {
    background-color: #1c9fff;
  }

  .📦:nth-child(3):after {
    background-color: #1fb1fd;
  }

  .📦:nth-child(4):after {
    background-color: #22c7fb;
  }

  .📦:nth-child(5):after {
    background-color: #23d3fb;
  }

@keyframes slide {
  0% {
    background-color: #1795ff;
    transform: translatex(0vw);
  }

  100% {
    background-color: #23d3fb;
    transform: translatex( calc(var(--container-size) - (var(--box-size) * 1.25)) );
  }
}

@keyframes color-change {
  0% {
    background-color: #1795ff;
  }

  100% {
    background-color: #23d3fb;
  }
}

@keyframes flip-1 {
  0%, 15% {
    transform: rotate(0);
  }

  35%, 100% {
    transform: rotate(-180deg);
  }
}

@keyframes squidge-1 {
  5% {
    transform-origin: center bottom;
    transform: scalex(1) scaley(1);
  }

  15% {
    transform-origin: center bottom;
    transform: scalex(1.3) scaley(0.7);
  }

  25%, 20% {
    transform-origin: center bottom;
    transform: scalex(0.8) scaley(1.4);
  }

  55%, 100% {
    transform-origin: center top;
    transform: scalex(1) scaley(1);
  }

  40% {
    transform-origin: center top;
    transform: scalex(1.3) scaley(0.7);
  }
}

@keyframes flip-2 {
  0%, 30% {
    transform: rotate(0);
  }

  50%, 100% {
    transform: rotate(-180deg);
  }
}

@keyframes squidge-2 {
  20% {
    transform-origin: center bottom;
    transform: scalex(1) scaley(1);
  }

  30% {
    transform-origin: center bottom;
    transform: scalex(1.3) scaley(0.7);
  }

  40%, 35% {
    transform-origin: center bottom;
    transform: scalex(0.8) scaley(1.4);
  }

  70%, 100% {
    transform-origin: center top;
    transform: scalex(1) scaley(1);
  }

  55% {
    transform-origin: center top;
    transform: scalex(1.3) scaley(0.7);
  }
}

@keyframes flip-3 {
  0%, 45% {
    transform: rotate(0);
  }

  65%, 100% {
    transform: rotate(-180deg);
  }
}

@keyframes squidge-3 {
  35% {
    transform-origin: center bottom;
    transform: scalex(1) scaley(1);
  }

  45% {
    transform-origin: center bottom;
    transform: scalex(1.3) scaley(0.7);
  }

  55%, 50% {
    transform-origin: center bottom;
    transform: scalex(0.8) scaley(1.4);
  }

  85%, 100% {
    transform-origin: center top;
    transform: scalex(1) scaley(1);
  }

  70% {
    transform-origin: center top;
    transform: scalex(1.3) scaley(0.7);
  }
}

@keyframes flip-4 {
  0%, 60% {
    transform: rotate(0);
  }

  80%, 100% {
    transform: rotate(-180deg);
  }
}

@keyframes squidge-4 {
  50% {
    transform-origin: center bottom;
    transform: scalex(1) scaley(1);
  }

  60% {
    transform-origin: center bottom;
    transform: scalex(1.3) scaley(0.7);
  }

  70%, 65% {
    transform-origin: center bottom;
    transform: scalex(0.8) scaley(1.4);
  }

  100%, 100% {
    transform-origin: center top;
    transform: scalex(1) scaley(1);
  }

  85% {
    transform-origin: center top;
    transform: scalex(1.3) scaley(0.7);
  }
}














.stamp {
  color: #555;
  font-size: 3rem;
  font-weight: 700;
  border: 0.25rem solid #555;
  display: inline-block;
  padding: 0.25rem 1rem;
  text-transform: uppercase;
  border-radius: 1rem;
  font-family: 'Courier';
  -webkit-mask-image: url(../Images/grunge.png);
  -webkit-mask-size: 944px 604px;
  mix-blend-mode: multiply;
}

.rejected-stamp {
  color: #D23;
  border: 0.5rem double #D23;
  transform: rotate(-10deg);
  -webkit-mask-position: 2rem 3rem;
  font-size: 4rem;
}

.approved-stamp {
  color: #0A9928;
  border: 0.5rem double #0A9928;
  transform: rotate(-10deg);
  -webkit-mask-position: 2rem 3rem;
  font-size: 4rem;
}

.draft-stamp {
  color: #C4C4C4;
  border: 0.5rem double #C4C4C4;
  transform: rotate(-10deg);
  -webkit-mask-position: 2rem 3rem;
  font-size: 4rem;
}






.circle_photo_bordered {
  height: 45px;
  width: 45px;
  border-radius: 100%;
  border-style: solid;
  border-width: medium;
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  cursor: none;
  background-size: cover;
  Text-align: center;
  vertical-align: middle;
  margin: auto;
}

.border_warning {
  border-color: #E4A11B;
}

.border_success {
  border-color: #14A44D;
}

.border_danger {
  border-color: #DC4C64;
}

.border_dark {
  border-color: #332D2D;
}




.select-dropdown{
  max-height:1000px !important;
}




.lds-dual-ring {
  display: inline-block;
  width: 80px;
  height: 80px;
  margin-top:20%;
}

  .lds-dual-ring:after {
    content: " ";
    display: block;
    width: 64px;
    height: 64px;
    margin: 8px;
    border-radius: 50%;
    border: 6px solid #090979;
    border-color: #090979 transparent #090979 transparent;
    animation: lds-dual-ring 1.2s linear infinite;
  }

@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }

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