html {
    font-family: Arial;
    height: 100%;
    background: #b3dced; /* Old browsers */
    background: -moz-linear-gradient(top, #b3dced 0%, #29b8e5 59%, #bce0ee 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #b3dced), color-stop(59%, #29b8e5), color-stop(100%, #bce0ee)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #b3dced 0%, #29b8e5 59%, #bce0ee 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #b3dced 0%, #29b8e5 59%, #bce0ee 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #b3dced 0%, #29b8e5 59%, #bce0ee 100%); /* IE10+ */
    background: linear-gradient(to bottom, #b3dced 0%, #29b8e5 59%, #bce0ee 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3dced', endColorstr='#bce0ee', GradientType=0); /* IE6-9 */
}

.spinner {
    margin: auto;
    display: none;
    width: 70px;
    text-align: center;
}

.spinner > div {
    width: 8px;
    height: 8px;
    background-color: #333;

    border-radius: 100%;
    display: inline-block;
    -webkit-animation: bouncedelay 1.4s infinite ease-in-out;
    animation: bouncedelay 1.4s infinite ease-in-out;
    /* Prevent first frame from flickering when animation starts */
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.spinner .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.spinner .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

@-webkit-keyframes bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0.0)
    }
    40% {
        -webkit-transform: scale(1.0)
    }
}

@keyframes bouncedelay {
    0%, 80%, 100% {
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    }
    40% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
    }
}

.noty_message {
    font-size: 1.2em !important;
}