.lottery{
  padding-bottom:10px;
  min-height: 600px;
  background-image: url('../Images/4d/bg.jpg');
  background-size: cover;
  background-position: center;
}

.lottery_content{
  padding-top:50px;
  position:relative;
  min-height: 500px;
  display:flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  background: rgba(0,0,0,0.3);
}

.lottery_header{
  display:flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 20px;
}

.lottery_logo{
  height:180px;
  margin:0 20px;
}

.lottery_btn{
background: linear-gradient(-45deg, var(--gold2),var(--gold1),var(--gold3),var(--gold1),var(--gold2));
padding:2px;
text-decoration: none;
display:flex;
border-radius: 3px;
margin:0 20px;
}

.lottery_btn_text{
  background: var(--color1);
  padding:10px;
  border-radius: 3px;
  width:180px;
  text-align: center;
}

.lottery_btn_text span{
  background: linear-gradient(-45deg, var(--gold2),var(--gold1),var(--gold3),var(--gold1),var(--gold2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 20px;
  font-weight: bold;
}

.lottery_btn:hover .lottery_btn_text{
  background: none;
}

.lottery_btn:hover .lottery_btn_text span{
  background:var(--color1);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}



.lottery_container{
 display: flex;
 flex-wrap: wrap;
 font-size: 18px;
 font-weight:bold;
 width:100%;
 margin: 0 auto;
 padding:10px;
}

.lottery_item {
  flex: 1 0 21%;
  margin: 5px;
  height:auto;
}

.lottery_item .tableTop{
  border-collapse: collapse;
}

.lottery_item .tableTop th,.lottery>.tableTop td{
  border:none;
  text-align: left;
  padding-left: 20px;
}

.pmp th ,.sabah th {
  color:white;
}


.lottery_item>table{
  width: 100%;
  text-align: center;
  border-collapse: separate;
}

.magnum table tr:nth-child(1){
  background-color:var(--magnum_color);
}

.pmp table tr:nth-child(1){
  background-color:var(--pmp_color);
}

.sabah table tr:nth-child(1){
  background-color:var(--sabah_color);
}

.sandakan table tr:nth-child(1){
  background-color:var(--sandakan_color);
}

.sarawak table tr:nth-child(1){
  background-color:var(--sarawak_color);
}

.singapore table tr:nth-child(1){
  background-color:var(--singapore_color);
}

.toto table tr:nth-child(1){
  background-color:var(--toto_color);
}

.magnum .tableMid th, .magnum .tableMid td, .magnum .tableBottom th, .magnum .tableBottom td {
  border:2px solid var(--magnum_color);
}

.pmp .tableMid th, .pmp .tableMid td, .pmp .tableBottom th, .pmp .tableBottom td {
  border:2px solid var(--pmp_color);
}

.sabah .tableMid th, .sabah .tableMid td, .sabah .tableBottom th, .sabah .tableBottom td {
  border:2px solid var(--sabah_color);
}

.sandakan .tableMid th, .sandakan .tableMid td, .sandakan .tableBottom th, .sandakan .tableBottom td {
  border:2px solid var(--sandakan_color);
}

.sarawak .tableMid th, .sarawak .tableMid td, .sarawak .tableBottom th, .sarawak .tableBottom td {
  border:2px solid var(--sarawak_color);
}

.singapore .tableMid th, .singapore .tableMid td, .singapore .tableBottom th, .singapore .tableBottom td {
  border:2px solid var(--singapore_color);
}

.toto .tableMid th, .toto .tableMid td, .toto .tableBottom th, .toto .tableBottom td {
  border:2px solid var(--toto_color);
}


.lottery_item td{
  background:rgba(0,0,0,0.5);
  color:white;
}


.lottery_date{
  font-size:10px;
}


/*--------------------Paayout popup-------------------------*/

.payout_popup{
  position:fixed;
  width:100%;
  height:100%;
  background: rgba(0,0,0,0.6);
  left:0;
  top:0;
  z-index: 999;
  display:none;
}

.payout_window{
  display:flex;
  flex-direction: column;
  margin:auto;
  margin-top: 100px;
  width:800px;
  background: linear-gradient(-45deg, var(--gold2),var(--gold1),var(--gold3),var(--gold1),var(--gold2));
  border-radius: 5px;
  height:75%;
}

.payout_header{
  font-weight: bold;
  font-size: 15px;
  padding:10px;
  display:flex;
  align-items: center;
  background: linear-gradient(45deg,var(--color1),black);
}

.payout_header span{
  background: linear-gradient(-45deg, var(--gold2),var(--gold1),var(--gold3),var(--gold1),var(--gold2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.payout_logo{
  width:25px;
  margin-right: 5px;
}

.payout_close{
  margin-left: auto;
  background: linear-gradient(-45deg, var(--gold2),var(--gold1),var(--gold3),var(--gold1),var(--gold2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  cursor:pointer;
}

.payout_close:hover{
  -moz-transform:scale(1.5);
  -webkit-transform:scale(1.5);
  transform:scale(1.5);
}

.payout_content{
  padding:0 20px;
  display:flex;
  flex-direction: column;
    overflow-y: auto;
}

.payout_content h2{
  font-size: 20px;
  margin:0;
  margin: 10px 0;
}

.payout_content p{
  font-size: 13px;
  margin:0;
  margin-bottom: 10px;
}

.payout_content table{
  width:100%;
  border-collapse: collapse;
  border:solid 2px var(--color1);
  box-shadow: 1px 1px 3px grey;
  margin-bottom: 20px;
}

.payout_content table th{
    background: linear-gradient(45deg,var(--color1),black);
    color:var(--color3);
    font-size: 14px;
}

.payout_content table td{
  text-align: center;
  font-size: 13px;
  padding:3px 0;
}

.payout_content table tr{
    background:rgb(220,220,220);
}

.payout_content table tr:nth-child(even){
    background:rgb(200,200,200);
}

.lottery_item:nth-child(5) {
    margin-left: 117px;
}
.lottery_item:nth-child(7) {
    margin-right: 117px;
}