html {
    font-size: 10px
}

body {
    background-color: #002644;
}

.container {}

.neon-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 10vw;
    color: #fff;
    animation: pulsate 0.11s ease-in-out infinite alternate;
    text-shadow:
        0 0 7px #fff,
        0 0 10px #fff,
        0 0 21px #fff,
        0 0 42px #5b7b97,
        0 0 82px #5b7b97,
        0 0 92px #5b7b97,
        0 0 102px #5b7b97,
        0 0 151px #5b7b97;
}

@media (max-width: 1000px) {
    .neon-text {
        font-size: 15vw;
    }
}

@media (min-width: 1200px) {
    .neon-text {
        font-size: 6vw;
    }
}

@keyframes pulsate {

    100% {
        text-shadow:
            0 0 4px #fff,
            0 0 11px #fff,
            0 0 19px #fff,
            0 0 40px #5b7b97,
            0 0 80px #5b7b97,
            0 0 90px #5b7b97,
            0 0 100px #5b7b97,
            0 0 150px #5b7b97;
    }

    0% {
        text-shadow:
            0 0 4px #fff,
            0 0 10px #fff,
            0 0 18px #fff,
            0 0 38px #5b7b97,
            0 0 73px #5b7b97,
            0 0 80px #5b7b97,
            0 0 94px #5b7b97,
            0 0 140px #5b7b97;
    }
}