/* @import url(comment.css); */

.chapter-content p {
    @apply flex flex-wrap overflow-hidden break-words text-left;

    display: flex !important;
    flex-wrap: wrap !important;
    overflow: hidden !important;
    overflow-wrap: break-word !important;
    text-align: left !important;
}

.chapter-content p::before {
    content: "ㅤ";
    display: flex;
    width: 100%;
    line-height: 200%;
    order: 0;
}

.chapter-content p:first-child:before {
    display: none;
}

.chapter-content img {
    margin: 0px auto;
}

.leading-100 .chapter-content {
    line-height: 100% !important;
}

.leading-110 .chapter-content {
    line-height: 110% !important;
}

.leading-120 .chapter-content {
    line-height: 120% !important;
}

.leading-130 .chapter-content {
    line-height: 130% !important;
}

.leading-140 .chapter-content {
    line-height: 140% !important;
}

.leading-150 .chapter-content {
    line-height: 150% !important;
}

.leading-160 .chapter-content {
    line-height: 160% !important;
}

.leading-170 .chapter-content {
    line-height: 170% !important;
}

.leading-180 .chapter-content {
    line-height: 180% !important;
}

.leading-190 .chapter-content {
    line-height: 190% !important;
}

.leading-200 .chapter-content {
    line-height: 200% !important;
}

.txtxl .chapter-content {
    @apply text-xl;

    font-size: 20px;
    line-height: 28px;
}

.txt2xl .chapter-content {
    @apply text-size23;

    font-size: 23px;
    line-height: 27px;
}

.txt3xl .chapter-content {
    @apply text-3xl;

    font-size: 30px;
    line-height: 36px;
}

.txt4xl .chapter-content {
    @apply text-4xl;

    font-size: 36px;
    line-height: 40px;
}

.txt5xl .chapter-content {
    @apply text-5xl;

    font-size: 48px;
    line-height: 1;
}

.font1 .chapter-content {
    font-family: 'Palatino Linotype', sans-serif;
}

.font2 .chapter-content {
    font-family: 'Source Sans Pro', sans-serif
}

.font3 .chapter-content {
    font-family: 'Segoe UI', sans-serif
}

.font4 .chapter-content {
    font-family: 'Roboto', sans-serif
}

.font5 .chapter-content {
    font-family: 'Patrick Hand', sans-serif
}

.font6 .chapter-content {
    font-family: 'Noticia Text', sans-serif
}

.font7 .chapter-content {
    font-family: 'Times New Roman', sans-serif
}

.font8 .chapter-content {
    font-family: Verdana, sans-serif
}

.font9 .chapter-content {
    font-family: Tahoma, sans-serif
}

.font10 .chapter-content {
    font-family: Arial, sans-serif
}

.my_bg_tf_1 {
    background-color: #F4F4F4
}

.my_border_tf_1 {
    border-color: #F4F4F4
}

.my_bg_tf_2 {
    background-color: #E9EBEE
}

.my_border_tf_2 {
    border-color: #E9EBEE
}

.my_bg_tf_3 {
    background-color: #F4F4E4
}

.my_border_tf_3 {
    border-color: #F4F4E4
}

.my_bg_tf_4 {
    background-color: #EAE4D3
}

.my_border_tf_4 {
    border-color: #EAE4D3
}

.my_bg_tf_5 {
    background-color: #D5D8DC
}

.my_border_tf_5 {
    border-color: #D5D8DC
}

.my_bg_tf_6 {
    background-color: #FAFAC8
}

.my_border_tf_6 {
    border-color: #FAFAC8
}

.my_bg_tf_7 {
    background-color: #EFEFAB
}

.my_border_tf_7 {
    border-color: #EFEFAB
}

.my_bg_tf_8 {
    background: url(/images/bg-hat-san.png)
}

.my_border_tf_8 {
    border-color: #ccc;
}

.my_bg_tf_9 {
    background: url(/images/bg-sach-cu.png)
}

.my_border_tf_9 {
    border-color: #ccc;
}

.my_bg_tf_10 {
    background: url(/images/bg-mau-toi.gif)
}

.my_border_tf_10 {
    border-color: #ffffff;
}

/*bg-bg_light_2 dark:bg-bg_dark*/
chapter-page {
    @apply bg-bg_light_2;

    background-color: rgb(245 245 245);
}

html.dark .chapter-page {
    @apply bg-bg_dark;

    background-color: rgb(18 18 18);
}

.tf_1 .chapter-page {
    background-color: #F4F4F4 !important;
}

.tf_2 .chapter-page {
    background-color: #E9EBEE !important;
}

.tf_3 .chapter-page {
    background-color: #F4F4E4 !important;
}

.tf_4 .chapter-page {
    background-color: #EAE4D3 !important;
}

.tf_5 .chapter-page {
    background-color: #D5D8DC !important;
}

.tf_6 .chapter-page {
    background-color: #FAFAC8 !important;
}

.tf_7 .chapter-page {
    background-color: #EFEFAB !important;
}

.tf_8 .chapter-page {
    background: url(/images/bg-hat-san.png) !important;
}

.tf_9 .chapter-page {
    background: url(/images/bg-sach-cu.png) !important;
}

.tf_10 .chapter-page {
    background: url(/images/bg-mau-toi.gif) !important;
}

.chapter-body {
    @apply border-bd_light bg-bg_light;

    border-color: rgb(237 237 237);
    background-color: rgb(255 255 255);
}

html.dark .chapter-body {
    @apply border-bd_dark bg-bg_dark_2;

    border-color: rgb(37 37 37);
    background-color: rgb(27 27 27);
}

.tf_1 .chapter-body,
.tf_2 .chapter-body,
.tf_3 .chapter-body,
.tf_4 .chapter-body,
.tf_5 .chapter-body,
.tf_6 .chapter-body,
.tf_7 .chapter-body,
.tf_8 .chapter-body,
.tf_9 .chapter-body {
    /* border-color: transparent !important; */
    /* border-color: rgb(237 237 237) !important; */
    background-color: transparent !important;
}

.tf_10 .chapter-body {
    /* border-color: transparent !important; */
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.6) !important;
}

html.dark.tf_1 .chapter-body,
html.dark.tf_2 .chapter-body,
html.dark.tf_3 .chapter-body,
html.dark.tf_4 .chapter-body,
html.dark.tf_5 .chapter-body,
html.dark.tf_6 .chapter-body,
html.dark.tf_7 .chapter-body,
html.dark.tf_8 .chapter-body,
html.dark.tf_9 .chapter-body {
    /* border-color: transparent !important; */
    color: rgb(43, 43, 43) !important;
}

html.dark.tf_10 .chapter-body {
    /* border-color: transparent !important; */
    color: inherit;
}

.chapter-tool {
    @apply text-txt_light;

    --tw-text-opacity: 1 !important;
    color: rgb(42 46 46 / var(--tw-text-opacity)) !important;
}

html.dark .chapter-tool {
    @apply text-txt_dark;

    --tw-text-opacity: 1 !important;
    color: rgb(172 172 172 / var(--tw-text-opacity)) !important;
}