@import url("https://rsms.me/inter/inter.css");

html {
    /* Some notes:
    Noto Sans CJK TC & Source Han Sans TC (aka 思源黑體 香港) are basically the same font. Used in Android devices.
     - https://github.com/adobe-fonts/source-han-sans
    PingFang HK (aka 蘋方-港) is used for macOS/iOS/iPadOS devices as this is their system font.
     - https://zh.wikipedia.org/wiki/%E8%8B%B9%E6%96%B9
    Microsoft JhengHei (aka 微軟正黑體) is used for Microsoft-related devices as this is their system font.
     - https://zh.wikipedia.org/wiki/%E5%BE%AE%E8%BB%9F%E6%AD%A3%E9%BB%91%E9%AB%94
    */
    font-family: "Inter", "Source Han Sans TC", "PingFang HK", "Microsoft JhengHei", "Noto Sans CJK TC", sans-serif;
    font-size: large;   
    /* Colors with less contrast for a11y */
    background-color: #212121;
    color: #F4F4F4;
}
body {
    height: 100vh;
    /* Note to self: Use `auto` to avoid the site being just a lil taller than the viewport */
    margin: auto 5%;
}
a {
    color: darkseagreen;
    /* Remove deep-blue colors for clicked links */
    text-decoration: none;
    /* Color transition to darkorange */
    transition: color .2s ease-in;
}
a:hover {
    color: darkorange;
}
audio {
    width: 50%;
}
#centre-on-page {
    height: 100%;
    /* Force an element to be exactly in the middle */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
footer {
    position: absolute;
    bottom: 50px;
}
footer p {
    margin-left: 16px;
}