body {
    font-family: "Myriad Set Pro";
    background: rgba(25, 25, 35, 1.0);
}


.loader {
    position: relative;
    top: 25%;
    left: 5%;
    width: 10%;
    margin: auto;
}

.loader .circle {
    position: absolute;
    width: 60px;
    height: 60px;
    opacity: 0;
    transform: rotate(225deg);
    animation-iteration-count: infinite;
    animation-name: orbit;
    animation-duration: 5.5s;
}

.loader .circle:after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 8px;
    background: #fff;
    /* Pick a color */
}

.loader .circle:nth-child(2) {
    animation-delay: 200ms;
}

.loader .circle:nth-child(3) {
    animation-delay: 500ms;
}

.loader .circle:nth-child(4) {
    animation-delay: 800ms;
}

.loader .circle:nth-child(5) {
    animation-delay: 1100ms;
}

@keyframes orbit {
    0% {
        transform: rotate(225deg);
        opacity: 1;
        animation-timing-function: ease-out;
    }
    7% {
        transform: rotate(345deg);
        animation-timing-function: linear;
    }
    30% {
        transform: rotate(455deg);
        animation-timing-function: ease-in-out;
    }
    39% {
        transform: rotate(690deg);
        animation-timing-function: linear;
    }
    70% {
        transform: rotate(815deg);
        opacity: 1;
        animation-timing-function: ease-out;
    }
    75% {
        transform: rotate(945deg);
        animation-timing-function: ease-out;
    }
    76% {
        transform: rotate(945deg);
    }
    100% {
        transform: rotate(945deg);
    }
}

.kg-btn {

    border-radius: 4px;
    border: 1px solid #979797;
    padding-top: 0px;
    padding-bottom: 0px;
    height: 21px;

    font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
    color: #000000;
    font-size: 13px;
    line-height: 19px;

    display: inline-block;

}

.kg-btn-primary {
    border-top-color: #595b71;
    border-bottom-color: #515268;
    border-left-color: #56586f;
    border-right-color: #56586f;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0, #D3F7FD),
            color-stop(0.5, #87C5FB),
            color-stop(0.5, #A1D1F9),
            color-stop(1, #D4E9FC)
    );
    background-image: -moz-linear-gradient(
            center bottom,
            #D3F7FD 0%,
            #87C5FB 50%,
            #A1D1F9 50%,
            #D4E9FC 100%
    );
    -webkit-animation-name: blinking;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 1s;
    -moz-animation-name: blinking;
    -moz-animation-timing-function: ease-in-out;
    -moz-animation-iteration-count: infinite;
    -moz-animation-duration: 1s;
    animation-name: blinking;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 1s;


}


.kg-btn-primary:active {
    background-color: #EDEDED;
    background-image: none;

    /* Rectangle 20: */
    background-image: -o-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
    background-image: -moz-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
    background-image: -ms-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
    background-image: linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
    border: 1px solid #557BC8;
}