.clock {
     background: url('/assets/img/ios_clock.svg') no-repeat center;
     background-size: 83%;
     height:270px;
     margin:auto;
     position: relative;
     width:270px;
     border-radius:50%;
     background-color:rgba(255, 255, 255, 0.9);
}
 .minutes-container, .hours-container, .seconds-container {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
}
 .hours {
     background: #505050;
     height: 20%;
     left: 48.75%;
     position: absolute;
     top: 30%;
     transform-origin: 50% 100%;
     width: 2.5%;
     border-radius:150%/25%;
}
 .minutes {
     background: #505050;
     height: 40%;
     left: 49%;
     position: absolute;
     top: 10%;
     transform-origin: 50% 100%;
     width: 2%;
     border-radius:150%/8%;
}
 .seconds {
     background: red ;
     height: 45%;
     left: 49.5%;
     position: absolute;
     top: 14%;
     transform-origin: 50% 80%;
     width: 1%;
     z-index: 8;
     border-radius:150%/5%;
}
 .round {
     background: red ;
     height: 6.5%;
     width: 6.5%;
     top: 46.75%;
     left:46.75%;
     position: absolute;
     border-radius: 50%;
}
 .hours-container {
     animation: rotate 2s ease-in-out;
}
 .minutes-container {
     animation:rotate 2s ease-in-out;
     animation-direction: alternate-reverse;
     transition: 0.3s cubic-bezier(.4,2.08,.55,.44);
}
 .seconds-container {
     animation: rotate 2s ease-in-out;
     transition: transform 0.2s cubic-bezier(.4,2.08,.55,.44);
}
 @keyframes rotate {
     100% {
         transform: rotateZ(360deg);
    }
}