@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&family=Noto+Sans+TC:wght@100..900&family=Noto+Serif+TC:wght@200..900&display=swap');

*{
    font-family: "Noto Sans TC";
}

body{
    background: linear-gradient(0deg,#000000 0%, #38372d 100%);
    background-size: cover;
    min-height: 100vh;
}

@media only screen and (min-width: 1200px) {
    body{ padding: 2rem 0; }
    iframe{
        width: 66.6% !important;
        height: 480px !important;
        display: block;
        margin: auto;
    }
    .mid{
        border: 0 !important;
    }
    .top{
        margin-bottom: 2rem;
    }
}

.ch-25{
    min-height: 27vh;
}
.ch-50{
    min-height: 46vh;
}

.mid{
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

h2{
    color: #FFF;
    font-size: 1.8rem;
    margin-bottom: 12pt;
}

p{
    color: #f3f3f3;
    margin-bottom: 6pt;
    font-size: 1.1rem;
    text-align: justify;
}

#lyricsDisplay p{
    color: #ffe87a;
    font-size: 2.2rem;
    font-family: "Noto Serif TC";
    font-weight: bold;
    text-align: center;
}

.sub{
    margin-top: 12pt;
    font-size: calc(2.2rem * 0.8) !important;
}
.sub::before{ content: '('; }
.sub::after{ content: ')'; }

iframe{
    width: 100%;
    height: 100%;
}