/**
 * CUSTOM CSS
 *
 * Here you can add your custom CSS code.
 */
.typewriter-text {
    white-space: nowrap;
    overflow: auto;
    display: inline-block;
}

.typewriter-text1 {
    animation: typewriter-text1;
}

.typewriter-text2 {
    animation: typewriter-text2;
}

.typewriter-text3 {
    animation: typewriter-text3;
}

.typewriter-text1,
.typewriter-text2,
.typewriter-text3 {
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;

    animation-duration: 15s;
    animation-timing-function: steps(25, end);
    animation-iteration-count: infinite;
}

.typewriter-text1::after,
.typewriter-text2::after,
.typewriter-text3::after {
    content: "|";
    animation: typewriter-caret infinite;
    animation-duration: 1s;
    animation-timing-function: steps(1, end);
}


@keyframes typewriter-text1 {

    0%,
    33%,
    66%,
    100% {
        width: 0;
        display: none;
    }

    10%, 30% {
        width: 5.5em;
        display: inline-block;
    }
}

@keyframes typewriter-text2 {

    0%,
    33%,
    66%,
    100% {
        display: none;
        width: 0;
    }

    40%,
    60% {
        width: 5.45em;
        display: inline-block;
    }
}

@keyframes typewriter-text3 {

    0%,
    33%,
    66%,
    100% {
        width: 0;
        display: none;
    }

    70%, 90% {
        width: 5.25em;
        display: inline-block;
    }
}



@keyframes typewriter-caret {

    0%,
    100% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }
}

.text-justify {
    text-align: justify;
    text-justify: inter-word;
}