body {
        background: #EEE;
    }

    .container {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
    }

    .spinner-container {
        -webkit-animation: rotate 2s linear infinite;
        animation: rotate 2s linear infinite;
        z-index: 2;
        width: 65px;
        height: 65px;
        margin: 100px auto;
        display: block;
    }

    .spinner-container .path {
        stroke-dasharray: 1, 150;
        /* 1%, 101% circumference */
        stroke-dashoffset: 0;
        stroke: #0275d8;
        stroke-linecap: round;
        -webkit-animation: dash 1.5s ease-in-out infinite;
        animation: dash 1.5s ease-in-out infinite;
    }

    @keyframes rotate {
        100% {
            transform: rotate(360deg);
        }
    }

    @-webkit-keyframes rotate {
        100% {
            -webkit-transform: rotate(360deg);
        }
    }

    @keyframes dash {
        0% {
            stroke-dasharray: 1, 150;
            /* 1%, 101% circumference */
            stroke-dashoffset: 0;
        }
        50% {
            stroke-dasharray: 90, 150;
            /* 70%, 101% circumference */
            stroke-dashoffset: -35;
            /* 25% circumference */
        }
        100% {
            stroke-dasharray: 90, 150;
            /* 70%, 101% circumference */
            stroke-dashoffset: -124;
            /* -99% circumference */
        }
    }

    @-webkit-keyframes dash {
        0% {
            stroke-dasharray: 1, 150;
            /* 1%, 101% circumference */
            stroke-dashoffset: 0;
        }
        50% {
            stroke-dasharray: 90, 150;
            /* 70%, 101% circumference */
            stroke-dashoffset: -35;
            /* 25% circumference */
        }
        100% {
            stroke-dasharray: 90, 150;
            /* 70%, 101% circumference */
            stroke-dashoffset: -124;
            /* -99% circumference */
        }
    }