html {
    scrollbar-width: none;
}

body {
    background-image: url(https://static.vecteezy.com/system/resources/previews/022/751/187/non_2x/snowy-mountain-peak-in-starry-night-amazing-night-sky-over-mountain-vector.jpg);
    image-rendering: smooth;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    background-attachment: fixed;
    font-family: Helvetica;
    display: flex;
    justify-content: center;
}

#clock-container {
    margin: 0 auto;
    padding: 2em;
    width: 300px;
    background: transparent;
    backdrop-filter: blur(4px);
    text-align: center;
    border-radius: 10px;
    position: absolute;
    border: solid 2px rgb(255, 255, 255);
    position: absolute;
    top: 45%;
    background-color: #29292927;
    color: white;
}

.topbar {
    background-color: #ffffff27;
    width: 100vh;
    height: 27px;
    text-align: center;
    border-radius: 10px;
    border: solid 1px rgb(255, 255, 255);
    position: absolute;
}

#clock {
    font-size: 34px;
}

#clock:hover {
    font-size: 40px;
    color: rgb(163, 237, 255);
}

.maindiv {
    background-color: #18181817;
    width: 400px;
    height: 300px;
    text-align: center;
    position: absolute;
    top: 60px;
    border-radius: 10px;
    border: white 1px solid;
}

h1 {
    color: #ffffff;
}

p {
    color: #d1d1d1
}

a {
    color: #01618d;
    text-decoration: none;
    border-right: 0.1px solid rgb(255, 255, 255);
    border-left: 0.1px solid rgb(255, 255, 255);
    padding: 0 4px;
}

a:hover {
    color: #42afca;
}

#titleh1 {
    top: 30px;
    color: #95e6ff;
    font-size: 44px;
}

#titleh1:hover {
    top: 30px;
    color: #a8ebff;
    font-size: 48px;
}

.subtitle {
    font-size: 12px;
    color: rgb(70, 121, 141);
}

.subtitle:hover {
    font-size: 19px;
    color: rgb(92, 155, 180);
}

.sited {
    position: absolute;
    bottom: 3px;
    left: 3px;
    color: gray;
    font-size: 6px;
}

.sited:hover {
    color: rgb(201, 201, 201);
    font-size: 12px;
}

.info:hover {
    color: white;
    font-size: 18px;
}

.notbyai {
    width: 20px;
    height: 20px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    background-color: transparent;
}


.notbyai:hover {
    width: 160px;
    height: 160px;
}

audio {
    position: absolute;
    bottom: 35px;
    background-color: none;
}

.bgm {
    position: absolute;
    bottom: 65px;
}