@media screen {
        html {
          height: 100%;
          font-size: 1em;
          font-size: 100%;
          line-height: 1.4;
          margin: 0;
          padding: 0;
          border: 0;
          vertical-align: baseline
        }

        body {
          margin: 0;
          font-size: 14px;
          line-height: 1.5;
          letter-spacing: .1px;
          color:rgb(255, 255, 255);
          background: #000000;
          font-family: "system-ui"
        }
        

        * {
          -moz-box-sizing: border-box;
          box-sizing: border-box
        }

        a:hover {
          color: #fff
        }

        div,
        input,
        label,
        section {
          display: block;
          overflow: hidden;
          position: relative
        }

        .mobile {
          display: none
        }

        li {
          list-style: none
        }

        .header {
          width: 100%;
          z-index: 999999;
          position: fixed;
          height: 120px;
          background: #000
        }

        .top-menu {
          line-height: 1.2;
          font-size: 11px;
          float: right;
          width: 50%
        }

        .top-header {
          height: 80px
        }

        .site-logo {
          float: left;
          top: 13px;
          left: 0px
        }

        .nav-header {
            background:rgb(0, 75, 92);
            background: linear-gradient(180deg, rgb(0, 90, 110) 0%, rgb(0, 208, 255) 100%);
            border-bottom: 4px solidrgb(0, 217, 255)
        }

        .sticky {
          height: 121px
        }

        .main {
          background: #1c1c1c;
          padding: 10px 0px
          
        }

        .container {
          max-width: 1060px;
          width: 100%;
          margin: auto
        }

        .game .container {
          background: #000;
          padding: 15px;
          border-radius: 7px;
          margin: 10px auto
        }

        ul.main-menu {
          padding: 0;
          margin: 0;
          text-transform: uppercase
        }

        .main-menu li a:hover {
          background: #00D0FF;
          color:rgb(0, 0, 0)
        }

        .main-menu li {
          display: block;
          float: left;
          margin: 0;
          padding: 0
        }

        .main-menu li a {
          color: #d2d2d2;
          display: inline-block;
          padding: 0px 38px;
          line-height: 35px;
          font-size: 13px
        }

        a {
          color:rgb(255, 255, 255);
          text-decoration: none
        }

        .main-menu li {
          border-left: solid 1.5px #000
        }
        
        .row {
          width: 100%;
          height: 100%;
          display: flex;
          flex-wrap: wrap
        }

        .col {
          flex-grow: 1;
          max-width: 33.33%
        }

        .col-md-6 {
          flex: 0 0 50%;
          max-width: 50%
        }

        .col-md-12 {
          flex: 0 0 100%;
          max-width: 100%
        }

        .col-border {
          margin: 17px 0px;
          position: relative;
          text-align: center;
          padding: 18px;
          border: 1px solid #262626;
          border-radius: 5px;
          width: 100%;
          overflow: unset
        }

        .col-title {
          position: absolute;
          top: -15px;
          background: #000;
          padding: 5px 10px;
          left: 20px;
          font-size: 12px;
          text-align: center;
          width: auto;
          max-width: 159px;
          margin: auto;
          font-weight: bold
        }

        .payment .col {
          background: #1a1a1a;
          margin: 4px;
          padding: 5px;
          font-size: 11px;
          border-left: 4px solid #08a52f;
          border-radius: 2px
        }

        .payment .col {
          flex: 1 0 11%;
          max-width: 12%
        }

        .game-list {
          border-bottom: 3px solid #004352;
          padding: 9px 0px
        }

        .game-list-title {
          font-size: 19px;
          color: #00D0FF;
          display: flex;
          margin: 9px auto;
          padding: 3px 0px;
          border-bottom: 3px solid #004352
        }

        .footer {
          width: 100%;
          background: #000;
        }

        .copyright {
          font-size: 11px;
          text-align: center;
          padding: 23px 0px;
          
        }

        .copyright a {
          color: #aaa
        }

        .article {
          text-align: left
        }

        @media only screen and (max-width: 768px) {

          amp-img,
          amp-anim {
            width: 100%
          }

          .slider amp-img,
          .slider amp-anim {
            border-radius: 0px
          }

          .nav-header,
          .desktop {
            display: none
          }

          .mobile {
            display: block
          }

          .main {
            background: #1c1c1c;
            padding: 0px
          }

          .header {
            z-index: 999999;
            position: fixed;
            border-bottom: 3px solid #00D0FF
          }

          .header,
          .sticky {
            height: 75px
          }

          .site-logo {
            position: fixed;       /* tetap di tempat meski halaman digulir */
            top: 4.5%;              /* 50% dari atas viewport */
            left: 50%;             /* 50% dari kiri viewport */
            transform: translate(-50%, -50%); /* geser setengah ukuran elemen untuk benar-benar center */
            z-index: 1000;         /* di atas elemen lain */
            pointer-events: none;  /* klik menerus ke elemen di bawahnya */
          }

          .top-header {
            margin: auto;
            width: 100%;
            height: auto
          }

          .container .row {
            padding: 0px 7px
          }
          
          .col {
            flex-grow: 1;
            max-width: 50%
          }

          .payment .col {
            flex-grow: 1;
            max-width: 22.7%
          }

          .bank .col {
            flex: 0 0 22.7%;
            max-width: 22.7%
          }
     
          .copyright {
            margin-bottom: 49px
          }

          #side-opener {
            display: none
          }

          input .tg {
            display: block;
            overflow: hidden;
            position: relative
          }

          .tg:checked+.page-content {
            right: 272px
          }

          .page-content {
            z-index: 10;
            right: 0;
            display: block;
            min-height: 580px;
            transition: all .25s ease-out;
            -webkit-transition: all .25s ease-out;
            background-color: #0a0a0a
          }

        }

        @media only screen and (max-width: 328px) {

          .header,
          .sticky {
            height: 55px
          }

            .site-logo {
            top: 28px;
            width: auto;
            max-width: 165px;
            height: auto;
            overflow: visible;
          }
  
          .site-logo img {
            display: block;
            width: 100%;
            height: auto;
            object-fit: contain;
          }
  
          .logo-wrapper {
            overflow: visible !important;
            height: auto !important;
          }
  


        }
      }