@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
}

html {
    scroll-behavior: smooth;
}

li {
    list-style-type: none; 
}

p {
    line-height: 1.5;
    font-size: 16px; 
}

a {
    text-decoration: none;
}

button {
    cursor: pointer;
}

section {
    background-color: slategrey; 
    transition: all 300ms ease;
}

input, textarea {
    width: 100%;
    background-color: #242424;
    color: #fff;
    outline: none;
    border: 3px solid #c0c4cc;
    border-top: none;
    border-left: none;
    border-right: none;
    height: 40px; 
    transition: all 300ms ease; 
}

textarea {
    resize: vertical;
    height: 100px; 
    margin-top: 8px;
}

label {
    font-size: 14px;
    font-weight: bold; 
}

input:hover, textarea:hover {
    border-color: #dcdfe6;
}

input:focus, textarea:focus {
    border-color: #f06449;
}

.container {
    padding: 150px 0;
    width: 100%;
}

.row {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 12px; 
}

.click {
    cursor: pointer; 
    transition: all 300ms ease;
}

.dark-theme .click {
    color: #fff;
}

.click:hover {
    transform: scale(1.1);
}

.click:active {
    transform: scale(0.8);
}

.title {
    font-size: 80px;
    margin-bottom: 12px;
    text-align: left;
    line-height: 1;
    color:slategrey;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8); 
}

.bold-white-text {
    color: #fff !important;

}

.link__hover-effect {
    position: relative;
}

.link__hover-effect:after {
    content: "";
    position: absolute;
    bottom: -3px;
    height: 3px;
    width: 0;
    right: 0;
    background-color: #000;
    transition: all 300ms ease; 
}

.link__hover-effect--white:after {
    background-color: #fff;
}

.link__hover-effect--black:after {
    background-color: #000; 
}

.link__hover-effect:hover:after {
    left: 0;
    width: 100%;
}

nav,
.scroll,
.header {
    opacity: 1;
    visibility: visible;
    transition: all 600ms 400ms; 
}

.modal--open nav,
.modal--open .scroll,
.modal--open .header {
    opacity: 0;
    visibility: hidden; 
    transition: all 400ms;  
}

.dark-theme .title,
.dark-theme .section__title,
.dark-theme .section__sub-title,
.dark-theme .nav__link--anchor,
.dark-theme .fa-solid .fa-circle-half-stroke {
    color: #fff; 
}

.dark-theme .title,
.dark-theme .header__para {
    color: #242424; 
}

.dark-theme section {
    background-color: #242424;
}

.dark-theme .scroll__icon {
    background-color: #fff;
}

.dark-theme .scroll__icon:after,
.dark-theme .link__hover-effect--black:after {
    background-color: #fff;
}

.dark-theme .link__hover-effect--white:after {
    background-color: #fff; 
}

.dark-theme .mail__btn {
    background-color: #fff;
    color: #242424;
}

:root {
  --logo-bg: #708090;   /* slate gray */
  --logo-ink: #000000;  /* letters and shapes */
}

.dark-theme {
  --logo-bg: #242424;   /* keep slate, or darken it (e.g. #2f3a44) */
  --logo-ink: #ffffff;
}

.dark-theme .slategrey-text {
  color: slategrey;
}

.logo-bg { 
  fill: var(--logo-bg); 
}

.logo path {
  fill: var(--logo-ink);
}

.logo path[stroke] {
  stroke: var(--logo-ink);
}

.logo--footer {
  --logo-bg: #242424;
  --logo-ink: #ffffff;
}

#personal-logo path {
  fill: var(--logo-ink);
  stroke: var(--logo-ink);
}

/*=========== ↓ Landing Page ↓ ===========*/ 

#svglogoanimation {
    position: fixed; 
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff; 
    z-index: 2000;
    width: 100%;
    transition: opacity 3s ease;
    pointer-events: none;
    opacity: 1;
}

#svglogoanimation svg {
    width: 100%;      /* adjust freely */
    height: auto;     /* keeps aspect ratio */
}

#svglogoanimation.fade-out {
    opacity: 0;
    pointer-events: none;
    transition: opacity 1s ease; 
}    

#landing-page {
    min-height: 100vh; 
}

.header__bkgdvideo {
    width: 100%; 
    height: 1px;
    background-color: #000;
}

#backgroundvideo {
    width: 100%;
}

.header {
    box-sizing: border-box; 
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 1000px; 
    padding: 0 30px;
}

.header__content {
    background-color: rgba(255, 255, 255, 0.5);
    padding: 24px;  
    height: 500px; 
}

.header__para {
    font-size: 20px;
    line-height: 2;
    min-width: 450px; 
    color: #fff;
    margin: 32px 0;
}

.social__list {
    margin-top: 64px; 
    display: flex;
}

.social__link {
    background-color: #000; 
    color: white;
    padding: 6px;
    width: 32px;
    height: 32px;
    font-size: 14px;
    margin-right: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}

.mail__btn {
    width: 70px;
    height: 70px;
    font-size: 32px;
    border-radius: 50%;
    border: none;
    background-color: #242424;
    color: #fff; 
    position: fixed;
    bottom: 32px; 
    right: 40px;
    z-index: 100;
    box-shadow: 0 12px 30px 0 rgb(0, 0, 0, 0.2);
}

.scroll {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.scroll__icon {
    width: 20px;
    height: 30px;
    border: 2px solid #242424;
    border-radius: 24px; 
    display: flex;
    align-items: center;
    justify-content: center; 
}

.scroll__icon:after {
    content: "";
    width: 4px;
    height: 4px;
    background-color: #242424;
    border-radius: 2px; 
    animation: scroll 1000ms infinite alternate-reverse; 
}

@keyframes scroll {
    0% {
        transform: translateY(3px);
    }

    100% {
        transform: translateY(-3px); 
    }
}

/*=========== ↓ Navigation ↓ ===========*/ 

#personal-logo {
    height: 100px;
    width: 100px; 
    flex-shrink: 0; 
}

nav {
    display: flex;
    justify-content: space-between; 
    align-items: center;
    width: 100%;
    max-width: 1200px; 
    margin: 0 auto;
    height: 80px; 
    padding: 0 20px; 
}

.nav__link--list {
    display: flex;
}

.nav__link {
    margin: 0 12px; 
}

.nav__link--anchor {
    font-size: 16px;
    font-weight: 700;
    color: #242424;
}

.fa-adjust {
    font-size: 20px;
}

/*=========== ↓ Hamburger button: hidden on desktop ↓ ===========*/

.nav__hamburger {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 28px;
    height: 22px;
    padding: 0;
    border: none;
    background: transparent; 
    cursor: pointer;
}

.nav__hamburger span {
    display: block;
    width: 100%;
    height: 3px;
    background-color: #242424; 
    border-radius: 2px;
    transition: transform 200ms ease, opacity 200ms ease, background-color 200ms ease;
}

/*=========== ↓ Dark Mode ↓ ===========*/

.dark-theme .nav__hamburger span {
    background-color: #fff;
}

.dark-theme .nav__link--list {
    background-color: #242424;
}

.nav__link--list {
    background-color: slategrey; 
}

/* Top bar rotates down */
.nav__hamburger.open span:nth-child(1) {
    transform: translateY(9.5px) rotate(45deg);
}

/* Middle bar disappears */
.nav__hamburger.open span:nth-child(2) {
    opacity: 0;
}

/* Bottom bar rotates up */
.nav__hamburger.open span:nth-child(3) {
    transform: translateY(-9.5px) rotate(-45deg);
}

/*=========== ↓ Modal ↓ ===========*/

.modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-width: 1100px;
    height: 700px;
    border-radius: 20px;
    overflow: hidden; 
    display: flex; 
    visibility: hidden;
    z-index: -1;
    transition: visibility 1s, z-index 1s, box-shadow 0.5s ease; 
}

.modal--open .modal {
    z-index: 60;
    box-shadow: 0 20px 80px 0 rgb(0, 0, 0, 0.55);
    visibility: visible;
}

.modal__half {
    width: 50%;
    padding: 40px 72px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative; 
    transition: all 300ms ease-in; 
}

.modal--open .modal__about,
.modal--open .modal__contact {
    transform: translateX(0%);
}

.modal__about {
    background-color: rgb(245, 245, 245);
    transform: translateX(-110%); 
}

.modal__languages {
    display: flex;
    flex-wrap: wrap;
}

.modal__language {
    width: 25%;
    padding: 16px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: all 300ms ease;
}

.dark-theme .btn__menu-bar {
    background-color: #fff;
}

.modal__language:hover .language__name {
    transform: scale(1);
}

.modal__language:hover {
    filter: brightness(80%);
    transform: scale(0.9);
}

.language__name {
    position: relative;
    bottom: -10px; 
    transform: scale(0);
    transition: all 300ms ease; 
}

.modal__language--img {
    width: 90%;
} 

.modal__contact {
    background-color: #242424;
    color: #fff; 
    transform: translateX(110%);
}

.modal__title {
    color: slategrey; 
    font-size: 26px;
    margin-top: 48px;
}

.modal__sub-title {
    margin: 12px 0 24px 0;
    font-size: 20px;
    text-align: center; 
}

.modal__para {
    margin-bottom: 12px;
    line-height: 1.75; 
}

.form__item {
    margin-bottom: 20px; 
}

.form__submit {
    background-color: #f06449;
    border: 2px solid #f06449;
    color: #fff;
    font-weight: 700;
    width: 100%;
    max-width: 240px; 
    padding: 12px 24px;
    font-size: 20px; 
    transition: all 300ms ease; 
}

.form__submit:hover {
    border-color: #fff;
    background-color: transparent;
}

.form__submit:active {
    border-color: #f06449;
    color: #f06449;
}

.modal__overlay {
    position: absolute;
    top: 0;
    left: 0; 
    width: 100%;
    height: 100%;
    display: none; 
    align-items: center;
    justify-content: center;
    z-index: -1;
}

.modal__overlay--loading {
    background-color: #242424;
    font-size: 80px;
}

.modal__overlay--success {
    background-color: #000;
    color: #fff;
    font-size: 40px;
    font-weight: 700;
    text-align: center;
    padding: 28px; 
}

.modal__overlay--visible {
    z-index: 1; 
    display: flex; 
}

.fa-spinner {
    animation: spinner 750ms infinite linear;
}

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

.modal__exit {
    position: absolute;
    top: 30px;
    right: 40px;
    color: #fff;
    font-size: 36px;
    z-index: 100; 
}

/*=========== ↓ Projects ↓ ===========*/

.section__title {
    text-align: center;
    font-size: 48px;
    margin-top: 160px;
    color: #fff; 
}

.project {
    margin-bottom: 135px;
    color: #242424;
}

.project__img {
    width: 100%; 
    display: block;
    transition: all 600ms ease; 
}

.project:hover .project__img {
    transform: scale(1.07);
    filter: blur(5px);
}

.project__wrapper {
    position: relative; 
    margin: 40px;
    border-radius: 20px;
    box-shadow: 0 20px 80px 0 rgb(0, 0, 0, 0.45);
    overflow: hidden; 
}

.project__wrapper:hover .project__description {
    opacity: 1;
    transform: translateY(-50%);
}

.project__description {
    position: absolute;
    top: 50%;
    left: 90px;
    transform: translateY(50%);
    opacity: 0;
    transition: opacity 300ms, transform 450ms ease;
    color: white;
    max-width: 550px;
}

.project__wrapper--bkgd {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #1c1d25;
    opacity: 0;
}

.project__wrapper:hover .project__img {
    transform: scale(1.07);
    filter: blur(5px); 
}

.project__description--para {
    margin: 16px 0; 
}

.project__description--title {
    font-size: 40px; 
}

.project__description--sub-title {
    margin-top: 8px;
}

.project__description--link {
    color: #fff;
    font-size: 20px;
    margin-right: 16px; 
    cursor: pointer;
}

.project__wrapper:hover .project__wrapper--bkgd {
    opacity: 0.7;
}

/*=========== ↓ Lightbox ↓ ===========*/

.lightbox {
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;

    visibility: hidden;
}

.lightbox.active {
    visibility: visible;
    animation: lightboxOpen 500ms ease forwards;
}

.lightbox.closing {
    visibility: visible;
    animation: lightboxClose 500ms ease forwards;
}

@keyframes lightboxOpen {
    from {
        transform: translateY(100%);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes lightboxClose {
    from {
        transform: translateY(0);
        opacity: 1;
    }

    to {
        transform: translateY(-100%);
        opacity: 0;
    }
}

/* 🔥 THIS is your "window" (not fullscreen) */
.lightbox-window {
  width: 85vw;
  height: 80vh;
  background: white;
  border-radius: 14px;
  display: flex;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15);
}

/* Thumbnails sidebar */
.lightbox-thumbs {
  width: 120px;
  background: #f5f5f5;
  border-right: 1px solid #ddd;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
}

.lightbox-thumbs img {
  width: 100%;
  cursor: pointer;
  opacity: 0.5;
  border-radius: 6px;
  transition: 0.2s;
}

.lightbox-thumbs img.active {
  opacity: 1;
  outline: 2px solid #111;
}

/* Main image area */
.lightbox-main {
  flex: 1;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.lightbox-main img {
  max-width: 90%;
  max-height: 90%;
  object-fit: contain;
}

/* Navigation */
.nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 40px;
  background: none;
  border: none;
  color: #111;
  cursor: pointer;
}

.prev { left: 10px; }
.next { right: 10px; }

/* Close */
.lightbox-close {
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 40px;
  color: #111;
  background: none;
  border: none;
  cursor: pointer;
}

/*=========== ↓ Footer ↓ ===========*/

footer {
    background-color: #242424;
    display: flex; 
    padding: 6% 0;
}

.footer__row {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.footer__logo--img {
    width: 70px;
}

.footer__social--list {
    color: #fff;
    width: 100%;
    max-width: 500px;
    display: flex;
    justify-content: space-around;
    margin: 28px 0; 
}

.footer__social--link,
.footer__copyright {
    color: #fff; 
}


/* #region SVG logo animation */

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

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

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

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

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

  100% {
    fill: rgb(43, 57, 144);
  }
}

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

  100% {
    fill: rgb(43, 57, 144);
  }
}

.svg-elem-1 {
  -webkit-animation: animate-svg-stroke-1 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s both,
                       animate-svg-fill-1 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s both;
          animation: animate-svg-stroke-1 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s both,
               animate-svg-fill-1 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-2 {
  -webkit-animation: animate-svg-stroke-2 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s both,
                       animate-svg-fill-2 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s both;
          animation: animate-svg-stroke-2 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s both,
               animate-svg-fill-2 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-3 {
  -webkit-animation: animate-svg-stroke-3 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s both,
                       animate-svg-fill-3 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s both;
          animation: animate-svg-stroke-3 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s both,
               animate-svg-fill-3 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-4 {
  -webkit-animation: animate-svg-stroke-4 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s both,
                       animate-svg-fill-4 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s both;
          animation: animate-svg-stroke-4 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s both,
               animate-svg-fill-4 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-5 {
  -webkit-animation: animate-svg-stroke-5 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s both,
                       animate-svg-fill-5 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s both;
          animation: animate-svg-stroke-5 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s both,
               animate-svg-fill-5 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-6 {
  -webkit-animation: animate-svg-stroke-6 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s both,
                       animate-svg-fill-6 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s both;
          animation: animate-svg-stroke-6 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s both,
               animate-svg-fill-6 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-7 {
  -webkit-animation: animate-svg-stroke-7 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s both,
                       animate-svg-fill-7 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s both;
          animation: animate-svg-stroke-7 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s both,
               animate-svg-fill-7 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s both;
}

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

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

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

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

.svg-elem-8 {
  -webkit-animation: animate-svg-stroke-8 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.84s both,
                       animate-svg-fill-8 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s both;
          animation: animate-svg-stroke-8 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.84s both,
               animate-svg-fill-8 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s both;
}

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

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

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

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

.svg-elem-9 {
  -webkit-animation: animate-svg-stroke-9 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.96s both,
                       animate-svg-fill-9 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s both;
          animation: animate-svg-stroke-9 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.96s both,
               animate-svg-fill-9 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s both;
}

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

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

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

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

.svg-elem-10 {
  -webkit-animation: animate-svg-stroke-10 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.08s both,
                       animate-svg-fill-10 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s both;
          animation: animate-svg-stroke-10 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.08s both,
               animate-svg-fill-10 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s both;
}

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

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

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

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

.svg-elem-11 {
  -webkit-animation: animate-svg-stroke-11 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2s both,
                       animate-svg-fill-11 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.8s both;
          animation: animate-svg-stroke-11 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2s both,
               animate-svg-fill-11 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.8s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-12 {
  -webkit-animation: animate-svg-stroke-12 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3199999999999998s both,
                       animate-svg-fill-12 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.9000000000000001s both;
          animation: animate-svg-stroke-12 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3199999999999998s both,
               animate-svg-fill-12 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.9000000000000001s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-13 {
  -webkit-animation: animate-svg-stroke-13 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.44s both,
                       animate-svg-fill-13 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2s both;
          animation: animate-svg-stroke-13 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.44s both,
               animate-svg-fill-13 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-14 {
  -webkit-animation: animate-svg-stroke-14 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.56s both,
                       animate-svg-fill-14 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.1s both;
          animation: animate-svg-stroke-14 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.56s both,
               animate-svg-fill-14 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.1s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-15 {
  -webkit-animation: animate-svg-stroke-15 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.68s both,
                       animate-svg-fill-15 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.2s both;
          animation: animate-svg-stroke-15 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.68s both,
               animate-svg-fill-15 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.2s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-16 {
  -webkit-animation: animate-svg-stroke-16 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7999999999999998s both,
                       animate-svg-fill-16 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.3s both;
          animation: animate-svg-stroke-16 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7999999999999998s both,
               animate-svg-fill-16 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.3s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-17 {
  -webkit-animation: animate-svg-stroke-17 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.92s both,
                       animate-svg-fill-17 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4000000000000004s both;
          animation: animate-svg-stroke-17 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.92s both,
               animate-svg-fill-17 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4000000000000004s both;
}

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

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

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

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

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

  100% {
    fill: rgb(0, 0, 0);
  }
}

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

  100% {
    fill: rgb(0, 0, 0);
  }
}

.svg-elem-18 {
  -webkit-animation: animate-svg-stroke-18 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.04s both,
                       animate-svg-fill-18 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.5s both;
          animation: animate-svg-stroke-18 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.04s both,
               animate-svg-fill-18 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.5s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-19 {
  -webkit-animation: animate-svg-stroke-19 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.16s both,
                       animate-svg-fill-19 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6s both;
          animation: animate-svg-stroke-19 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.16s both,
               animate-svg-fill-19 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6s both;
}

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

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

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

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

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

  100% {
    fill: rgb(0, 0, 0);
  }
}

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

  100% {
    fill: rgb(0, 0, 0);
  }
}

.svg-elem-20 {
  -webkit-animation: animate-svg-stroke-20 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.28s both,
                       animate-svg-fill-20 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.7s both;
          animation: animate-svg-stroke-20 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.28s both,
               animate-svg-fill-20 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.7s both;
}

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

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

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

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

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

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

  100% {
    fill: rgb(46, 65, 154);
  }
}

.svg-elem-21 {
  -webkit-animation: animate-svg-stroke-21 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4s both,
                       animate-svg-fill-21 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.8s both;
          animation: animate-svg-stroke-21 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4s both,
               animate-svg-fill-21 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.8s both;
}

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

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

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

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

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

  100% {
    fill: rgb(0, 0, 0);
  }
}

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

  100% {
    fill: rgb(0, 0, 0);
  }
}

.svg-elem-22 {
  -webkit-animation: animate-svg-stroke-22 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.52s both,
                       animate-svg-fill-22 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.9000000000000004s both;
          animation: animate-svg-stroke-22 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.52s both,
               animate-svg-fill-22 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.9000000000000004s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-23 {
  -webkit-animation: animate-svg-stroke-23 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6399999999999997s both,
                       animate-svg-fill-23 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3s both;
          animation: animate-svg-stroke-23 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6399999999999997s both,
               animate-svg-fill-23 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-24 {
  -webkit-animation: animate-svg-stroke-24 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.76s both,
                       animate-svg-fill-24 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.1000000000000005s both;
          animation: animate-svg-stroke-24 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.76s both,
               animate-svg-fill-24 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.1000000000000005s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-25 {
  -webkit-animation: animate-svg-stroke-25 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.88s both,
                       animate-svg-fill-25 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.2s both;
          animation: animate-svg-stroke-25 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.88s both,
               animate-svg-fill-25 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.2s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-26 {
  -webkit-animation: animate-svg-stroke-26 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3s both,
                       animate-svg-fill-26 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.3s both;
          animation: animate-svg-stroke-26 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3s both,
               animate-svg-fill-26 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.3s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-27 {
  -webkit-animation: animate-svg-stroke-27 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.12s both,
                       animate-svg-fill-27 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.4000000000000004s both;
          animation: animate-svg-stroke-27 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.12s both,
               animate-svg-fill-27 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.4000000000000004s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-28 {
  -webkit-animation: animate-svg-stroke-28 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.2399999999999998s both,
                       animate-svg-fill-28 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.5s both;
          animation: animate-svg-stroke-28 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.2399999999999998s both,
               animate-svg-fill-28 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.5s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-29 {
  -webkit-animation: animate-svg-stroke-29 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.36s both,
                       animate-svg-fill-29 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.6000000000000005s both;
          animation: animate-svg-stroke-29 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.36s both,
               animate-svg-fill-29 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.6000000000000005s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-30 {
  -webkit-animation: animate-svg-stroke-30 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.48s both,
                       animate-svg-fill-30 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.7s both;
          animation: animate-svg-stroke-30 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.48s both,
               animate-svg-fill-30 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.7s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-31 {
  -webkit-animation: animate-svg-stroke-31 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.5999999999999996s both,
                       animate-svg-fill-31 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.8s both;
          animation: animate-svg-stroke-31 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.5999999999999996s both,
               animate-svg-fill-31 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.8s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-32 {
  -webkit-animation: animate-svg-stroke-32 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.7199999999999998s both,
                       animate-svg-fill-32 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.9000000000000004s both;
          animation: animate-svg-stroke-32 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.7199999999999998s both,
               animate-svg-fill-32 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 3.9000000000000004s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-33 {
  -webkit-animation: animate-svg-stroke-33 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.84s both,
                       animate-svg-fill-33 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4s both;
          animation: animate-svg-stroke-33 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.84s both,
               animate-svg-fill-33 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-34 {
  -webkit-animation: animate-svg-stroke-34 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.96s both,
                       animate-svg-fill-34 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.1000000000000005s both;
          animation: animate-svg-stroke-34 1s cubic-bezier(0.47, 0, 0.745, 0.715) 3.96s both,
               animate-svg-fill-34 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.1000000000000005s both;
}

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

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

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

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-35 {
  -webkit-animation: animate-svg-stroke-35 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.08s both,
                       animate-svg-fill-35 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.2s both;
          animation: animate-svg-stroke-35 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.08s both,
               animate-svg-fill-35 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.2s both;
}

@-webkit-keyframes animate-svg-stroke-36 {
  0% {
    stroke-dashoffset: 45.323143005371094px;
    stroke-dasharray: 45.323143005371094px;
  }

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

@keyframes animate-svg-stroke-36 {
  0% {
    stroke-dashoffset: 45.323143005371094px;
    stroke-dasharray: 45.323143005371094px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-36 {
  -webkit-animation: animate-svg-stroke-36 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.2s both,
                       animate-svg-fill-36 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.3s both;
          animation: animate-svg-stroke-36 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.2s both,
               animate-svg-fill-36 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.3s both;
}

@-webkit-keyframes animate-svg-stroke-37 {
  0% {
    stroke-dashoffset: 38.25997543334961px;
    stroke-dasharray: 38.25997543334961px;
  }

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

@keyframes animate-svg-stroke-37 {
  0% {
    stroke-dashoffset: 38.25997543334961px;
    stroke-dasharray: 38.25997543334961px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-37 {
  -webkit-animation: animate-svg-stroke-37 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.32s both,
                       animate-svg-fill-37 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.4s both;
          animation: animate-svg-stroke-37 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.32s both,
               animate-svg-fill-37 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.4s both;
}

@-webkit-keyframes animate-svg-stroke-38 {
  0% {
    stroke-dashoffset: 51.573055267333984px;
    stroke-dasharray: 51.573055267333984px;
  }

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

@keyframes animate-svg-stroke-38 {
  0% {
    stroke-dashoffset: 51.573055267333984px;
    stroke-dasharray: 51.573055267333984px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-38 {
  -webkit-animation: animate-svg-stroke-38 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.4399999999999995s both,
                       animate-svg-fill-38 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.5s both;
          animation: animate-svg-stroke-38 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.4399999999999995s both,
               animate-svg-fill-38 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.5s both;
}

@-webkit-keyframes animate-svg-stroke-39 {
  0% {
    stroke-dashoffset: 42.040733337402344px;
    stroke-dasharray: 42.040733337402344px;
  }

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

@keyframes animate-svg-stroke-39 {
  0% {
    stroke-dashoffset: 42.040733337402344px;
    stroke-dasharray: 42.040733337402344px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-39 {
  -webkit-animation: animate-svg-stroke-39 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.56s both,
                       animate-svg-fill-39 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.6000000000000005s both;
          animation: animate-svg-stroke-39 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.56s both,
               animate-svg-fill-39 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.6000000000000005s both;
}

@-webkit-keyframes animate-svg-stroke-40 {
  0% {
    stroke-dashoffset: 46.00984573364258px;
    stroke-dasharray: 46.00984573364258px;
  }

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

@keyframes animate-svg-stroke-40 {
  0% {
    stroke-dashoffset: 46.00984573364258px;
    stroke-dasharray: 46.00984573364258px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-40 {
  -webkit-animation: animate-svg-stroke-40 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.68s both,
                       animate-svg-fill-40 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.7s both;
          animation: animate-svg-stroke-40 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.68s both,
               animate-svg-fill-40 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.7s both;
}

@-webkit-keyframes animate-svg-stroke-41 {
  0% {
    stroke-dashoffset: 27.827423095703125px;
    stroke-dasharray: 27.827423095703125px;
  }

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

@keyframes animate-svg-stroke-41 {
  0% {
    stroke-dashoffset: 27.827423095703125px;
    stroke-dasharray: 27.827423095703125px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-41 {
  -webkit-animation: animate-svg-stroke-41 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.8s both,
                       animate-svg-fill-41 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.8s both;
          animation: animate-svg-stroke-41 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.8s both,
               animate-svg-fill-41 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.8s both;
}

@-webkit-keyframes animate-svg-stroke-42 {
  0% {
    stroke-dashoffset: 39.00653839111328px;
    stroke-dasharray: 39.00653839111328px;
  }

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

@keyframes animate-svg-stroke-42 {
  0% {
    stroke-dashoffset: 39.00653839111328px;
    stroke-dasharray: 39.00653839111328px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-42 {
  -webkit-animation: animate-svg-stroke-42 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.92s both,
                       animate-svg-fill-42 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.9s both;
          animation: animate-svg-stroke-42 1s cubic-bezier(0.47, 0, 0.745, 0.715) 4.92s both,
               animate-svg-fill-42 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 4.9s both;
}

@-webkit-keyframes animate-svg-stroke-43 {
  0% {
    stroke-dashoffset: 46.11566925048828px;
    stroke-dasharray: 46.11566925048828px;
  }

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

@keyframes animate-svg-stroke-43 {
  0% {
    stroke-dashoffset: 46.11566925048828px;
    stroke-dasharray: 46.11566925048828px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-43 {
  -webkit-animation: animate-svg-stroke-43 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.04s both,
                       animate-svg-fill-43 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5s both;
          animation: animate-svg-stroke-43 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.04s both,
               animate-svg-fill-43 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5s both;
}

@-webkit-keyframes animate-svg-stroke-44 {
  0% {
    stroke-dashoffset: 32.89360237121582px;
    stroke-dasharray: 32.89360237121582px;
  }

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

@keyframes animate-svg-stroke-44 {
  0% {
    stroke-dashoffset: 32.89360237121582px;
    stroke-dasharray: 32.89360237121582px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-44 {
  -webkit-animation: animate-svg-stroke-44 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.16s both,
                       animate-svg-fill-44 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.1s both;
          animation: animate-svg-stroke-44 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.16s both,
               animate-svg-fill-44 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.1s both;
}

@-webkit-keyframes animate-svg-stroke-45 {
  0% {
    stroke-dashoffset: 38.25996780395508px;
    stroke-dasharray: 38.25996780395508px;
  }

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

@keyframes animate-svg-stroke-45 {
  0% {
    stroke-dashoffset: 38.25996780395508px;
    stroke-dasharray: 38.25996780395508px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-45 {
  -webkit-animation: animate-svg-stroke-45 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.279999999999999s both,
                       animate-svg-fill-45 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.2s both;
          animation: animate-svg-stroke-45 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.279999999999999s both,
               animate-svg-fill-45 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.2s both;
}

@-webkit-keyframes animate-svg-stroke-46 {
  0% {
    stroke-dashoffset: 40.379730224609375px;
    stroke-dasharray: 40.379730224609375px;
  }

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

@keyframes animate-svg-stroke-46 {
  0% {
    stroke-dashoffset: 40.379730224609375px;
    stroke-dasharray: 40.379730224609375px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-46 {
  -webkit-animation: animate-svg-stroke-46 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.3999999999999995s both,
                       animate-svg-fill-46 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.3s both;
          animation: animate-svg-stroke-46 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.3999999999999995s both,
               animate-svg-fill-46 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.3s both;
}

@-webkit-keyframes animate-svg-stroke-47 {
  0% {
    stroke-dashoffset: 16.844099044799805px;
    stroke-dasharray: 16.844099044799805px;
  }

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

@keyframes animate-svg-stroke-47 {
  0% {
    stroke-dashoffset: 16.844099044799805px;
    stroke-dasharray: 16.844099044799805px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-47 {
  -webkit-animation: animate-svg-stroke-47 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.52s both,
                       animate-svg-fill-47 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.4s both;
          animation: animate-svg-stroke-47 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.52s both,
               animate-svg-fill-47 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.4s both;
}

@-webkit-keyframes animate-svg-stroke-48 {
  0% {
    stroke-dashoffset: 32.90810775756836px;
    stroke-dasharray: 32.90810775756836px;
  }

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

@keyframes animate-svg-stroke-48 {
  0% {
    stroke-dashoffset: 32.90810775756836px;
    stroke-dasharray: 32.90810775756836px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-48 {
  -webkit-animation: animate-svg-stroke-48 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.64s both,
                       animate-svg-fill-48 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.5s both;
          animation: animate-svg-stroke-48 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.64s both,
               animate-svg-fill-48 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.5s both;
}

@-webkit-keyframes animate-svg-stroke-49 {
  0% {
    stroke-dashoffset: 44.93537521362305px;
    stroke-dasharray: 44.93537521362305px;
  }

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

@keyframes animate-svg-stroke-49 {
  0% {
    stroke-dashoffset: 44.93537521362305px;
    stroke-dasharray: 44.93537521362305px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-49 {
  -webkit-animation: animate-svg-stroke-49 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.76s both,
                       animate-svg-fill-49 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.6000000000000005s both;
          animation: animate-svg-stroke-49 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.76s both,
               animate-svg-fill-49 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.6000000000000005s both;
}

@-webkit-keyframes animate-svg-stroke-50 {
  0% {
    stroke-dashoffset: 42.040733337402344px;
    stroke-dasharray: 42.040733337402344px;
  }

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

@keyframes animate-svg-stroke-50 {
  0% {
    stroke-dashoffset: 42.040733337402344px;
    stroke-dasharray: 42.040733337402344px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-50 {
  -webkit-animation: animate-svg-stroke-50 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.88s both,
                       animate-svg-fill-50 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.7s both;
          animation: animate-svg-stroke-50 1s cubic-bezier(0.47, 0, 0.745, 0.715) 5.88s both,
               animate-svg-fill-50 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.7s both;
}

@-webkit-keyframes animate-svg-stroke-51 {
  0% {
    stroke-dashoffset: 36.34831237792969px;
    stroke-dasharray: 36.34831237792969px;
  }

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

@keyframes animate-svg-stroke-51 {
  0% {
    stroke-dashoffset: 36.34831237792969px;
    stroke-dasharray: 36.34831237792969px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-51 {
  -webkit-animation: animate-svg-stroke-51 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6s both,
                       animate-svg-fill-51 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.8s both;
          animation: animate-svg-stroke-51 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6s both,
               animate-svg-fill-51 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.8s both;
}

@-webkit-keyframes animate-svg-stroke-52 {
  0% {
    stroke-dashoffset: 16.844099044799805px;
    stroke-dasharray: 16.844099044799805px;
  }

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

@keyframes animate-svg-stroke-52 {
  0% {
    stroke-dashoffset: 16.844099044799805px;
    stroke-dasharray: 16.844099044799805px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-52 {
  -webkit-animation: animate-svg-stroke-52 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.12s both,
                       animate-svg-fill-52 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.9s both;
          animation: animate-svg-stroke-52 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.12s both,
               animate-svg-fill-52 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 5.9s both;
}

@-webkit-keyframes animate-svg-stroke-53 {
  0% {
    stroke-dashoffset: 39.00651550292969px;
    stroke-dasharray: 39.00651550292969px;
  }

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

@keyframes animate-svg-stroke-53 {
  0% {
    stroke-dashoffset: 39.00651550292969px;
    stroke-dasharray: 39.00651550292969px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-53 {
  -webkit-animation: animate-svg-stroke-53 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.24s both,
                       animate-svg-fill-53 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6s both;
          animation: animate-svg-stroke-53 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.24s both,
               animate-svg-fill-53 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6s both;
}

@-webkit-keyframes animate-svg-stroke-54 {
  0% {
    stroke-dashoffset: 46.00984573364258px;
    stroke-dasharray: 46.00984573364258px;
  }

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

@keyframes animate-svg-stroke-54 {
  0% {
    stroke-dashoffset: 46.00984573364258px;
    stroke-dasharray: 46.00984573364258px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-54 {
  -webkit-animation: animate-svg-stroke-54 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.359999999999999s both,
                       animate-svg-fill-54 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.1000000000000005s both;
          animation: animate-svg-stroke-54 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.359999999999999s both,
               animate-svg-fill-54 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.1000000000000005s both;
}

@-webkit-keyframes animate-svg-stroke-55 {
  0% {
    stroke-dashoffset: 51.85761642456055px;
    stroke-dasharray: 51.85761642456055px;
  }

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

@keyframes animate-svg-stroke-55 {
  0% {
    stroke-dashoffset: 51.85761642456055px;
    stroke-dasharray: 51.85761642456055px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-55 {
  -webkit-animation: animate-svg-stroke-55 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.4799999999999995s both,
                       animate-svg-fill-55 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.2s both;
          animation: animate-svg-stroke-55 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.4799999999999995s both,
               animate-svg-fill-55 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.2s both;
}

@-webkit-keyframes animate-svg-stroke-56 {
  0% {
    stroke-dashoffset: 46.11566925048828px;
    stroke-dasharray: 46.11566925048828px;
  }

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

@keyframes animate-svg-stroke-56 {
  0% {
    stroke-dashoffset: 46.11566925048828px;
    stroke-dasharray: 46.11566925048828px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-56 {
  -webkit-animation: animate-svg-stroke-56 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.6s both,
                       animate-svg-fill-56 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.3s both;
          animation: animate-svg-stroke-56 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.6s both,
               animate-svg-fill-56 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.3s both;
}

@-webkit-keyframes animate-svg-stroke-57 {
  0% {
    stroke-dashoffset: 32.89362144470215px;
    stroke-dasharray: 32.89362144470215px;
  }

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

@keyframes animate-svg-stroke-57 {
  0% {
    stroke-dashoffset: 32.89362144470215px;
    stroke-dasharray: 32.89362144470215px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-57 {
  -webkit-animation: animate-svg-stroke-57 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.72s both,
                       animate-svg-fill-57 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.4s both;
          animation: animate-svg-stroke-57 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.72s both,
               animate-svg-fill-57 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.4s both;
}

@-webkit-keyframes animate-svg-stroke-58 {
  0% {
    stroke-dashoffset: 46.00981903076172px;
    stroke-dasharray: 46.00981903076172px;
  }

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

@keyframes animate-svg-stroke-58 {
  0% {
    stroke-dashoffset: 46.00981903076172px;
    stroke-dasharray: 46.00981903076172px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-58 {
  -webkit-animation: animate-svg-stroke-58 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.84s both,
                       animate-svg-fill-58 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.5s both;
          animation: animate-svg-stroke-58 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.84s both,
               animate-svg-fill-58 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.5s both;
}

@-webkit-keyframes animate-svg-stroke-59 {
  0% {
    stroke-dashoffset: 44.9354362487793px;
    stroke-dasharray: 44.9354362487793px;
  }

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

@keyframes animate-svg-stroke-59 {
  0% {
    stroke-dashoffset: 44.9354362487793px;
    stroke-dasharray: 44.9354362487793px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-59 {
  -webkit-animation: animate-svg-stroke-59 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.96s both,
                       animate-svg-fill-59 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.6000000000000005s both;
          animation: animate-svg-stroke-59 1s cubic-bezier(0.47, 0, 0.745, 0.715) 6.96s both,
               animate-svg-fill-59 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.6000000000000005s both;
}

@-webkit-keyframes animate-svg-stroke-60 {
  0% {
    stroke-dashoffset: 27.827434539794922px;
    stroke-dasharray: 27.827434539794922px;
  }

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

@keyframes animate-svg-stroke-60 {
  0% {
    stroke-dashoffset: 27.827434539794922px;
    stroke-dasharray: 27.827434539794922px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-60 {
  -webkit-animation: animate-svg-stroke-60 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.08s both,
                       animate-svg-fill-60 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.7s both;
          animation: animate-svg-stroke-60 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.08s both,
               animate-svg-fill-60 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.7s both;
}

@-webkit-keyframes animate-svg-stroke-61 {
  0% {
    stroke-dashoffset: 32.8935546875px;
    stroke-dasharray: 32.8935546875px;
  }

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

@keyframes animate-svg-stroke-61 {
  0% {
    stroke-dashoffset: 32.8935546875px;
    stroke-dasharray: 32.8935546875px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-61 {
  -webkit-animation: animate-svg-stroke-61 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.199999999999999s both,
                       animate-svg-fill-61 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.8s both;
          animation: animate-svg-stroke-61 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.199999999999999s both,
               animate-svg-fill-61 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.8s both;
}

@-webkit-keyframes animate-svg-stroke-62 {
  0% {
    stroke-dashoffset: 16.844022750854492px;
    stroke-dasharray: 16.844022750854492px;
  }

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

@keyframes animate-svg-stroke-62 {
  0% {
    stroke-dashoffset: 16.844022750854492px;
    stroke-dasharray: 16.844022750854492px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-62 {
  -webkit-animation: animate-svg-stroke-62 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.319999999999999s both,
                       animate-svg-fill-62 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.9s both;
          animation: animate-svg-stroke-62 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.319999999999999s both,
               animate-svg-fill-62 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 6.9s both;
}

@-webkit-keyframes animate-svg-stroke-63 {
  0% {
    stroke-dashoffset: 25.576818466186523px;
    stroke-dasharray: 25.576818466186523px;
  }

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

@keyframes animate-svg-stroke-63 {
  0% {
    stroke-dashoffset: 25.576818466186523px;
    stroke-dasharray: 25.576818466186523px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-63 {
  -webkit-animation: animate-svg-stroke-63 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.4399999999999995s both,
                       animate-svg-fill-63 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7s both;
          animation: animate-svg-stroke-63 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.4399999999999995s both,
               animate-svg-fill-63 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7s both;
}

@-webkit-keyframes animate-svg-stroke-64 {
  0% {
    stroke-dashoffset: 45.322933197021484px;
    stroke-dasharray: 45.322933197021484px;
  }

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

@keyframes animate-svg-stroke-64 {
  0% {
    stroke-dashoffset: 45.322933197021484px;
    stroke-dasharray: 45.322933197021484px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-64 {
  -webkit-animation: animate-svg-stroke-64 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.56s both,
                       animate-svg-fill-64 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.1000000000000005s both;
          animation: animate-svg-stroke-64 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.56s both,
               animate-svg-fill-64 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.1000000000000005s both;
}

@-webkit-keyframes animate-svg-stroke-65 {
  0% {
    stroke-dashoffset: 46.1158447265625px;
    stroke-dasharray: 46.1158447265625px;
  }

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

@keyframes animate-svg-stroke-65 {
  0% {
    stroke-dashoffset: 46.1158447265625px;
    stroke-dasharray: 46.1158447265625px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-65 {
  -webkit-animation: animate-svg-stroke-65 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.68s both,
                       animate-svg-fill-65 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.2s both;
          animation: animate-svg-stroke-65 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.68s both,
               animate-svg-fill-65 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.2s both;
}

@-webkit-keyframes animate-svg-stroke-66 {
  0% {
    stroke-dashoffset: 16.844022750854492px;
    stroke-dasharray: 16.844022750854492px;
  }

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

@keyframes animate-svg-stroke-66 {
  0% {
    stroke-dashoffset: 16.844022750854492px;
    stroke-dasharray: 16.844022750854492px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-66 {
  -webkit-animation: animate-svg-stroke-66 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.8s both,
                       animate-svg-fill-66 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.3s both;
          animation: animate-svg-stroke-66 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.8s both,
               animate-svg-fill-66 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.3s both;
}

@-webkit-keyframes animate-svg-stroke-67 {
  0% {
    stroke-dashoffset: 46.0098991394043px;
    stroke-dasharray: 46.0098991394043px;
  }

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

@keyframes animate-svg-stroke-67 {
  0% {
    stroke-dashoffset: 46.0098991394043px;
    stroke-dasharray: 46.0098991394043px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-67 {
  -webkit-animation: animate-svg-stroke-67 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.92s both,
                       animate-svg-fill-67 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.4s both;
          animation: animate-svg-stroke-67 1s cubic-bezier(0.47, 0, 0.745, 0.715) 7.92s both,
               animate-svg-fill-67 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.4s both;
}

@-webkit-keyframes animate-svg-stroke-68 {
  0% {
    stroke-dashoffset: 39.006614685058594px;
    stroke-dasharray: 39.006614685058594px;
  }

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

@keyframes animate-svg-stroke-68 {
  0% {
    stroke-dashoffset: 39.006614685058594px;
    stroke-dasharray: 39.006614685058594px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-68 {
  -webkit-animation: animate-svg-stroke-68 1s cubic-bezier(0.47, 0, 0.745, 0.715) 8.04s both,
                       animate-svg-fill-68 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.5s both;
          animation: animate-svg-stroke-68 1s cubic-bezier(0.47, 0, 0.745, 0.715) 8.04s both,
               animate-svg-fill-68 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.5s both;
}

@-webkit-keyframes animate-svg-stroke-69 {
  0% {
    stroke-dashoffset: 8.785840131753954px;
    stroke-dasharray: 8.785840131753954px;
  }

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

@keyframes animate-svg-stroke-69 {
  0% {
    stroke-dashoffset: 8.785840131753954px;
    stroke-dasharray: 8.785840131753954px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-69 {
  -webkit-animation: animate-svg-stroke-69 1s cubic-bezier(0.47, 0, 0.745, 0.715) 8.16s both,
                       animate-svg-fill-69 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.6000000000000005s both;
          animation: animate-svg-stroke-69 1s cubic-bezier(0.47, 0, 0.745, 0.715) 8.16s both,
               animate-svg-fill-69 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.6000000000000005s both;
}

@-webkit-keyframes animate-svg-stroke-70 {
  0% {
    stroke-dashoffset: 8.785840131753954px;
    stroke-dasharray: 8.785840131753954px;
  }

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

@keyframes animate-svg-stroke-70 {
  0% {
    stroke-dashoffset: 8.785840131753954px;
    stroke-dasharray: 8.785840131753954px;
  }

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

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

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

  100% {
    fill: rgb(28, 117, 188);
  }
}

.svg-elem-70 {
  -webkit-animation: animate-svg-stroke-70 1s cubic-bezier(0.47, 0, 0.745, 0.715) 8.28s both,
                       animate-svg-fill-70 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.7s both;
          animation: animate-svg-stroke-70 1s cubic-bezier(0.47, 0, 0.745, 0.715) 8.28s both,
               animate-svg-fill-70 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 7.7s both;
}
/* #endregion */


/*=========== ↓ Mobile Device Optimization ↓ ===========*/

/* Small phones, large smart phones, tablets */

@media (max-width: 768px) {
    .title {
        font-size: 80px;
    }
    .header__para {
        font-size: 20px;
    }
    .header__content {
        height: 580px;
        margin-top: 4px;  
    }
    .modal {
        position: fixed;
        top: 0;
        left: 0;
        transform: none;
        height: auto;
        max-height: 100dvh;
        overflow-y: auto;
        width: 100%;
        flex-direction: column-reverse;
        border-radius: 0;
        align-items: center;
    }
    .modal__contact {
        width: 100%;
        text-align: center;
    }
    .modal__half {
        width: 100%;
    }
    .project__description {
        left: 70px;
    }
}

/* Small phones */

@media (max-width: 480px) {
    .title {
        font-size: 52px;
    }
    .header {
        padding: 0;
    }
    .header__content {
        height: 650px;
        margin-top: 28px;
    }
    .header__para {
        font-size: 18px;
        min-width: 0;
        max-width: 100%;
    }
    nav {
        position: relative;
    }
    .nav__hamburger {
        display: flex;
        position: fixed;
        top: 28px;
        right: 20px;
        z-index: 101;
    }
    .nav__link--list {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        box-sizing: border-box;
        padding: 120px 0 24px;
        background-color: slategrey; 
        z-index: 100;
        display: none;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 32px;
    }
    .nav__link--list.open {
        display: flex;
    }
    .nav__link {
        margin: 0;
    }
    .nav__link--anchor {
        color: #242424;
    }
    .project__description--para {
        display: none;
    }
    .project__description {
        left: 0;
        padding: 0;
        width: 100%;
        text-align: center;
    }
    .project__description--sub-title {
        margin-bottom: 8px;
    }
    .modal___half {
        padding: 40px; 
    }
}

@media (max-width: 375px) {

    /* 1. Make sure nothing is wider than the screen */
    *,
    *::before,
    *::after {
        box-sizing: border-box !important;
    }

    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow-x: hidden !important;
    }

    /* 2. Full-width page containers */
    section,
    header,
    footer,
    nav,
    main,
    .header,
    .header__content,
    .header__bkgdvideo {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        left: 0 !important;
        right: 0 !important;
        transform: none !important;
    }

    /* 3. Background video fills the width */
    #backgroundvideo,
    video {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        left: 0 !important;
        right: 0 !important;
        object-fit: cover;
    }

    /* 4. Nav fits instead of stretching the page */
    nav {
        flex-wrap: wrap;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    nav figure,
    nav .logo,
    #personal-logo {
        max-width: 120px;
        height: auto;
    }

    .nav__link--list {
        flex-wrap: wrap;
        gap: 12px;
        max-width: 100%;
    }

    /* 5. Text and media can't push past the edge */
    h1, h2, h3, p, a, li, span {
        max-width: 100%;
        overflow-wrap: break-word;
        word-wrap: break-word;
    }

    img,
    svg,
    figure,
    iframe {
        max-width: 100%;
        height: auto;
    }

    /* 6. Comfortable side padding for content */
    .header__content {
        height: 654px;
        margin-top: -373px;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}