@-webkit-keyframes app-circular-rotate {
    0% {
        transform-origin: 50% 50%;
    }
    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes app-circular-dash {
    0% {
        stroke-dasharray: 1px, 200px;
        stroke-dashoffset: 0;
    }
    50% {
        stroke-dasharray: 100px, 200px;
        stroke-dashoffset: -15px;
    }
    100% {
        stroke-dasharray: 100px, 200px;
        stroke-dashoffset: -125px;
    }
}

html, body {
    height: 100%;
    padding: 0;
    margin: 0;
    background: #fff;
    color: #004874;
}

#root {
    min-height: 100%;
    position: relative;
    display: flex;
}

.app-ldr-nd.hide {
    opacity: 0;
    visibility: hidden;
}

.app-ldr-nd.hide.invisible {
    display: none;
}

.app-ldr-nd {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    display: flex;
    background: #fff;
    opacity: 1;
    transition: all .5s ease;
    z-index: 9999999;
}

.app-ldr {
    margin: auto;
    width: 240px;
    height: 240px;
    position: relative;
    overflow: hidden;
}

.app-crl {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    color: #004874;
    animation: app-circular-rotate 1.4s linear infinite;
}

.app-crl-c {
    animation: app-circular-dash 1.4s ease-in-out infinite;
    stroke-dasharray: 80px, 200px;
    stroke-dashoffset: 0;
    stroke: currentColor;
}

.app-svg {
    display: block;
}

.app-crl-2 {
    top: 4%;
    left: 4%;
    width: 92%;
    height: 92%;
    animation-delay: .05s;
}

.app-crl-3 {
    width: 86%;
    height: 86%;
    top: 7%;
    left: 7%;
    animation-delay: .15s;
}

.app-ldr-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 160px;
    overflow: hidden;
    transform: translate(-50%, -50%)
}