html {
	padding:0;
	margin:0;
	height:auto;
	background:linear-gradient(180deg,#2c032e,#550651fa, #4e033b);
	background-size:270% 270%;	
	display:flex;
	flex-direction:column;
iframestyle
 
  }
  
  @keyframes gradient {
	0% {
	  background-position:0% 50%;
	}
	50% {
	  background-position:100% 50%;
	}
	100% {
	  background-position:0% 50%;
	}
  }
  
  a {
	text-decoration:none;
	color:#ff09ff
;
	-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;
  }

  #sectionWrapper {
	width:100%;
	height:auto;
	position:relative;
	margin:0 auto;
	background-size:100% 100%;
  }
  
  #sectionWrapper #sectionHeader {
	width:100%;
	height:100px;
	position:relative;
  }
  
  #sectionWrapper #sectionHeader.header {
	height:170px;
  }
  
  #sectionWrapper #sectionHeader #sectionLogo {
	height:100px;
	width:216px;
	left:0;
	top:10px;
	position:absolute;
  }
  
  #sectionWrapper #sectionHeader .login {
	width:390px;
	height:49px;
	position:absolute;
	right:0;
	top:42px;
  }
  
  #sectionWrapper #sectionHeader .login input {
	border:none;
	position:absolute;
	font-size:12px;
	color:#000;
	background:#ffe600
;
  }
  
  #sectionWrapper #sectionHeader .login input.username {
	left:60px;
	top:0;
	width:112px;
	height:20px;
	padding:0 5px;
	border:1px solid #b12daa;
	font-style:italic;
  }
  
  #sectionWrapper #sectionHeader .login input.password {
	top:27px;
	left:60px;
	width:112px;
	height:20px;
	padding:0 5px;
	border:1px solid #b12daa;
	font-style:italic;
  }
  
  #sectionWrapper #sectionHeader .login input.code {
	left:189px;
	top:0;
	width:56px;
	height:20px;
	padding:0 5px;
	border:1px solid #b12daa;
	font-style:italic;
  }
  
  #sectionWrapper #sectionHeader .login img.kode {
	position:absolute;
	left:189px;
	top:27px;
	border:1px solid #b12daa;
  }
  
  #sectionWrapper #sectionHeader .login input[type=button],
  #sectionWrapper #sectionHeader .login input[type=button] {
	padding:0;
	border:none;
	cursor:pointer;
	position:absolute;
	top:0;
  }
  
  #sectionWrapper #sectionHeader .login input.btn-login {
	padding-top:-10px;
	border:1px solid;
	border-image-source:linear-gradient(0deg,rgba(173,0,0,1) 0%,rgba(255,0,0,1) 100%);
	border-image-slice:1;
	cursor:pointer;
	visibility:visible;
	background:rgb(255,128,0);
	background:Animated CSS button;
	right:0;
	top:0;
	width:127px;
	height:49px;
	font-family: 'Bebas Neue';
	letter-spacing:2px;
	margin-left:5px;
	font-size:24px;
	cursor:pointer;
	color:#ffe600
;
  }
  
  #sectionWrapper #sectionHeader .login input.btn-register {
	padding-top:-10px;
	border:1px solid;
	border-image-source:linear-gradient(0deg,rgba(173,0,0,1) 0%,rgba(255,0,0,1) 100%);
	border-image-slice:1;
	cursor:pointer;
	visibility:visible;
	background:rgb(255,128,0);
	background:Animated CSS button;
	left:-75px;
	top:0;
	width:127px;
	height:49px;
	font-family: 'Bebas Neue';
	letter-spacing:2px;
	margin-left:5px;
	font-size:24px;
	cursor:pointer;
	color:#ffe600
;
  }
  
  #sectionWrapper #sectionHeader .login .fogotpass {
	position:absolute;
	color:#ffe600
;
	font-size:12px;
	font-style:italic;
	position:absolute;
	right:168px;
	top:100px;
	font-weight:700;
  }
  
  .header {
	width:930px;
	height:auto;
  }
  
  .logo {
	float:left;
	width:370px;
	height:110px;
	margin: left 0.1em;px;
	margin-top:10px;
  }

  /* Style the button inside the input container */
  
	.header .login-container .sitelogin {
	float:left;
	width:80px;
	height:31px;
	font-family:'Bebas Neue';
	margin-left:5px;
	font-size:20px;
	cursor:pointer;
	color:#ffe600
;
  }
  
  #sectionWrapper #sectionHeader .login {
	width:390px;
	height:49px;
	margin-top:15px;
	position:absolute;
	right:0;
	top:42px;
  }
  
  #sectionWrapper #sectionHeader .login input {
	border:none;
	position:absolute;
	font-size:12px;
	color:#000;
	background:#fff
;
  }
  
  #sectionWrapper #sectionHeader .login input.username {
	left:60px;
	top:0;
	width:112px;
	height:20px;
	padding:0 5px;
	border:1px solid #b12daa;
	font-style:italic;
  }
  
  #sectionWrapper #sectionHeader .login input.password {
	top:27px;
	left:60px;
	width:112px;
	height:20px;
	padding:0 5px;
	border:1px solid #b12daa;
	font-style:italic;
  }
  
  #sectionWrapper #sectionHeader .login input.code {
	left:189px;
	top:0;
	width:56px;
	height:20px;
	padding:0 5px;
	border:1px solid #b12daa;
	font-style:italic;
  }
  
  #sectionWrapper #sectionHeader .login img.kode {
	position:absolute;
	left:189px;
	top:27px;
	border:1px solid #b12daa;
  }
  
  #sectionWrapper #sectionHeader .login input[type=button],
  #sectionWrapper #sectionHeader .login input[type=button] {
	padding:0;
	border:none;
	cursor:pointer;
	position:absolute;
	top:0;
  }
  
  #sectionWrapper #sectionHeader .login input.btn-login {
	padding-top:-10px;
	border:1px solid;
	border-image-slice:1;
	cursor:pointer;
	visibility:visible;
	background:rgba(255, 128, 0, 0);
	background:linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
	border-color: #b12daa;
	right:0;
	top:0;
	width:127px;
	height:49px;
	font-family: 'Bebas Neue';
	letter-spacing:2px;
	margin-left:5px;
	font-size:26px;
	cursor:pointer;
	color: #ffffff;
}
  
  #sectionWrapper #sectionHeader .login input.btn-register {
	padding-top:-10px;
	border:1px solid;
	border-image-slice:1;
	cursor:pointer;
	visibility:visible;
	background:rgb(255, 230, 0);
	background:linear-gradient(0deg, rgba(110, 97, 21, 0.89) 0%, #ffd000 45%, rgb(250, 213, 7) 52%, rgb(245, 211, 18) 66%, rgba(209, 177, 33, 0.966) 90%);
	border-color: #ffd000;
	left:-75px;
	top:0;
	width:127px;
	height:49px;
	font-family: 'Bebas Neue';
	font: bold;
	letter-spacing:2px;
	margin-left:5px;
	font-size:26px;
	cursor:pointer;
	color:#000000;
  }
  
  #sectionWrapper #sectionHeader .login .fogotpass {
	position:absolute;
	color:#ffe600
;
	font-size:12px;
	font-style:italic;
	position:absolute;
	right:168px;
	top:100px;
	font-weight:700;
  }
  
  nav {
	max-width:930px;
	width:930px;
	font-family: 'Bebas Neue';
	
  }
  
  #checkbox1,
  .toggle {
	display:none;
  }
  
  .menu {
	padding:0px;
	margin: 0px;
	max width : 930px;
	height: 65px;
	border-radius:0;
	display:flex;
	flex-direction:row;
	justify-content: space-around;
	align-items: end;
	list-style-type:none;
  }

  .menu li a {
	text-decoration: none;
    border-radius: 0;
    font-size: 18px;
    transition: background .2s linear;
  }
  
  .demo {
	border-radius: 0px;
	border: 10px solid;
	border-color: #b12daa;
	border-width: 1px;
	
  }
  
  .demo li a {
	color:#ffffff;
  }
  
  .demo li a:hover {
	width:100%;
	color:rgb(195, 0, 255) 0%, rgb(255, 255, 255) ;
	background:rgb(187, 255, 0);
	background:linear-gradient(0deg,rgb(255, 255, 255)20%,rgba(0,0,0,0) 44%);
  }
  
  #informasi {
	top:185px;
	position:absolute;
	float:left;
	background: rgb(156, 0, 187);
	background: -moz-linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
	background: -webkit-linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
	background: linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#bb9000",endColorstr="#fff393",GradientType=1);	width:930px;
	height:40px;
	border:1px solid #b12daa;
	border-radius:6px;
	margin-top: 9px;
  }
  
  .textinformasi {
	float: left;
    color: #ffffff;
    font-size: 23px;
	font-style:bold;
    font-family: 'Bebas Neue',cursive;
    letter-spacing: 2px;
    width: 0.2%;
    margin: -19px 15px;
  }
  
  .textmarquee {
	float:right;
	color:#ffee00;
	font-family: 'Bebas Neue',cursive;
	width:92%;
	height:26px;
	margin:5px 5px;
	: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:3px;
	border-radius:7px;
  }
  
  #sliderarea {
	position:absolute;
	top: 245px;
	float:left;
	width:656px;
	height:272px;
	margin-top:0px;
	border:1px solid #b12daa;
  }
  
  .iframestyle {
	width:100%;
	height:272px;
	float:left;
	margin-left:0;
	margin-top:0;
  }
 

  .gamewraper {
	top: 245px;
	margin-top:0px;
	margin-left:666px;
	position:absolute;
	float:right;
	width:264px;
	height: 273px
	font-family:'bebas neue',bold;
  }
  
  .games {
	position:relative;
	margin:0 auto;
	text-align:center;
	width:264px;
	height: 276px;
	margin-bottom: 7px;
  }
  
  /* 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:30px;
	font-weight:bold;
	background-image:linear-gradient(
		to top,#ffffff 10%,#ffffff 0,#828282 12%,#ffffff 45%,#828282 50%,#949494 20%,#ffffff 78%,#ffffff 100%
		);
	color:transparent;
	-webkit-background-clip:text;
	letter-spacing:0;
	-webkit-text-stroke:0.7px #260000;
  }
  
  .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:rgb(255, 255, 255);
	-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';
	font-display: swap;
	src:url('BebasNeue-Regular.woff2') format('woff2'),
        url('BebasNeue-Regular.woff') format('woff'),
        url('BebasNeue-Regular.ttf') format('truetype');;
  }
  
  .media-body span {
	position:absolute;
	vertical-align: middle;
	font-size:20px;
	margin-left:60px;
	color:#ffffff
;
	padding-top:15px;
  }
  
  .media {
	float: left;
    width: 220px;
    height: 55px;
    margin-top: 105px;
    margin-left:8.5px;
	vertical-align: middle;
    font-family: 'Bebas Neue';
	border-radius: px;
    border:1.5px solid #b12daa;
    background: linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
}
  
  .socialico {
	float:left;
	width:40px;
	height:40px;
	position:absolute;
	margin-top:7px;
	margin-left:10px;
  }
  .button-glow {
	animation: glowing 3000ms infinite;
	box-shadow: 1px 1px 15px 0.5px #f7cb0a;

	}
	.glow {
		text-decoration:none;
		position:relative;
		overflow:hidden;
	  }
	  
	  .glow:hover {
		box-shadow:2px 2px 25px 2px rgb(255, 255, 255);
	  }
	  
	  .glow:before {
		content:"";
		position:absolute;
		top:0;
		left:-100%;
		width:100%;
		height:100%;
		background:linear-gradient(
		  120deg,transparent,rgba(255, 217, 0, 0.9),transparent
		);
		transition:all 650ms;
	  }
	
  img {
	max-width:100%;
	max-height:100%;
	display:block;
  }
  
  .middleinfo {
	float:left;
	margin-top:10px;
	width:930px;
	height:330px;
  }

.boxtoto {
	
  font-family: 'Bebas Neue';
  font-display: swap;
  float:left;
  width:304px;
  height:.300px;
  border:1px solid #b12daa;;
  background:linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
  background-size:400% 400%;
  animation:gradient 15s ease infinite;
}
.boxtoto {
	font-family:'Bebas Neue',cursive;
	float:left;
	width:304px;
	height:304px;
	border:1px solid #b12daa;;
	background:linear-gradient(180deg,#430246,#6b0666fa, #720457);
	background-size:400% 400%;
	animation:gradient 15s ease infinite;
}
.boxstep{
   float:right;
   width:615px;
   height:295px;
} 

.step{
	
   float:right;
   width:613px;
   height: 144px;
   margin-top:5px;
   border:1px solid #b12daa;;
}
.supportedbrowser{
   float:right;
   margin-top:10px;
   width:613px;
   height:143px;
   border:1px solid #b12daa;;
}
  
  .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 #b12daa;
	background:rgb(33,0,0);
	background:linear-gradient(0deg,rgba(33,0,0,1) 0%,rgba(13,0,0,1) 100%);
	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 #6c0000;
}

  .boxslotgames {
    float: center;
    margin-top: 15px;
    width: 930px;
    height: auto;
    border: 1px solid #b12daa;
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
}
  
  .lastesttitle {
	float:left;
	width:100%;
	height:px;
	text-align:center;
	vertical-align:middle;
	background:linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
	color:#ffffff
;
	font-size:23px;
	padding-top:9px;
	margin-bottom:-1px;
	font-family: 'Bebas Neue';
	font-display: swap;
}
  
.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 #f8f7f8;
 }
 
 .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:#ffd000
;
 }
  
  .sectionfooter {
	float:left;
	margin-top:10px;
	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;
	/*top:10px;
	*/
  
	background:rgb(32,0,0);
	background:-moz-linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
	background:-webkit-linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
	background:linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#200000",endColorstr="#200000",GradientType=1);
	width:100%;
	height:43px;
	font-weight: bold;
	border:1px solid #b12daa;
	border-radius:10px;
	margin-bottom:20px;
  }
  
  .textfooter {
	float:left;
	color:#ffe600
;
	font-size:12px;
	width:70%;
	margin:3px 15px;
	text-align:left;
  }
  
  .imglogo {
	float:right;
	color:#ffe600
;
	width:13%;
	margin:2px 10px;
	border-radius:7px;
  }
  .loginfrom {
	float:right;
	width:530px;
	height:auto;

  }
  
  /* PROMO BUTTON STYLE */
  
	.promobutton {
	float: right;
	right:20px;
	width: 100px;
	height:40px;
	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';
	font-size:35px;
	font-weight:300;
	padding-top:px;
	text-shadow:0 0 20px #ffe600
;
	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:#b12daa;
  }
  
  .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:#b12daa;
	background:#b12daa;
	background:linear-gradient(0deg,rgb(132, 0, 255) 0%,rgba(255,0,0,0) 100%);
	box-shadow:0 0 15px rgb(140, 0, 255),0 5px 20px rgb(140, 0, 255),inset 0 1px #b12daa,inset 0 -1px #b12daa;
	color:#ffe600
;
  }
  
  .button.fire:before {
	box-shadow:inset 0 0 20px 0 #b12daa;
  }
  
  .button:hover.fire {
	box-shadow:0 0 25px rgba(132, 0, 255, 0.8),0 5px 20px rgba(162, 0, 255, 0.8),inset 0 1px #b12daa,inset 0 -1px #b12daa;
	color:yellow;
  }
  
  .button:hover.fire:before {
	box-shadow:inset 0 0 30px 0 #b12daa;
  }
  
  .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);
	}
  }
  

  
/*
 * Animated CSS button
 * Copyright Alexander Bodin 2019-09-07
 *
 * Useage: .class {@import button($button-size, $hue, $sat);}
 */
.animated-button2 {
	float:right;
	margin:auto;
	width:100px;
	background:linear-gradient(0deg, #5e0159 0%, #d836d8d5 50%, rgba(215, 52, 221, 0.877) 55%, rgba(234, 54, 240, 0.767) 66%, rgba(180, 25, 180, 0.856) 90%);
    padding: 0.1px 10px;
	font-family: 'Bebas Neue';
  display: inline-block;
  -webkit-transform: translate(0%, 0%);
          transform: translate(0%, 0%);
  overflow: hidden;
  color: #ffffff;
  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:#b12daa
;
  background-color: #ffffff;
  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(#ffffff));
  background: linear-gradient(to left, rgba(43, 26, 8, 0), #ffffff);
  -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(#ffffff));
  background: linear-gradient(to top, rgba(43, 26, 8, 0), #fffb00);
  -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(#b12daa));
  background: linear-gradient(to right, rgba(43, 26, 8, 0), #b12daa);
  -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(#b12daa));
  background: linear-gradient(to bottom, rgba(43, 26, 8, 0), #b12daa);
  -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%);
  }
}

.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, 255, 255, 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%;
}