body #playphone-loading {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    font-size: 14px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    display: block;
    z-index: 2000;
    background: #31a0e7;
    
}

#playphone-loading .loader {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    box-sizing: border-box;
    border-width: 2px;
    border-style: solid;
    border-color: #fff #fff #fff transparent;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    -webkit-animation: spinner-default 2s linear infinite;
    -moz-animation: spinner-default 2s linear infinite;
    -ms-animation: spinner-default 2s linear infinite;
    -o-animation: spinner-default 2s linear infinite;
    animation: spinner-default 2s linear infinite;
}

body.initialized #playphone-loading {
    background: rgba(255,255,255,.5);
}

body.initialized #playphone-loading .loader {
    border-color: #31a0e7 #31a0e7 #31a0e7 transparent;
}

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

@-moz-keyframes spinner-default {
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-ms-keyframes spinner-default {
    100% {
        -ms-transform: rotate(360deg);
    }
}

@-o-keyframes spinner-default {
    100% {
        -o-transform: rotate(360deg);
    }
}

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