html {
    padding:0;
    margin:0;
    height:auto;
    background:linear-gradient(45deg,rgba(196,140,0,1),#000000,#000000,rgba(196,140,0,1));
    background-size:400% 400%;
    animation:gradient 15s ease infinite;
    display:flex;
    flex-direction:column;
  }
  
  @keyframes gradient {
    0% {
      background-position:0% 50%;
    }
    50% {
      background-position:100% 50%;
    }
    100% {
      background-position:0% 50%;
    }
  }
  
  a {
    text-decoration:none;
    color:#fff;
    -webkit-transition:opacity 0.2s;
    -moz-transition:opacity 0.2s;
    -o-transition:opacity 0.2s;
    transition:opacity 0.2s;
  }
  
  a img {
    border:none;
  }
  
  /* a:hover {
    opacity:0.9;
  }
   */
  .container {
    margin:auto;
    max-width:930px;
    border:1px solid transparent;
  }
  
  .header {
    width:930px;
    height:auto;
  }
  
  .logo {
    float:left;
    width:276px;
    height:101px;
    margin-left:10px;
    margin-top:10px;
  }
  
  .loginfrom {
    float:right;
    width:640px;
    height:auto;
  }
  
  /* PROMO BUTTON STYLE */
  
          .promobutton {
    float:center;
    position:relative;
    right:20px;
    padding-top:10px;
    margin-left:180px;
    margin-bottom:5px;
    width:40%;
    height:40px;
  }
  
  .button {
    border:1px solid #FFD700;
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
    transform:skewX(-10deg);
    height:40px;
    width:100%;
    border-radius:20px 5px 20px 0;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all 0.3s ease;
    font-family:'Bebas Neue',cursive;
    font-size:35px;
    font-weight:300;
    padding-top:7px;
    text-shadow:0 0 20px #fff;
    text-transform:uppercase;
    -webkit-animation:breath2 2s 0.5s infinite alternate;
    animation:breath2 2s 0.5s infinite alternate;
    transition:all 0.2s ease;
    cursor:pointer;
    color:#FFD700;
  }
  
  .button:before {
    content:"";
    display:block;
    width:calc(100% - 22px);
    height:calc(45px - 8px);
    -webkit-animation:breath 2s infinite alternate;
    animation:breath 2s infinite alternate;
    left:10px;
    top:3px;
    position:absolute;
    background-color:transparent;
    border:1px solid #DAA520;
    border-radius:15px 3px 15px 3px;
  }
  
  .button.fire {
    border-color:rgb(255,175,25);
    background:rgb(255,175,25);
    background:linear-gradient(0deg,rgb(255,175,25) 0%,rgba(255,0,0,0) 100%);
    box-shadow:0 0 15px rgb(255,175,25),0 5px 20px rgb(255,175,25),inset 0 1px rgba(179,122,0),inset 0 -1px rgba(179,122,0);
    color:#fff;
  }
  
  .button.fire:before {
    box-shadow:inset 0 0 20px 0 rgba(255,224,163);
  }
  
  .button:hover.fire {
    box-shadow:0 0 25px rgba(255,224,163),0 5px 20px rgba(255,224,163),inset 0 1px rgba(179,122,0),inset 0 -1px rgba(179,122,0);
    color:#ffd000;
  }
  
  .button:hover.fire:before {
    box-shadow:inset 0 0 30px 0 #ffd000;
  }
  
  .button + .button {
    margin-top:15px;
    -webkit-animation-delay:0.3s;
    animation-delay:0.3s;
  }
  
  @-webkit-keyframes breath {
    0% {
      transform:scaleX(1);
    }
    100% {
      transform:scaleX(0.95);
    }
  }
  
  @keyframes breath {
    0% {
      transform:scaleX(1);
    }
    100% {
      transform:scaleX(0.95);
    }
  }
  
  @-webkit-keyframes breath2 {
    0% {
      transform:skewX(-10deg) scaleX(1);
    }
    100% {
      transform:skewX(-10deg) scaleX(0.95);
    }
  }
  
  @keyframes breath2 {
    0% {
      transform:skewX(-10deg) scaleX(1);
    }
    100% {
      transform:skewX(-10deg) scaleX(0.95);
    }
  }
  
  .ref {
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.6);
    border-radius:3px;
    padding:5px 8px;
    position:absolute;
    font-size:16px;
    bottom:10px;
    right:10px;
    color:#fff;
    font-weight:300;
    font-family:sans-serif;
    text-decoration:none;
  }
  
  .ref::first-letter {
    font-size:12px;
  }
  
  /* END PROMO BUTTON */
  
          .header .login-container {
    float:right;
    width:522px;
    margin-top:10px;
  }
  
  .numbercode {
    float:left;
    width:55px;
    height:31px;
    margin-left:5px;
    border-color:gold;
  }
  
  /* Style the input field inside the navbar */
  
          .header input[type=text] {
    float:left;
    padding-left:5px;
    margin-left:5px;
    margin-top:0;
    font-size:12px;
    width:100px;
    /* adjust as needed (as long as it doesn't break the topnav) */
  
              height:27px;
    background:#000;
    border:1px solid transparent;
    border-color:#FFAE00;
    border-image-slice:1;
    font-style:italic;
    color:#fff;
  }
  
  .header input[type=password] {
    float:left;
    padding-left:5px;
    margin-left:5px;
    margin-top:0;
    font-size:12px;
    width:100px;
    /* adjust as needed (as long as it doesn't break the topnav) */
  
              height:27px;
    background:#000;
    border:1px solid transparent;
    border-color:#FFAE00;
    border-image-slice:1;
    font-style:italic;
    color:#fff;
  }
  
  .code input[type=text] {
    float:left;
    width:50px;
  }
  
  /* Style the button inside the input container */
  
          .header .login-container .sitelogin {
    float:left;
    width:80px;
    height:31px;
    font-family:'Bebas Neue',bold;
    margin-left:5px;
    font-size:20px;
    cursor:pointer;
    color:rgb(0,0,0);
  }
  
  .header .login-container .sitelogin:hover {
    background-image:linear-gradient(to top,#ffd000 100%,#FFAE00 100%);
  }
  
  nav {
    margin:115px auto;
    max-width:930px;
    width:930px;
    font-family:'Bebas Neue',cursive;
  }
  
  #checkbox1,
  .toggle {
    display:none;
  }
  
  .menu {
    padding:0;
    margin:0;
    max-width:930px;
    height:50px;
    border-radius:0;
    display:flex;
    flex-direction:row;
    justify-content:space-around;
    align-items:center;
    list-style-type:none;
  }
  
  .menu li a {
    text-decoration:none;
    align-self:center;
    border-radius:0;
    font-size:20px;
    padding:10px 15px;
    transition:background .2s linear;
  }
  
  .demo {
    border-radius:0;
    background:rgb(218,165,32);
    background:linear-gradient(0deg,rgb(125,77,0),rgba(150,102,0) 18%,rgba(179,122,0) 30%,rgba(255,199,135) 52%,rgba(255,215,135) 64%,rgba(255,224,163) 82%,rgb(255,175,25) 100%);
    border-radius:0;
    border:1px solid #FFAE00;
  }
  
  .demo li a {
    color:rgb(5,5,5);
  }
  
  .demo li a:hover {
    width:100%;
    color:#970000;
    background:white;
    background:linear-gradient(0deg,rgb(255,196,21) 0%,rgba(0,0,0,0) 44%);
  }
  
  #informasi {
    top:185px;
    position:absolute;
    float:left;
    background:rgb(255,255,255);
    background:-moz-linear-gradient(0deg,rgb(171,117,0),rgba(247,169,0) 14%,rgba(168,116,3) 31%,rgba(255,199,87) 47%,rgba(255,217,140) 67%,rgba(255,170,0) 88%,rgb(150,97,0) 100%);
    background:-webkit-linear-gradient(0deg,rgb(171,117,0),rgba(247,169,0) 14%,rgba(168,116,3) 31%,rgba(255,199,87) 47%,rgba(255,217,140) 67%,rgba(255,170,0) 88%,rgb(150,97,0) 100%);
    background:linear-gradient(0deg,rgb(171,117,0),rgba(247,169,0) 14%,rgba(168,116,3) 31%,rgba(255,199,87) 47%,rgba(255,217,140) 67%,rgba(255,170,0) 88%,rgb(150,97,0) 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#aaaaaa",GradientType=1);
    width:930px;
    height:43px;
    border:1px solid #FFAE00;
    border-radius:10px;
    margin-bottom:20px;
  }
  
  .textinformasi {
    float:left;
    color:#000;
    font-size:20px;
    font-family:'Bebas Neue';
    font-style:bold;
    font src:url('../fonts/BEBAS.ttf');
    width:0.2%;
    margin:-12px 16px;
  }
  
  .textmarquee {
    float:right;
    color:#fff;
    font:normal 15px arial,sans-serif;
    font-style:italic;
    width:92%;
    height:26px;
    margin:5px 5px;
    background:rgb(36,36,36);
    background:-moz-linear-gradient(0deg,rgba(36,36,36,1) 0%,rgba(0,0,0,1) 7%,rgba(0,0,0,1) 48%,rgba(22,22,22,1) 50%,rgba(0,0,0,1) 75%,rgba(24,24,24,1) 100%);
    background:-webkit-linear-gradient(0deg,rgba(36,36,36,1) 0%,rgba(0,0,0,1) 7%,rgba(0,0,0,1) 48%,rgba(22,22,22,1) 50%,rgba(0,0,0,1) 75%,rgba(24,24,24,1) 100%);
    background:linear-gradient(0deg,rgba(36,36,36,1) 0%,rgba(0,0,0,1) 7%,rgba(0,0,0,1) 48%,rgba(22,22,22,1) 50%,rgba(0,0,0,1) 75%,rgba(24,24,24,1) 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#242424",endColorstr="#181818",GradientType=1);
    padding-top:8px;
    border-radius:7px;
  }
  
  #sliderarea {
    position:absolute;
    top:243px;
    float:left;
    width:656px;
    height:276px;
    border:1px solid #ffd000;
  }
  
  .iframestyle {
    width:100%;
    height:276px;
    float:left;
    margin-left:0;
    margin-top:0;
  }
  
  .gamewraper {
    top:243px;
    margin-left:666px;
    position:absolute;
    float:right;
    width:264px;
    height:259px;
    font-family:'Bebas',bold;
  }
  
  .games {
    position:relative;
    margin:0 auto;
    text-align:center;
    width:263px;
    height:62px;
    border:1px solid #ffd000;
    margin-bottom:7px;
    border:1px solid #ffd000;
    background:rgb(255,255,255);
    background:linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(206,206,206,1) 30%,rgba(223,223,223,1) 52%,rgba(255,255,255,1) 52%,rgba(229,229,229,1) 80%,rgba(209,209,209,1) 100%);
  }
  
  /* Centered text */
  
          .centered {
    font-weight:bold;
    position:absolute;
    top:70%;
    left:50%;
    transform:translate(-50%,-50%);
  }
  
  .centered span {
    position:absolute;
    transform:translate(-50%,-50%);
    top:50%;
    left:50%;
    letter-spacing:5px;
    font-size:25px;
    font-weight:bold;
    background-image:linear-gradient(0deg,rgba(0,0,0) 0%,rgba(0,0,0) 14%,rgba(0,0,0) 33%,rgba(0,0,0) 54%,rgba(0,0,0) 55%,rgba(0,0,0) 85%,rgba(0,0,0) 100%);
    color:black;
    -webkit-background-clip:text;
    letter-spacing:0;
    -webkit-text-stroke:1px #FFAE00;
  }
  
  .nbox {
    background:-ms-linear-gradient(top,#274b66 0,#103856 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#274b66',endColorstr='#103856',GradientType=0);
  }
  
  .nbox {
    -webkit-box-shadow:aquamarine;
    -moz-box-shadow:0 -2px 0 0 rgba(7,32,49,1);
    padding:0 0;
    float:left;
    width:930px;
    margin-top:240px;
  }
  
  .media-body {
    vertical-align:middle;
    border-radius:5px;
  }
  
  .media-body span {
    font-size:16px;
  }
  
  .media {
    font-family:'Bebas Neue';
    src:url('../fonts/BEBAS.ttf');
  }
  
  .media-body span {
    position:absolute;
    font-size:23px;
    margin-left:78px;
    color:rgb(255 255 255);
    padding-top:19px;
  }
  
  .media {
    float:right;
    width:220px;
    height:65px;
    margin-top:0;
    margin-left:10px;
    font-size:18px;
    background-color:#000000;
    border-radius:0;
    border:1px solid #FFAE00;
  }
  
  .socialico {
    float:left;
    width:40px;
    height:60px;
    position:absolute;
    margin-top:12px;
    margin-left:30px;
  }
  
  img {
    max-width:100%;
    max-height:100%;
    display:block;
  }
  
  .middleinfo {
    float:left;
    margin-top:10px;
    width:930px;
    height:330px;
  }
  
  .boxslotgames {
    float:left;
    margin-top:10px;
    width:930px;
    height:120px;
    border:1px solid #FFAE00;
    background-size:400% 400%;
    animation:gradient 15s ease infinite;
  }
  
  .boxtoto {
    font-family:arial;
    float:left;
    margin-right:10px;
    width:302px;
    height:320px;
    border:1px solid #FFAE00;
  }
  
  .boxtotogames {
    font-family:arial;
    float:left;
    margin-right:10px;
    width:302px;
    height:320px;
    border:1px solid #FFAE00;
  }
  
  .boxmid {
    float:left;
    width:301px;
    height:320px;
    border:1px solid #FFAE00;
    background:linear-gradient(0deg,rgb(153,101,21),rgba(255,215,0) 100%);
    border:1px solid #ffd000;
  }
  
  .boxmid span {
    transform:translate(-50%,-50%);
    top:50%;
    left:50%;
    letter-spacing:5px;
    font-weight:bold;
    background-image:linear-gradient( to top,#a77600 10%,#a77600 0,#ffea00 22%,#a77600 45%,#ffea00 50%,#ffea00 55%,#be8600 78%,#ffea00 100% );
    color:#FFAE00;
    -webkit-background-clip:text;
    letter-spacing:0;
    -webkit-text-stroke:0 #c7a900;
  }
  
  .light {
    -webkit-mask-image:linear-gradient(-15deg,rgba(0,0,0,.6) 30%,#000 50%,rgba(0,0,0,.6) 70%);
    -webkit-mask-size:200%;
    animation:shine 2s infinite;
  }
  
  @-webkit-keyframes shine {
    from {
      -webkit-mask-position:150%;
    }
    to {
      -webkit-mask-position:-50%;
    }
  }
  
  .boxsmartphone {
    float:left;
    margin-left:10px;
    width:301px;
    height:320px;
    border:1px solid #FFAE00;
    background:rgba(213,171,0,0.21);
    animation:gradient 15s ease infinite;
  }
  
  .boxsmartphone span {
    transform:translate(-50%,-50%);
    top:50%;
    left:50%;
    letter-spacing:5px;
    font-weight:bold;
    background-image:linear-gradient( to top,#a77600 10%,#a77600 0,#ffea00 22%,#a77600 45%,#ffea00 50%,#ffea00 55%,#be8600 78%,#ffffff 100% );
    color:#ffffff;
    -webkit-background-clip:text;
    letter-spacing:2px;
    -webkit-text-stroke:0 #c7a900;
  }
  
  .lastesttitle {
    float:left;
    width:302px;
    height:40px;
    vertical-align:middle;
    background:#ffffff00;
    color:rgb(0,0,0);
    font-size:30px;
    font-family:'Bebas Neue',cursive;
    font-style:bold;
    margin-bottom:10px;
    color:rgba(10 0 0);
    -webkit-text-stroke:0 #ffd000;
  }
  
  .titletoto {
    text-align:left;
    font-weight:bold;
    font-size:16px;
  }
  
  .datetoto {
    text-align:left;
    font-size:14px;
  }
  
  #gaptoto {
    margin-left:15px;
  }
  
  .imgtoto {
    width:13%;
    height:13%;
  }
  
  .wrappersection {
    float:left;
    width:100%;
  }
  
  table {
    border-left:0 solid #ddd;
    border-right:0 solid #ddd;
  }
  
  table,
  td,
  th {
    border-bottom:0 solid #ddd;
  }
  
  table {
    border-collapse:collapse;
    width:90%;
  }
  
  td {
    height:15px;
    text-align:center;
    vertical-align:center;
  }
  
  .widget-content {
    margin:0 0 0 0;
  }
  
  tr td a {
    display:block;
  }
  
  .widget-content tr td {
    border-top:0;
    letter-spacing:0;
    color:#fff;
  }
  
  .sectionfooter {
    float:left;
    margin-top:5px;
    margin-bottom:30px;
    width:930px;
    height:50px;
    border-radius:5px;
  }
  
  .textkeyword {
    float:left;
    margin-top:5px;
    margin-bottom:10px;
    text-align:center;
    padding:1px 1px;
    font-family:arial;
    width:100%;
  }
  
  #footerok {
    float:left;
    margin-top:0;
    /*top:10px;
    */
  
              background:rgb(32,0,0);
    background:-moz-linear-gradient(0deg,rgb(125,77,0),rgba(150,102,0) 18%,rgba(179,122,0) 30%,rgba(255,199,135) 52%,rgba(255,215,135) 64%,rgba(255,224,163) 82%,rgb(255,175,25) 100%);
    background:-webkit-linear-gradient(0deg,rgb(125,77,0),rgba(150,102,0) 18%,rgba(179,122,0) 30%,rgba(255,199,135) 52%,rgba(255,215,135) 64%,rgba(255,224,163) 82%,rgb(255,175,25) 100%);
    background:linear-gradient(0deg,rgb(125,77,0),rgba(150,102,0) 18%,rgba(179,122,0) 30%,rgba(255,199,135) 52%,rgba(255,215,135) 64%,rgba(255,224,163) 82%,rgb(255,175,25) 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#200000",endCo lorstr="#200000",GradientType=1);
    width:100%;
    height:43px;
    border:1px solid #FFAE00;
    border-radius:10px;
    margin-bottom:20px;
  }
  
  .textfooter {
    float:left;
    color:rgb(0,0,0);
    font-size:12px;
    width:80%;
    margin:3px 15px;
    text-align:left;
  }
  
  .imglogo {
    float:right;
    color:#fff;
    width:13%;
    margin:2px 10px;
    border-radius:7px;
  }