CSSでローディングのぐるぐるの大きいやつを作ってみた

この画像が延々とぐるぐるしてくれます

html

<div id="loading"></div>

css3

    #loading{
        width: 200px;
        height: 200px;

        /* 色の設定 */
        background-color: #fff;

        /* 円にする*/
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -o-border-radius: 50%;

        box-shadow: 150px 0px 0px -90px #0ee, 105px 105px 0px -90px #0ee, 0px 150px 0px -85px #0ee, -105px 105px 0px -85px #0ee, -150px 0px 0px -80px #0ee, -105px -105px 0px -80px #0ee, 0px -150px 0px -75px #0ee, 105px -105px 0px -75px #0ee;
        position: absolute;

        top: 37%;
        left: 45%;

        animation: spin 3s linear infinite;
    }

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