/*========================================*/
/*===== Home Page =====*/
/* Home Page Hero Section */
/*===== iTyped Cursor =====*/
.ityped-cursor {
    font-size: 2.2rem;
    opacity: 1;
    -webkit-animation: blink 0.3s infinite;
    -moz-animation: blink 0.3s infinite;
    animation: blink 0.3s infinite;
    animation-direction: alternate;
  }
  
  @keyframes blink {
    100% {
        opacity: 0;
    }
  }
  
  @-webkit-keyframes blink {
    100% {
        opacity: 0;
    }
  }
  
  @-moz-keyframes blink {
    100% {
        opacity: 0;
    }
  }

  /* Decorative Background Images */
  .img-hero {
    position: absolute;
    top: 0%;
    right: 0%;
    z-index: -2;
  }
  .img-one {
    position: absolute;
    top: 40%;
    left: 25%;
    animation: rotationone 6s infinite linear;
  }
  @keyframes rotationone {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  .img-two {
    position:absolute;
    top: 40%;
    left: 60%;
    animation:animExtra 5s linear 0s infinite alternate
  }
  @keyframes animExtra {
    0% { 
      transform:rotate(0deg)
    }
    100% {
      transform:rotate(180deg)
    }
  }
  .img-three {
    position: absolute;
    top: 50%;
    right: 25%;
    animation: animRight 5s linear 0s infinite alternate
  }
  @keyframes animRight {
    0% {
      transform:translateX(15px)
    }
    100% {
      transform:translateX(-15px)
    }
  }
  .img-four {
    position: absolute;
    top: 85%;
    left: 30%;
    animation:animMoveTop 5s linear 0s infinite alternate
  }
  @keyframes animMoveTop {
    0% {
      transform:translateY(-15px)
    }
    100% {
      transform:translateY(15px)
    }
  }
  .img-five {
    position: absolute;
    top: 85%;
    right: 30%;
    animation:animScale 5s linear 0s infinite alternate
  }
  @keyframes animScale {
    0% {
      transform:scale(0.5)
    }
    100% {
      transform:scale(1)
    }
  }

/*===== Tagline =====*/
/* Decorative Background Images */
.img-six {
  position: absolute;
  top: 80%;
  left: 7%;
  animation: rotationone 6s infinite linear;
}
@keyframes rotationone {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.img-seven {
  position:absolute;
  width: 12px;
  height: 13px;
  top: 15%;
  left: 15%;
  animation: animRight 5s linear 0s infinite alternate
}
@keyframes animRight {
  0% {
    transform:translateX(15px)
  }
  100% {
    transform:translateX(-15px)
  }
  
}
.img-eight {
  position: absolute;
  width: 25px;
  height: 26px;
  top: 7%;
  right: 30%;
  animation:animExtra 5s linear 0s infinite alternate
}
@keyframes animExtra {
  0% { 
    transform:rotate(0deg)
  }
  100% {
    transform:rotate(180deg)
  }
}
.img-nine {
  position: absolute;
  top: 100%;
  right: 0%;
  animation:animMoveTop 5s linear 0s infinite alternate
}
@keyframes animMoveTop {
  0% {
    transform:translateY(-15px)
  }
  100% {
    transform:translateY(15px)
  }
}

/* Text Highlight */
.wrapper {
  display: flex;
}
.text-effect {
  margin: auto;
}
.text-effect.no-js .background:before {
  transform: none;
}
.background {
  position: relative;
}
.background:before {
  position: absolute;
  content: '';
  z-index: -1;
  top: -2px;
  left: -5px;
  right: -5px;
  bottom: -2px;
  background-color: var(--bs-primary);
  transform-origin: 0;
  transform: scaleX(0);
  animation-name: background-out;
  animation-duration: .8s;
  animation-iteration-count: 1;
}
.text-effect.in-view .background:before {
  animation-name: background;
  animation-duration: .8s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
@keyframes background {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1) rotate(-1deg);
  }
}
@keyframes background-out {
  from {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}

/*========================================*/
/* Text Highlight Two */
.wrapperTwo {
  display: flex;
}
.text-effectTwo {
  margin: auto;
}
.text-effectTwo.no-jsTwo .backgroundTwo:before {
  transform: none;
}
.title {
  color: #fff;
  text-align: center;
}
.backgroundTwo {
  position: relative;
}
.backgroundTwo:before {
  position: absolute;
  content: '';
  z-index: -1;
  top: -2px;
  left: -5px;
  right: -5px;
  bottom: -2px;
  background-color: var(--bs-secondary);
  transform-origin: 0;
  transform: scaleX(0);
  animation-name: background-outTwo;
  animation-duration: .8s;
  animation-iteration-count: 1;
}
.text-effectTwo.in-view .backgroundTwo:before {
  animation-name: backgroundTwo;
  animation-duration: .8s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
@keyframes backgroundTwo {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1) rotate(1deg);
  }
}
@keyframes background-outTwo {
  from {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}
/* Text Highlight Three */
.wrapperThree {
  display: flex;
}
.text-effectThree {
  margin: auto;
}
.text-effectThree.no-jsThree .backgroundThree:before {
  transform: none;
}
.backgroundThree {
  position: relative;
}
.backgroundThree:before {
  position: absolute;
  content: '';
  z-index: -1;
  top: -2px;
  left: -5px;
  right: -5px;
  bottom: -2px;
  background-color: var(--bs-warning);
  transform-origin: 0;
  transform: scaleX(0);
  animation-name: background-outThree;
  animation-duration: .8s;
  animation-iteration-count: 1;
}
.text-effectThree.in-view .backgroundThree:before {
  animation-name: backgroundThree;
  animation-duration: .8s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
@keyframes backgroundThree {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1) rotate(1deg);
  }
}
@keyframes background-outThree {
  from {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}
/* Begin Cards */
/*===== Cards =====*/
.card-shadow {
  box-shadow: var(--bs-box-shadow);
}
.card:hover {
  box-shadow: var(--bs-box-shadow-sm);
}
.card-img-top {
  height: 250px;
}

/* Button Options */
.button-investor {
  margin: 0 auto;
  background-color: #ffef00;
  border: 0 solid #ffffff;
  box-sizing: border-box;
  color: #000000;
  display: flex;
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
  justify-content: center;
  line-height: 1.75rem;
  padding: .75rem 1.65rem;
  position: relative;
  text-align: center;
  width: 100%;
  max-width: 200px;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  touch-action: manipulation;
}

.button-investor:focus {
  outline: 0;
}

.button-investor:after {
  content: '';
  position: absolute;
  border: 2px solid #000000;
  bottom: 4px;
  right: 4px;
  width: calc(100% - 1px);
  height: calc(100% - 1px);
}

.button-investor:hover:after {
  bottom: 2px;
  left: 2px;
}

@media (min-width: 768px) {
  .button-investor {
    padding: .75rem 3rem;
    font-size: 1.25rem;
  }
}