/*-------------------------------- typed --------------------------------*/
.typed-container {
  display: inline-block;
  text-align: left;
  width: 120px;
}

.typed-wrapper {
  display: inline-block;
  position: relative;
}

.typed-wrapper b {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
  left: 0;
  top: 0;
}

.typed-wrapper b.show {
  position: relative;
}

.headline.type .typed-wrapper {
  vertical-align: top;
  overflow: hidden;
}

.headline.type .typed-wrapper::after {
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 90%;
  width: 1px;
  background-color: rgba(11, 164, 236, 0.7);
}

.headline.type .typed-wrapper.wait::after {
  -webkit-animation: typed 1s infinite;
  -moz-animation: typed 1s infinite;
  animation: typed 1s infinite;
}

.headline.type .typed-wrapper.select {
  background-color: rgb(255, 252, 207);
}

.headline.type .typed-wrapper.select::after {
  visibility: hidden;
}

.headline.type .typed-wrapper.select b {
  color: #0d0d0d;
}

.headline.type b {
  visibility: hidden;
}

.headline.type b.show {
  visibility: visible;
}

.headline.type i {
  position: absolute;
  visibility: hidden;
  font-style: normal;
}

.headline.type i.in {
  position: relative;
  visibility: visible;
}

@-webkit-keyframes typed {
  0% {
    -webkit-transform: translateY(-50%) scale(1);
    opacity: 1;
  }

  40% {
    -webkit-transform: translateY(-50%) scale(0.9);
    opacity: 0;
  }

  100% {
    -webkit-transform: translateY(-50%) scale(0);
    opacity: 0;
  }
}

@-moz-keyframes typed {
  0% {
    -moz-transform: translateY(-50%) scale(1);
    opacity: 1;
  }

  40% {
    -moz-transform: translateY(-50%) scale(0.9);
    opacity: 0;
  }

  100% {
    -moz-transform: translateY(-50%) scale(0);
    opacity: 0;
  }
}

@keyframes typed {
  0% {
    -webkit-transform: translateY(-50%) scale(1);
    -moz-transform: translateY(-50%) scale(1);
    -ms-transform: translateY(-50%) scale(1);
    -o-transform: translateY(-50%) scale(1);
    transform: translateY(-50%) scale(1);
    opacity: 1;
  }

  40% {
    -webkit-transform: translateY(-50%) scale(0.9);
    -moz-transform: translateY(-50%) scale(0.9);
    -ms-transform: translateY(-50%) scale(0.9);
    -o-transform: translateY(-50%) scale(0.9);
    transform: translateY(-50%) scale(0.9);
    opacity: 0;
  }

  100% {
    -webkit-transform: translateY(-50%) scale(0);
    -moz-transform: translateY(-50%) scale(0);
    -ms-transform: translateY(-50%) scale(0);
    -o-transform: translateY(-50%) scale(0);
    transform: translateY(-50%) scale(0);
    opacity: 0;
  }
}


#typos  { 
font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #fff;
  font-sirrze: 56px;
  font-weight: bold;
  padding: 0 20px;
margin-top: 10vw;
  margin-bottom: 20px;
font-size: 6vw;
line-height: 7vw;
text-transform: none;

  -webkit-text-stroke-width: 3px;
  -webkit-text-stroke-color: #463a54;

}

@media screen and (max-width: 768px) {
#typos  { 

 -webkit-text-stroke-width: 1px;

}

}

@media screen and (min-width: 769px) {
#typos  { 

 -webkit-text-stroke-width: 2px;

}

}


@media screen and (min-width: 1040px) {
#typos  { 

 -webkit-text-stroke-width: 3px;

}

}


