@charset "UTF-8";
/*!
 * Bootstrap  v5.2.0 (https://getbootstrap.com/)
 * Copyright 2011-2022 The Bootstrap Authors
 * Copyright 2011-2022 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
 .btn-lg {
    --bs-btn-font-size: 0.75rem;
}

#container-apk {
    background: rgb(165,32,204);
    background: #212121;
    padding: 10px;
}
#container-apk-a {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 0.7rem;
}
#container-apk-b {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.1rem;
    color: #EDFF0E;
}
#container-apk-button {
    float: right;
    text-transform: uppercase;
    font-weight: bold;
}
#apk-button {
    text-decoration: none;
    display: inline-block;
    padding: 0.6em 1.5em;
    border-radius: 2rem;
    box-sizing: border-box;
    text-decoration: none;
    font-weight: 700;
    color: #ffffff;
    background: rgb(231, 90, 235);
    background: linear-gradient(229deg, rgb(255 0 0) 0%, rgb(255 93 93) 56%, rgb(255 0 0) 100%);
    text-align: center;
    border: #FEFFFE 8px !important;
    transition: all 0.2s;
    animation: blink 0.4s infinite;
}
@keyframes blink {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

.announcement {
    margin-top: 50px;
    text-align: center;
    background: #000000;
}
.mb-5 {
    margin-bottom: 3rem !important;
    background: #2d0000bd;
}

.wrapper>#content>#maincontent>.container>.d-flex.justify-content-between.align-items-center.mt-3>h3 {
    padding: 0px 15px;
    position: relative;
    text-transform: uppercase;
    font-size: 18px;
    color: #000 !important;
    background-image: repeating-linear-gradient(to right bottom, #a2682a 0, #be8c3c 8%, #be8c3c 18%, #d3b15f 27%, #faf0a0 35%, #ffffc2 40%, #faf0a0 50%, #d3b15f 58%, #be8c3c 67%, #b17b32 77%, #bb8332 83%, #d4a245 88%, #e1b453 93%, #a4692a 100%);
}

.wrapper>#content>#maincontent>.container>.d-flex.justify-content-between.align-items-center.mt-3>h3:after {
    background-image: repeating-linear-gradient(168deg, #faf2a4 0, #be8c3c 32%, #be8c3c 65%, #deb050 76%, #a46b2c 100%);
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 10px;
    height: 100%;
    transform-origin: 100% 0;
    transform: skew(25deg);
}

.mt-3 {
    margin-top: 1rem !important;
    padding: 5px 15px;
    position: relative;
    text-transform: uppercase;
    font-size: 15px;
    background-image: repeating-linear-gradient(to right bottom, #ab0000 0, #ff0000 8%, #be3c3c 18%, #ff0000 27%, #950000 35%, #ff0000 40%, #950000 50%, #ff0000 58%, rgb(255 0 0) 67%, #530000 77%, #590000 83%, #a70000 88%, #230000 93%, #000000 100%);
    border-radius: 12px;
}

.wrapper>#content>#maincontent>.container>.d-flex.justify-content-between.align-items-center.mt-3>h3:after {
    background-image: repeating-linear-gradient(168deg, #faf2a4 0, #be8c3c 32%, #be8c3c 65%, #deb050 76%, #a46b2c 100%);
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 10px;
    height: 100%;
    transform-origin: 100% 0;
    transform: skew(25deg);
}

.wrapper>#content>#maincontent>.my-3>section.container.roll {
    margin: 20px auto;
    padding: 0px;
    border: 1px solid #d3b15f;
    border-radius: 15px;
    background-color: var(--third-color);
}

.wrapper>#content>#maincontent>.my-3>.container.roll>.row {
    align-items: center;
}


.wrapper>#content>#maincontent>.container>.d-flex.justify-content-between.align-items-center.mt-3>h3 {
    padding: 0px 15px;
    position: relative;
    text-transform: uppercase;
    font-size: 18px;
    color: #000 !important;
    background-image: repeating-linear-gradient(to right bottom, #a2682a 0, #be8c3c 8%, #be8c3c 18%, #d3b15f 27%, #faf0a0 35%, #ffffc2 40%, #faf0a0 50%, #d3b15f 58%, #be8c3c 67%, #b17b32 77%, #bb8332 83%, #d4a245 88%, #e1b453 93%, #a4692a 100%);
}


.mt-3 {
    margin-top: 1rem !important;
    padding: 5px 15px;
    position: relative;
    text-transform: uppercase;
    font-size: 15px;
    background-image: repeating-linear-gradient(to right bottom, #ab0000 0, #ff0000 8%, #be3c3c 18%, #ff0000 27%, #950000 35%, #ff0000 40%, #950000 50%, #ff0000 58%, rgb(255 0 0) 67%, #530000 77%, #590000 83%, #a70000 88%, #230000 93%, #000000 100%);
    border-radius: 12px;
}


.menubar.navbar.fixed-bottom.navbar-dark.bg-dark.p-0 {
    border-radius: 25px 25px 0px 0px;
    border-top: 3px solid #ffff00;
}

.glassmorphism {
    background: #79000070;
    border-radius: 16px;
    box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
    backdrop-filter: blur(1px);
    border: 2px groove #ffe0e047;
}
.glassmorphism::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background: linear-gradient(180deg, rgb(255 255 255 / 10%), rgb(255 255 255 / 30%));
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.invalid-feedback {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875em;
    color: #bbff00;
}


.card-body {
padding: 5px !Important;
}

  #sidebarCollapse svg {
    width: 24px;
    height: 24px;
    fill: white;
    
  }

#sidebarCollapse:hover svg {
    transform: rotate(90deg);
  }
.eye-icon-username {
  background-color: transparent;
  right: 0px;
  top: 2px;
  display: none !Important;
}

.eye-icon-pass {
  background-color: transparent;
  right: 0px;
  top: 30%;
  display: none !Important;
}



.show-more-btn {
display: block;
margin: 20px auto;
padding: 10px 20px;
background: linear-gradient(to bottom,#fe0 0,#e7c407 50%,#fdd700 100%)!important;
color: black !important;
border: none;
border-radius: 20px;
box-shadow: 0 -2px 0px #ff0, 0 2px 0px #ff0 !important;
cursor: pointer;
font-weight: bold;
font-family: "Saira Condensed", sans-serif;
font-size: 14px;
transition: all 0.3s ease;
}

#row-quicklogin .form-group label {
  display: none;
}

.fas, .fa-solid {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: #3b3b3b54;
}

#togglePass{
position: absolute;
    right: 12px;
    top: 25% !important;
}

.progress-bar-striped {
    background-image: linear-gradient(45deg, rgb(56 255 0) 25%, #1dff39 25%, #80ffae 50%, rgb(0 255 31) 50%, rgb(45 255 0) 75%, #1cff00 75%, #0dff00);
    background-size: var(--bs-progress-height) var(--bs-progress-height);
}



  .btn-primary, .btn-primary:hover {
     border-color: #ffd700;
  }
  .btn-secondary, .btn-secondary:hover, .btn-info {
     border-color: #ffd700;
  }
  .btn-rajaberas88, .btn-rajaberas88:hover {
     border-color: #ffd700;
  }

.modal {
--bs-modal-border-color: rgb(0 0 0 / 0%);
background: #000000cf;
}

.btn-rajaberas88{
background: linear-gradient(270deg, rgb(0 194 201) 0%, rgb(0 136 193) 21%, rgb(0 154 255) 33%, rgb(0 236 255) 44%, rgb(9 200 215) 60%, rgb(34 126 252) 73%, rgb(0 180 255) 85%, rgb(0 217 255) 100%);
    background-size: auto;
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    box-shadow: inset 0 0 5px 3px #00e9f1, inset 0 2px 0 0 #fff, inset 0 0 0 2px #640067, 3px 3px 3px 1px rgba(0, 0, 0, .2);
    border: 0px solid #08f1ff;
    color: black;
    font-weight: 500;
    border-radius: 20px;
}

.btn-primary {
    background: linear-gradient(270deg, rgba(201, 138, 0, 1) 0%, rgba(253, 243, 35, 1) 21%, rgba(253, 243, 35, 1) 33%, rgba(211, 158, 7, 1) 44%, rgba(215, 166, 9, 1) 60%, rgba(252, 241, 34, 1) 73%, rgba(255, 247, 36, 1) 85%, rgba(201, 138, 0, 1) 100%);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    box-shadow: inset 0 0 5px 3px #f18700, inset 0 2px 0 0 #fff, inset 0 0 0 2px #640067, 3px 3px 3px 1px rgba(0, 0, 0, .2);
    color: #000;
    border: 1px solid #ffe400 !important;
    border-radius: 16px;
}
.btn-secondary {
    background: linear-gradient(270deg, rgba(201, 138, 0, 1) 0%, rgba(253, 243, 35, 1) 21%, rgba(253, 243, 35, 1) 33%, rgba(211, 158, 7, 1) 44%, rgba(215, 166, 9, 1) 60%, rgba(252, 241, 34, 1) 73%, rgba(255, 247, 36, 1) 85%, rgba(201, 138, 0, 1) 100%);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    box-shadow: inset 0 0 5px 3px #f18700, inset 0 2px 0 0 #fff, inset 0 0 0 2px #640067, 3px 3px 3px 1px rgba(0, 0, 0, .2);
    color: #000;
    border: 1px solid #ffe400 !important;
    border-radius: 16px;
}

  @keyframes gradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
  }
.btn-grad-2 {
    background: linear-gradient(270deg, rgb(255 0 0) 0%, rgb(141 0 0) 21%, rgb(255 0 0) 33%, rgb(139 0 0) 44%, rgb(255 0 0) 60%, rgb(136 0 0) 73%, rgb(255 0 0) 85%, rgb(187 0 0) 100%);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    box-shadow: inset 0 0 5px 3px #d41515, inset 0 2px 0 0 #fff, inset 0 0 0 2px #640067, 3px 3px 3px 1px rgba(0, 0, 0, .2);
    border: 1px solid #ff0000 !important;
    border-radius: 16px;
    font-weight: 700;
}
.btn-grad-3 { 
background: linear-gradient(270deg, rgb(245 14 8) 0%, rgb(217 23 23) 21%, rgb(255 45 45) 33%, rgb(227 38 38) 44%, rgb(221 15 15) 60%, rgb(161 33 33) 73%, rgb(221 48 48) 85%, rgb(209 10 10) 100%);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    box-shadow: inset 0 0 5px 3px #d41515, inset 0 2px 0 0 #fff, inset 0 0 0 2px #640067, 3px 3px 3px 1px rgba(0,0,0,.2);
color: #00000

}
.card-body {
    padding: 0px !important;
    margin-top: -10px;
}

.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: var(--bs-modal-padding);
    background-color: #00000000 !important;
}

.modal-header {
    display: flex;
    background-color: #ec0000;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: var(--bs-modal-header-padding);
    border-bottom: var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color);
    border-top-left-radius: var(--bs-modal-inner-border-radius);
    border-top-right-radius: var(--bs-modal-inner-border-radius);
}

.btn-danger {
    background: linear-gradient(270deg, rgb(254 255 0) 0%, #ea9d2b 21%, rgb(255 254 0) 33%, #ea9d2b 44%, rgb(244 255 0) 60%, #ea9d2b 73%, rgb(255 254 0) 85%, #ea9d2b 100%);
    background-size: 400% 400%;
    animation: gradient 5s 
ease infinite;
    box-shadow: inset 0 0 5px 3px #fff600, inset 0 2px 0 0 #fff, inset 0 0 0 2px #ea9d2b, 3px 3px 3px 1px rgba(0, 0, 0, .2);
    color: #000;
    border-radius: 15px 0px 15px 0px;
}


.w-100 {
    width: 100% !important;
    border-color: #ffffff !important;
    box-shadow: 0 0 0px #ff0000;
    border-radius: 12px;
}

.bg-danger {
    --bs-bg-opacity: 1;
    --bs-btn-border-color: #ea9d2b;
    background-color: rgb(230 12 12) !important;
}


.mb-3 {
    margin-bottom: 0.5rem !important;
    background: 0px;
}

.bg-dark {
    --bs-bg-opacity: 1;
    background-color: rgb(144 0 0 / 37%) !important;
}

.text-primary {
    --bs-text-opacity: 1;
    color: rgb(255 255 255) !important;
}

.btn-outline-info {
--bs-btn-color: #ffffff;
}


.form-label {
  margin-bottom: -2.5rem;
}

.form-select {
    display: block;
    width: 100%;
    padding: 0.375rem 2.25rem 0.375rem 0.75rem;
    -moz-padding-start: calc(0.75rem - 3px);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #fff;
    background-color: #000;
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e);
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
    border: 2px solid #aeaeb0;
    border-radius: 16px;
    transition: border-color 0.15s 
ease-in-out, box-shadow 0.15s 
ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}


.p-3 {
    padding: 1rem !important;
    background: #ff00002b;
    color: #fff !important;
}

.m-3 {
    margin: 1.5rem !important;
}

#sidebar.active {
    left: 0;
    background: #000000 !important;
}

.btn.active {
background: linear-gradient(270deg, rgb(254 255 0) 0%, #ea9d2b 21%, rgb(255 254 0) 33%, #ea9d2b 44%, rgb(244 255 0) 60%, #ea9d2b 73%, rgb(255 254 0) 85%, #ea9d2b 100%);
    background-size: 400% 400%;
    animation: gradient 5s 
ease infinite;
}
.p-2 {
    padding: 0.5rem !important;
    background: #000000000;
}

a {
    color: #ffffff;
    text-decoration: underline;
}

.progress-bar {
    display: flex
;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    color: #000000;
    text-align: center;
    white-space: nowrap;
    background-color: var(--bs-progress-bar-bg);
    transition: var(--bs-progress-bar-transition);
}

.nav-tabs {
    --bs-nav-tabs-border-width: 0px;
    --bs-nav-tabs-border-color: #4901a1;
    background: #ff0000;
}
.menubar {
    background-image: linear-gradient(to top, #680000 3%, #300000 5%, #770000 50%, #ff0000 50%, #be0000 85%, #250000 99%, #ff0000 3%) !important;
    border-radius: 0px 0px 25px 25px;
    border-bottom: 2px solid #ffff00;
}

.btn-dark {
    background: #000;
    background-size: 400% 400%;
    box-shadow: inset 0 0 0px 2px #000000, inset 0 2px 0 0 #490bc8, inset 0 0 0 2px #000000, 3px 3px 3px 1px rgb(0 0 0);
    color: #fff900;
    --bs-btn-border-color: #000000;
}

.card {
    --bs-card-spacer-y: 0rem;
    --bs-card-spacer-x: 2rem;
    --bs-card-border-color: rgb(0 0 0 / 0%);
}

.btn.active, .btn.show {
    color: var(--bs-btn-active-color);
    background-color: #ffb900;
    border-color: #ffe400;
}

.ninfo {
    background-image: linear-gradient(to bottom, #ff0000 40%, #580000 100%);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    box-shadow: inset 0 0 5px 3px #e700f6, inset 0 2px 0 0 #fff, inset 0 0 0 2px #000000, 3px 3px 3px 1px rgba(0, 0, 0, .2);
    font-weight: 500;
    color: #fff;
    font-weight: bold;
    z-index: 9999;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    margin: 5px;
    z-index: 0;
}
.nicon {
    background: linear-gradient(#f9d800, #f9d800, #f9d800);
    width: 60px;
    min-width: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom-left-radius: 8px;
}
  .nicon i {
    font-size: 1.3rem;
    animation: shake 1.5s infinite, blinkColor 2s infinite;
  }
  @keyframes shake {
    0%, 100% { transform: rotate(0deg); }
    20% { transform: rotate(-15deg); }
    40% { transform: rotate(10deg); }
    60% { transform: rotate(-10deg); }
    80% { transform: rotate(5deg); }
  }
  @keyframes blinkColor {
    0% { color: #ff0000; }
    25% { color: #fff; }
    50% { color: #ff0000; }
    75% { color: #fff; }
    100% { color: #ff0000; }
  }
.ntxt-wrapper {
    overflow: hidden;
    flex: 1;
    display: flex;
    align-items: center;
    padding-right: 10px;
}
  .ntxt {
    white-space: nowrap;
    display: inline-block;
    animation: flowX 18s linear infinite;
    padding: -0.25rem 1rem;
    color: #fff;
  }
  @keyframes flowX {
    0% { transform: translateX(0%); }
    100% { transform: translateX(-100%); }
  }
.modal-content {
    position: relative;
    display: flex
;
    flex-direction: column;
    width: 100%;
    color: var(--bs-modal-color);
    pointer-events: auto;
    background-color: #48484800;
    background-clip: padding-box;
    border: var(--bs-modal-border-width) solid var(--bs-modal-border-color);
    border-radius: var(--bs-modal-border-radius);
    outline: 0;
}

.carousel-inner {
    position: relative;
    margin-top: -3px;
    width: 100%;
    overflow: hidden;
    padding: 2px;
}

.border-primary {
    --bs-border-opacity: 1;
    border-color: rgb(255 0 0) !important;
}

.bg-white {
    --bs-bg-opacity: 1;
    background-image: linear-gradient(28deg, #000000 50%, #595959 50%);
}
.text-decoration-none {
    text-decoration: none !important;
    color: #fff;
}

    #apk-bar-wrapper .btn-apk {
        position: relative;
        overflow: hidden;
        background: #00ff66;
        color: #003300;
        border-radius: 20px;
        padding: 6px 16px;
        font-size: 14px;
        font-weight: bold;
        box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        transition: all 0.3s 
ease-in-out;
        animation: pulse 1.8s infinite;
    }