.clock {
    border-radius: 50%;
    background: #fff url(https://cssanimation.rocks/images/posts/clocks/ios_clock.svg) no-repeat center;
    background-size: 88%;
    height: 5em;
    position: relative;
    width: 5em;
    box-shadow:
            0 0 0 4px rgba(0,0,0,0.1),
            inset 0 0 0 3px #EFEFEF,
            inset 0 0 10px black,
            0 0 10px rgba(0,0,0,0.2);
    transition: all 1s;
    transform-origin: 50% 50%;
}

.clock:hover {
    transform: scale(1.5);
}



#clock {
    position:absolute;
    top: 600px;
    left: 980px;
}

.clock.simple::before {
    background: #000;
    border-radius: 50%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 5%;
    height: 5%;
    z-index: 10;
}

.clock.simple::after {
    background: red;
    border-radius: 50%;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 2%;
    height: 2%;
    z-index: 10;
}

.minutes-container, .hours-container, .seconds-container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.hours {
    border-radius: 85%/10%;
    position: absolute;
    background: #000;
    height: 20%;
    width: 2.5%;
    left: 48.75%;
    top: 30%;
    transform-origin: 50% 100%;
}

.minutes {
    border-radius: 150%/10%;
    position:absolute;
    background: #000;
    height: 40%;
    width: 2%;
    left: 49%;
    top: 10%;
    transform-origin: 50% 100%;
}

.seconds {
    border-radius: 150%/10%;
    position: absolute;
    background: red;
    height: 45%;
    width: 1%;
    left: 49.5%;
    top:14%;
    transform-origin: 50% 80%;
    z-index: 8;
}

@keyframes rotate {
    100% {
        transform: rotateZ(360deg);
    }
}

.hours-container {
    animation: rotate 43200s infinite linear;
}

.minutes-container {
    transition: transform 0.3s cubic-bezier(.4,2.08,.55,.44);
    /*animation: rotate 3600s infinite steps(60);*/
}

.seconds-container {
    transition: transform 0.2s cubic-bezier(.4,2.08,.55,.44);
    /*animation: rotate 60s infinite steps(60);*/
}