#main {
    margin: 50px 0px;
    text-align: center;
}
#clock {
    box-shadow: inset 5px 5px var(--grey-d-color), inset -5px -5px var(--white-color), 10px 10px 3px var(--grey-d-color);
    text-align: center;
    background-color: var(--main-bg-color);
    border: 10px solid var(--main-color);
    border-radius: 180px;
    height: 350px;
    width: 350px;
    margin: 0px calc(50vw - 180px);
}
#hour,#minute,#second,#center {
    background-color: var(--dark-green-color);
}
#hour,#s_hour {
    margin-top: 95px;
    margin-left: 170px;
    width: 10px;
    height: 80px;
}
#minute,#s_minute {
    margin-top: 45px;
    margin-left: 172.5px;
    width: 5px;
    height: 130px;
}
#second,#s_second {
    background-color: var(--main-color);
    margin-top: 25px;
    margin-left: 173.5px;
    width: 3px;
    height: 150px;
}
#center,#s_center {
    margin-top: 167.5px;
    margin-left: 167.5px;
    width: 15px;
    height: 15px;
}
#s_hour {
    margin-top: 100px;
    margin-left: 175px;
}
#s_minute {
    margin-top: 50px;
    margin-left: 177.5px;
}
#s_second {
    margin-top: 30px;
    margin-left: 178.5px;
}
#s_center {
    margin-top: 172.5px;
    margin-left: 171.5px;
}
#s_hour,#s_minute,#s_second,#s_center {
    background-color: #C6C6C2;
}
#s_hour,#s_minute,#s_second,#s_center,#hour,#minute,#second,#center {
    position: absolute;
    transform-origin: bottom;
    border-radius: 7.5px;
}
.scalebox {
    margin-top: 15px;
    margin-left: 173.5px;
    position: absolute;
    transform-origin: bottom;
    height: 160px;
    width: 2px;
}
.clear {
    background: transparent;
    width: 2px;
    height: 150px;
}
.scale {
    background-color: var(--main-color);
    border-radius: 1px;
    width: 2px;
    height: 10px;
}