@charset "utf-8";
/* CSS Document */

#wrapper {
	width: 100%;
	margin: 0 auto;
	
}
.linkalt{
position :fixed;
top:30%;
}
.linkalt ul{
list-style-type: none;
padding:0;
transform: translateX(-265px);
}
.linkalt ul li{
display: block;
margin-left: -5px;
background: #023162;
width: 310px;
text-align: right;
padding: 6px;
border-radius: 0 15px 15px 0;
transition: all 1s;
}
.linkalt ul li:hover{
transform: translatex(150px);
}
.linkalt ul li.twitter:hover{
background-color: #023162;
}
.linkalt ul li.facebook:hover{
background-color: #023162;
}
.linkalt ul li.googleplus:hover{
background-color: #023162;
}
.linkalt ul li a{
color: #FFFFFF;
text-decoration: none;
font-size: 16px;
font-family: acme;
}
.linkalt ul li i{
text-align: center;
margin-left: 15px;
color: #023162;
background-color: #03d3ff;
padding:10px;
border-radius:60%;
width: 20px;
height: 20px;
font-size: 20px;
transform: rotate(0deg);
}
.linkalt ul li:hover i {
transform:rotate(360deg);
transition: all 1s;
}

body {
	background: url(../../gambar/background.jpg) top repeat;
	background-size: cover;
	background-attachment: fixed;
}

@media only screen and (max-width:1024px){
	body{
		background: url(../../gambar/background.jpg) top repeat;
		background-size: cover;
		width: 100%;
		height: auto;
		}
}

#container{
	margin:0 auto;
	width:1024px;

}
#logo {
	width: auto;
	height: 45px;
	margin: 20px 0 0 59px; 
}
#login {
	margin: 0 0 0 469px;
}
.txtbox {
	border: 1px solid #01c3f7;
    border-radius: 4px;
    width: 143px;
    height: 30px;
    padding: 0 10px;
    font-size: 16px;
    color: #fff;
    background: rgb(12, 37, 56);
}
.btnlogin {
	width: 104px;
	font-family: Acme;
    height: 30px;
    background: #e9eef8;
    font-size: 15px;
    font-weight: bold;
    color: #143045;
    border-radius: 4px;
}
.btnlogin:hover {
	background: #002943;
	color: aliceblue;
}

.btn-daftar {
	width: 104px;
	font-family: Acme;
    height: 30px;
    background: #00B4F5;
    font-size: 15px;
    font-weight: bold;
    color: #143045;
    border: none;
    border-radius: 4px;
}
.btn-daftar:hover{
	background: #002943;
	color: aliceblue;
}

.btn-group{
	text-align: center;
	margin-top: 30px;
	margin-left: 59px;
}
.btn-group:link {
	text-decoration: none;
}
.btn-group .button {
  	background-color: #002839;
  	border: 1px solid #03d3ff;
  	color: white;
  	text-decoration: none;
  	font-size: 16px;
  	cursor: pointer;
	float: left;
  	font-family: Acme;
	width: 160px;
	height: 40px;
}

.btn-group .button:not(:last-child) {
  	border-right: none; /* Prevent double borders */
}

.btn-group .button:hover {
  	background-color: #03d3ff;
}

.contact {
	background: url(../../gambar/contact.png) top no-repeat;
	width: 318px;
	height: 245px;
	margin: -319px 701px;
}

.pesan {
	background: url(../../gambar/pesan.png) top no-repeat;
	width: 960px;
	height: 35px;
	margin: 322px 59px;
}
marquee {
	color: white;
	font-family: Acme;
	width: 830px;
	margin: 8px 127px;
}

.step {
	background: url(../../gambar/step.jpg) top no-repeat;
	width: 960px;
	height: 70px;
	margin: -319px 59px;
}

.contact1 {
	position: relative;
	width: 100%;
	text-align: center;
	margin: 38px 0 0 -45px;

}
.contact2 {
	position: relative;
	width: 100%;
	float: left;
	text-align: center;
	margin: 15px -45px;
}
.contact3 {
	position: relative;
	width: 100%;
	float: left;
	text-align: center;
	margin: -4px -45px;
}
.btn {
	display: inline-block;
	margin: 15px 58px;
	width: 40px;
	height: 40px;
	background: #03d3ff;
	border-radius: 30%;
	border: solid 0px #FFFFFF;
	color: #00296A;
	overflow: hidden;
	position: relative;
}
.btn i {
	line-height: 40px;
	font-size: 25px;
	transition: 0.2s linear;
}
.btn:hover i {
	transform: scale(1.3);
	color: #00D6F9;
}
.btn::before {
	content: "";
	position: absolute;
	width: 120%;
	height: 120%;
	background: #023162;
	transform: rotate(45deg);
	left: -110%;
	top: 90%;
}
.btn:hover::before {
	animation: aaa 0.7s 1;
	top: -10%;
	left:  -10%;
}
@keyframes aaa {
	0% {
	left: -110%;
	top: 90%;
	}
	50% {
	left: 10%;
	top: -30%;
	}
	100% {
	left: -10%;
	top:-10%;
	}
}

#win {
	background: url(../../gambar/jackpot.jpg) top no-repeat;
	width: 960px;
	height: 250px;
	margin: 322px 59px;
}

.lastdepo {
	margin: -528px 0 0 70px;
	position: relative;
	overflow: hidden;
	float: left;
	font-family: Acme;
	color: white;
	line-height: 10px;
}
.lastdepo table td p{
	color: #fff;
	font-size: 15px;
	margin: 10px 0 0 0;
}
.lastdepo td.td2 p{
	margin: -10px 0 0 0;
}
.lastdepo table td.td1{
	padding: 0 0 20px 40px;
	background: url(../../gambar/coin.png) no-repeat;
}
.jackpot {
	overflow:hidden;
	width:500px;
	height:450px;
	background-repeat:no-repeat;
	float:left;
	margin: -515px 0 0 415px;
	z-index: 0;
	position: relative;
	font-family: Acme;
	color: white;
	font-size: 50px;
}
.lastwd {
	margin: -528px 0 0 715px;
	position: relative;
	overflow: hidden;
	float: left;
	font-family: Acme;
	color: white;
	line-height: 10px;
}
.lastwd table td.td1{
	padding: 0 0 20px 40px;
	background: url(../../gambar/coin.png) no-repeat;
}
.lastwd table td p{
	color: #fff;
	font-size: 15px;
	margin: 10px 0 0 0;
}
.lastwd td.td2 p{
	margin: -10px 0 0 0;
}

#slidegame{
	position: relative;
	margin: -430px 0 0 377px;
	overflow: hidden;
	float: left;
}
.artikel {
	position: absolute;
	width: 970px;
	margin: -345px 0 0 58px;
	text-align: center;
	color: #090808;
	font-size: 16px;
	font-family: Acme;
	color: white;
}
.footer{
	margin: 320px 0 0 59px;
}
.blink-me{
animation-name: blinker;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}

@keyframes blinker{
0%{ opacity: 1.0}
50%{opacity: 0.0}
100%{opacity: :1.0}
}

.copy {
	text-align: center;
	color: #FDF8F8;
	position: relative;
	font-family: acme;
}