*{
    margin: 0;
    padding: 0;
}
#clockbody{
/* border: 5px solid green; */
background: url("clock.png") no-repeat center/cover;
background-size: 100%;
height: 40vw; 
width: 40vw;
margin: 4rem auto;
position: relative;

}

#hour {
        /* background-color: black;
        height: 11vw;
        margin: 24% auto;
        width: 2vw;     
        border-radius: 2rem;
    position: absolute; */

    left: 48.2%;
    background-color: black;
    height: 30%;
    margin: auto;
    width: 3.2%;
    top: 19.7%;
    /* margin-top: 24%; */
    border-radius: 2.5rem;
    position: absolute;
    /* z-index: 1;*/
    transform-origin: bottom;
 
}

#min{
        
    left: 48.8%;
    background-color: rgb(49, 167, 137);
    height: 34%;
    margin: auto;
    width: 2%;
    top: 16.3%;
    /* margin-top: 24%; */
    border-radius: 2rem;
    position: absolute;
    z-index: 1;
    transform-origin: bottom;
    /* display: none; */
    
   
}
#sec{
    /* display: none; */
    left: 49.3%;
    background-color: rgba(255, 47, 245, 0.658);
    height: 42%;
    margin: auto;
    width: 1%;
    top: 8.2%;
    /* margin-top: 24%; */
    border-radius: 2rem;
    position: absolute;
    z-index: 2;
    transform-origin: bottom;

}