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

.clock .loader {
    width: 100px;
    height: 100px;
}
.clock .loader .arc {
    position: relative;
    margin: 23% 0 0 23%;
    border: 2px solid #4169E1;
    width: 50px;
    height: 50px;
    border-radius: 50%;
}
.clock .loader .arc::after, .clock .loader .arc::before {
    content: '';
    position: absolute;
    top: 4%;
    left: 48%;
    width: 4%;
    height: 46%;
    background-color: #4169E1;
    transform-origin: 50% 100%;
    border-radius: 5px;
    animation: rotate 2s infinite linear;
}
.clock .loader .arc::after {
    height: 36%;
    top: 14%;
    animation-duration: 12s;
}

.loader-container .loader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    }

* {
    margin: 0;
    padding: 0; }

#preloader {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 100500;
}