﻿@charset "utf-8"; *{margin:0;padding:0}

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,
pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,
samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset
,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td
{margin:0;padding:0;border:0;outline:0;background:none repeat scroll 0% 0% transparent;text-align:left}
html{background-color:#8CF7DA;}
body{font-size:14px;font-family:Rubik,sans-serif}
a{text-decoration:none;color:#00ff15;font-weight:700;-webkit-transition:opacity .2s;-moz-transition:opacity .2s;-o-transition:opacity .2s;transition:opacity .2s}
a img{border:none}.hover:hover{opacity:.5}
ul{list-style-type:none}
p{text-align:justify}
img {
	max-width:100%;
	max-height:100%;
	display:block;
}
::placeholder {
  color: black;
  opacity: 0.5; /* Firefox */
}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{display:inline-block}
* html .clearfix{height:1%}
.clearfix{display:block;height:inherit}
.clear{clear:both;height:0}
.container{
	width:1024px;
	height:auto;
	margin:0 auto;
	position:relative;
}
#header {
	display: flex;
	justify-content: space-between;
}
#sectionLogo {
	max-width: 40%;
}
#login {
	position: relative;
	min-width: 30%;
}
#daftar {
	max-width: 20%;
}
#daftar img, #promo img {
	cursor: pointer;
}
#promo {
	height: 50px;
	display: flex;
	justify-content: center;
}
.login{
	 width:310px;
	 text-align: right;
}
.login input{
	 border:none;
	 font-size:12px;
	 color:#000;
	 background:#fff;
	 }
.login input.username{
	background-image: url("../img/username.png");
  width: 107px;
  height: 33px;
  padding: 0px 5px 0px 33px;
  border: 1px solid #000;
  font-weight: bold;
  margin-bottom: 3px;
  background-size: contain;
  background-position-x: -10px;
  background-repeat: no-repeat;
}
.login input.password{
	 background-image: url("../img/password.png");
  width: 107px;
  height: 33px;
  padding: 0px 5px 0px 33px;
  border: 1px solid #000;
  font-weight: bold;
  margin-bottom: 3px;
  background-size: contain;
  background-repeat: no-repeat;
}
.login input.code{
	vertical-align: top;
	 width:66px;
	 height:30px;
	 padding:0 5px;
	 border:1px solid #3A80BD;
}
.login input {
	font-weight:bold;
}
.login .kode{
	display: inline-block;
	 height:28px;
	 vertical-align: top;
	 line-height: 1.3;
	 font-size: 24px;
	border: 2px solid;
	padding: 0px 4px;
	background-color: #EBEBEB;
}
.login input[type=button],
.login input[type=button]{
	 padding:0;
	 border:none;
	 cursor:pointer;
}
.login input.btn-login{
	background: url("../img/login.png") no-repeat;
	background-position: center;
	background-size: 152px 39px;
	 padding-top: -10px;
	 cursor: pointer;
	 visibility: visible;
	 top:0;
	 width: 145px;
  height: 33px;
	 letter-spacing: 2px;
	 margin-left:2px;
	 font-size:24px;
	 cursor:pointer;
  	 color:#ffffff;
}
nav {
	margin:0px auto;
	max-width:1023px;
	width:1023px;
	font-family:'Bebas Neue',cursive;
}
.menu { 
	padding:0px;
	margin:0;
	max-width:1024px;
	height:43px;
	border-radius:0;
	display:flex;
	flex-direction:row;
	justify-content:space-around;
	align-items:center;
	list-style-type:none;
}
.menubg {
	background: #FEE946;
	width: 97px;
	height: 41px;
	margin-right: 2px;
	display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  font-size: 14px;
  font-family: emoji;
}
.menubg img {
  margin-right: 3px;
}
.menubg span:hover {
	opacity:.5;
}
.menu a {
	text-decoration:none;
}
li{padding-right:3px;}

#informasi {
	  margin-top:5px;
	display: flex;
	width:1022px;
	height:38px;
}
.textmarquee {
	color:#fff;
	font:normal 18px arial,sans-serif;
	width:90%;
	margin: 0 0 0 5px;
	background: #000;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#242424",endColorstr="#181818",GradientType=1);
	padding-top:8px;
}
  
#sliderarea {
	margin-top:5px;
	width: 725px;
	height: 280px;
}
.border-slider {
	width: 100%;
}
#mid-content {
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
}

div#togel {
  background: url("../img/togel.png") no-repeat;
  width: 295px;
  height: 285px;
}
div#togel div {
position: relative;
    left: 13px;
    top: 35px;
}
div#togel img {
	display: inline-block;
	width: 25px;
	margin-left: -8px;
}

  .contact, .games {
	padding:0 0;
	display: flex;
	margin:5px 0px;
	width:1024px; 
	gap: 5px;
}
	.contact div, .games div {
		flex-grow: 1;
	}
  .contact img, .games img {
	  width: 100%;
  }
#sectionFooter p{
	text-align:center;
	color:#000;
	font-size:16pt;
	line-height:26px;
	padding-top:7px;
	text-align:center;
}

 @keyframes glowing {
  0% { box-shadow: 0 0 -10px #fffc00; }
  40% { box-shadow: 0 0 20px #fffc00; }
  60% { box-shadow: 0 0 20px #fffc00; }
  100% { box-shadow: 0 0 -10px #fffc00; }
}

.button-glow {
  animation: glowing 3000ms infinite;
}

.glow {
  text-decoration: none;
  position: relative;
  overflow: hidden;
}

.glow:hover {
  box-shadow: 1px 1px 25px 5px rgba(0, 0, 0, 0.7);
}

.glow:before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.9),
    transparent
  );
  transition: all 650ms;
}

.glow:hover:before {
  left: 100%;
}

.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%;
	}
  }
  