:root {
    --red: #980B0B;
    --gold: #A09258;
}

@font-face {
    font-family: "MStiffHeiHK-UltraBold";
    src:
        src: url("/font/MStiffHeiHK-UltraBold.eot");
    /* IE9*/
    src: url("/font/MStiffHeiHK-UltraBold.eot?#iefix") format("embedded-opentype"),
        /* IE6-IE8 */
        url("/font/MStiffHeiHK-UltraBold.woff2") format("woff2"),
        /* chrome、firefox */
        url("/font/MStiffHeiHK-UltraBold.woff") format("woff"),
        /* chrome、firefox */
        url("/font/MStiffHeiHK-UltraBold.ttf") format("truetype"),
        /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
        url("/font/MStiffHeiHK-UltraBold.svg#MStiffHeiHK-UltraBold") format("svg");
    /* iOS 4.1- */
}

body {
    background:#cec5ac url(../img/bg.png) no-repeat center top / cover;
    margin: 0;
    padding: 0;
    font-size:16rem;
}

html,
* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html,
body {
    font-family: MStiffHeiHK-UltraBold, Geneva, Tahoma, sans-serif;
    font-size: 16px;
/*    -webkit-text-fill-color: #0f3878;*/
    -webkit-text-stroke-width: 0.1px;
    -webkit-text-stroke-color: #fff;
}
p {
    font-size: 2rem;
}
label,
.text-red {
    color: var(--red) !important;
}
.text-gold {
    color: var(--gold) !important;
}
#ticketno {
    font-size: 140%;
    line-height: 1.5;;
    color: var(--gold) !important;
}

.btn-img {
    transition: all 0.5s ease-in-out;
}
.btn-img:hover {
    transform: scale(1.1);
}

.quote-limit-confirm {
    width: 100%;
    height: 165px;
    background: url(../img/limit-reached-checkbox.png) no-repeat center center / contain;padding-top: 80px;
    box-sizing: border-box;
    display: block;
}
.quote-limit {
    width: 100%;
    height: 165px;
    background: url(../img/limit-reached.png) no-repeat center center / contain;
}

#flush-headingOne::before {
    content: "";
    display: block;
    width: 100%;
    height: 10px;
    background: url(../img/red-dot.png) repeat-x center center / cover;
    margin-bottom:10px;
}
#flush-headingOne::after {
    content: "";
    display: block;
    width: 100%;
    height: 10px;
    background: url(../img/red-dot.png) repeat-x center center / cover;
    margin-top:10px;
}
.accordion-item {
    background: none;
}
.accordion-button {
    background: transparent;
    text-align: center;
    color:var(--red);
    font-size: 2rem;
}
.accordion-button:not(.collapsed) {
    background: transparent;
    color:var(--red);
    box-shadow: none;
}
.accordion-button::after,
.accordion-button:not(.collapsed)::after {
    background-image: url(../img/arrow-down.png);
}
ul.prize-list {
    list-style: none;
}
ul.prize-list li {
    list-style: none;
    color:var(--red);
    font-size: 1.4rem;
    line-height: 1.5;
}
ul.prize-list li::before {
    content: "-";
    display: inline-block;
    margin-right: 1rem;
}
.btn-link.btn-back {
    z-index: 10;
}
.app__layout-content video {
    height: 120vh;
}

.draw-quota-title {
    background: url(../img/draw-title-scan.png) no-repeat center center / contain;
    display: block;
    width:420px;
    height: 128px;
    position: relative;
    margin: 0 auto;
    z-index: 10;
}
.draw-quota-title #draw-quota {
    font-family: MStiffHeiHK-UltraBold, Geneva, Tahoma, sans-serif;
    font-size: 4.2rem;
    position: absolute;
    left: 27%;
    text-align: center;
    width: 26%;
    top: 0;
    height: 100%;
    line-height: 120px;
    color: var(--gold);
    font-weight: 400;
    transform: scaleY(1.3);
}
.btn-confirm-img {
    max-width: 200px;
}
#tnc{
    width: 30px;
    height: 30px;
    border: 1px solid #222;
    background: #fff;
    /* appearance: none; */
    display: block;
}
label.tnc-text {
    padding-left:1rem;
    font-size: 0.65rem; font-weight: 400;
    text-align: justify;
    color:#222 !important;
    width: 90%;
}
.app__infodialog, .app__dialog {
    font-family: MStiffHeiHK-UltraBold, Geneva, Tahoma, sans-serif;
    width: 100vw;
    min-height: 100vh;
    background:url(../img/bg.png) no-repeat center top / cover;
    border: 0;
    box-shadow: none;
}
.app__dialog-actions, .app__infodialog-actions {
    bottom: 4rem;
}

#prize {
    font-size:4rem;
    color:var(--red);
    margin-top:1rem;
}
#congrat-msg {
    text-align: center;
    font-size: 4rem;
    color: var(--red);
    margin-bottom: 1rem;
    line-height: 5rem;
    margin-top: 2rem;
}
.app__infodialog-open, .app__infodialog-close, .app__dialog-open, .app__dialog-close {
    width: 400px;
    height: auto;
}
.app__dialog-content #msg {
    text-align: center;
    font-size: 2rem;
    color: var(--red);
}
#prize-img-wrapper {
    position: relative;
    margin-top:2rem;
    height: 40vh;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
}
#prize-img-wrapper.hide {
    height: 20vh;
}
#prize-img{
    position: absolute;
    width: 100%;
}
#prize-img img {
    max-height: 40vh;
}
.effect-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;left:0;
    display: none;
}
.effect-wrapper.show {
    display: block;
}
.effect-wrapper > div {
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;left:0;
}

.color_box {
    height: 30px;
    width: 100%;
}

.hk_am_om {
  background-color: #49eb34;
}

.hk_store {
  background-color: #eb3464;
}

.macau_store {
    background-color: #eb9534;
}