html {
	padding:0;
	margin:0;
	height:auto;
	background:linear-gradient(45deg,#2a1900,#120b00,#6d4d00,#1b1100);
	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:330px;
	height:78px;
	margin-left:10px;
	margin-top:25px;
  }
  
  .loginfrom {
	float:right;
	width:530px;
	height:auto;
  }
  
  /* PROMO BUTTON STYLE */
  
	.promobutton {
	float:right;
	right:20px;
	width:280px;
	height:50px;
	margin-top:10px;
  }
  
  .button {
	border:1px solid yellow;
	-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:red;
  }
  
  .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 #ffde00;
	border-radius:15px 3px 15px 3px;
  }
  
  .button.fire {
	border-color:#ff0000;
	background:rgb(255,0,0);
	background:linear-gradient(0deg,rgba(255,0,0,1) 0%,rgba(255,0,0,0) 100%);
	box-shadow:0 0 15px rgba(255,0,0,0.6),0 5px 20px rgba(255,0,0,0.6),inset 0 1px #ff0000,inset 0 -1px #ff0000;
	color:#fff;
  }
  
  .button.fire:before {
	box-shadow:inset 0 0 20px 0 #ff0000;
  }
  
  .button:hover.fire {
	box-shadow:0 0 25px rgba(255,0,0,0.8),0 5px 20px rgba(255,0,0,0.8),inset 0 1px #ff0000,inset 0 -1px #ff0000;
	color:yellow;
  }
  
  .button:hover.fire:before {
	box-shadow:inset 0 0 30px 0 #ff0000;
  }
  
  .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:29px;
	margin-left:5px;
	border:1px solid transparent;
	border-color:yellow;
	border-image-slice:1;
  }
  
  /* 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:yellow;
	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:yellow;
	border-image-slice:1;
	font-style:italic;
	color:#fff;
  }
  
  .code input[type=text] {
	float:left;
	width:50px;
	border:1px solid transparent;
	border-color:yellow;
	border-image-slice:1;
  }
  
  /* Style the button inside the input container */
  
	.header .login-container .sitelogin {
	float:left;
	width:80px;
	height:31px;
	font-family:'Bebas Neue',cursive;
	margin-left:5px;
	font-size:20px;
	cursor:pointer;
	color:#fff;
  }
  
  .header .login-container .sitelogin:hover {
	background-image:linear-gradient(to top,#d80007 100%,#ff0008 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:926px;
	height:45px;
	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 13px;
	transition:background .2s linear;
  }
  
  .demo {
	border-radius:0px;
  border: 10px solid;
  border-image-slice: 1;
  border-width: 2px;
  border-image-source: linear-gradient(to top, #756000, #ffd200, #ffe984);
background: rgb(55,55,55);
background: linear-gradient(0deg, rgba(55,55,55,1) 0%, rgba(0,0,0,1) 14%, rgba(0,0,0,1) 49%, rgba(56,56,56,1) 50%, rgba(0,0,0,1) 73%, rgba(0,0,0,1) 100%);  
}
  
  .demo li a {
	color:#ffd200;
  }
  
  .demo li a:hover {
	width:100%;
	color:#fff5c8;
background: rgb(255,209,0);
background: linear-gradient(0deg, rgba(255,209,0,1) 0%, rgba(0,0,0,0) 50%);
  }
  
  #informasi {
	top:185px;
	position:absolute;
	float:left;
background: rgb(187,144,0);
background: -moz-linear-gradient(0deg, rgba(187,144,0,1) 0%, rgba(255,209,0,1) 46%, rgba(255,231,0,1) 47%, rgba(255,243,147,1) 89%);
background: -webkit-linear-gradient(0deg, rgba(187,144,0,1) 0%, rgba(255,209,0,1) 46%, rgba(255,231,0,1) 47%, rgba(255,243,147,1) 89%);
background: linear-gradient(0deg, rgba(187,144,0,1) 0%, rgba(255,209,0,1) 46%, rgba(255,231,0,1) 47%, rgba(255,243,147,1) 89%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#bb9000",endColorstr="#fff393",GradientType=1);	width:930px;
	height:43px;
	border:1px solid #ffb400;
	border-radius:5px;
	margin-bottom:20px;
  }
  
  .textinformasi {
	float:left;
	color:#000;
	font-size:25px;
font-family:'Bebas Neue',cursive;
font-weight:bold;
letter-spacing:2px;
	width:0.2%;
	margin:-18px 10px;
  }
  
  .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 #ffc600;
  }
  
  .iframestyle {
	width:100%;
	height:276px;
	float:left;
	margin-left:0;
	margin-top:0;
  }
  
  .gamewraper {
	margin-top:-45px;
	margin-left:666px;

	float:right;
	width:264px;
	height:259px;
	font-family:'bebas neue',bold;
  }
  
  .games {
float:left;
	margin:0 auto;
	text-align:center;
	width:264px;
	height:62px;
	margin-bottom:7px;
	border:1px solid #ffc600;
  }
  

  
  .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:30px;
  }
  
  .media-body {
	vertical-align:middle;
	border-radius:5px;
  }
  
  .media {
	font-family:'Bebas Neue',cursive;
  }
  
  .media-body span {
	position:absolute;
	font-size:25px;
	margin-left:60px;
	color:#ffd200;
	padding-top:20px;
  }
  
  .media {
	float:left;
	width:220px;
	height:70px;
	margin-top:0;
	margin-left:7px;
	font-size:18px;
	
	border-radius:0px;
	  border: 10px solid;
  border-image-slice: 1;
  border-width: 2px;
  border-image-source: linear-gradient(to top, #756000, #ffd200, #ffe984);
background: rgb(55,55,55);
background: linear-gradient(0deg, rgba(55,55,55,1) 0%, rgba(0,0,0,1) 14%, rgba(0,0,0,1) 49%, rgba(56,56,56,1) 50%, rgba(0,0,0,1) 73%, rgba(0,0,0,1) 100%);  

  }
  
  .socialico {
	float:left;
	width:40px;
	height:40px;
	position:absolute;
	margin-top:15px;
	margin-left:10px;
  }
  
  img {
	max-width:100%;
	max-height:100%;
	display:block;
  }
  
  .middleinfo {
	float:right;
	margin-top:10px;
	width:930px;
	height:330px;
  }
  
  .boxtoto {
	font-family:'Bebas Neue',cursive;
	float:left;
	width:302px;
	height:295px;
	border:1px solid #ffd200;
	background:linear-gradient(-160deg,#1f1300,#1f1100,#5e3a00,#5e3a00);
	background-size:400% 400%;
	animation:gradient 15s ease infinite;
  }
  
 .boxstep{
	 float:right;
	 width:615px;
	 height:295px;
 } 
  
 .step{
	 float:left;
	 width:100%;
	 height:145px;
	 border:1px solid #ffc600;
 }
 .supportedbrowser{
	 float:left;
	 margin-top:10px;
	 width:100%;
	 height:140px;
	 border:1px solid #ffc600;
 }

.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%;
	}
  }
  
  .lastesttitle {
	float:left;
	width:100%;
	height:33px;
	text-align:center;
	vertical-align:middle;
	background: rgb(187,144,0);
	background: linear-gradient(0deg, rgba(187,144,0,1) 0%, rgba(255,209,0,1) 46%, rgba(255,231,0,1) 47%, rgba(255,243,147,1) 89%);
	color:#fff;
	font-size:25px;
	font-family:'Bebas Neue',cursive;
	font-style:bold;
	padding-top:5px;
	margin-bottom:3px;
	color:#261700;
  }
  
 .tototitle{
	 float:left;
	 width:80px;
	 height:40px;
 } 
 
  .countrytoto { 
	width:85px;
	padding-left:8px;
	text-align:left;
	font-size:18px;
	text-transform: uppercase;
  }
  
  .datetoto {
	text-align:left;
	font-size:18px;
  }
  
  #gaptoto {
	margin-left:0px;
	margin-top:2px; width:302px;
	border-bottom:1px solid #ffd200;
  }
  
  .imgtoto {
	width:9%;
	height:9%;
	padding-bottom:3px;
  }
  
  .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 {
	/* background:rgb(96,96,96);
	background:linear-gradient(0deg,rgba(96,96,96,1) 0%,rgba(0,0,0,0) 44%,rgba(41,41,41,0) 100%);
	*/
  
		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:-20px;
	margin-bottom:30px;
	width:930px;
	height:50px;
	border-radius:5px;
  }
  
  .textkeyword {
	float:left;
	margin-top:0;
	text-align:center;
	padding:0 10px 0 10px;
	font-family:arial;
  }
  
  #footerok {
	float:left;
	margin-top:0;
background: rgb(55,55,55);
background: linear-gradient(0deg, rgba(55,55,55,1) 0%, rgba(0,0,0,1) 14%, rgba(0,0,0,1) 49%, rgba(56,56,56,1) 50%, rgba(0,0,0,1) 73%, rgba(0,0,0,1) 100%);
	width:100%;
	height:43px;
	border:1px solid #ffcc00;
	border-radius:5px;
	margin-bottom:20px;
  }
  
  .textfooter {
	float:left;
	color:#ffcc00;
	font-size:15px;
	width:100%;
	margin:-2px 15px;
	text-align:center;
	font-family:'bebas neue',bold;
  }
  
  .imglogo {
	float:right;
	color:#fff;
	width:13%;
	margin:2px 10px;
	border-radius:7px;
  }
  
/*
 * Animated CSS button
 * Copyright Alexander Bodin 2019-09-07
 *
 * Useage: .class {@import button($button-size, $hue, $sat);}
 */
.animated-button2 {
	float:right;
	margin:auto;
	width:200px;
    background: linear-gradient(-30deg, #221500 50%, #473212 50%);
    padding: 8px 40px;
	font-family:'Bebas Neue',cursive;
  display: inline-block;
  -webkit-transform: translate(0%, 0%);
          transform: translate(0%, 0%);
  overflow: hidden;
  color: #ffd200;
  font-size: 26px;
  letter-spacing: 2.5px;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  -webkit-box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
          box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
}

.animated-button2::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  color:#fff;
  background-color: #ffd200;
  opacity: 0;
  -webkit-transition: .2s opacity ease-in-out;
  transition: .2s opacity ease-in-out;
}

.animated-button2:hover::before {
  opacity: 0.2;
}

.animated-button2 span {
  position: absolute;
}

.animated-button2 span:nth-child(1) {
  top: 0px;
  left: 0px;
  width: 100%;
  height: 3px;
  background: -webkit-gradient(linear, right top, left top, from(rgba(43, 26, 8, 0)), to(#ffd200));
  background: linear-gradient(to left, rgba(43, 26, 8, 0), #ffd200);
  -webkit-animation: 2s animateTop linear infinite;
          animation: 2s animateTop linear infinite;
}

@keyframes animateTop {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

.animated-button2 span:nth-child(2) {
  top: 0px;
  right: 0px;
  height: 100%;
  width: 3px;
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(43, 26, 8, 0)), to(#ffd200));
  background: linear-gradient(to top, rgba(43, 26, 8, 0), #ffd200);
  -webkit-animation: 2s animateRight linear -1s infinite;
          animation: 2s animateRight linear -1s infinite;
}

@keyframes animateRight {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}

.animated-button2 span:nth-child(3) {
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 3px;
  background: -webkit-gradient(linear, left top, right top, from(rgba(43, 26, 8, 0)), to(#ffd200));
  background: linear-gradient(to right, rgba(43, 26, 8, 0), #ffd200);
  -webkit-animation: 2s animateBottom linear infinite;
          animation: 2s animateBottom linear infinite;
}

@keyframes animateBottom {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

.animated-button2 span:nth-child(4) {
  top: 0px;
  left: 0px;
  height: 100%;
  width: 3px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(43, 26, 8, 0)), to(#ffd200));
  background: linear-gradient(to bottom, rgba(43, 26, 8, 0), #ffd200);
  -webkit-animation: 2s animateLeft linear -1s infinite;
          animation: 2s animateLeft linear -1s infinite;
}

@keyframes animateLeft {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

@keyframes glowing {
  0% { box-shadow: 0 0 -10px #fff000; }
  40% { box-shadow: 0 0 20px #fff000; }
  60% { box-shadow: 0 0 20px #fff000; }
  100% { box-shadow: 0 0 -10px #fff000; }
}

.button-glow {
  animation: glowing 3000ms infinite;
}
/*# sourceMappingURL=button.css.map */


.glow {
  text-decoration: none;
  position: relative;
  overflow: hidden;
}

.glow:hover {
  box-shadow: 1px 1px 25px 10px rgba(255, 222, 0, 0.6);
}

.glow:before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.7),
    transparent
  );
  transition: all 650ms;
}

.glow:hover:before {
  left: 100%;
}