clock.css

body{
	margin:0;
	background:url(bk.jpg) bottom;
	background-size : cover;
	display:flex;
	justify-content: center;
	align-items: center;
    min-height:100vh;
}
.clockBody{
	height:300px;
	width:300px;
	border:8px solid black;
	border-radius: 50%;
    position: relative;
	padding: 15px;
	box-shadow:
        inset 0 0 0 6px rgba(0,0,0,0.1), 
        inset 0 0 7px 2px #EFEFEF,
        inset 0 0 14px 6px black, 
        0 0 6px 9px rgba(0,0,0,0.2);
}

.hand{
	position:absolute;
	transform-origin: 100%;
	transform:rotate(90deg);
    transition:all 0.4s;
    transition-timing-function: cubic-bezier(0.71, 1.38, 0, 1.27);
}
.hourHand{
	border:3px solid #413752;
    width:27%;
    top:50%;
    left:21%;
}
.minuteHand{
	border:3px solid #413752;
    width:38%;
    top:50%;
    left:8%;
}
.secondHand{
	border:3px dashed #413752;
    width:42%;
    top:50%;
}