@font-face {
    font-family: "riwenlogo";
    src: url("../fonts/RiWenLOGO.ttf");
}

@font-face {
    font-family: "chei2hks-xbold";
    src: url("../fonts/CHei2HKS-Xbold.otf");
}

@font-face {
    font-family: "chei2hk-xbold";
    src: url("../fonts/CHei2HK-Xbold.ttf");
}

html[lang="en"] .header .desktop-menu,
html[lang="en"] .header .mobile-menu {
    font-family: "riwenlogo";
}

html[lang="zh-Hant"] .page-sub-title-text {
    font-family: "chei2hk-xbold";
}

html[lang="zh"] .page-sub-title-text {
    font-family: "chei2hks-xbold";
}

.riwenlogo {
    font-family: "riwenlog";
}

.chei2hks-xbold {
    font-family: "chei2hks-xbold";
}

.mheihks-xbold {
    font-family: "mheihks-xbold";
}

html.custom-fonts-small {
    font-size: 85%;
}

html.custom-fonts-middle {
    font-size: 100%;
}

html.custom-fonts-large {
    font-size: 115%;
}

.header .active {
    background-color: white;
    position: relative;
    color: #f2672e;
}
.header .active a {
    position: relative;
    z-index: 1;
    border: none;
}

.header .active::after {
    content: "";
    display: block;
    position: absolute;
    height: 100%;
    width: 110%;
    top: 0;
    left: -5%;
    background-color: white;
    box-shadow: 0 0 10px #f2672e;
    transform: skew(-10deg);
}

label.error {
    display: block;
    font-size: 18px;
    color: #f2672e;
}

.highlight-dollar {
    display: inline-block;
    font-size: 1.5rem;
    border-radius: 99999px;
    background: rgb(0, 104, 137);
    color: #ffffff;
    margin: 0 6px;
    padding: 0 20px;
    color: rgb(254, 240, 138);
    font-weight: bold;
}
