svg {
    margin-top:40vh;
    max-height: 60vh;
    overflow:visible;
}
path {
    fill: #204e81;
    stroke: #204e81;
    stroke-width: .2;
    transform: scale(0);
    transform-origin: 50% 50%;
    animation: star 8s ease-in-out infinite;
    animation-delay: calc( var(--no) * .025s );
    transform-box: fill-box;
}
@keyframes star {
    0% {
        transform: scale(0);
        animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
    }
    10% {
        transform: scale(1);
    }
    65% {
        transform: translateY(0px) scale(1);
    }
    75% {
        transform: translateY(50px) scale(0);
    }
    100% {
        transform: translateY( 0px ) scale(0);
    }
}

@media (max-width: 4350px) {
    svg {
        margin-top:40vh;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}

@media (max-width: 1250px) {
    svg {
        margin-top:40vh;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}
@media (max-width: 1200px) {
    svg {
        margin-top:40vh;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}
@media (max-width: 1100px) {
    svg {
        margin-top:40vh;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}
@media (max-width: 1024px) {
    svg {
        margin-top:40vh;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}
@media (max-width: 976px) {
    svg {
        margin-top:85vh;
        margin-left:20vw;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}
@media (max-width: 840px) {
    svg {
        margin-top:85vh;
        margin-left:20vw;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}
@media (max-width: 767px) {
    svg {
        margin-top:85vh;
        margin-left:20vw;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}
@media (max-width: 480px) {
    svg {
        margin-top:85vh;
        margin-left:20vw;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}


@media only screen and (-webkit-min-device-pixel-ratio: 2) {
    svg {
        margin-top:85vh;
        margin-left:20vw;
        max-height: 60vh;
        overflow:visible;
    }
    path {
        fill: #204e81;
        stroke: #204e81;
        stroke-width: .2;
        transform: scale(0);
        transform-origin: 50% 50%;
        animation: star 8s ease-in-out infinite;
        animation-delay: calc( var(--no) * .025s );
        transform-box: fill-box;
    }
    @keyframes star {
        0% {
            transform: scale(0);
            animation-timing-function: cubic-bezier(.74,1.72,.57,1.01)
        }
        10% {
            transform: scale(1);
        }
        65% {
            transform: translateY(0px) scale(1);
        }
        75% {
            transform: translateY(50px) scale(0);
        }
        100% {
            transform: translateY( 0px ) scale(0);
        }
    }
}