:root{
  --theangels-body:#f0f3f9;
  --theangels-putih:#FFFFFF;
  --theangels-putih-gelap:#c1c1c1;
  --theangels-hitam:#20242d;
  --theangels-abu-abu:#424242;
  --theangels-orange:#e84d26;
  --theangels-orange-dark:#cf5f00;
  --theangels-subbg:#1f2225;
  --theangels-subfooter:#dbe4fd;
  --theangels-primary:rgb(96 37 117);
  --theangels-primary-dark:rgb(80 20 101);
  --theangels-primary-border:rgb(63 11 109);
  --theangels-tranparan:rgba(0,0,0,0.5);
  --theangels-merah:#ff3d3d;
  --color-portal-10:#e8e3ff;
  --sku-card-border-color-default: var(--color-portal-10);
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(124 59 246 / 12%);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-bg-opacity: 1;
  --spacing: .25rem;
  --scrollbar-width: 20px;
}

/* Text colors */
.color-primary {color: #3b7cff; }
.color-primary-hover {color: #003569; }
.color-danger {color: #ff3d3d; }
.color-success {color: #9BE15D; }
.color-info {color: #3b7cff; }
.color-warning {color: #bbae00; }
.color-light {color: #f7f9fb; }
.color-mid {color: #6D7784; }
.color-dark {color: #293340; }
.color-green {color: #4e9800; }
.color-white {color: #FFFFFF; }

.bg-primary {background: #3b7cff; }
.bg-danger {background: #ff3d3d; }
.bg-success {background: #9BE15D; }
.bg-info {background: #3b7cff; }
.bg-warning {background: #bbae00; }
.bg-light {background: #f7f9fb; }
.bg-mid {background: #6D7784; }
.bg-dark {background: #293340; }
.bg-green {background: #4e9800; }

.list-items-other li .bg-bianca {--tw-bg-opacity: 1;background-color: rgb(244 252 237 / var(--tw-bg-opacity));border-top-left-radius: 0.5em;border-top-right-radius: 0.5em;}
.noborder{border: unset;}

.shimmer {
  color: grey;
  display: inline-block;
  mask: linear-gradient(-60deg, #000 30%, #0005, #000 70%) right/350% 100%;
  animation: shimmer 3.3s infinite;
  font-size: 50px;
  max-width: 200px;
}

@keyframes shimmer {
  100% {
    mask-position: left
  }
}
@-webkit-keyframes mescrollFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes mescrollFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.mescroll-fade-out {
  pointer-events: none;
  -webkit-animation: mescrollFadeOut .5s linear forwards;
  animation: mescrollFadeOut .5s linear forwards;
}

@-webkit-keyframes mescrollFadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes mescrollFadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

body{font-family:"Fira Sans",sans-serif;font-size:100%;margin:0;padding:0;background-color:var(--theangels-body);color:#293340;-webkit-transition: all ease 0.2s;-webkit-transition: all ease 0.2s;-moz-transition: all ease 0.2s;transition: all ease 0.2s;}
body.onprogress:after{content:"";position:fixed;z-index:999999;top:0;left:0;width:100%;height:100%;background:rgb(255 255 255 / .95) url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiBmaWxsPSIjM2I3Y2ZmIj4KICA8cGF0aCBvcGFjaXR5PSIuMjUiIGQ9Ik0xNiAwIEExNiAxNiAwIDAgMCAxNiAzMiBBMTYgMTYgMCAwIDAgMTYgMCBNMTYgNCBBMTIgMTIgMCAwIDEgMTYgMjggQTEyIDEyIDAgMCAxIDE2IDQiLz4KICA8cGF0aCBkPSJNMTYgMCBBMTYgMTYgMCAwIDEgMzIgMTYgTDI4IDE2IEExMiAxMiAwIDAgMCAxNiA0eiI+CiAgICA8YW5pbWF0ZVRyYW5zZm9ybSBhdHRyaWJ1dGVOYW1lPSJ0cmFuc2Zvcm0iIHR5cGU9InJvdGF0ZSIgZnJvbT0iMCAxNiAxNiIgdG89IjM2MCAxNiAxNiIgZHVyPSIwLjhzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L3BhdGg+Cjwvc3ZnPgo=) center no-repeat}
.frame-input-area.onprogress:after{content:"";position:absolute;z-index:9;top:0;left:0;width:100%;height:100%;background:rgb(255 255 255 / .95) url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiBmaWxsPSIjM2I3Y2ZmIj4KICA8cGF0aCBvcGFjaXR5PSIuMjUiIGQ9Ik0xNiAwIEExNiAxNiAwIDAgMCAxNiAzMiBBMTYgMTYgMCAwIDAgMTYgMCBNMTYgNCBBMTIgMTIgMCAwIDEgMTYgMjggQTEyIDEyIDAgMCAxIDE2IDQiLz4KICA8cGF0aCBkPSJNMTYgMCBBMTYgMTYgMCAwIDEgMzIgMTYgTDI4IDE2IEExMiAxMiAwIDAgMCAxNiA0eiI+CiAgICA8YW5pbWF0ZVRyYW5zZm9ybSBhdHRyaWJ1dGVOYW1lPSJ0cmFuc2Zvcm0iIHR5cGU9InJvdGF0ZSIgZnJvbT0iMCAxNiAxNiIgdG89IjM2MCAxNiAxNiIgZHVyPSIwLjhzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L3BhdGg+Cjwvc3ZnPgo=) center no-repeat}
.payment.onprogress:after {display: block;content: "";position: absolute;z-index: 9;top: 0;left: 0;width: 100%;height: 100%;background: rgb(124 104 131 / 51%) url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiBmaWxsPSIjM2I3Y2ZmIj4KICA8cGF0aCBvcGFjaXR5PSIuMjUiIGQ9Ik0xNiAwIEExNiAxNiAwIDAgMCAxNiAzMiBBMTYgMTYgMCAwIDAgMTYgMCBNMTYgNCBBMTIgMTIgMCAwIDEgMTYgMjggQTEyIDEyIDAgMCAxIDE2IDQiLz4KICA8cGF0aCBkPSJNMTYgMCBBMTYgMTYgMCAwIDEgMzIgMTYgTDI4IDE2IEExMiAxMiAwIDAgMCAxNiA0eiI+CiAgICA8YW5pbWF0ZVRyYW5zZm9ybSBhdHRyaWJ1dGVOYW1lPSJ0cmFuc2Zvcm0iIHR5cGU9InJvdGF0ZSIgZnJvbT0iMCAxNiAxNiIgdG89IjM2MCAxNiAxNiIgZHVyPSIwLjhzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L3BhdGg+Cjwvc3ZnPgo=) center no-repeat;}
.buynow.onprogress:after {display: block;content: "";position: absolute;z-index: 9;top: 0;left: 0;width: 100%;height: 100%;background: rgb(124 104 131 / 51%) url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiBmaWxsPSIjM2I3Y2ZmIj4KICA8cGF0aCBvcGFjaXR5PSIuMjUiIGQ9Ik0xNiAwIEExNiAxNiAwIDAgMCAxNiAzMiBBMTYgMTYgMCAwIDAgMTYgMCBNMTYgNCBBMTIgMTIgMCAwIDEgMTYgMjggQTEyIDEyIDAgMCAxIDE2IDQiLz4KICA8cGF0aCBkPSJNMTYgMCBBMTYgMTYgMCAwIDEgMzIgMTYgTDI4IDE2IEExMiAxMiAwIDAgMCAxNiA0eiI+CiAgICA8YW5pbWF0ZVRyYW5zZm9ybSBhdHRyaWJ1dGVOYW1lPSJ0cmFuc2Zvcm0iIHR5cGU9InJvdGF0ZSIgZnJvbT0iMCAxNiAxNiIgdG89IjM2MCAxNiAxNiIgZHVyPSIwLjhzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L3BhdGg+Cjwvc3ZnPgo=) center no-repeat;}
a{text-decoration:none;outline:none;color:var(--theangels-primary)}
a.full-link{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit}li{list-style:none}

#mobile-menu{display:none}
.mobile-menu-open{transform: translate(-200px);}
.mobile-menu-open .header-nav{display:block;position:absolute;height:auto;width:200px;background-color:var(--theangels-primary);top:0}
.mobile-menu-open .header-nav.mobilemenu ul{display:block;width:100%;margin-top:0;height:100%;padding: 0px;}
.mobile-menu-open .header-nav.mobilemenu li{margin:0;width:100%;line-height:30px}
.mobile-menu-open .header-nav.mobilemenu li a{display:block;padding:20px 20px;font-size:16px;text-align:right;color:var(--theangels-putih)}
.topbar-mobile-menu-icon{position:absolute;right:20px;color:var(--theangels-putih);background-color: var(--theangels-primary-border);border-color: var(--theangels-primary);border-radius:5px;padding:5px 10px}
.darkbg.mobile-menu-open .header-nav{background-color: var(--theangels-hitam);}


#eyemode{float:right;background-color: var(--theangels-primary-border);border-color: var(--theangels-primary);padding:10px 13px;color:#fff;border-radius:5px}
#eyemode:hover {background-color: var(--theangels-primary-dark);}
.section{padding:29px 0}
.section-title{margin:0 0 51px;font-size:36px;line-height:44px;font-weight:200}
.section-title a {color: var(--theangels-hitam);}
.footer-cont{min-height:307px}
.item-produk {display: grid;row-gap: 20px;grid-column-gap: 10px;grid-template-columns: repeat(5, 1fr);align-items: normal;align-content: normal;}
.service{background-color:var(--theangels-putih);border-radius:.6rem;border: 1px solid var(--theangels-putih-gelap);padding: 10px;}
.service #trial-time {z-index:99;margin: 0px;font-size: 13px;font-weight: 600;background-color: rgb(103 10 146);color: rgb(249 133 255);padding: 5px;border-radius: 4px;text-align: center;line-height: normal;position: absolute;width: 100%;top: -30px;left: -5px;}
.service #trialtime {margin: 0px;font-size: 13px;font-weight: 600;background-color: rgb(10 146 52);color: rgb(172 255 198 / 76%);padding: 5px;border-radius: 4px;text-align: center;line-height: normal;position: absolute;width: 100%;bottom: -28px;left: -5px;}
.rounded{border-radius:6px!important}
.img-thumbnail{padding:.45rem;background-color:#fff;border:1px solid #dee2e6;border-radius:6px;max-width:100%;height:auto}
.styling{border:1px solid #dee2e6;border-radius:6px;background-color:#fff;padding:.45rem .45rem .2rem .45rem;margin-right:1.5%!important;max-width:617px!important}

@media only screen and (min-width: 992px) {
  .item-produk .service{padding: 15px;}
}

@media only screen and (max-width: 768px) {
  .item-produk{grid-template-columns: repeat(4, 1fr);}
}

@media only screen and (max-width: 600px) {
  .item-produk{grid-template-columns: repeat(3, 1fr);}
}

@media screen and (max-width:430px){
  .item-produk{grid-template-columns: repeat(2, minmax(170px, 1fr));}
  .game .item-produk{grid-template-columns: repeat(3, minmax(110px, 1fr));}
  .pulsapln .item-produk{grid-template-columns: repeat(3, minmax(110px, 1fr));}
  .pulsapln .item-produk .text-lg{
    font-size: 1.001rem !important;
  }

  .item-produk .service #trial-time {
    margin-left: 0;
    max-width: 150px !important;
    line-height: 26px;
  }
  .item-produk .service #trialtime {
    margin-left: 0;
    max-width: 150px;
  }
}
@media screen and (max-width:375px){
  .item-produk{grid-template-columns: repeat(2, 1fr);}
  .item-produk .service #trial-time {
    margin-left: 0;
    max-width: 130px !important;
    line-height: 12px;
  }
  .item-produk .service #trialtime {
    margin-left: 0;
    max-width: 130px;
  }
}

@media only screen and (max-width: 320px) {
  .item-produk{grid-template-columns: repeat(2, 1fr);}
  .pilihan .item-produk{grid-template-columns: repeat(7, 135px);overflow-x: scroll;scrollbar-width: none;-ms-overflow-style: none;}
}

header{padding:20px 0;color:#fff;background-color:var(--swiper-theme-color);position:sticky;top:0;z-index:999}
footer{padding:80px 0;color:var(--theangels-putih);font-size:14px;line-height:20px;font-weight:300;background-color:var(--theangels-primary)}
footer *{color:var(--theangels-putih);background-color:var(--theangels-primary)}
.footer-logo{float:left}
.footer-logo img{display:block;height:60px;width:auto}
.copyright{display:grid;grid-template-columns:repeat(2,1fr);align-items:center;align-content:baseline;float:left}
.footer-lang-selector{float:left;margin-top:4px;margin-left:20px;padding:3px;display:inline-block;border:1px solid #6D7784;outline:none;background-color:#fff0;color:#fff;font-size:14px;line-height:24px}
.footer-lang-selector option{color:#293340}

.onesidepage .title{margin:0 0 37px;color:#6D7784;font-size:32px;line-height:41px;font-weight:300;text-align:center}
.onesidepage form{max-width:300px;margin:200px auto;padding:35px 35px 60px;background-color:#fff}
.onesidepage .sub{margin:40px auto 0;color:#3A3A3A;font-size:12px;line-height:20px;text-align:center}
.onesidepage .sub .link{color:inherit;float:inherit}
.onesidepage .sub a:hover{color:#6D7784}
.onesidepage .sub label{float:left}

.soon{
  max-height: 90px;
  top: -40px;
  position: relative;
}

.mediumpage{min-height:600px;}
.mediumpage .title{margin:0 0 37px;color:var(--theangels-putih);font-size:32px;line-height:41px;font-weight:300;text-align:center}
.mediumpage form{max-width:450px;margin:0 auto;padding:35px 35px 60px;background-color:var(--theangels-primary);border-radius:15px;}
.mediumpage .sub{margin:40px auto 0;color:var(--theangels-putih-gelap);font-size:12px;line-height:20px;text-align:center}
.mediumpage .sub .link{color:inherit;float:inherit}
.mediumpage .sub a:hover{color:#6D7784}
.mediumpage .sub label{float:left}
.mediumpage .input.hasvalue {color: var(--theangels-putih);}
.mediumpage .checkbox:checked+div{color: var(--theangels-putih);}
.mediumpage .checkbox:checked+div .icon.checked{color: var(--theangels-putih);}
.mediumpage .checkbox+div .icon.unchecked{color: var(--theangels-putih);}
.mediumpage label{color: var(--theangels-putih);}
.mediumpage input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theangels-primary) inset !important;-webkit-text-fill-color: var(--theangels-putih) !important;}
.mediumpage input:-internal-autofill-selected{background-color:var(--theangels-primary) !important;font-size: 14px;}
.mediumpage input:-internal-autofill-selected + label {top:-10px !important;color:var(--theangels-putih-gelap) !important;font-size: 12px;}
.mediumpage input:-webkit-autofill:focus + label{top:-10px !important;color:var(--theangels-putih-gelap) !important;font-size: 12px;}

.largeform{margin:80px 0}
.largeform .title{margin:0 0 37px;color:#6D7784;font-size:32px;line-height:41px;font-weight:300;text-align:center}
.largeform form{max-width:1140px;margin:0 auto;padding:35px 60px 60px}
.largeform .sub{margin:40px auto 0;color:#BEBEBE;font-size:12px;line-height:17px;text-align:center}
.largeform .sub div{margin-bottom:5px}
.largeform .sub a{color:inherit;text-decoration:underline}
.largeform .sub a:hover{color:#293340}

.simpleform{margin:80px 0}
.simpleform .title{margin:0 0 37px;color:#6D7784;font-size:32px;line-height:41px;font-weight:300;text-align:center}
.simpleform form{max-width:300px;margin:0 auto;padding:35px 60px 60px;background-color:#fff}
.simpleform .sub{margin:40px auto 0;color:#BEBEBE;font-size:12px;line-height:17px;text-align:center}
.simpleform .sub div{margin-bottom:5px}
.simpleform .sub a{color:inherit;text-decoration:underline}
.simpleform .sub a:hover{color:#293340}

.fbloginbtn{display:block;padding:13px;margin-bottom:60px;font-size:17px;line-height:20px;text-align:center;color:#fff;background-color:#39579A;border-radius:4px}
.fbloginbtn:hover{background-color:#2b4275}
.fbloginbtn span{font-size:24px;vertical-align:-3px}

.fluid{display:block!important;width:100%!important}
.form-result{font-size:16px;line-height:20px}
.form-result > div{margin-bottom:5px}
.form-result > div:last-child{margin-bottom:0}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {-webkit-appearance: none;-moz-appearance: textfield;margin: 0;}
input[type=number] {-moz-appearance: textfield;}
input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theangels-abu-abu) inset;-webkit-text-fill-color: var(--theangels-putih);}
.lightbg input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px var(--theangels-putih) inset;-webkit-text-fill-color: var(--theangels-hitam);}
input:-internal-autofill-selected{background-color:var(--theangels-abu-abu)}
.lightbg input:-internal-autofill-selected{background-color:var(--theangels-putih) !important;}

.input.hasvalue {color: var(--theangels-hitam);}
.input{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:block;width:100%;height:50px;padding:15px 0;color:#6D7784;font-size:14px;line-height:19px;border:none;border-bottom:1px solid #e0e0e0;background-color:#fff0;outline:none}
.input:focus{border-color:var(--theangels-primary)}
.input.error{border-color:#ff3d3d}
.inputdazz{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:block;width:100%;height:39px;padding:10px;margin:0;color:inherit;font-size:14px;line-height:19px;border:1px solid #b9b9b9;background-color:#fff0;outline:none}
.inputdazz:focus{border-color:var(--theangels-primary)}
.inputdazz.error{border-color:#ff3d3d}

.button{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:inline-block;height:50px;padding:15px 12px;text-decoration:none;text-align:center;font-size:12px;line-height:20px;font-family:"Fira Sans",sans-serif;color:#fff;font-weight:500;outline:none;border:none;background-color:#00E3AE;background:linear-gradient(320.44deg,#00E3AE 0%,#9BE15D 100%);border-radius:8px;cursor:pointer;-webkit-transition:all ease 0.2s;-moz-transition:all ease 0.2s;transition:all ease 0.2s}
.button:hover{background-color:#9BE15D;background:linear-gradient(220.44deg,#00E3AE 0%,#9BE15D 100%)}
.button--purple{background-color:var(--theangels-primary-border);background:var(--theangels-primary-border);background-image:none}
.button--purple:hover{background-color:var(--theangels-primary-dark);background:var(--theangels-primary-dark)}
.button--orange{background-color:#3A3A3A;background:#3A3A3A;background-image:none}
.button--orange:hover{background-color:var(--theangels-orange);background:var(--theangels-orange)}
.button--dark{background-color:#293340;background-image:none}
.button--dark:hover{background-color:#151a21;background-image:none;color: #fff;}
.button--oval{border-radius:100px;padding-left:25px;padding-right:25px;margin-top:25px}
.button--block{border-radius:10px;padding-left:25px;padding-right:25px;margin-top:25px}
.button--outline{background:#fff0;border:1px solid #fff;line-height:18px}
.button--outline:hover{color:#3b7cff;background:#fff}
.button--small{height:40px;padding:10px 20px}

.checkbox{display:none}
.checkbox+div{position:relative;padding-left:24px;font-size:12px;line-height:20px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:all ease 0.2s;-moz-transition:all ease 0.2s;transition:all ease 0.2s}
.checkbox+div .icon{position:absolute;top:0;left:0;font-size:20px;line-height:1;-webkit-transition:all ease 0.2s;-moz-transition:all ease 0.2s;transition:all ease 0.2s}
.checkbox:checked+div{color:#293340}
.checkbox+div .icon.unchecked{opacity:1;visibility:visible}
.checkbox+div .icon.checked{opacity:0;visibility:hidden;-webkit-transform:scale(.7);-moz-transform:scale(.7);-ms-transform:scale(.7);-o-transform:scale(.7);transform:scale(.7)}
.checkbox:checked+div .icon.checked{color:var(--theangels-primary);opacity:1;visibility:visible;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}

.fancy-field{position:relative;line-height:35px}
.fancy-field label{position:absolute;margin-bottom:1px;top:17px;font-size:14px;line-height:19px;color:#c1c1c1;-webkit-transition:all ease 0.2s;-moz-transition:all ease 0.2s;transition:all ease 0.2s}
.fancy-field .input:focus+label,.fancy-field .input.hasvalue+label{top:-10px;color:#6D7784;font-size:12px}

#buycoin .fancy-field label{position:relative;top:0}
#topup .fancy-field label{position:relative;top:0}
#confirm .fancy-field label{position:relative;top:0}

.header-logo{float:left}
.header-logo img{display:block;height:40px;width:auto}
.header-nav{float:right;font-size:14px;line-height:20px;right:-200px;}
.header-nav ul{float:left;margin:0;padding:0 30px;list-style:none;}
.header-nav li{float:left;margin:0 39px 0 0;padding:10px}
.header-nav li:hover {background: #3a3a3a;border-radius: 16px;border-top-right-radius: 0;border-bottom-left-radius: 0;}
.lightbg .header-nav li:hover {background: var(--theangels-primary-border);}
.header-nav li:last-child {margin-right: 0px;}
.header-nav a{color:inherit;font-weight:500}
.header-nav .link{float:left;margin-top:10px;margin-left:26px}
.header-nav .button{float:left;margin-left:26px;padding-left:20px;padding-right:20px}

.minipage .inner{max-width:400px;margin:80px auto;text-align:center}
.minipage .icon{display:block;margin-bottom:24px;font-size:50px;color:#3b7cff}
.minipage p{margin:0 0 20px;color:#6D7784;font-size:18px;line-height:25px}
.minipage-title{margin:0 0 14px;font-size:32px;font-weight:300;line-height:41px;color:#000}


.overlay{position:fixed;top:0;left:0;z-index:999;width:100%;height:100%;overflow:auto;background-color:rgb(255 255 255 / .98);.close-btn{position:fixed;top:50px;right:50px;font-size:30px;color:$color-mid;&:hover{color:$color-dark}}
.content{max-width:400px;padding:20px;margin:0 auto}
.overlay-title{padding:0 20px;margin:0 0 30px;font-size:30px;font-weight:300;line-height:40px}}
.modal{position:fixed;z-index:99;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgb(0 0 0 / .4)}
.modal-content{position:relative;margin:89px auto;padding:0;width:276px;box-shadow:0 4px 8px 0 rgb(0 0 0 / .2),0 6px 20px 0 rgb(0 0 0 / .19);-webkit-animation-name:animatetop;-webkit-animation-duration:0.4s;animation-name:animatetop;animation-duration:0.4s}
.bodypop{background:linear-gradient(to bottom,#000 0%,#000 100%)!important}
.close{color:#E3E3E3;float:right;font-size:28px;font-weight:700;position:absolute;top:0;right:-35px}
.close:hover,.close:focus{color:#bd890c;text-decoration:none;cursor:pointer}
.modal-header{padding:2px 16px;color:#fff}
.modal-body{width:420px;height:600px;background:#E3E3E3}
.modal-footer{padding:2px 16px;background-color:#3b7cff;color:#fff}
.whatsapp-float{position:fixed;bottom:20px;right:20px;z-index:100}
.whatsapp-float i{margin-top:12px;font-size:40px;color:green}
.logo-link{position:relative;display:inline-block;align-items:center}
.styled-icon{padding:0}
.styled-icon .icon{width:3.188rem;height:3.188rem;line-height:3.188rem;border-radius:50%;display:block;text-align:center;transition:all 0.3s}
.styled-icon .mdi::before{font-size:1.88rem}
.styled-icon li{display:inline-block}
.styled-icon li:not(:last-child){margin-right:.375rem}
.last{margin-right:0px!important}
.intruksi{color:#FFF;top:20px;position:absolute;background:#DF0505;padding:2px;margin:0}
.menu-icon{color:#000}
.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-clip:border-box;transition:all 0.2s}
.card-full{padding:15px 15px 10px 15px}


.input-params .card{min-height:150px;padding:20px;border-radius:.5em;margin-bottom:40px;padding-top:15px;border:1px solid #fff;box-shadow:0 3px 15px #63809e1f;background-color:var(--theangels-subfooter)}
.input-params .card.frame-input-area{background-color:var(--theangels-subfooter)}
.input-params .card.list-frame{background-color:var(--theangels-subfooter)}
.input-params .card .heading{margin-bottom:20px}
.input-params .card .heading h2.number-ic{font-size:20px;background:var(--theangels-primary);position:absolute;color:#fff;width:37px;height:37px;display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:center;align-items:flex-start;border-radius:50%;border:5px solid #FFF;margin-top:-32px;margin-bottom:0;margin-left:-5px;line-height:34px;z-index:10}
.input-params .card .heading h2.title-ic{color:#1c1c1c;font-size:18px;font-weight:600;margin-top:24px;margin-bottom:0}
.input-params .card .input-area .first-input{width:100%;border-radius:7px;text-align:left;padding:10px;box-sizing:border-box}
.input-params .card .input-area .second-input{width:100%;border-radius:7px;text-align:left;padding:10px;box-sizing:border-box}
.game .input-params .card .input-area .second-input,.game .input-params .card .input-area .first-input{text-align:center}
.second-input:hover,.second-input:focus{border:2px solid var(--theangels-primary)!important}
.first-input:hover,.first-input:focus{border:2px solid var(--theangels-primary)!important}
.input-params .card .input-area a{color:var(--theangels-primary);text-decoration:none;font-size:21px}
.area-help{position:relative;display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:center;align-items:center;margin-left:10px}
.area-help a{cursor:help}
.input-area area-help a.active i{color:#ec7f00}
.input-area i:hover{color:#ec7f00}
.popover-custom{left:-85px}
.popover-custom{position:absolute;background:#fff;z-index:1000;padding:10px;border-radius:.5em;border:1px solid #ccc;top:22px;left:-99px;box-shadow:0 0 13px 3px #ccc;display:none;width:235px}
.popover-custom:after,.popover-custom:before{bottom:100%;left:50%;border:solid #fff0;content:"";height:0;width:0;position:absolute;pointer-events:none}
.input-params .card .subtitle{margin-bottom:0;font-size:12px;color:#3a464f;margin-top:20px}

.list-items{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);align-items:center;align-content:baseline}
.list-items-other.custom {grid-template-columns: repeat(1, 1fr);}
.list-tree{grid-template-columns:repeat(3,1fr)}
.list-items li:nth-child(odd){margin-right:5px}
.list-items li{border:2px solid #d9dfe2;border-radius:5px;padding:10px 12px;text-align:center;color:#323e46;font-weight:600;margin-bottom:10px;cursor:pointer;font-size:15px}
.list-items li.active{background:var(--theangels-subfooter);color:var(--theangels-hitam);border:2px solid var(--theangels-primary)}
.list-items li:hover{border:2px solid var(--theangels-primary)}
.list-items .sli:before{top:2px;position:relative}
.list-items-other{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);align-items:center;align-content:baseline}
.list-items-other li{border: 2px solid var(--sku-card-border-color-default, var(--color-portal-10));border-radius:.3em; background:#fff;cursor:pointer;position:relative}
.list-items-other li > div {padding: 10px;}
.list-items-other li .info-top{line-height: 2;border-bottom:2px solid var(--sku-card-border-color-default, var(--color-portal-10));display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;border-top-right-radius: 5px;border-top-left-radius: 5px;border-bottom-right-radius: 35px;}
.list-items-other li .info-top img{height:20px;object-fit:contain}
.list-items-other li .info-top b{color:var(--theangels-primary);font-size:14px;font-weight:600}
.list-items-other li .info-midle {}
.list-items-other li .info-midle .icon {width: 60px;height: 60px;}
.list-items-other li .info-bottom{color:#333232;font-weight:300}
.list-items-other li .info-bottom.price{background-color: #d1d1d1;}
.list-items-other li.hot::before {content: "";display: inline-block;position: absolute;right: 0px;width: 65px;height: 35px;background-image: url(../img/hot.webp);background-size: cover;background-color: transparent;}
.list-items-other li.rich::before {content: "";display: inline-block;position: absolute;right: 0px;width: 65px;height: 35px;background-image: url(../img/rich.webp);background-size: cover;background-color: transparent;}
.list-items-other li.sultan::before {content: "";display: inline-block;position: absolute;right: 0px;width: 65px;height: 35px;background-image: url(../img/sultan.webp);background-size: cover;background-color: transparent;}
.list-items-other li .info-midle .hot::after {content: "";display: inline-block;position: absolute;left: 42px;width: 45px;height: 26px;background-image: url(../img/hot.webp);background-size: cover;background-color: transparent;top: 47px;}
.list-items-other li .info-midle .rich::after {content: "";display: inline-block;position: absolute;left: 42px;width: 45px;height: 26px;background-image: url(../img/rich.webp);background-size: cover;background-color: transparent;top: 47px;}
.list-items-other li .info-midle .sultan::after {content: "";display: inline-block;position: absolute;left: 42px;width: 45px;height: 26px;background-image: url(../img/sultan.webp);background-size: cover;background-color: transparent;top: 47px;}
.list-items-other li.active{background:var(--theangels-subfooter) !important;color:var(--theangels-hitam);border:2px solid var(--theangels-primary) !important}
.list-items-other li.active .info-bottom.price{background-color: var(--theangels-primary);color: var(--theangels-body);}
.list-items-other li.active::after {display: inline-block;font: normal normal normal 24px / 1 "Material Design Icons";content: "\F12C" !important;line-height: 1;position: absolute;right: 5px;color: var(--theangels-body);width: 26px;height: 26px;font-size: 15px;text-align: center;bottom: 0;}
.list-items-other li.active .info-top {border-bottom: 2px solid var(--theangels-primary, var(--color-portal-10));}

@media only screen and (max-width: 768px) {
  .list-items-other{grid-template-columns: repeat(3, 1fr);}
}
@media screen and (max-width:425px){
  .list-items-other{grid-template-columns:repeat(2,1fr);}
  .list-items-other li .info-midle .hot::after {left: 26px;width: 50px;height: 30px;top: 40px;}
  .list-items-other li .info-midle .rich::after {left: 26px;width: 50px;height: 30px;top: 40px;}
  .list-items-other li .info-midle .sultan::after {left: 26px;width: 50px;height: 30px;top: 40px;}
}

.darkbg .list-items-other li .info-top{background-color: var(--theangels-abu-abu);}
.card-img-top{border-top-left-radius:.6rem;border-top-right-radius:.6rem;border-bottom-left-radius:.6rem;border-bottom-right-radius:.6rem;}
.card-img,.card-img-top,.card-img-bottom{width:100%;height:100%;transition: all 0.3s ease;overflow: hidden;border-top-left-radius: .6rem;border-top-right-radius: .6rem;border-bottom-left-radius: .6rem;border-bottom-right-radius: .6rem;clip-path: polygon(84% 0%, 100% 16%, 100% 100%, 16% 100%, 0% 84%, 0% 0%);}
.service:hover .card-img img {transform: scale(1.05);}
.card-body{flex:1 1 auto;border-bottom-right-radius:.6rem;border-bottom-left-radius:.6rem;color:var(--theangels-hitam)}
.card-body-tile__clip-path{clip-path:polygon(0 48%,9% 48%,18% 65%,27% 49%,36% 72%,45% 58%,55% 70%,64% 58%,73% 86%,82% 48%,91% 63%,100% 70%,100% calc(100% + 1px),0 calc(100% + 1px));-webkit-clip-path:polygon(0 48%,9% 48%,18% 65%,27% 49%,36% 72%,45% 58%,55% 70%,64% 58%,73% 86%,82% 48%,91% 63%,100% 70%,100% calc(100% + 1px),0 calc(100% + 1px));background-color:var(--theangels-primary);width:100%;height:25px;margin-top:-23px;margin-bottom:-1px}
.card-title{font-weight:500;color:var(--theangels-hitam);text-align:center;margin:0}
.card-title-effect{padding:5px 0 5px 0}
.card-footer{text-align:center;padding:10px 0 5px;border-top:1px solid #dfe4f1!important}
#qrcode canvas{width:260px;padding:8px;background:#fff}
.qrwatermark{width:40px;position:absolute;top:120px;left:120px}
.infoqr{padding:0 0 21px}

.static-page-product-desc {font-size: 14px;}
.sub-footer{background:var(--theangels-subfooter);color:var(--theangels-hitam);cursor:default;padding-top: 49px;}
.sub-footer .angels-featured{display:grid;grid-template-columns:repeat(2,1fr);align-items:center;align-content:baseline}
.sub-footer .angels-featured .angels-child-featured{display:flex}
.sub-footer .angels-featured .angels-child-featured .icon{margin-right:20px}
.sub-footer .angels-featured .angels-child-featured .icon img{width:32px}
.sub-footer .angels-featured .angels-child-featured .desc{margin-right:10px}
.sub-footer .angels-featured .angels-child-featured .desc p{font-size:14px;color:var(--theangels-abu-abu)}
.footer-para{font-size:14px;text-align:left}
.footer-list-item{width:100%;float:left;display:block;margin:0;padding:0;text-align:left}
.footer-item-para{width:100%;margin-bottom:10px;font-size:14px;float:left}
.footer-item-para:last-child{margin-bottom:0}

.rows{display:flex;flex-wrap:wrap;gap:15px}
.popular-tag{position:absolute;top:0;inset-inline-start:0}
.popular-tag{display:flex;align-items:center;padding:0 8px;background:linear-gradient(90deg,#ff7f98,#6242fb);border-start-start-radius:5px;border-start-end-radius:12px;border-end-end-radius:12px;border-end-start-radius:0}
.popular-tag-shimmer{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#fff0 40%,hsl(0 0% 100% / .4) 50%,#fff0 60%);background-size:300%;background-position-x:100%;animation:shimmer-data-v-bc94a422 2.5s linear infinite alternate;mix-blend-mode:overlay}
#paymentmethod{display:grid;grid-template-columns:repeat(2,1fr);align-items:center;align-content:baseline}
.paymentmethod-item img{width:100px;cursor:pointer;background-color:var(--theangels-putih)}
body.darkbg{background-color: var(--theangels-abu-abu);color: var(--theangels-putih);}
.lightbg #promo,.lightbg #features,.lightbg #slider{background-color:#edf0f7}
.darkbg .section-title{color:var(--theangels-putih)}
.darkbg .section-title a {color: var(--theangels-putih);}
.darkbg footer,.darkbg footer *,.darkbg header{background:var(--theangels-hitam);color:var(--theangels-putih)}
.darkbg footer a{color:var(--theangels-putih)}
.darkbg .hitam{color:var(--theangels-putih)}
.darkbg #promo,.darkbg #features,.darkbg #slider, .darkbg #res-slider{background-color:var(--theangels-hitam)}
.darkbg .service {background-color: var(--theangels-abu-abu);}
.darkbg .service .card-title{color: var(--theangels-putih);}
.darkbg input:focus{border-color: var(--theangels-putih);}
.darkbg .input-params .card,.darkbg .area-list-voucher-method .child-box,.darkbg .area-list-payment-method .child-box,.darkbg .area-list-payment-method .child-box .header,.darkbg .area-list-voucher-method .child-box .header {background-color: var(--theangels-hitam);}
.darkbg .input-params .card .heading h2.title-ic{color: var(--theangels-putih)}
.darkbg .list-items-other li{background-color: var(--theangels-abu-abu);}
.darkbg .inputdazz, .darkbg .list-items-other li .info-top b{color: var(--theangels-putih)}
.darkbg #rewards .inputdazz {color: var(--theangels-hitam)}
.darkbg .list-items-other li.pop .info-bottom.price {background-color: var(--theangels-subbg);color: var(--theangels-body);}
.darkbg .area-list-voucher-method .child-box .header .left b,.darkbg .area-list-payment-method .child-box .header .left b,.darkbg .area-list-payment-method .child-box .header .right.price-range b {color: var(--theangels--putih);}
.darkbg .list-items-other li.pop {border: 1px solid var(--theangels-putih-gelap);}
.darkbg .list-items-other li.pop::before {background-color: var(--theangels-subbg);}
.darkbg .list-items-other li .info-midle {color: var(--theangels-putih);background: var(--theangels-abu-abu);}
.darkbg .open-button-action-payment {color: var(--theangels-hitam);}
.lightbg header{background:var(--theangels-primary);color:var(--theangels-putih)}
.darkbg #eyemode,.darkbg #mobile-menu{background-color:var(--theangels-subfooter);color:var(--theangels-hitam);border-color:var(--theangels-subfooter)}
.darkbg .sub-footer .angels-featured .angels-child-featured .desc p{color:var(--theangels-putih-gelap)}
.lightbg .bg-white-slim {border-color: #ffffff3d;}
.darkbg .bg-white-slim{color:var(--theangels-putih);background-color:var(--theangels-putih)}
.darkbg .sub-footer{background:var(--theangels-hitam);color:var(--theangels-putih)}
.darkbg .sub-footer .angels-featured .angels-child-featured .icon img{filter:brightness(50%) invert(1) sepia(1)}
.sub-footer .container-1100::after{margin-top:50px}
.darkbg .sub-footer .container-1100::after{background-color:var(--theangels-putih-gelap);width:100%;height:1px}
.darkbg .cover{background-color:var(--theangels-hitam)}
.darkbg .input-params .card .subtitle{color: var(--theangels-putih);}
.rowsprod{gap:80px;display:grid;grid-template-columns:repeat(2,1fr)}
.ratio{position:relative;width:100%;max-height:220px}
.ratio .img-fluid{width:100%;height:100%}
.col:last-child{margin-right:0px!important}
.area-list-payment-method .child-box{background:#F8F8F8;border:1px solid #e6ebef;margin-bottom:18px;border-radius:7px!important}
.area-list-payment-method .child-box:hover{border:1px solid var(--theangels-primary);}
.area-list-payment-method .child-box:hover .open-button-action-payment i:before{color:var(--theangels-primary);}
.area-list-payment-method .child-box .header{display:flex;flex-direction:row;flex-wrap:nowrap;font-size:12px;line-height: 20px;align-content:center;justify-content:space-between;align-items:center;padding:15px;background:#fff;border-top-left-radius:7px;border-top-right-radius:7px;cursor:pointer;position:relative}
.area-list-payment-method .child-box .header .left img{height:20px;margin-right:12px}
.area-list-payment-method .child-box .header .left b{font-size:12px;color:var(--theangels-hitam)}
.area-list-payment-method .child-box .header .right.price-range b{font-size:12px;color:#073a65}
.badge-promotion-on-head{box-shadow:0 2px 6px #f99828;background:#ed7f00;color:white!important;padding:3px 20px;font-size:10px!important;font-weight:600;margin-left:15px;display:none;position:absolute;right:-6px;margin-top:-23px;border-radius:3px}
.area-list-payment-method .child-box .short-payment-support-info{background:#f6f6f6;padding:11px 15px;display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:flex-end;align-items:center;cursor:pointer;border-bottom-left-radius:7px;border-bottom-right-radius:7px}
.area-list-payment-method .child-box .short-payment-support-info img{height:10px;margin-right:15px;pointer-events: none;}
.open-button-action-payment i:before{font-weight:600;font-size:12px;color:var(--theangels-hitam)}
.area-list-payment-method .child-box .button-action-payment{padding:15px;display:none}
.area-list-payment-method .child-box .button-action-payment ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);align-items:center;align-content:baseline}
.area-list-payment-method .child-box .button-action-payment ul li:nth-child(odd){margin-right:5px}
.area-list-payment-method .child-box .button-action-payment ul li{min-height: 50px;border:1px solid #c7d0d7;padding:12px;border-radius:.3em;margin-bottom:10px;background:#fff;cursor:pointer;position:relative}
.area-list-payment-method .child-box .button-action-payment ul li.active{border:1px solid var(--theangels-primary);background:var(--theangels-subfooter)}
.area-list-payment-method .child-box .button-action-payment ul li .info-top{border-bottom:1px solid #f0f0f0;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;margin-bottom:10px;padding-bottom:10px}
.area-list-payment-method .child-box .button-action-payment ul li .info-top img{height:12px;object-fit:contain}
.area-list-payment-method .child-box .button-action-payment ul li .info-top b{color:#073a65;font-size:12px;font-weight:500;line-height: 1;}
.area-list-payment-method .child-box .button-action-payment ul li .info-bottom{font-size:11px;color:#333232;font-weight:300;}

.area-list-voucher-method .child-box{background:#F8F8F8;border:1px solid #e6ebef;margin-bottom:18px;border-radius:7px!important}
.area-list-voucher-method .child-box:hover{border:1px solid var(--theangels-primary);}
.area-list-voucher-method .child-box:hover .open-button-action-payment i:before{color:var(--theangels-primary);}
.area-list-voucher-method .child-box .header{display:flex;flex-direction:row;flex-wrap:nowrap;font-size:12px;line-height: 20px;align-content:center;justify-content:space-between;align-items:center;padding:15px;background:#fff;border-top-left-radius:7px;border-top-right-radius:7px;cursor:pointer;position:relative}
.area-list-voucher-method .child-box .header .left img{height:20px;margin-right:12px}
.area-list-voucher-method .child-box .header .left b{font-size:12px;color:var(--theangels-hitam)}
.area-list-voucher-method .child-box .header .right.price-range b{font-size:12px;color:#073a65}
.badge-promotion-on-head{box-shadow:0 2px 6px #f99828;background:#ed7f00;color:white!important;padding:3px 20px;font-size:10px!important;font-weight:600;margin-left:15px;display:none;position:absolute;right:-6px;margin-top:-23px;border-radius:3px}
.area-list-voucher-method .child-box .short-payment-support-info{background:#f6f6f6;padding:11px 15px;display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:flex-end;align-items:center;cursor:pointer;border-bottom-left-radius:7px;border-bottom-right-radius:7px}
.area-list-voucher-method .child-box .short-payment-support-info img{height:10px;margin-right:15px;pointer-events: none;}
.open-button-action-voucher i:before{font-weight:600;font-size:12px;color:var(--theangels-hitam)}
.area-list-voucher-method .child-box .button-action-payment{padding:15px;display:none}
.area-list-voucher-method .child-box .button-action-payment ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);align-items:center;align-content:baseline}
.area-list-voucher-method .child-box .button-action-payment ul li:nth-child(odd){margin-right:5px}
.area-list-voucher-method .child-box .button-action-payment ul li{min-height: 50px;border:1px solid #c7d0d7;padding:12px;border-radius:.3em;margin-bottom:10px;background:#fff;cursor:pointer;position:relative}
.area-list-voucher-method .child-box .button-action-payment ul li.active{border:1px solid var(--theangels-primary);background:var(--theangels-subfooter)}
.area-list-voucher-method .child-box .button-action-payment ul li .info-top{border-bottom:1px solid #f0f0f0;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;margin-bottom:10px;padding-bottom:10px}
.area-list-voucher-method .child-box .button-action-payment ul li .info-top img{height:12px;object-fit:contain}
.area-list-voucher-method .child-box .button-action-payment ul li .info-top b{color:#073a65;font-size:12px;font-weight:500;line-height: 1;}
.area-list-voucher-method .child-box .button-action-payment ul li .info-bottom{font-size:11px;color:#333232;font-weight:300;}
.input-params .card.voucher { min-height: unset;}
.area-list-voucher-method .child-box .header{border-radius: 7px}

@media screen and (max-width:425px){
  .list-items-other{grid-template-columns:repeat(2,1fr);}
  .area-list-payment-method .child-box .button-action-payment ul{grid-template-columns: repeat(1, 1fr);}
  .area-list-payment-method .child-box .button-action-payment ul li:nth-child(odd) {margin-right: 0px;}
  .area-list-payment-method .child-box .header .left b{font-size: 12px;top: -3px;}
  .area-list-payment-method .child-box .header .right b{font-size: 12px;}
  .area-list-payment-method .child-box .header .left img {height: 20px;}
  .area-list-payment-method .child-box .short-payment-support-info img {height: 10px;}

  .area-list-voucher-method .child-box .button-action-voucher ul{grid-template-columns: repeat(1, 1fr);}
  .area-list-voucher-method .child-box .button-action-voucher ul li:nth-child(odd) {margin-right: 0px;}
  .area-list-voucher-method .child-box .header .left b{font-size: 12px;top: -3px;}
  .area-list-voucher-method .child-box .header .right b{font-size: 12px;}
  .area-list-voucher-method .child-box .header .left img {height: 20px;}
  .area-list-voucher-method .child-box .short-voucher-support-info img {height: 10px;} 
}
.page-title,.page-subtitle,.page-image,.page-content,.page-sidebar{display:block;width:100%;float:left;margin-bottom:10px;}
.page-title h1{margin:auto}
.page-subtitle h2{margin:auto}
.page-image img{width:100%;margin:auto;height:auto}
.btn{display:inline-block;font-weight:600;line-height:1.5;color:#343a40;text-align:center;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:#fff0;border:1px solid #fff0;padding:.375rem .75rem;font-size:1rem;border-radius:.25rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}
.btn-hero.btn-primary{color:#fff;background-color:var(--theangels-primary);border-color:var(--theangels-primary-border);}
.btn-hero.btn-primary{text-transform:uppercase;letter-spacing:.0625rem;font-weight:700;padding:8px;font-size:.875rem;border-radius:.25rem;box-shadow:0 .125rem .75rem rgb(4 65 134 / .25);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,transform .12s ease-out}
.text-currency{color:var(--theangels-primary);}

#purchase{background:var(--theangels-putih-gelap)}
#main-form{background:var(--theangels-subfooter)}

.block-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;transition:opacity .25s ease-out;color: #fff;}
.block-title{flex:1 1 auto;min-height:1.75rem;margin:0;font-size:1rem;font-weight:500;line-height:1.75}
.block-header-default{background-color: var(--theangels-primary);}
.darkbg .block-header-default{background-color: var(--theangels-hitam);}
.darkbg .info{color: var(--theangels-hitam);}
.block.block-rounded > .block-content:last-child{border-bottom-right-radius:.2rem;border-bottom-left-radius:.2rem}
.block-content.block-content-full{padding-bottom:1.25rem}
.block-content{transition:opacity .25s ease-out;margin:0 auto;padding:1.25rem 1.25rem 1px;overflow-x:visible}
.input-group{position:relative;display:flex;flex-wrap:nowrap;align-items:stretch;width:100%}
#userInputContainer,#userResult,#topResult {max-width: 871px;}
#topResult {background-color: #602575;color: #fff;}
.darkbg #topResult{background-color: var(--theangels-hitam);}
#topResult #rewards-item::first-child {color: #c1ff6c;}


#orderid{background-color:var(--theangels-putih);border-radius:5px}
.block-status{background-color:var(--theangels-body)}
.product-tile{background:#fff;border-radius:20%;padding-bottom:100%;background-position:center;background-repeat:no-repeat;background-size:cover;box-shadow:0 2px 5px 0 rgb(0 0 0 / .2)}
.namepass{-webkit-box-orient:vertical;-webkit-line-clamp:1;word-wrap:break-word;display:-webkit-box;overflow:hidden}
.namepass>*{padding:0;margin:0}
.qrcode{width:200px;height:200px;min-width:200px;min-height:200px;}
.img-sq {width: 80px;height: 80px;border-radius: 20%;}
.block-content {background: #efefef;color: #000;}
.block-content:last-child {border-bottom-right-radius: .2rem;border-bottom-left-radius: .2rem;}
.block-content:first-child {border-top-left-radius: .2rem;border-top-right-radius: .2rem;}
.bg-body-light {background-color: var(--theangels-subfooter); !important;}
.btn-alt-secondary {color: #212529;background-color: #edf0f7;border-color: #edf0f7;}
.rounded-pill {border-radius: 50rem !important;}

.cutom-item {border: 1px solid #c7d0d7;padding: 10px;border-radius: .3em;margin: 5px;background: #fff;cursor: pointer;position: relative;}
.cutom-item.active {background: var(--theangels-subfooter);color: var(--theangels-hitam);border: 1px solid var(--theangels-primary);}
.cutom-item .info-top {border-bottom: 1px solid #f0f0f0;display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: space-between;margin-bottom: 10px;padding-bottom: 10px;}
.cutom-item .info-bottom {font-size: 14px;color: #333232;font-weight: 300;}
.cutom-item .info-bottom {font-size: 14px;color: #333232;font-weight: 300;}
.card .inputdazz {border-radius: 5px;}


@media only screen and (min-width:601px){
  .img-fluid{width:20%!important}
  .cont-fluid{width:77%!important}
  .footer-cont .col:nth-child(2) {margin-right: 0px;}
}

@media screen and (max-width:425px){
  .s1,.s2,.s3,.s4{width:47%!important;padding:0}
  .s5,.s6,.s7,.s8,.s9,.s10,.s11,.s12{width:100%!important;padding:0}
  .col .img-thumbnail{width:90%!important}
  #slider{padding:0}
  .sub-footer .angels-featured{grid-template-columns:repeat(1,1fr)!important}
  .auto-130{margin:0px!important}
  .qrcode{min-width:240px!important;min-height:240px!important}
  .img-fluid{width:20%!important}
  .cont-fluid{width:77%!important}
  .header-logo img{height:30px}
  .header-nav .link{margin-top:5px;margin-left:0}
  .header-nav .button{height:30px;padding:5px 15px;margin-left:15px}
  .header-nav ul{display:none}
  #mobile-menu{display:block;right:70px}
  .mt-150{margin-top:100px!important}
  .footer-logo img{width:170px;height:auto;display:block;margin:0 auto 20px}
  .footer-lang-selector{float:none;margin-bottom:20px}
  .simpleform{margin:50px 20px}
  .simpleform .title{margin-bottom:26px;font-size:26px;line-height:32px}
  .simpleform form{padding:25px 35px 35px;border-radius:5px}
  footer{font-size:12px;line-height:17px;text-align:center}
  footer .copyright{margin-top:5px;float:none;display:block}
  footer .footer-list-item{margin-top:10px;margin-bottom:10px}
}


/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (max-width: 768px) {
  .s1,.s2,.s3,.s4{width:25% !important;padding:0}
  .section-title{font-size:28px;line-height:34px}
  .header-nav {
    max-width: 344px;
    display: none;
  }
  .header-nav li{
    margin: 0 10px 0 0 !important;
    font-size: 12px;
  }
  #mobile-menu {
    display: block;
    right: 70px;
  }
}


@media screen and (max-width:992px){
  .s1,.s2,.s3,.s4{width:47%;padding:0}
  .s5,.s6,.s7,.s8,.s9,.s10,.s11,.s12{width:100%;padding:0}
  .col .img-thumbnail{width:90%!important}header{padding:20px 0}
  #eyemode{padding:5px 10px}
  .section{padding:30px 0}
  .section-title{margin-bottom:30px}
  .swiper-slide img{height:180px!important}footer{padding:45px 0}
  .img-fluid{width:20%!important}
  .cont-fluid{width:77%!important}
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 430px) {
  #mobile-menu {
    display: block;
    right: 70px;
  }
}

.js-agent-list {
    position: absolute;
    right: 20px;
    top: 197px;
    z-index: 999;
    max-width: 260px;
    max-height: 400px;
    overflow-y: scroll;
    background: #fff;
    color: #000;
    padding: 5px 10px;
    border: solid 1px var(--theangels-primary-border);
}
.js-agent-list .dots {
    display: block;
    cursor: pointer;
    min-width: 230px;
    line-height: 35px;
}
.js-agent-list .dots strong {
    color: var(--theangels-primary);
}

.darkbg #confirmation-submit {
    color: #1c1c1c;
}
.darkbg #confirmation-submit label{
    color: #fff;
}
.darkbg .list-frame .title-ic {
    color: var(--theangels-putih);
}
.darkbg #confirmation-submit .title-ic {
    color: #1c1c1c;
}
.darkbg .last {
    color: var(--theangels-hitam);
}
.darkbg .last label{
    color: var(--theangels-hitam) !important;
}
.darkbg .input-params .card.last .heading h2.title-ic {
    color: var(--theangels-hitam);
}

.spinner-overlay[data-variant=darkOverlay]{
    background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
    opacity: .9;
}

.spinner-overlay {
    height: 100%;
    inset-inline-start: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 999;
    position: fixed !important;
}

.spinner-container__progress-bar {
    align-items: center;
    display: flex;
    justify-content: center;
    text-align: center;
}
.spinner {
    width: 100%;
}
.spinner-icon {
    display: inline-block;
    padding-bottom: 15px;
    padding-top: 15px;
    width: 4em;
    --tw-text-opacity: 1;
    color: rgb(234 232 247 / var(--tw-text-opacity, 1));
}
.spinner-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    padding: 15px 5px;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
@keyframes loadingBar {
    0% {
        transform: translate(0) scaleX(0)
    }

    40% {
        transform: translate(0) scaleX(.4)
    }

    to {
        transform: translate(100%) scaleX(.5)
    }
}

.spinner-loader {
    border-radius: 9px;
    height: 4px;
    margin: 0 auto;
    overflow: hidden;
    width: 150px;
    background-color: rgb(234 232 247 / var(--tw-bg-opacity, 1));
}
.spinner-loading-bar {
    animation: loadingBar 1s linear infinite;
    border-radius: 9px;
    background-color: rgb(98 66 252 / var(--tw-bg-opacity, 1));
    height: 100%;
    transform-origin: 0 50%;
    width: 100%;
}

.darkbg #kalkulator .fancy-field .input:focus+label, .darkbg #kalkulator .fancy-field .input.hasvalue+label {
    color: var(--theangels-putih);
}
.darkbg #kalkulator .input.hasvalue {
    color: var(--theangels-putih);
}
.darkbg #kalkulator .text-black {
    color: var(--theangels-putih);
}

@media (width >= 48rem) {
    .item-produk {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    #features.pulsapln .item-produk,#features.game .item-produk {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (width >= 80rem) {
    .item-produk {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    #features.pulsapln .item-produk,#features.game .item-produk {
        grid-template-columns: repeat(7, minmax(0, 1fr));
    }
}

.bg-black {
  background-color: color-mix(in oklab, var(--theangels-hitam) 60%, transparent);
}
.bg-putih {
  background-color: color-mix(in oklab, var(--theangels-putih) 40%, transparent);
}
.rounded-2xl {
  border-radius: 10px;
}

.darkbg .jconfirm-box {
  color: var(--theangels-hitam);
}
.darkbg .jconfirm-box {
  max-width: 500px;
}
.darkbg #orderid {
    color: var(--theangels-hitam);
}
.darkbg #pesanan {
    color: var(--theangels-hitam);
}

.jconfirm-title p {
    margin: 0;
    line-height: 26px;
}

.sekeltonimage {
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #ffffff12;
  width: 39px;
  min-width: 39px;
  height: 39px;
  display: inline-block;
  border-radius: 3px;
  overflow: hidden;
}
.sekeltonitem {
  min-height: 10px;
  background-color: #ffffff12;
  overflow: hidden;
}

.sekeltonitem::after,.sekeltonimage::after {
  display: block;
  content: '';
  position: relative;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, #ffff00, transparent);
  animation: shimmers 1.5s infinite linear;
}
@keyframes shimmers {
    0% {
        left: -100%;
    }
    100% {
        left: 100%;
    }
}
.darkbg .list-items-other li.active{background: var(--theangels-abu-abu) !important;}
.darkbg .list-items-other li.bg-bianca {--tw-bg-opacity: 1;background-color: rgb(244 252 237 / var(--tw-bg-opacity));}
.darkbg .list-items-other li.bg-bianca.active {background-color: #4e9800 !important;border: 2px solid #4e9800 !important;color: #fff;}
.darkbg .list-items-other li.bg-bianca.active svg {color: #4e9800;}

/* Gaya Daftar Navigasi */
.nav-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap; /* Memungkinkan item untuk membungkus pada layar kecil */
}
.nav-links li {
    position: relative;
}
/* Gaya Panah Dropdown */
.arrow {
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 3px;
    margin-left: 8px;
    transition: transform 0.3s ease;
    vertical-align: middle;
    margin-top: -5px;
}
.arrow.down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
/* Gaya Konten Dropdown */
.dropdown-content {
    display: none; /* Sembunyikan secara default */
    position: absolute;
    background-color: #2c2c2c; /* Latar belakang gelap untuk dropdown */
    min-width: 180px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.5);
    z-index: 10; /* Pastikan dropdown muncul di atas konten lain */
    border-bottom-left-radius: 8px; /* Sudut membulat */
    border-bottom-right-radius: 8px; /* Sudut membulat */
    overflow: hidden; /* Memastikan sudut membulat diterapkan dengan benar */
    top: 100%; /* Posisi dropdown tepat di bawah item parent */
    left: 0;
}
.dropdown-content a {
    color: var(--theangels-putih);
    padding: 10px 18px;
    text-decoration: none;
    display: block;
    text-align: left;
    font-weight: normal;
    transition: background-color 0.3s ease, color 0.3s ease;
    border-radius: 0;
}
.dropdown-content a:hover {
    background-color: #3a3a3a;
}
/* Tampilkan Dropdown saat di-hover */
.dropdown:hover .dropdown-content {
    display: block;
}
/* Putar panah saat dropdown terbuka */
.dropdown:hover .arrow.down {
    transform: rotate(-135deg); /* Panah menunjuk ke atas saat terbuka */
}

/* Media Queries untuk Responsivitas */
@media (max-width: 768px) {
    nav {
        flex-direction: column;
        align-items: flex-start;
    }
    .nav-links {
        flex-direction: column;
        width: 100%;
        align-items: flex-start;
    }
    .nav-links li {
        margin: 0;
        width: 100%;
    }
    .nav-links li a {
        padding: 10px 20px;
        width: calc(100% - 40px); /* Menyesuaikan padding */
    }
    .dropdown-content {
        position: static; /* Dropdown muncul di bawah item parent */
        width: 100%;
        box-shadow: none;
        border-top: none;
        border-radius: 0;
    }
    .dropdown-content a {
        padding-left: 40px; /* Indentasi untuk sub-item */
    }
}
.darkbg .rescheckbox{color: var(--theangels-putih-gelap);}
.mescroll-lazy-in, .mescroll-fade-in {-webkit-animation: mescrollFadeIn .5s linear forwards;animation: mescrollFadeIn .5s linear forwards;}
.mediumpage .form-label {color: var(--theangels-putih);}
.mediumpage .compulsory-field-indicator {color: var(--theangels-merah);}
.mediumpage .compulsory-field-indicator-small {color: var(--theangels-merah);color: var(--theangels-merah);font-size: 11px;font-style: italic;}
.mediumpage .input:focus{border-color: var(--theangels-putih);}
.fancy-field .input:focus+label.forusername, .fancy-field .input.hasvalue+label.forusername{top: -20px !important;}
.fancy-field label.forusername {top: 0px !important;}
.mediumpage input:-internal-autofill-selected + label.forusername{top: -20px !important;}
#pinhalaman {border: 1px solid #cdcdcd;padding: 15px 10px;margin-top: 10px;border-radius: 8px;}
.bg-bianca-active{--tw-bg-opacity: 1;background-color: #4e9800 !important;}
.pulsa .list-items-other li{border-radius: .5em;}
.pricename {
    display: inline-block;
}

@media (max-width: 768px) {
    .pricename {
        max-width: 120px;
    }
}

.border-lanjut {
    border-radius: 7px;
    border: 1px solid var(--theangels-putih-gelap);
    padding: 5px 5px 5px 20px;
}
.section-title a:hover {
    background: var(--tw-ring-color);
}
.item-produk .service:hover {
  background-color: var(--tw-ring-color);
}
.footer-item-para a {
    padding: 5px;
}
.footer-item-para a:hover {
    background: #3a3a3a;
    border-radius: 10px;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
}
.lightbg .footer-item-para a:hover {
    background: var(--theangels-primary-border);
}

.gradasi {
  background: linear-gradient(to top, hsl(84.68deg 50.37% 33.61%), hsl(211deg 100% 50%));
}

.gradasi .card-img{
  border: 1px solid #000;
}


.formsaran {
    width: 100%;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid #4a4a6a;
    background-color: #2a2a45;
    color: #fff;
    font-size: 14px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#appDownload {
    background-color: #212529;
    color: #fff;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    animation: slideDown 0.5s ease-out forwards;
    transform: translateX(-50%);
}


@keyframes slideDown {
    from {
        transform: translate(0, -150px);
        opacity: 0;
    }
    to {
        transform: translate(0, 0);
        opacity: 1;
    }
}

/* Wrapper utama di dalam banner */
.app-download-wrapper {
    display: flex;
    align-items: center;
    gap: 12px; /* Jarak antar item */
}

.app-logo {
    width: 40px;
    height: 40px;
    border-radius: 8px;
}

/* Styling untuk teks informasi */
.app--inform {
    flex-grow: 1; /* Mengisi ruang kosong */
    font-size: 14px;
    margin: 0 10px;
}

.app--inform .icon-svg {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    margin: 0 2px;
}

/* Styling dasar untuk tombol */
.btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
}

/* Styling untuk tombol close */
.btn--cross {
    color: #adb5bd;
    font-size: 1.5rem;
}
.btn--cross:hover {
    color: #fff;
}

/* Styling untuk tombol install (meniru .btn-sm .btn--app-download .rounded-pill) */
#installApp {
    background-color: #7F56D9; /* Warna ungu seperti contoh sebelumnya */
    color: white;
    border-radius: 50rem; /* .rounded-pill */
    padding: 0.25rem 0.75rem; /* .btn-sm */
    font-size: 0.875rem;
    white-space: nowrap;
}
#installApp:hover {
    background-color: #6941C6;
}
.d-none { display: none !important; }
@media (min-width: 992px) {
    .d-lg-block { display: block !important; }
    .d-lg-none { display: none !important; }
    #installApp {
        padding: 0.5rem 1.25rem;
    }
}
@media screen and (max-width:430px){
  #appDownload {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .app--inform {
    font-size: 12px;
  }
}
@media only screen and (max-width: 320px) {
  #appDownload {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .app--inform {
    font-size: 12px;
  }
}
.tawk-button {
    width: 46px !important;
    right: 0;
    left: unset !important;
    border-radius: 5px !important;
}
.tawk-text-left {
    display: none !important;
}



.mobile-bottom-nav {
    display: none;
}
@media (max-width: 768px) {
    body {
        padding-bottom: 70px; /* Sesuaikan nilainya dengan tinggi navigasi */
    }
    .mobile-bottom-nav {
        display: flex !important;
        flex-direction: row;
        justify-content: space-around; 
        align-items: center; 
        
        position: fixed; 
        bottom: 0;
        left: 0;
        width: 100%; /* Pastikan lebarnya 100% */
        height: 65px; 
        background-color: #000000; 
        border-top: 1px solid #333; 
        z-index: 1000; 
    }
    .lightbg .mobile-bottom-nav {
        background-color: var(--theangels-primary);
    }

    .mobile-bottom-nav .nav-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        flex: 1;
        color: rgb(255 255 255); 
        text-decoration: none;
        font-size: 12px;
        text-align: center;
    }

    .mobile-bottom-nav .nav-item-icon svg {
        width: 24px;
        height: 24px;
        margin-bottom: 4px;
    }
    .mobile-bottom-nav .nav-item.active {
        color: rgb(255 255 255); 
        font-weight: bold;
    }
    .darkbg .mobile-bottom-nav .nav-item.active {
      color: var(--theangels-primary);
    }
    .lightbg .mobile-bottom-nav .nav-item.active {
      color: #000;
    }

    .mobile-bottom-nav .nav-item.active svg {
        stroke: rgb(255 255 255); 
    }
    .darkbg .mobile-bottom-nav .nav-item.active svg {
        stroke: var(--theangels-primary);
    }
    .lightbg .mobile-bottom-nav .nav-item.active svg {
        stroke: #000;
    }
}

#countdown-container{
  display: none;
  margin-top: 25px; 
  border: 1px solid rgb(80 20 101); 
  padding: 15px; 
  border-radius: 5px; 
  background-color: rgba(255, 243, 205, 0.1);
}
