/* Minification failed. Returning unminified contents.
(348,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(658,25): run-time error CSS1039: Token not allowed after unary operator: '-num-item-per-row'
(1190,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1195,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1200,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1278,27): run-time error CSS1039: Token not allowed after unary operator: '-num-item-per-row'
(1597,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2180,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2454,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
 */
body footer {
  position: relative;
  width: 100%;
  background-color: #000000;
}
body footer .footer-box {
  position: relative;
  width: 100%;
  max-width: 58.645833vw;
  height: 8.59375vw;
  margin: 0 auto;
  display: flex;
}
body footer .footer-box .footer-item-box {
  display: flex;
  align-items: baseline;
  height: 100%;
}
body footer .footer-box .footer-item-box.footer-logo-box {
  width: 16.979166vw;
}
body footer .footer-box .footer-item-box.footer-logo-box .logo-box {
  position: relative;
  margin: 1.041666vw;
  width: 6.40625vw;
}
body footer .footer-box .footer-item-box.footer-logo-box .logo-box .logo {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}
body footer .footer-box .footer-item-box.footer-logo-box .logo-box.dzo-logo-box {
  height: 2.447916vw;
}
body footer .footer-box .footer-item-box.footer-logo-box .logo-box.dzo-logo-box .logo.dzo-logo {
  background-image: url(/Assets/General/imgs/dzo-logo.png);
}
body footer .footer-box .footer-item-box.footer-logo-box .logo-box.mgame-logo-box {
  height: 2.001953vw;
}
body footer .footer-box .footer-item-box.footer-logo-box .logo-box.mgame-logo-box .logo.mgame-logo {
  background-image: url(/Assets/General/imgs/mgame-logo.png);
}
body footer .footer-box .footer-item-box.footer-info-rule-box {
  flex-direction: column;
  width: 41.666666vw;
  padding: 0 1.041666vw 0.520833vw;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0.520833333vw 0 1.041666vw;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item {
  border-right: 0.052083vw solid #fff;
  padding-right: 0.78125vw;
  margin-right: 0.78125vw;
  display: flex;
  align-items: center;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-icon {
  position: relative;
  width: 3.125vw;
  height: 3.125vw;
  background-image: url(/Assets/General/imgs/Footer/footer-buttons.png);
  background-repeat: no-repeat;
  background-size: 300% 200%;
  background-position-y: 0;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-icon.location-icon {
  background-position-x: 0%;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-icon.number-icon {
  background-position-x: 50%;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-icon.mail-icon {
  background-position-x: 100%;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-icon:hover {
  background-position-y: 101%;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-icon a {
  position: absolute;
  width: 100%;
  height: 100%;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-content {
  position: relative;
  padding-left: 0;
  margin: auto;
  display: block;
  opacity: 0;
  width: 0;
  float: left;
  color: #FFFFFF;
  font-size: 0.729166vw;
  line-height: 1.041666vw;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
  font-family: roboto;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-content.motion {
  transition: opacity 0.75s ease-out, width 0.75s ease-out, padding 0.75s ease-out;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item:last-child {
  border-right: unset;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active .footer-info-content {
  padding-left: 1.041666vw;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active .footer-info-content.motion {
  opacity: 1;
  display: block;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active .footer-info-icon {
  background-position-y: 101%;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active.location .footer-info-content {
  width: 27.5vw;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active.number .footer-info-content {
  width: 10.5vw;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active.mail .footer-info-content {
  width: 15.760416vw;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-rule-box {
  font-size: 0.9375vw;
  margin-bottom: 0;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-rule-box a {
  color: #FCAA00;
  text-decoration: none;
  padding-right: 1.041666vw;
  margin-right: 1.041666vw;
  font-weight: bold;
  border-right: 0.052083vw solid #fff;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-rule-box a:hover {
  color: #ffcf6c;
}
body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-rule-box span {
  color: #ffffff;
}
body footer.footer-top-bg:before {
  content: "";
  position: absolute;
  width: 100vw;
  height: 5.416666vw;
  top: -5.3125vw;
  background-image: url(/Assets/General/imgs/Footer/footer-top-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  display: none;
}
/*@media (min-aspect-ratio: 1920/1180) {
    body {
        footer {
            .footer-box {
                max-width: 95.423728vh; //set by height 1180px (1126px)
                height: 165px; //set by height 1180px (165px)
                z-index: 9998;

                .footer-item-box {
                    &.footer-logo-box {
                        width: 27.6271186vh; //set by height 1180px (326px)

                        .logo-box {
                            margin: 1.694915vh; //set by height 1180px (20px)
                            width: 10.423728vh; //set by height 1180px (123px)

                            &.dzo-logo-box {
                                height: 3.98305vh; //set by height 1180px  (47px)
                            }

                            &.mgame-logo-box {
                                height: 3.2574152vh; //set by height 1180px  (38.4375px)
                            }
                        }
                    }

                    &.footer-info-rule-box {
                        width: 67.79661vh; //set by height 1180px (800px)
                        padding: 0.847457vh 1.694915vh; //set by height 1180px (10px 20px)

                        .footer-info-rule-item {
                            &.footer-info-box {
                                .footer-info-item {
                                    border-right-width: 0.084745vh; //set by height 1180px (1px)
                                    padding-right: 1.271186vh; //set by height 1180px (15px)
                                    margin-right: 1.271186vh; //set by height 1180px (15px)

                                    .footer-info-icon {
                                        width: 5.084745vh; //set by height 1180px (60px)
                                        height: 5.084745vh; //set by height 1180px (60px)
                                    }

                                    .footer-info-content {
                                        font-size: 1.18644vh; //set by height 1180px (14px)
                                        line-height: 1.694915vh; //set by height 1180px (20px)
                                    }

                                    &.active {
                                        .footer-info-content {
                                            padding-left: 1.694915vh; //set by height 1180px (20px)
                                        }

                                        &.location {
                                            .footer-info-content {
                                                width: 35.169491vh; //set by height 1180px (415px)
                                            }
                                        }

                                        &.number {
                                            .footer-info-content {
                                                width: 13.98305vh; //set by height 1180px (165px)
                                            }
                                        }

                                        &.mail {
                                            .footer-info-content {
                                                width: 20.762711vh; //set by height 1180px (245px)
                                            }
                                        }
                                    }
                                }
                            }

                            &.footer-rule-box {
                                font-size: 1.525423vh; //set by height 1180px (18px)

                                a {
                                    padding-right: 1.694915vh; //set by height 1180px (20px)
                                    margin-right: 1.694915vh; //set by height 1180px (20px)
                                    border-right-width: 0.084745vh; //set by height 1180px (1px)
                                }
                            }
                        }
                    }
                }
            }

            &.footer-top-bg {
                &:before {
                    height: 8.813559vh; //set by height 1180px (104px)
                    top: -8.7288135vh; //set by height 1180px (-104px)
                    background-size: 100% 100%;
                }
            }
        }
    }
}
*/

@media screen and (max-width: 1024px) {
  body footer {
    height: max-content !important;
  }
  body footer .footer-box {
    max-width: 100%;
    height: max-content;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
  }
  body footer .footer-box .footer-item-box.footer-logo-box {
    width: 31.8359375vh;
  }
  body footer .footer-box .footer-item-box.footer-logo-box .logo-box {
    margin: 1.953125vh;
    width: 12.01171875vh;
  }
  body footer .footer-box .footer-item-box.footer-logo-box .logo-box.dzo-logo-box {
    height: 4.58984375vh;
  }
  body footer .footer-box .footer-item-box.footer-logo-box .logo-box.mgame-logo-box {
    height: 3.753662109vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box {
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-align-content: center;
    -webkit-align-content: center;
    align-content: center;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    padding: 0.9765625vh 1.953125vh;
    zoom: 0.75;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box {
    -ms-align-content: center;
    -webkit-align-content: center;
    align-content: center;
    -webkit-justify-content: center;
    justify-content: center;
    margin-bottom: 1.953125vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item {
    border-right: 0.09765625vh solid #fff;
    padding-right: 1.46484375vh;
    margin-right: 1.46484375vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-icon {
    width: 5.859375vh;
    height: 5.859375vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item .footer-info-content {
    font-size: 1.3671875vh;
    line-height: 1.953125vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active .footer-info-content {
    padding-left: 1.953125vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active.location .footer-info-content {
    width: 40.52734375vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active.number .footer-info-content {
    width: 18.11328125vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-info-box .footer-info-item.active.mail .footer-info-content {
    width: 29.925781vh;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-rule-box {
    font-size: 1.7578125vh;
    -webkit-justify-content: center;
    justify-content: center;
  }
  body footer .footer-box .footer-item-box.footer-info-rule-box .footer-info-rule-item.footer-rule-box a {
    padding-right: 1.953125vh;
    margin-right: 1.953125vh;
    border-right: 0.09765625vh solid #fff;
  }
  body footer.footer-top-bg:before {
    display: none;
  }
}

:root {
  --num-item-per-row: 4;
}
body {
  background-color: #bebebe;
}
body .form-select {
  margin: 10px auto;
}
body .main-container {
  /*min-width: 1170px;*/
  position: relative;
  background: url(/Assets/WebShopV2/imgs/BG-webshop.jpg) center center;
}
body .main-container .webshop-container {
  width: 100%;
  min-height: calc(100vh - 8.59375vw);
  position: relative;
}
body .main-container .webshop-container .header-webshop {
  width: 100%;
  height: max-content;
  background: #000;
  position: sticky;
  top: 0;
  left: 0;
  padding: 0.260416667vw 0;
  margin-bottom: 1.041666667vw;
  z-index: 99;
}
body .main-container .webshop-container .header-webshop .header-container .menu {
  width: 100%;
  height: max-content;
  position: relative;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item {
  background-image: url(/Assets/WebShopV2/imgs/Image.png);
  background-repeat: no-repeat;
  position: relative;
  /*//================ Cơ Chế WebShop mới
                            &.menu-item-character-info {
                                background: unset;

                                .character-info {
                                    font-size: 1rem;
                                    color: #fff;
                                    text-decoration: none;
                                    font-weight: bold;
                                }
                            }
                            //================*/

}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item a {
  width: 100%;
  height: 100%;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  display: block;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-logo {
  height: 3.75vw;
  width: 6.770833333vw;
  background-size: 953.0769231% 883.3333333%;
  background-position: 48.5% 30%;
  margin-right: 50px;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-webshop {
  height: 2.34375vw;
  width: 2.96875vw;
  background-size: 2173.684211% 1413.333333%;
  background-position: 0 88%;
  position: relative;
  margin-right: 23px;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-webshop:hover {
  background-position: 20.4% 88%;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox {
  width: 22vw;
  background: unset;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container {
  padding: 0.260416667vw 3.854166667vw 0.260416667vw 1.5625vw;
  background: #fff;
  border: solid #f37fdd 2px;
  border-radius: 1.5625vw;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container .search-box {
  width: 100%;
  font-size: large;
  box-shadow: none;
  border: none;
  color: #959595;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container .btn-search {
  height: max-content;
  width: max-content;
  position: absolute;
  top: 50%;
  right: 1.041666667vw;
  transform: translateY(-50%);
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container .btn-search i {
  font-size: xx-large;
  color: #037ffd;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-buycash {
  background: unset;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-buycash .buycash {
  font-size: 1.2rem;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-buycash .buycash.amination {
  animation: vibrate 0.5s linear infinite both;
  color: yellow;
  font-size: 2rem;
  font-family: math;
  font-style: italic;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info {
  background: unset;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .balance-container {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .balance-container .balance-dzo {
  font-size: 1rem;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  margin: 5px 4px 0px 4px;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .select-option-box {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .select-option-box .select-option {
  width: max-content;
  margin: 0 0.5vw 0 0.5vw;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .select-option-box .select-option select {
  width: 8.5vw;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login {
  height: 2.291666667vw;
  width: 2.291666667vw;
  background-size: 2815.909091%;
  background-position: 16.3% 88.4%;
  background-repeat: repeat;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login:hover {
  background-position: 36.5% 88.4%;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon {
  position: relative;
  width: 100%;
  height: 100%;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .avatar {
  position: absolute;
  width: 100%;
  height: 100%;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info {
  right: -0.78125vw;
  top: 160%;
  position: absolute;
  z-index: 99;
  width: max-content;
  display: none;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info.active {
  display: block;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info .menu-info-item {
  display: block;
  white-space: nowrap;
  padding: 0.520833333vw 0.78125vw;
  background: #ffffff;
  margin-bottom: 2px;
  text-align: center;
  position: relative;
  color: #000;
  font-weight: bold;
}
body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info .menu-info-item:hover {
  background-color: #000;
  color: #fff;
}
body .main-container .webshop-container .container {
  padding: 0 !important;
}
body .main-container .webshop-container .container .banner-container {
  width: 100%;
  height: max-content;
}
body .main-container .webshop-container .container .banner-container .image-banner {
  width: 100%;
}
body .main-container .webshop-container .container .webshop-tab-container {
  padding-top: 1.302083333vw;
  width: 100%;
  height: max-content;
  margin-bottom: 1.041666667vw;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container {
  width: 13.54166667vw;
  background-color: #fff;
  margin-right: 0.520833333vw;
}
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs {
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
}
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link {
  cursor: pointer;
  background: url(/Assets/WebShopV2/imgs/Image.png);
  background-size: 692.1787709% 244.6153846%;
  width: 9.322916667vw;
  height: 13.54166667vw;
  margin: 1.5625vw auto;
  border: none;
  background-position-y: -0.2%;
}
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link:hover,
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link.active {
  background-position-y: 69%;
}
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link.item-tab-offer {
  background-position-x: 0;
}
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link.item-tab-limit {
  background-position-x: 17%;
}
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link.item-tab-all {
  background-position-x: 34%;
}
body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link.item-tab-rotation {
  background-position-x: 99.9%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content {
  flex: 1 1 0;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .serverImg {
  width: 35vw;
  margin: 15px auto;
  border: 8px solid #446eed;
  border-radius: 50px;
  background-color: #ffffff;
  color: white;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .serverImg .allItem {
  width: 95%;
  margin: 15px auto;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .serverImg .allItem .notify {
  text-decoration: none;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .serverImg .allItem .notify .text {
  font-weight: 600 !important;
  font-size: 1vw;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane {
  width: 100%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container {
  display: flex;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: baseline;
  align-items: stretch;
  flex-wrap: wrap;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info {
  margin: 0 0.130208333vw 0.260416667vw;
  display: flex;
  width: calc(100%/var(--num-item-per-row) - 0.260416667vw);
  height: auto;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
  background-color: #fff;
  overflow: hidden;
  padding: 0.260416667vw;
  /* .btn-buy {
                                        background-image: url(/Assets/WebShopV2/imgs/Image.png);
                                        background-position: 23.1% 96%;
                                        background-size: 1020% 1440%;
                                        width: 6.25vw; //set by width 1920px (120px)
                                        height: 2.291666667vw; //set by width 1920px (44px)
                                        border: none;
                                        margin-top: 0.520833333vw; //set by width 1920px (10px)
                                        outline: none;

                                        &:hover {
                                            background-position-x: 12.2%;
                                        }
                                    }*/

}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img {
  position: relative;
  width: 5.208333333vw;
  height: 4.947916667vw;
  background-image: url(/Assets/WebShopV2/imgs/Image.png);
  background-size: 1224% 669.4736842%;
  background-repeat: no-repeat;
  background-position-y: 1.1%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img.rank-0 {
  background-position-x: 47.4%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img.rank-1 {
  background-position-x: 56.2%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img.rank-2 {
  background-position-x: 65.1%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img.rank-3 {
  background-position-x: 74%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img.rank-4 {
  background-position-x: 82.9%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .item-cover-img {
  width: 100%;
  height: 100%;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .item-cover-img .img-item {
  margin: auto;
  display: block;
  width: 3.333333333vw;
  height: 3.333333333vw;
  position: relative;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .tag-limit {
  position: absolute;
  /* height: 18px;
                                                width: 70px;*/
  top: 0;
  left: 0;
  color: #fff;
  font-size: x-small;
  padding: 0.104166667vw 0.520833333vw;
  background-color: #fb1711;
  font-weight: bold;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .tag-limit.tag-unlimit {
  font-size: xx-small;
  padding: 0.052083333vw 0.260416667vw;
  background-color: #037ffd;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-text {
  display: block;
  color: #252525;
  margin: 0.15625vw;
  justify-self: flex-end;
  text-align: center;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-text.item-name {
  text-transform: capitalize;
  font-size: 1.2rem;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-text.item-original-price {
  font-size: 0.8rem;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-text.item-original-price.discount {
  text-decoration: line-through;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-text.item-original-price.undiscount {
  font-size: 1.2rem;
  color: #fb1711;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-text.item-discount-price {
  font-size: 1.2rem;
  color: #fb1711;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  flex-wrap: wrap;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option .btn-buy {
  background-image: url(/Assets/WebShopV2/imgs/Image.png);
  background-position: 23.1% 96%;
  background-size: 1020% 1440%;
  width: 5.5vw;
  height: 2.291666667vw;
  border: none;
  outline: none;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option .btn-buy:hover {
  background-position-x: 12.2%;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option .btn-send-gift {
  /* background-image: url(/Assets/WebShopV2/imgs/tangqua.png);
                                            background-position: 23.1% 96%;
                                            background-size: 1020% 1440%;
                                            width: 6.25vw; //set by width 1920px (120px)
                                            height: 2.291666667vw; //set by width 1920px (44px)
                                            border: none;
                                            //margin-top: 0.520833333vw; //set by width 1920px (10px)
                                            outline: none;*/
  background-image: url(/Assets/WebShopV2/imgs/tangqua.png);
  background-position: 100% 100%;
  background-repeat: no-repeat;
  background-size: 200% 96.5%;
  width: 5.5vw;
  height: 2.291666667vw;
  border: none;
  outline: none;
  cursor: pointer;
}
body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option .btn-send-gift:hover {
  background-position-x: 0%;
}
body .main-container .webshop-container .container .history-table-container {
  width: 100%;
  min-height: calc(100vh - 8.59375vw);
  padding: 2.083333333vw;
  background-color: #fff;
  margin-bottom: 1.041666667vw;
}
body .main-container .webshop-container .container .history-table-container .title {
  text-transform: uppercase;
  color: #ff7d00;
  text-align: center;
  font-size: 32px;
  font-weight: bold;
}
body .main-container .webshop-container .container .history-table-container .table-history {
  margin: 1.5625vw auto 0;
  max-width: 100%;
}
body .main-container .webshop-container .container .history-table-container .table-history span {
  display: block;
  margin: 0 1.041666667vw;
  text-align: center;
}
body .main-container .webshop-container .container .history-table-container .table-history thead {
  margin-bottom: 1.5625vw;
}
body .main-container .webshop-container .container .history-table-container .table-history thead tr th {
  min-width: 5.208333333vw;
}
body .main-container .webshop-container .container .history-table-container .table-history thead tr th span {
  font-size: x-large;
  margin-bottom: 0.520833333vw;
  color: #252525;
  text-align: center;
  font-weight: bold;
}
body .main-container .webshop-container .container .history-table-container .table-history tbody tr td {
  min-height: 30px;
}
body .main-container .webshop-container .container .history-table-container .table-history tbody tr td .show-giftcode {
  min-width: 100%;
  height: max-content;
  position: relative;
  margin: 5px 0;
  z-index: 1;
  transform-origin: left center;
  padding: 0.520833333vw 1.041666667vw;
  border: solid 2px #037ffd;
  border-radius: 30px;
}
body .main-container .webshop-container .container .history-table-container .table-history tbody tr td .show-giftcode span {
  font-size: large;
  margin: 0;
  width: 100%;
  height: 100%;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
  font-weight: bold;
  text-align: center;
}
body .main-container .webshop-container .container .history-table-container .table-history tbody tr td .btn-submit-code {
  height: 4vh;
  margin: 0 auto;
  background: url(/Assets/WebShopV2/imgs/VQ/nhapcode.png);
  background-repeat: no-repeat;
  background-size: 200% 100%;
  width: 12.5vh;
  background-position-x: 100%;
  cursor: pointer;
}
body .main-container .webshop-container .container .history-table-container .table-history tbody tr td .btn-submit-code:hover {
  background-position-x: 0%;
}
body .main-container .webshop-container .container .history-table-container .table-history tbody tr td .btn-coppy-giftcode {
  background: url(/Assets/WebShopV2/imgs/Image.png);
  height: 3.125vw;
  width: 5.729166667vw;
  background-size: 1126.363636% 1060%;
  background-position: 63.3% 30%;
  position: relative;
  border: none;
  outline: none;
}
body .popup {
  display: none;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(0, 0, 0, 0.7);
  z-index: 99;
}
body .popup .btn-close {
  width: 87px;
  height: 81.5px;
  position: absolute;
  top: -50px;
  right: -50px;
  background: url(/Assets/WebShopV2/imgs/videoClose.png) no-repeat;
  background-size: 100% 200%;
  opacity: 1;
  cursor: pointer;
}
body .popup .btn-close:hover {
  background-position-y: 100%;
}
body .popup .btn-close:focus {
  border: none;
}
body .popup .title-popup {
  text-align: center;
  font-size: 2.180914vh;
  margin-top: 2vh;
}
body .popup .title-popup .large-word {
  font-size: 3.771371vh;
}
body .popup .body-popup {
  width: 100%;
  height: auto;
  overflow: auto;
}
body .popup .popup-info {
  max-width: 660px;
  width: 100%;
  height: max-content;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  align-items: center;
}
body .popup .popup-info.popup-login {
  display: none;
}
body .popup .popup-info.popup-login .body-popup {
  padding: 10px 70px;
}
body .popup .popup-info.popup-login form .form-group {
  display: flex;
  margin-bottom: 0.994035vh;
}
body .popup .popup-info.popup-login form .form-group .captcha-container {
  display: flex;
  width: 100%;
}
body .popup .popup-info.popup-login form .form-group .captcha-container .captcha-image-container {
  display: flex;
  align-items: center;
}
body .popup .popup-info.popup-login form .form-group .captcha-container .captcha-image-container * {
  margin-left: 0.994035vh;
}
body .popup .popup-info.popup-login form .form-group .captcha-container .captcha-image-container .captcha-image {
  width: 7.952286vh;
  height: 3.180914vh;
  border-radius: 0.397614vh;
}
body .popup .popup-info.popup-login form .form-group .captcha-container .captcha-image-container .captcha-reload {
  width: 2.7833vh;
  height: 2.7833vh;
  cursor: pointer;
}
body .popup .popup-info.popup-login form .form-group .form-input,
body .popup .popup-info.popup-login form .form-group .form-button {
  width: 100%;
  padding: 0.596421vh 1.192842vh;
  background-color: #f0f0f0;
  background-clip: padding-box;
  border-radius: 0.397614vh;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  line-height: normal;
}
body .popup .popup-info.popup-login form .form-group .form-input {
  display: block;
  height: 3.180914vh;
  border: 0.099403vh solid #ced4da;
  color: #676767;
  font-size: 1.192842vh;
  font-weight: 400;
}
body .popup .popup-info.popup-login form .form-group .form-input:focus {
  outline: 0;
}
body .popup .popup-info.popup-login form .form-group .form-button {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 3.976143vh;
  border: unset;
  color: #ffffff;
  font-size: 1.789264vh;
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-dzo-login {
  margin-top: 1.491053vh;
  background: linear-gradient(0deg, #ffaa00 0%, #ffdd00 100%);
  transition: background 0.3s linear;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-dzo-login:hover {
  background: linear-gradient(0deg, #ff7400 0%, #ffcc00 100%);
}
body .popup .popup-info.popup-login form .form-group .form-button.button-fb-login {
  margin-top: 0.994035vh;
  background: #38559B;
  transition: background 0.3s linear;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-fb-login::before {
  content: "\f39e";
  background: #2e4576;
  padding-left: 1.789264vh;
  padding-right: 1.789264vh;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-fb-login:hover {
  background: #2e4576;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-gg-login {
  /*margin-top: 0.994035vh; //Set by height 1006px (10px)*/
  background: #dd4b39;
  transition: background 0.3s linear;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-gg-login::before {
  content: "\f1a0";
  background: #b53424;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-gg-login:hover {
  background: #b53424;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-apple-login {
  background: #333333;
  transition: background 0.3s linear;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-apple-login::before {
  content: "\f179";
  background: #000;
}
body .popup .popup-info.popup-login form .form-group .form-button.button-apple-login:hover {
  background: #000;
}
body .popup .popup-info.popup-login form .form-group .form-button::before {
  font-family: "Font Awesome 5 Brands";
  position: absolute;
  left: 0px;
  top: 0;
  bottom: 0;
  padding: 0.994035vh 1.491053vh;
  border-radius: 0.497017vh;
}
body .popup .popup-info.popup-login form .form-group .text-validation {
  font-size: 1.192842vh;
  color: #dc3545;
}
body .popup .popup-info.popup-login form .form-group.form-register-group {
  flex-wrap: wrap;
  justify-content: space-around;
}
body .popup .popup-info.popup-login form .form-group.form-register-group a {
  font-size: 1.39165vh;
  color: #ff9900;
  text-decoration: none;
}
body .popup .popup-info.popup-login form .form-group.form-register-group a:hover {
  text-decoration: underline;
}
body .popup .popup-info.popup-login form .form-group.form-or-group {
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 0.497017vh auto;
  color: #676767;
}
body .popup .popup-info.popup-login form .form-group.form-or-group .line {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 0.099403vh;
  background-color: #676767;
  vertical-align: middle;
}
body .popup .popup-info.popup-login form .form-group.form-or-group .text {
  font-size: 1.192842vh;
}
body .popup .popup-info.popup-login form .form-check-label {
  vertical-align: middle;
  font-size: 9pt;
  font-family: serif;
}
body .popup .popup-info.popup-login form .form-check-label a {
  color: #ff9900;
}
body .popup .popup-info.popup-login form .form-check-label a:hover {
  color: cornflowerblue;
}
body .popup .popup-info.popup-login form .form-check-input {
  width: 16px;
  height: 16px !important;
  margin: 0;
}
body .popup .popup-info.popup-login form .form-check-input:checked {
  background-color: #28a745;
  border-color: #28a745;
}
body .popup .popup-info.popup-choice,
body .popup .popup-info.popup-chose-server,
body .popup .popup-info.popup-chose-user {
  display: none;
  background-image: url(/Assets/WebShopV2/imgs/pc/popup_DangNhap-Quay-LuotQuay/KhungChonNV.png);
  width: 730px;
  height: 316px;
}
body .popup .popup-info.popup-choice .body-popup,
body .popup .popup-info.popup-chose-server .body-popup,
body .popup .popup-info.popup-chose-user .body-popup {
  display: flex;
  justify-content: space-evenly;
  align-content: center;
  align-items: center;
}
body .popup .popup-info.popup-chose-server .body-popup,
body .popup .popup-info.popup-chose-user .body-popup {
  flex-direction: column;
  padding: 0 100px;
}
body .popup .popup-info.popup-chose-server .body-popup .input-option,
body .popup .popup-info.popup-chose-user .body-popup .input-option {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
}
body .popup .popup-info.popup-chose-server .body-popup .input-option #txt-HashId,
body .popup .popup-info.popup-chose-user .body-popup .input-option #txt-HashId {
  width: 70%;
}
body .popup .popup-info.popup-chose-server .body-popup .input-option .btn-check-hashid,
body .popup .popup-info.popup-chose-user .body-popup .input-option .btn-check-hashid {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.2rem;
  text-decoration: none;
  color: white;
  border: 0.156vw solid #0d6efd;
  min-width: 5.208vw;
  padding: 0.26vw 0.52vw 0.26vw;
  border-radius: 0.52vw;
  transition: 0.5s ease-in-out;
  background-color: #0d6efd;
  cursor: pointer;
}
body .popup .popup-info.popup-chose-server .body-popup .input-option .btn-check-hashid:hover,
body .popup .popup-info.popup-chose-user .body-popup .input-option .btn-check-hashid:hover {
  background-color: #80391e;
  color: white;
  border: 0.156vw solid white;
  border-radius: 10px;
  transition: 0.1s ease-in-out;
}
@media screen and (max-width: 660px) {
  :root {
    --num-item-per-row: 3;
  }
}
@media screen and (max-width: 490px) {
  :root {
    --num-item-per-row: 2;
  }
}
@media screen and (max-width: 350px) {
  :root {
    --num-item-per-row: 1;
  }
}
@media screen and (orientation: portrait), screen and (orientation: landscape) and (max-width: 1366px) {
  body {
    background-color: #bebebe;
  }
  body .main-container .webshop-container .header-webshop {
    padding: 0.48828125vh 0;
    margin-bottom: 1.953125vh;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-logo {
    height: 7.03125vh;
    width: 12.6953125vh;
    margin-right: 1vh;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-webshop {
    height: 4.39453125vh;
    width: 5.56640625vh;
    margin-right: 2.24609375vw;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox {
    flex: 1 1 0;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container {
    padding: 0.48828125vh 7.2265625vh 0.48828125vh 2.9296875vh;
    border-radius: 2.9296875vh;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container .btn-search {
    right: 1.953125vh;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-buycash .buycash {
    font-size: small;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .balance-dzo {
    font-size: small;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .select-option-box .select-option select {
    width: 16vw;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login {
    height: 4.296875vh;
    width: 4.296875vh;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info {
    right: -1.46484375vh;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info .menu-info-item {
    padding: 0.9765625vh 1.46484375vh;
  }
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info .menu-info-item.item-mobile {
    display: block !important;
  }
  body .main-container .webshop-container .container {
    max-width: 100% !important;
  }
  body .main-container .webshop-container .container .webshop-tab-container {
    padding: 2.44140625vh 0.48828125vh 0;
    margin-bottom: 1.953125vh;
    flex-wrap: wrap;
  }
  body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container {
    width: 100%;
    margin-right: 0;
    margin-bottom: 1.953125vh;
  }
  body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs {
    -webkit-justify-content: space-around;
    justify-content: space-around;
  }
  body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link {
    width: 8.740234375vh;
    height: 12.6953125vh;
    margin: 2.9296875vh auto;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info {
    margin: 0 0.244140625vh 0.48828125vh;
    padding: 0.48828125vh;
    width: calc(100%/var(--num-item-per-row) - 0.48828125vh);
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img {
    width: 9.765625vh;
    height: 9.27734375vh;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .item-cover-img .img-item {
    width: 6.25vh;
    height: 6.25vh;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .tag-limit {
    padding: 0.104166667vh 0.9765625vh;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .tag-limit.tag-unlimit {
    padding: 0.09765625vh 0.48828125vh;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .text-break-mobile {
    display: block;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-text {
    margin: 0.29296875vh;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option .btn-buy {
    width: 11.71875vh;
    height: 4.296875vh;
    margin-top: 0.9765625vh;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option .btn-send-gift {
    width: 11.71875vh;
    height: 4.296875vh;
    margin-top: 0.9765625vh;
  }
  body .main-container .webshop-container .container .history-table-container {
    padding: 3.90625vh;
    margin-bottom: 1.041666667vw;
  }
  body .main-container .webshop-container .container .history-table-container table,
  body .main-container .webshop-container .container .history-table-container thead,
  body .main-container .webshop-container .container .history-table-container tbody,
  body .main-container .webshop-container .container .history-table-container th,
  body .main-container .webshop-container .container .history-table-container td,
  body .main-container .webshop-container .container .history-table-container tr {
    display: block;
  }
  body .main-container .webshop-container .container .history-table-container .table-history {
    margin: 2.9296875vh auto 0;
  }
  body .main-container .webshop-container .container .history-table-container .table-history span {
    margin: 0 1.953125vh;
  }
  body .main-container .webshop-container .container .history-table-container .table-history thead {
    margin-bottom: 2.9296875vh;
    display: none;
  }
  body .main-container .webshop-container .container .history-table-container .table-history thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  body .main-container .webshop-container .container .history-table-container .table-history thead tr th {
    min-width: 9.765625vh;
  }
  body .main-container .webshop-container .container .history-table-container .table-history thead tr th span {
    margin-bottom: 0.9765625vh;
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr {
    border: solid 1px #037ffd;
    padding: 2px;
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr:nth-of-type(odd) {
    background: #eee;
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50%;
    height: max-content;
    /*&:nth-of-type(1):before {
                                              content: "Thời gian";
                                          }
  
                                          &:nth-of-type(2):before {
                                              content: "Vật Phẩm";
                                          }
  
                                          &:nth-of-type(3):before {
                                              content: "Số Tiền";
                                          }
  
                                          &:nth-of-type(4):before {
                                              content: "GiftCode";
                                          }
  
                                          &:nth-of-type(5):before {
                                              content: "Sao Chép";
                                          }*/
  
    /* &:nth-of-type(4):before {
                                              content: "HashId";
                                          }*/
  
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
    font-weight: bold;
    text-align: left !important;
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:nth-of-type(1):before {
    content: "Thời gian mua";
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:nth-of-type(2):before {
    content: "Vật Phẩm";
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:nth-of-type(3):before {
    content: "Số Tiền";
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:nth-of-type(4):before {
    content: "Máy Chủ";
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:nth-of-type(5):before {
    content: "Nhân Vật";
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:nth-of-type(6):before {
    content: "Thời Gian Nhận Quà";
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:nth-of-type(7):before {
    content: "Quà Tặng";
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td:nth-of-type(8):before {
    content: "HashId Người Nhận";
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td .show-giftcode {
    padding: 0.9765625vh 1.953125vh;
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td .show-giftcode span {
    font-size: small;
  }
  body .main-container .webshop-container .container .history-table-container .table-history tbody tr td .btn-coppy-giftcode {
    height: 5.859375vh;
    width: 10.7421875vh;
  }
  body .popup .btn-close {
    right: 0;
    width: 8.49609375vh;
    height: 7.958984375vh;
    top: -4.8828125vh;
  }
  body .popup .popup-info.popup-login .body-popup {
    padding: 10px;
  }
}
@media screen and (orientation: portrait) and (max-width: 660px), screen and (orientation: landscape) and (max-width: 1366px) and (max-width: 660px) {
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox {
    display: none;
  }
}
@media screen and (orientation: portrait) and (orientation: landscape), screen and (orientation: landscape) and (max-width: 1366px) and (orientation: landscape) {
  body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link {
    width: 9.322916667vw;
    height: 13.54166667vw;
  }
}
@media screen and (orientation: portrait) and (orientation: landscape), screen and (orientation: landscape) and (max-width: 1366px) and (orientation: landscape) {
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img {
    width: 40%;
    height: auto;
    aspect-ratio: 1.052631579;
  }
}
@media screen and (orientation: portrait) and (orientation: landscape), screen and (orientation: landscape) and (max-width: 1366px) and (orientation: landscape) {
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .item-cover-img .img-item {
    width: 80%;
    height: auto;
    aspect-ratio: 1;
  }
}
@media screen and (orientation: portrait) and (orientation: landscape), screen and (orientation: landscape) and (max-width: 1366px) and (orientation: landscape) {
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option .btn-buy {
    aspect-ratio: 2.727272727;
    width: 50%;
    height: 4vw;
  }
}
@media screen and (orientation: portrait) and (orientation: landscape), screen and (orientation: landscape) and (max-width: 1366px) and (orientation: landscape) {
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-box-option .btn-send-gift {
    aspect-ratio: 2.727272727;
    width: 50%;
    height: 4vw;
  }
}
@media screen and (max-width: 660px) {
  body .main-container .webshop-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox {
    display: none;
  }
}
@media screen and (max-width: 1024px) and (orientation: portrait) {
  .serverImg {
    width: 80vw !important;
  }
  .serverImg .allItem .notify .text {
    font-size: 2.5vw !important;
  }
  .popup-info {
    max-width: unset !important;
  }
  .popup-info.popup-chose-server {
    width: 90% !important;
  }
  .popup-info.popup-chose-server .body-popup {
    padding: 0 10vw !important;
  }
}
@media screen and (orientation: landscape) and (max-width: 1366px) {
  body .main-container .webshop-container .container .webshop-tab-container .nav-tab-links-container .nav-tabs .nav-link {
    width: 9.322916667vw;
    height: 13.54166667vw;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img {
    width: 40%;
    height: auto;
    aspect-ratio: 1.052631579;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .item-img .item-cover-img .img-item {
    width: 80%;
    height: auto;
    aspect-ratio: 1;
  }
  body .main-container .webshop-container .container .webshop-tab-container .tab-content .tab-pane .item-container .item-info .btn-buy {
    aspect-ratio: 2.727272727;
    width: 80%;
    height: auto;
  }
}
@media screen and (min-width: 1000px) and (max-width: 1380px) and (orientation: landscape) {
  body .popup .title-popup {
    font-size: 5.180914vh;
    margin-top: 0.029822vh;
  }
  body .popup .title-popup .large-word {
    font-size: 8.771371vh;
  }
  body .popup .popup-info.popup-login {
    width: 63vw;
    max-width: unset;
  }
  body .popup .popup-info.popup-login form .form-group .captcha-container .captcha-image-container .captcha-image {
    width: 10.952286vh;
    height: 4.180914vh;
  }
  body .popup .popup-info.popup-login form .form-group .form-input,
  body .popup .popup-info.popup-login form .form-group .form-button {
    font-size: 2vh;
    height: 5.180914vh;
  }
  body .popup .popup-info.popup-login form .form-group .form-input {
    font-size: 2.192842vh;
  }
  body .popup .popup-info.popup-login form .form-group .text-danger {
    font-size: 2vh;
  }
  body .popup .popup-info.popup-login form .form-group .form-button::before {
    padding: 1.2vh 1.491053vh;
  }
  body .popup .popup-info.popup-login form .form-group.form-register-group a {
    font-size: 1.5vh;
  }
  body .popup .popup-info.popup-login form .form-group.form-or-group .text {
    font-size: 2vh;
  }
}
@media screen and (min-width: 600px) and (max-width: 1000px) and (orientation: landscape) {
  
}
::-webkit-scrollbar {
  width: 0.3125vw;
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 0.260416vw grey;
  border-radius: 0.260416vw;
}
::-webkit-scrollbar-thumb {
  background: #aaa;
  border-radius: 0.260416vw;
}
::-webkit-scrollbar-thumb:hover {
  background: #aaa;
}
@keyframes vibrate {
  0% {
    transform: translate(0);
  }
  20% {
    transform: translate(-2px, 2px);
  }
  40% {
    transform: translate(-2px, -2px);
  }
  60% {
    transform: translate(2px, 2px);
  }
  80% {
    transform: translate(2px, -2px);
  }
  100% {
    transform: translate(0);
  }
}

:root {
  --rotate: 11.510416vw;
}
/*
@font: "../../../General/fonts/";

@font-face {
    font-family: "JosefinSans-Medium";
    src: url(/Assets/Events/DepositBenefits/less/@{font}JosefinSans-Medium.ttf) format('truetype');
    font-display: swap;
}*/

body {
  width: 100%;
  font-family: JosefinSans-Medium;
}
body .main-container {
  background: unset;
}
body .main-container #rank-1 {
  /*background: linear-gradient(90deg, gold, orange);*/
  animation: sparkle 1.5s infinite;
}
body .main-container #rank-2 {
  /*background: linear-gradient(90deg, silver, lightgray);*/
  animation: sparkle 1.5s infinite;
}
body .main-container #rank-3 {
  /* background: linear-gradient(90deg, #cd7f32, #a97142);*/
  animation: sparkle 1.5s infinite;
}
body .main-container.no-scroll {
  overflow: hidden;
}
body .main-container .swal-modal.swal-vq {
  width: 100%;
  max-width: 42.857142vh;
  background-color: #0dcaf0d1;
  border-top: 0.510204vh solid #100e337d;
  border-bottom: 0.510204vh solid #100e337d;
  border-radius: 1.530612vh;
}
body .main-container .swal-modal.swal-vq > div.swal-title {
  padding: 1.32653vh 1.632653vh;
  font-weight: bold;
  color: #fff;
  text-align: center;
  text-transform: capitalize;
}
body .main-container .swal-modal.swal-vq > div.swal-title:not(:last-child) {
  margin-bottom: 1.32653vh;
}
body .main-container .swal-modal.swal-vq > div.swal-text {
  padding: 0 1.020408vh;
  color: #fff;
  text-align: center;
}
body .main-container .swal-modal.swal-vq > div.swal-content {
  padding: 0 2.040816vh;
  margin-top: 2.040816vh;
  font-size: 2.186878728vh;
}
body .main-container .swal-modal.swal-vq > div.swal-content ol,
body .main-container .swal-modal.swal-vq > div.swal-content ul {
  padding-left: 3.265306vh;
  margin-left: 7.142857vh;
}
body .main-container .swal-modal.swal-vq > div.swal-content .swal-btn-choose-container {
  width: max-content;
  height: max-content;
  max-width: 100%;
  margin: 2.040816vh auto;
}
body .main-container .swal-modal.swal-vq > div.swal-content .swal-btn-choose-container .swal-btn-choose {
  width: 100%;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
  padding: 10px 15px;
  background-color: #53372f;
  border-radius: 10px;
  border: 1px solid #fff;
  margin: 0 auto;
  font-size: 14pt;
  color: #fff;
  text-align: center;
  font-weight: bold;
  margin: 0.8rem auto;
}
body .main-container .swal-modal.swal-vq > div.swal-footer {
  display: flex;
  justify-content: center;
  margin-top: 0;
}
body .main-container .swal-modal.swal-vq > div.swal-footer .swal-button-container .swal-button {
  min-width: 14.285714vh;
  background: #FFF201;
  background-color: #2aabff;
  border: 1px solid;
  font-size: 2.982107356vh;
  font-weight: normal;
  color: #FFFFFF;
  padding: 0;
  transition: background-color 0.3s linear;
}
body .main-container .swal-modal.swal-vq > div.swal-footer .swal-button-container .swal-button:hover {
  background-color: #2abeff;
}
body .main-container .swal-modal.swal-vq > div.swal-footer .swal-button-container .swal-button:focus {
  box-shadow: none;
}
body .main-container .swal-modal.swal-vq-mutil {
  width: 100%;
  max-width: 42.857142vh;
  margin: 1.020408vh;
  background-color: #0dcaf08f;
  border-top: 0.510204vh solid #100e337d;
  border-bottom: 0.510204vh solid #100e337d;
  border-radius: 1.530612vh;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-title {
  padding: 1.32653vh 1.632653vh;
  font-size: 2.755102vh;
  font-weight: bold;
  color: #fff;
  text-align: center;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-title:not(:last-child) {
  margin-bottom: 1.32653vh;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-text {
  padding: 0 1.020408vh;
  font-size: 1.632653vh;
  font-weight: bold;
  color: #c86200;
  text-align: center;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-content {
  padding: 0 2.040816vh;
  margin-top: 2.040816vh;
  font-size: 16pt;
  max-height: 30vh;
  overflow: auto;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-content ol,
body .main-container .swal-modal.swal-vq-mutil > div.swal-content ul {
  padding: 0 !important;
  margin: auto !important;
  width: max-content;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-content ol li,
body .main-container .swal-modal.swal-vq-mutil > div.swal-content ul li {
  width: max-content;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-footer {
  display: flex;
  justify-content: center;
  margin-top: 0;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-footer .swal-button-container .swal-button {
  min-width: 14.285714vh;
  background: #FFF201;
  background-color: #2aabff;
  border: 0.10204vh solid #7D4D25;
  border-radius: 2.346938vh;
  font-size: 1.734693vh;
  color: #FFFFFF;
  transition: background-color 0.3s linear;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-footer .swal-button-container .swal-button:hover {
  background-color: #2abeff;
}
body .main-container .swal-modal.swal-vq-mutil > div.swal-footer .swal-button-container .swal-button:focus {
  box-shadow: none;
}
body .main-container .swal-modal.swal-box {
  width: 100%;
  max-width: 42.857142vh;
  background-color: #0dcaf0d1;
  border-top: 0.510204vh solid #100e337d;
  border-bottom: 0.510204vh solid #100e337d;
  border-radius: 1.530612vh;
}
body .main-container .swal-modal.swal-box > div.swal-title {
  padding: 1.32653vh 1.632653vh;
  font-weight: bold;
  color: #fff;
  text-align: center;
  text-transform: capitalize;
}
body .main-container .swal-modal.swal-box > div.swal-title:not(:last-child) {
  margin-bottom: 1.32653vh;
}
body .main-container .swal-modal.swal-box > div.swal-text {
  font-size: 20px;
  padding: 0 1.020408vh;
  color: #fff;
  text-align: center;
}
body .main-container .swal-modal.swal-box > div.swal-content {
  padding: 0 2.040816vh;
  margin-top: 2.040816vh;
  font-size: 2.186878728vh;
}
body .main-container .swal-modal.swal-box > div.swal-content ol,
body .main-container .swal-modal.swal-box > div.swal-content ul {
  padding-left: 3.265306vh;
  margin-left: 7.142857vh;
}
body .main-container .swal-modal.swal-box > div.swal-content .swal-btn-choose-container {
  width: max-content;
  height: max-content;
  max-width: 100%;
  margin: 2.040816vh auto;
}
body .main-container .swal-modal.swal-box > div.swal-content .swal-btn-choose-container .swal-btn-choose {
  width: 100%;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
  padding: 10px 15px;
  background-color: #53372f;
  border-radius: 10px;
  border: 1px solid #fff;
  margin: 0 auto;
  font-size: 14pt;
  color: #fff;
  text-align: center;
  font-weight: bold;
  margin: 0.8rem auto;
}
body .main-container .swal-modal.swal-box > div.swal-footer {
  display: flex;
  justify-content: center;
  margin-top: 0;
}
body .main-container .swal-modal.swal-box > div.swal-footer .swal-button-container .swal-button {
  min-width: 14.285714vh;
  background: #FFF201;
  background-color: #2aabff;
  border: 1px solid #120f2e;
  font-size: 2.982107356vh;
  font-weight: normal;
  color: #FFFFFF;
  padding: 0;
  transition: background-color 0.3s linear;
}
body .main-container .swal-modal.swal-box > div.swal-footer .swal-button-container .swal-button:hover {
  background-color: #2abeff;
}
body .main-container .swal-modal.swal-box > div.swal-footer .swal-button-container .swal-button:focus {
  box-shadow: none;
}
body .main-container .swal-modal.swal-box-red {
  width: 100%;
  max-width: 42.857142vh;
  background-color: #ff001870;
  border-top: 0.510204vh solid #100e337d;
  border-bottom: 0.510204vh solid #100e337d;
  border-radius: 1.530612vh;
}
body .main-container .swal-modal.swal-box-red > div.swal-title {
  padding: 1.32653vh 1.632653vh;
  font-weight: bold;
  color: #fff;
  text-align: center;
  text-transform: capitalize;
}
body .main-container .swal-modal.swal-box-red > div.swal-title:not(:last-child) {
  margin-bottom: 1.32653vh;
}
body .main-container .swal-modal.swal-box-red > div.swal-text {
  font-size: 20px;
  padding: 0 1.020408vh;
  color: #fff;
  text-align: center;
}
body .main-container .swal-modal.swal-box-red > div.swal-content {
  padding: 0 2.040816vh;
  margin-top: 2.040816vh;
  font-size: 2.186878728vh;
}
body .main-container .swal-modal.swal-box-red > div.swal-content ol,
body .main-container .swal-modal.swal-box-red > div.swal-content ul {
  padding-left: 3.265306vh;
  margin-left: 7.142857vh;
}
body .main-container .swal-modal.swal-box-red > div.swal-content .swal-btn-choose-container {
  width: max-content;
  height: max-content;
  max-width: 100%;
  margin: 2.040816vh auto;
}
body .main-container .swal-modal.swal-box-red > div.swal-content .swal-btn-choose-container .swal-btn-choose {
  width: 100%;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
  padding: 10px 15px;
  background-color: #53372f;
  border-radius: 10px;
  border: 1px solid #fff;
  margin: 0 auto;
  font-size: 14pt;
  color: #fff;
  text-align: center;
  font-weight: bold;
  margin: 0.8rem auto;
}
body .main-container .swal-modal.swal-box-red > div.swal-footer {
  display: flex;
  justify-content: center;
  margin-top: 0;
}
body .main-container .swal-modal.swal-box-red > div.swal-footer .swal-button-container .swal-button {
  min-width: 14.285714vh;
  background: #FFF201;
  background-color: #2aabff;
  border: none;
  font-size: 2.982107356vh;
  font-weight: normal;
  color: #FFFFFF;
  padding: 0;
  transition: background-color 0.3s linear;
}
body .main-container .swal-modal.swal-box-red > div.swal-footer .swal-button-container .swal-button:hover {
  background-color: #2abeff;
}
body .main-container .swal-modal.swal-box-red > div.swal-footer .swal-button-container .swal-button:focus {
  box-shadow: none;
}
body .main-container .loading-gift .loading {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background-color: #040404ab;
}
body .main-container .loading-gift .loading p {
  font-size: 20pt;
  font-weight: bold;
  color: #fff;
}
body .main-container .loading-gift .loading p .dots {
  animation: blink 1s infinite;
}
body .main-container .popup-rule {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9999;
}
body .main-container .popup-rule .rule-container {
  position: relative;
}
body .main-container .popup-rule .rule-container .rule-content {
  width: 80%;
  height: 42.447916vw;
  padding: 0 0.520833vw 0;
  border: 0.46875vw #e02e00 solid;
  border-radius: 1.5625vw;
  background-color: #fcfcfceb;
  margin: 2% auto;
  position: relative;
}
body .main-container .popup-rule .rule-container .rule-content .btn-close {
  position: absolute;
  top: 0;
  right: 0;
  background: none;
  color: #ffc107;
  font-size: 40px;
  width: max-content;
  height: max-content;
  opacity: 1;
  z-index: 10;
}
body .main-container .popup-rule .rule-container .rule-content .content-detail {
  overflow: auto;
  width: 100%;
  height: 100%;
  color: #000000;
  padding: 2%;
}
body .main-container .popup-rule .rule-container .rule-content .content-detail img {
  max-width: 100%;
  height: auto !important;
}
body .main-container .popup-rule .rule-container .rule-content .content-detail table {
  max-width: 100%;
  caption-side: unset;
  border-collapse: separate;
  box-sizing: border-box;
  margin: auto;
}
body .main-container .popup-rule .rule-container .rule-content .content-detail table tbody,
body .main-container .popup-rule .rule-container .rule-content .content-detail table td,
body .main-container .popup-rule .rule-container .rule-content .content-detail table tfoot,
body .main-container .popup-rule .rule-container .rule-content .content-detail table th,
body .main-container .popup-rule .rule-container .rule-content .content-detail table thead,
body .main-container .popup-rule .rule-container .rule-content .content-detail table tr {
  border-color: #000000;
  border-style: solid;
  border-width: 1px;
}
body .main-container .popup-history {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9999;
}
body .main-container .popup-history .history-container {
  position: relative;
}
body .main-container .popup-history .history-container .history-content {
  width: 80%;
  height: 42.447916vw;
  padding: 0 0.520833vw 0;
  border: 0.46875vw #e02e00 solid;
  border-radius: 1.5625vw;
  background-color: #393737eb;
  margin: 2% auto;
  position: relative;
}
body .main-container .popup-history .history-container .history-content .btn-close {
  position: absolute;
  top: 0;
  right: 0;
  background: none;
  color: #ffc107;
  font-size: 40px;
  width: max-content;
  height: max-content;
  opacity: 1;
  z-index: 10;
}
body .main-container .popup-history .history-container .history-content .content-detail {
  overflow: auto;
  width: 100%;
  height: 100%;
  color: #000000;
  padding: 2%;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history {
  width: 90%;
  height: 70vh;
  margin: auto;
  overflow-y: auto;
  position: relative;
  top: 6%;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history table {
  width: 100%;
  border-collapse: collapse;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history table tbody tr {
  border: 1px solid;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history td {
  color: #fff;
  padding: 0.416666vw;
  text-align: center;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history th {
  font-size: 1.458333vw;
  color: #fff;
  padding: 0.416666vw;
  text-align: center;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history .text-box {
  color: goldenrod;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history .text-normal {
  color: deepskyblue;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history .diamond-text {
  color: crimson;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history .btn-gift {
  background: url(/Assets/Events/DepositBenefits/imgs/nut-nho.png) no-repeat;
  background-size: 100%;
  width: 9.53125vw;
  height: 2.8125vw;
  font-size: 1.770833vw;
  text-align: center;
  color: #fff;
  border: 0;
  font-family: 'Times New Roman';
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history .btn-gift.all {
  font-size: 1.5625vw;
}
body .main-container .popup-history .history-container .history-content .content-detail .spin-history .btn-gift:hover {
  background: url(/Assets/Events/DepositBenefits/imgs/nut-nho-hover.png) no-repeat;
  background-size: 100%;
}
body .main-container .info-server-role {
  background: url(/Assets/Events/DepositBenefits/imgs/Khung-info.png) center 0 no-repeat;
  background-size: contain;
  height: 10vw;
  width: 57%;
  position: relative;
  padding: 3% 1% 1% 0%;
  margin: auto;
  /*.btn-rule {
                        width: 9vw;
                        height: 3vw;
                        background: url(/Assets/Events/DepositBenefits/imgs/Rule.png) 0 0 no-repeat;
                        background-size: contain;
                        position: absolute;
                        z-index: 2;
                        top: 0vw;
                        left: 2vw;
                    }*/

}
body .main-container .info-server-role .btn-list {
  display: flex;
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  align-items: center;
}
body .main-container .info-server-role .btn-list .btn-server {
  width: 9vw;
  height: 3vw;
  background: url(/Assets/Events/DepositBenefits/imgs/Choose-Server.png) center 0 no-repeat;
  background-size: contain;
}
body .main-container .info-server-role .btn-list .btn-logout {
  width: 9vw;
  height: 3vw;
  background: url(/Assets/Events/DepositBenefits/imgs/LogOut.png) 0 0 no-repeat;
  background-size: contain;
}
body .main-container .info-server-role .btn-list .btn-login {
  width: 9vw;
  height: 3vw;
  background: url(/Assets/Events/DepositBenefits/imgs/Login.png) 0 0 no-repeat;
  background-size: contain;
}
body .main-container .info-server-role .list-btn-right {
  display: flex;
  align-items: center;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
}
body .main-container .info-server-role .list-btn-right .btn-rule {
  width: 8.5vw;
  height: 3vw;
  background: url(/Assets/Events/Event_LuckySpin/imgs/Rule.png) 0 0 no-repeat;
  background-size: contain;
}
body .main-container .info-server-role .list-btn-right .btn-history {
  width: 8.5vw;
  height: 3vw;
  background: url(/Assets/Events/Event_LuckySpin/imgs/btn-history.png) center 0 no-repeat;
  background-size: contain;
}
body .main-container .info-server-role .text-login {
  --bs-text-opacity: 1;
  color: #e60000;
  text-align: center !important;
  font-size: 1.5vw;
  position: absolute;
  margin: 2% auto;
  width: 100%;
  cursor: pointer;
  text-decoration: none;
}
body .main-container .info-server-role .info-user {
  margin: 4% auto 0;
  text-align: center;
  width: 50vw;
  font-size: 1.3vw;
  font-weight: bold;
}
body .main-container .info-server-role .info-user .info-user-1 {
  width: 100%;
  display: inline-flex;
  color: white;
  text-align: center;
  margin-bottom: 2%;
}
body .main-container .info-server-role .info-user .info-user-1 .user-1 {
  width: 50%;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-inline-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
body .main-container .info-server-role .info-user .info-user-1 .user-1:nth-child(1) {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
body .main-container .info-server-role .info-user .info-user-1 .user-1:nth-child(1) .img-ruby {
  width: 2vw;
  height: 2vw;
}
body .main-container .info-server-role .info-user .info-user-1 .user-1:nth-child(1) .small-txt {
  color: red;
  font-size: 1vw;
}
body .main-container .info-server-role .info-user .info-user-1 .user-1.user-border {
  border-right: 1px solid #fde98d;
}
body .main-container .info-server-role .info-user .info-user-1 .user-1.icon {
  display: flex;
  justify-content: center;
}
body .main-container .info-server-role .info-user .info-user-1 .user-1 .icon-vip {
  width: 2vw;
  height: 1.5vw;
  background: url(/Assets/Events/DepositBenefits/imgs/CD/VIP.png) no-repeat center center;
  background-size: contain;
  display: inline-block;
}
body .main-container .info-server-role .info-user .info-user-2 {
  width: 100%;
  display: inline-flex;
  color: white;
  text-align: center;
}
body .main-container .info-server-role .info-user .info-user-2 .user-2 {
  width: 50%;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-inline-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
body .main-container .info-server-role .info-user .info-user-2 .user-2.user-border {
  border-right: 1px solid #fde98d;
}
body .main-container .info-server-role .info-user p {
  margin: 0;
  color: #ffffff;
}
body .main-container .info-server-role .info-user p .info-user-detail {
  color: #ffffff;
  margin: 2%;
}
body .main-container .info-server-role.non-display {
  display: none;
}
body .main-container .header-webshop {
  width: 100%;
  height: max-content;
  background: #000;
  position: sticky;
  top: 6%;
  left: 0;
  padding: 0.260416667vw 0;
  margin-bottom: 1.041666667vw;
  z-index: 99;
}
body .main-container .header-webshop .header-container .menu {
  width: 100%;
  height: max-content;
  position: relative;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
}
body .main-container .header-webshop .header-container .menu .menu-item {
  background-image: url(/Assets/Events/DepositBenefits/imgs/Image.png);
  background-repeat: no-repeat;
  position: relative;
  /*//================ Cơ Chế WebShop mới
                            &.menu-item-character-info {
                                background: unset;

                                .character-info {
                                    font-size: 1rem;
                                    color: #fff;
                                    text-decoration: none;
                                    font-weight: bold;
                                }
                            }
                            //================*/

}
body .main-container .header-webshop .header-container .menu .menu-item a {
  width: 100%;
  height: 100%;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  display: block;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-logo {
  height: 3.75vw;
  width: 6.770833333vw;
  background-size: 953.0769231% 883.3333333%;
  background-position: 48.5% 30%;
  margin-right: 50px;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-webshop {
  height: 2.34375vw;
  width: 2.96875vw;
  background-size: 2173.684211% 1413.333333%;
  background-position: 0 88%;
  position: relative;
  margin-right: 23px;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-webshop:hover {
  background-position: 20.4% 88%;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox {
  width: 22vw;
  background: unset;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container {
  padding: 0.260416667vw 3.854166667vw 0.260416667vw 1.5625vw;
  background: #fff;
  border: solid #f37fdd 2px;
  border-radius: 1.5625vw;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container .search-box {
  width: 100%;
  font-size: large;
  box-shadow: none;
  border: none;
  color: #959595;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container .btn-search {
  height: max-content;
  width: max-content;
  position: absolute;
  top: 50%;
  right: 1.041666667vw;
  transform: translateY(-50%);
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container .btn-search i {
  font-size: xx-large;
  color: #037ffd;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-align-content: center;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  align-items: center;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-buycash {
  background: unset;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-buycash .buycash {
  font-size: 1.2rem;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info {
  background: unset;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .balance-container {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .balance-container .balance-dzo {
  font-size: 1rem;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  margin: 5px 4px 0px 4px;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .select-option-box {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .select-option-box .select-option {
  width: max-content;
  margin: 0 0.5vw 0 0.5vw;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .select-option-box .select-option select {
  width: 8.5vw;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login {
  height: 2.291666667vw;
  width: 2.291666667vw;
  background-size: 2815.909091%;
  background-position: 16.3% 88.4%;
  background-repeat: repeat;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login:hover {
  background-position: 36.5% 88.4%;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon {
  position: relative;
  width: 100%;
  height: 100%;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .avatar {
  position: absolute;
  width: 100%;
  height: 100%;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info {
  right: -0.78125vw;
  top: 160%;
  position: absolute;
  z-index: 99;
  width: max-content;
  display: none;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info.active {
  display: block;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info .menu-info-item {
  display: block;
  white-space: nowrap;
  padding: 0.520833333vw 0.78125vw;
  background: #ffffff;
  margin-bottom: 2px;
  text-align: center;
  position: relative;
  color: #000;
  font-weight: bold;
}
body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info .menu-info-item:hover {
  background-color: #000;
  color: #fff;
}
@media screen and (max-width: 1024px) {
  :root {
    --rotate: 21.582031vw;
  }
  body .main-container .header-webshop {
    top: 4%;
    padding: 1.488281vh 0;
    margin-bottom: 1.953125vh;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-logo {
    height: 7.03125vh;
    width: 12.6953125vh;
    margin-right: 1vh;
    display: none;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-webshop {
    height: 4.39453125vh;
    width: 5.56640625vh;
    margin-right: 2.24609375vw;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox {
    flex: 1 1 0;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container {
    padding: 0.48828125vh 7.2265625vh 0.48828125vh 2.9296875vh;
    border-radius: 2.9296875vh;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox .search-box-container .btn-search {
    right: 1.953125vh;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-buycash .buycash {
    font-size: small;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .balance-dzo {
    font-size: small;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-balance-info .select-option-box .select-option select {
    width: 16vw;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login {
    height: 4.296875vh;
    width: 4.296875vh;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info {
    right: -1.46484375vh;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info .menu-info-item {
    padding: 0.9765625vh 1.46484375vh;
  }
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-login .avatar-icon .menu-info .menu-info-item.item-mobile {
    display: block !important;
  }
  body .main-container .info-server-role {
    scale: 1.9;
    top: 20%;
    width: 50%;
    padding: 3% 1% 1% 0%;
  }
  body .main-container .popup-rule .rule-container {
    margin-top: 10%;
  }
  body .main-container .popup-rule .rule-container .rule-content {
    height: 85vh;
    padding: 0 0.976562vw 0;
    border: 0.878906vw #e02e00 solid;
    border-radius: 2.929687vw;
  }
  body .main-container .popup-rule .rule-container .rule-content .btn-close {
    top: -4vw;
    font-size: 9vw;
  }
  body .main-container .popup-history .history-container {
    margin-top: 10%;
  }
  body .main-container .popup-history .history-container .history-content {
    height: 85vh;
    padding: 0 0.976562vw 0;
    border: 0.878906vw #e02e00 solid;
    border-radius: 2.929687vw;
  }
  body .main-container .popup-history .history-container .history-content .content-detail .spin-history {
    height: 76vh;
  }
  body .main-container .popup-history .history-container .history-content .content-detail .spin-history table {
    width: 100%;
    border-collapse: collapse;
  }
  body .main-container .popup-history .history-container .history-content .content-detail .spin-history td {
    color: #fff;
    padding: 0.78125vw;
    text-align: center;
  }
  body .main-container .popup-history .history-container .history-content .content-detail .spin-history th {
    font-size: 2.734375vw;
    padding: 0.78125vw;
  }
  body .main-container .popup-history .history-container .history-content .content-detail .spin-history .btn-gift {
    width: 17.871093vw;
    height: 5.273437vw;
    font-size: 3.320312vw;
  }
  body .main-container .popup-history .history-container .history-content .content-detail .spin-history .btn-gift.all {
    font-size: 2.929687vw;
  }
}
@media screen and (max-width: 1024px) and (max-width: 660px) {
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox {
    display: none;
  }
}
@media screen and (max-width: 480px) and (orientation: portrait) {
  body .main-container .header-webshop .header-container .menu .menu-item.menu-item-searchbox {
    display: none;
  }
  body .main-container .popup-rule .rule-container {
    margin-top: 20%;
  }
  body .main-container .popup-rule .rule-container .rule-content {
    height: 65vh;
  }
  body .main-container .popup-history .history-container {
    margin-top: 20%;
  }
  body .main-container .popup-history .history-container .history-content {
    height: 65vh;
  }
  body .main-container .popup-history .history-container .history-content .btn-close {
    font-size: 9vw;
    top: -4vw;
  }
  body .main-container .popup-history .history-container .history-content .spin-history {
    height: 58vh !important;
  }
  body .main-container .popup-history .history-container .history-content .spin-history td {
    font-size: 3vw;
    padding: 0.78125vw;
  }
  body .main-container .popup-history .history-container .history-content .spin-history th {
    font-size: 3.6vw;
    padding: 0.78125vw;
  }
  body .main-container .popup-history .history-container .history-content .spin-history .btn-gift.all {
    font-size: 2.3vw;
  }
}
@keyframes progress-bar {
  0%, 100% {
    filter: hue-rotate(0deg);
  }
  50% {
    filter: hue-rotate(360deg);
  }
}
@keyframes blink {
  0% {
    opacity: 0.2;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 0.2;
  }
}
@keyframes sparkle {
  0% {
    text-shadow: 0 0 5px red, 0 0 10px red;
  }
  50% {
    text-shadow: 0 0 15px orange, 0 0 25px yellow;
  }
  100% {
    text-shadow: 0 0 5px red, 0 0 10px red;
  }
}