/*Custom Preloader Cyberboss*/
/*******************************/
/*******************************/
/***************************************************
 * Generated by SVG Artista on 10/2/2024, 12:23:10 AM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/
svg.trademarkpreloader{
    display: inline-block;
    position: relative;
    width: 64px;
    position: absolute;
    top: calc(50% - 3.5px);
    left: 0;
    right: 0;
    margin: 0 auto;
}

@keyframes animate-svg-stroke-1 {
  0% {
    stroke-dashoffset: 100.04126739501953px;
    stroke-dasharray: 100.04126739501953px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 100.04126739501953px;
  }
}

.svg-cyberboss-1 {
  animation: animate-svg-stroke-1 1s infinite ease-out 0s both,
               animate-svg-fill-1 3s infinite ease-out 0.8s both;
}

@keyframes animate-svg-stroke-2 {
  0% {
    stroke-dashoffset: 9.957726001739502px;
    stroke-dasharray: 9.957726001739502px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.957726001739502px;
  }
}

@keyframes animate-svg-fill-2 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-2 {
  animation: animate-svg-stroke-2 1s infinite ease-out 0.12s both,
               animate-svg-fill-2 3s infinite ease-out 0.9s both;
}

@keyframes animate-svg-stroke-3 {
  0% {
    stroke-dashoffset: 9.954512598889355px;
    stroke-dasharray: 9.954512598889355px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.954512598889355px;
  }
}

.svg-cyberboss-3 {
  animation: animate-svg-stroke-3 1s infinite ease-out 0.24s both,
               animate-svg-fill-3 3s infinite ease-out 1s both;
}

@keyframes animate-svg-stroke-4 {
  0% {
    stroke-dashoffset: 9.959531784057617px;
    stroke-dasharray: 9.959531784057617px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.959531784057617px;
  }
}

@keyframes animate-svg-fill-4 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-4 {
  animation: animate-svg-stroke-4 1s infinite ease-out 0.36s both,
               animate-svg-fill-4 3s infinite ease-out 1.1s both;
}

@keyframes animate-svg-stroke-5 {
  0% {
    stroke-dashoffset: 9.954512598889355px;
    stroke-dasharray: 9.954512598889355px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.954512598889355px;
  }
}

.svg-cyberboss-5 {
  animation: animate-svg-stroke-5 1s infinite ease-out 0.48s both,
               animate-svg-fill-5 3s infinite ease-out 1.2000000000000002s both;
}

@keyframes animate-svg-stroke-6 {
  0% {
    stroke-dashoffset: 9.958662509918213px;
    stroke-dasharray: 9.958662509918213px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.958662509918213px;
  }
}

@keyframes animate-svg-fill-6 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(123, 72, 156);
  }
}

.svg-cyberboss-6 {
  animation: animate-svg-stroke-6 1s infinite ease-out 0.6s both,
               animate-svg-fill-6 3s infinite ease-out 1.3s both;
}

@keyframes animate-svg-stroke-7 {
  0% {
    stroke-dashoffset: 9.954512598889355px;
    stroke-dasharray: 9.954512598889355px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.954512598889355px;
  }
}

.svg-cyberboss-7 {
  animation: animate-svg-stroke-7 1s infinite ease-out 0.72s both,
               animate-svg-fill-7 3s infinite ease-out 1.4000000000000001s both;
}

@keyframes animate-svg-stroke-8 {
  0% {
    stroke-dashoffset: 9.957890510559082px;
    stroke-dasharray: 9.957890510559082px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.957890510559082px;
  }
}

@keyframes animate-svg-fill-8 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(123, 72, 156);
  }
}

.svg-cyberboss-8 {
  animation: animate-svg-stroke-8 1s infinite ease-out 0.84s both,
               animate-svg-fill-8 3s infinite ease-out 1.5s both;
}

@keyframes animate-svg-stroke-9 {
  0% {
    stroke-dashoffset: 9.954512598889355px;
    stroke-dasharray: 9.954512598889355px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.954512598889355px;
  }
}

.svg-cyberboss-9 {
  animation: animate-svg-stroke-9 1s infinite ease-out 0.96s both,
               animate-svg-fill-9 3s infinite ease-out 1.6s both;
}

@keyframes animate-svg-stroke-10 {
  0% {
    stroke-dashoffset: 48.29400634765625px;
    stroke-dasharray: 48.29400634765625px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 48.29400634765625px;
  }
}

.svg-cyberboss-10 {
  animation: animate-svg-stroke-10 1s infinite ease-out 1.08s both,
               animate-svg-fill-10 3s infinite ease-out 1.7000000000000002s both;
}

@keyframes animate-svg-stroke-11 {
  0% {
    stroke-dashoffset: 9.960865020751953px;
    stroke-dasharray: 9.960865020751953px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.960865020751953px;
  }
}

@keyframes animate-svg-fill-11 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(123, 72, 156);
  }
}

.svg-cyberboss-11 {
  animation: animate-svg-stroke-11 1s infinite ease-out 1.2s both,
               animate-svg-fill-11 3s infinite ease-out 1.8s both;
}

@keyframes animate-svg-stroke-12 {
  0% {
    stroke-dashoffset: 9.954512598889355px;
    stroke-dasharray: 9.954512598889355px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.954512598889355px;
  }
}

.svg-cyberboss-12 {
  animation: animate-svg-stroke-12 1s infinite ease-out 1.3199999999999998s both,
               animate-svg-fill-12 3s infinite ease-out 1.9000000000000001s both;
}

@keyframes animate-svg-stroke-13 {
  0% {
    stroke-dashoffset: 9.960394859313965px;
    stroke-dasharray: 9.960394859313965px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.960394859313965px;
  }
}

@keyframes animate-svg-fill-13 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(123, 72, 156);
  }
}

.svg-cyberboss-13 {
  animation: animate-svg-stroke-13 1s infinite ease-out 1.44s both,
               animate-svg-fill-13 3s infinite ease-out 2s both;
}

@keyframes animate-svg-stroke-14 {
  0% {
    stroke-dashoffset: 9.954512598889355px;
    stroke-dasharray: 9.954512598889355px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 9.954512598889355px;
  }
}

.svg-cyberboss-14 {
  animation: animate-svg-stroke-14 1s infinite ease-out 1.56s both,
               animate-svg-fill-14 3s infinite ease-out 2.1s both;
}

@keyframes animate-svg-stroke-15 {
  0% {
    stroke-dashoffset: 48.293155670166016px;
    stroke-dasharray: 48.293155670166016px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 48.293155670166016px;
  }
}

.svg-cyberboss-15 {
  animation: animate-svg-stroke-15 1s infinite ease-out 1.68s both,
               animate-svg-fill-15 3s infinite ease-out 2.2s both;
}

@keyframes animate-svg-stroke-16 {
  0% {
    stroke-dashoffset: 5.122391939163208px;
    stroke-dasharray: 5.122391939163208px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 5.122391939163208px;
  }
}

@keyframes animate-svg-fill-16 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-16 {
  animation: animate-svg-stroke-16 1s infinite ease-out 1.7999999999999998s both,
               animate-svg-fill-16 3s infinite ease-out 2.3s both;
}

@keyframes animate-svg-stroke-17 {
  0% {
    stroke-dashoffset: 26.634151458740234px;
    stroke-dasharray: 26.634151458740234px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 26.634151458740234px;
  }
}

@keyframes animate-svg-fill-17 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-17 {
  animation: animate-svg-stroke-17 1s infinite ease-out 1.92s both,
               animate-svg-fill-17 3s infinite ease-out 2.4000000000000004s both;
}

@keyframes animate-svg-stroke-18 {
  0% {
    stroke-dashoffset: 24.74384880065918px;
    stroke-dasharray: 24.74384880065918px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 24.74384880065918px;
  }
}

@keyframes animate-svg-fill-18 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-18 {
  animation: animate-svg-stroke-18 1s infinite ease-out 2.04s both,
               animate-svg-fill-18 3s infinite ease-out 2.5s both;
}

@keyframes animate-svg-stroke-19 {
  0% {
    stroke-dashoffset: 24.292028427124023px;
    stroke-dasharray: 24.292028427124023px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 24.292028427124023px;
  }
}

@keyframes animate-svg-fill-19 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-19 {
  animation: animate-svg-stroke-19 1s infinite ease-out 2.16s both,
               animate-svg-fill-19 3s infinite ease-out 2.6s both;
}

@keyframes animate-svg-stroke-20 {
  0% {
    stroke-dashoffset: 22.629404067993164px;
    stroke-dasharray: 22.629404067993164px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 22.629404067993164px;
  }
}

@keyframes animate-svg-fill-20 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-20 {
  animation: animate-svg-stroke-20 1s infinite ease-out 2.28s both,
               animate-svg-fill-20 3s infinite ease-out 2.7s both;
}

@keyframes animate-svg-stroke-21 {
  0% {
    stroke-dashoffset: 20.087825775146484px;
    stroke-dasharray: 20.087825775146484px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 20.087825775146484px;
  }
}

@keyframes animate-svg-fill-21 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-21 {
  animation: animate-svg-stroke-21 1s infinite ease-out 2.4s both,
               animate-svg-fill-21 3s infinite ease-out 2.8s both;
}

@keyframes animate-svg-stroke-22 {
  0% {
    stroke-dashoffset: 17.108030319213867px;
    stroke-dasharray: 17.108030319213867px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 17.108030319213867px;
  }
}

@keyframes animate-svg-fill-22 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-22 {
  animation: animate-svg-stroke-22 1s infinite ease-out 2.52s both,
               animate-svg-fill-22 3s infinite ease-out 2.9000000000000004s both;
}

@keyframes animate-svg-stroke-23 {
  0% {
    stroke-dashoffset: 17.068272590637207px;
    stroke-dasharray: 17.068272590637207px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 17.068272590637207px;
  }
}

@keyframes animate-svg-fill-23 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-23 {
  animation: animate-svg-stroke-23 1s infinite ease-out 2.6399999999999997s both,
               animate-svg-fill-23 3s infinite ease-out 3s both;
}

@keyframes animate-svg-stroke-24 {
  0% {
    stroke-dashoffset: 15.829727172851562px;
    stroke-dasharray: 15.829727172851562px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 15.829727172851562px;
  }
}

@keyframes animate-svg-fill-24 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-24 {
  animation: animate-svg-stroke-24 1s infinite ease-out 2.76s both,
               animate-svg-fill-24 3s infinite ease-out 3.1000000000000005s both;
}

@keyframes animate-svg-stroke-25 {
  0% {
    stroke-dashoffset: 15.285787582397461px;
    stroke-dasharray: 15.285787582397461px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 15.285787582397461px;
  }
}

@keyframes animate-svg-fill-25 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-25 {
  animation: animate-svg-stroke-25 1s infinite ease-out 2.88s both,
               animate-svg-fill-25 3s infinite ease-out 3.2s both;
}

@keyframes animate-svg-stroke-26 {
  0% {
    stroke-dashoffset: 14.788299560546875px;
    stroke-dasharray: 14.788299560546875px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 14.788299560546875px;
  }
}

@keyframes animate-svg-fill-26 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-26 {
  animation: animate-svg-stroke-26 1s infinite ease-out 3s both,
               animate-svg-fill-26 3s infinite ease-out 3.3s both;
}

@keyframes animate-svg-stroke-27 {
  0% {
    stroke-dashoffset: 14.306857109069824px;
    stroke-dasharray: 14.306857109069824px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 14.306857109069824px;
  }
}

@keyframes animate-svg-fill-27 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-27 {
  animation: animate-svg-stroke-27 1s infinite ease-out 3.12s both,
               animate-svg-fill-27 3s infinite ease-out 3.4000000000000004s both;
}

@keyframes animate-svg-stroke-28 {
  0% {
    stroke-dashoffset: 12.439099311828613px;
    stroke-dasharray: 12.439099311828613px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 12.439099311828613px;
  }
}

@keyframes animate-svg-fill-28 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-28 {
  animation: animate-svg-stroke-28 1s infinite ease-out 3.2399999999999998s both,
               animate-svg-fill-28 3s infinite ease-out 3.5s both;
}

@keyframes animate-svg-stroke-29 {
  0% {
    stroke-dashoffset: 10.392730712890625px;
    stroke-dasharray: 10.392730712890625px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 10.392730712890625px;
  }
}

@keyframes animate-svg-fill-29 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-29 {
  animation: animate-svg-stroke-29 1s infinite ease-out 3.36s both,
               animate-svg-fill-29 3s infinite ease-out 3.6000000000000005s both;
}

@keyframes animate-svg-stroke-30 {
  0% {
    stroke-dashoffset: 8.574223041534424px;
    stroke-dasharray: 8.574223041534424px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 8.574223041534424px;
  }
}

@keyframes animate-svg-fill-30 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-30 {
  animation: animate-svg-stroke-30 1s infinite ease-out 3.48s both,
               animate-svg-fill-30 3s infinite ease-out 3.7s both;
}

@keyframes animate-svg-stroke-31 {
  0% {
    stroke-dashoffset: 7.874504566192627px;
    stroke-dasharray: 7.874504566192627px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 7.874504566192627px;
  }
}

@keyframes animate-svg-fill-31 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-31 {
  animation: animate-svg-stroke-31 1s infinite ease-out 3.5999999999999996s both,
               animate-svg-fill-31 3s infinite ease-out 3.8s both;
}

@keyframes animate-svg-stroke-32 {
  0% {
    stroke-dashoffset: 6.515213966369629px;
    stroke-dasharray: 6.515213966369629px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 6.515213966369629px;
  }
}

@keyframes animate-svg-fill-32 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-32 {
  animation: animate-svg-stroke-32 1s infinite ease-out 3.7199999999999998s both,
               animate-svg-fill-32 3s infinite ease-out 3.9000000000000004s both;
}

@keyframes animate-svg-stroke-33 {
  0% {
    stroke-dashoffset: 6.483058929443359px;
    stroke-dasharray: 6.483058929443359px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 6.483058929443359px;
  }
}

@keyframes animate-svg-fill-33 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-33 {
  animation: animate-svg-stroke-33 1s infinite ease-out 3.84s both,
               animate-svg-fill-33 3s infinite ease-out 4s both;
}

@keyframes animate-svg-stroke-34 {
  0% {
    stroke-dashoffset: 6.126688003540039px;
    stroke-dasharray: 6.126688003540039px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 6.126688003540039px;
  }
}

@keyframes animate-svg-fill-34 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-34 {
  animation: animate-svg-stroke-34 1s infinite ease-out 3.96s both,
               animate-svg-fill-34 3s infinite ease-out 4.1000000000000005s both;
}

@keyframes animate-svg-stroke-35 {
  0% {
    stroke-dashoffset: 5.453184604644775px;
    stroke-dasharray: 5.453184604644775px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 5.453184604644775px;
  }
}

@keyframes animate-svg-fill-35 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(29, 29, 27);
  }
}

.svg-cyberboss-35 {
  animation: animate-svg-stroke-35 1s infinite ease-out 4.08s both,
               animate-svg-fill-35 3s infinite ease-out 4.2s both;
}