@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300&display=swap');

.grow-parent {
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #101010;
}


.grow-parent p {
    font-size: 2rem;
    color: lightblue;
    text-shadow: 5px 5px 30px blue;
    font-family: 'Open Sans Condensed', sans-serif;
    animation-name: repeat;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    font-weight: lighter;
}

@keyframes repeat {

    0% {
        color: lightblue;
        text-shadow: 5px 5px 30px lightblue;
    }

    20% {
        color: #45aaf2;
        text-shadow: 5px 5px 30px #45aaf2;
    }

    40% {
        color: #2d98da;
        text-shadow: 5px 5px 30px #2d98da;
    }

    60% {
        color: #4b7bec;
        text-shadow: 5px 5px 30px #2d98da;
    }

    80% {
        color: #3867d6;
        text-shadow: 5px 5px 30px #3867d6;
    }

    100% {
        color: lightblue;
        text-shadow: 5px 5px 30px lightblue;
    }
}


/*https://codepen.io/webstoryboy/pen/rrLdQX*/
@import url('https://fonts.googleapis.com/css?family=Russo+One');

.svg-parent {
    background: #e3f2fd ;
    position: relative;
    
}

    .svg-parent svg {
        font-family: 'Russo One', sans-serif;
        position: relative;
        width: 100%;
        height: 6vh;
    }

    .svg-parent svg text {
        text-transform: uppercase;
        animation: stroke 5s infinite alternate;
        stroke-width: 1;
        stroke: #365fa0;
        font-size: 3vh;
    }

@keyframes stroke {
    0% {
        fill: rgba(72,138,20,0);
        stroke: rgba(54,95,160,1);
        stroke-dashoffset: 25%;
        stroke-dasharray: 0 50%;
        stroke-width: 2;
    }

    70% {
        fill: rgba(72,138,20,0);
        stroke: rgba(54,95,160,1);
    }

    80% {
        fill: rgba(72,138,20,0);
        stroke: rgba(54,95,160,1);
        stroke-width: 3;
    }

    100% {
        fill: rgba(72,138,204,1);
        stroke: rgba(54,95,160,0);
        stroke-dashoffset: -25%;
        stroke-dasharray: 50% 0;
        stroke-width: 0;
    }
}