body{
    margin:0;
    min-height: 100vh;
    font-family: system-ui;
    color:#eee;
    display: flex;
    justify-content: center;
    align-items: center;
}
.container{
    text-align: center;
}
.logo img{
    width:90px
}
h1{
    font-size: xxx-large;
    font-weight: 100;
}
.time .item{
    position: relative;
    background: #ffffff29;
    border-radius: 11px;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
.time{
    display: grid;
    grid-template-columns: 100px 100px 100px 100px;
    column-gap: 20px;
    grid-template-rows: 100px;
    justify-content: center;
}
#day,
#hour,
#minute,
#seconds{
    font-size: xxx-large;
    font-weight: bold;
}
.time .item::before,
.time .item::after
{
    position: absolute;
    width:6px;
    height:20px;
    background-color: #6a6a6a;
    content:'';
    left:0;
    top:50%;
    transform: translate(0,-50%);
}
.time .item::after{
    left: unset;
    right:0;
}