.tekst-1 {
    animation: text1;
}

.tekst-2{
    animation: text2;
}

.tekst-1, .tekst-2 {
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;
    position: relative;
    animation-duration: 12s;
    animation-timing-function: steps(25, end);
    animation-iteration-count: infinite;
}

.tekst-1::after, .tekst-2::after {
    content: "|";
    position: absolute;
    right: 0;
    animation: caret infinite;
    animation-duration: 1s;
    animation-timing-function: steps(1, end);
}

#sekcija-drustvene-mreze, .recenzije-slajder {
    animation: pulsiranje 1s infinite ease-in-out alternate;
}

.logo {
  animation: pulsiranje2 0.7s infinite ease-in-out alternate;
}

@keyframes pulsiranje {
    from { transform: scale(0.95); }
    to { transform: scale(1.0); }
}

@keyframes pulsiranje2 {
  from { transform: scale(0.95); }
  to { transform: scale(1.1); }
}


@keyframes text2 {

    0%, 50%, 100% {
      width: 0;
    }
    
    60%, 90% {
      width: 10.2em;
    }
}

@keyframes text1 {

    0%, 50%, 100% {
      width: 0;
    }
    10%, 40% {
      width: 7.3em;
    }
}

@keyframes typewriter {

    0%, 100% {
      width: 0;
    }
    20%, 80% {
      width: 10.2em;
    }
}

@keyframes caret {

    0%, 100% {
      opacity: 0;
    }
    50% {
      opacity: 1;
    }
}