body#background {
	  background: url('../images/bg01.jpg') #000 no-repeat !important;
	  background-color: #000;
	  background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  -webkit-background-size: cover;
	  z-index: -998;
	  overflow: hidden;
	}
html,body{
		max-width: 100%;
/*    	overflow-x: hidden;*/
        overflow:hidden;
    	scroll-behavior: smooth;
	}
@font-face {
  font-family: konsenBold;
  src: url(../fonts/KonsensBold.otf);
}

@font-face {
  font-family: konsenBook;
  src: url(../fonts/KonsensBook.otf);
}
@font-face {
  font-family: konsensExtrabold;
  src: url(../fonts/KonsensExtrabold.otf);
}
@font-face {
  font-family:varieraDemo;
  src: url(../fonts/VarieraDemo-Regular.ttf);
}

.bg_design {
    background: url(../img/group2.png);
    background-size: 100% 100%;
    padding: 30px 0;
    background-repeat: no-repeat;
}
.bg_design2 {
    background: url(../img/group3.png);
    background-size: 100% 100%;
    padding: 30px 0;
    background-repeat: no-repeat;
}

.vipafter-content2 td{
    font-size: 12px;
    font-family: Cambria;
    color:white;
}
.vipafter-content2 i{
    font-size: 12px;
    color: white;
}
.vipafter-content2 h1,
.vipafter-content2 h2,
.vipafter-content2 h3,
.vipafter-content2 h4,
.vipafter-content2 h5,
.vipafter-content2 h6 {
  letter-spacing: 1px;
    color: white;
    font-family: Cambria;
    font-weight: bold!important;
}

.vipafter-content2bdt h1,
.vipafter-content2bdt h2,
.vipafter-content2bdt h3,
.vipafter-content2bdt h4,
.vipafter-content2bdt h5,
.vipafter-content2bdt h6{
    letter-spacing: 0px!important;
}

.vipbg h1 , .vipafterbg h1{
    color: white;
    font-family: konsenBold;
    letter-spacing: 5px;
    margin-top: 5%;
}
.vipbg .joinus {
    padding: 20px;
}
.vipbg .joinus a {
    font-family: konsenBold;
    color: black;
    font-size: 18px;
    background: #FFB80A;
    padding: 2% 10%;
    border-radius: 10px;
}
.vipbg .joinus a:focus {
    color: black;
    text-decoration: none;
}
.vipafterbg2 .joinus a:hover {
    color: black;
    text-decoration: none;
}
.vipbg h2 , .vipafterbg h2{
    color: white;
    font-size: 26px;
    margin-top: 5px;
    font-family: konsenBold;
    letter-spacing: 5px;
}

.vipbg h3, vipafterbg h3{
    color: white;
    font-size: 24px;
    font-family: varieraDemo;
    letter-spacing: 5px;
}

.vipbg2 h5{
    color: white;
    font-size: 24px;
    font-family: KonsenBold;
    letter-spacing: 5px;
    margin-bottom: 0;
}

.vipafterbg p{
    font-size: 12px;
    font-family: konsenBook;
}

.vipafter-content2 p {
    font-family: konsenBook;
    color: white;
    font-size: 12px;
}

	.vipbg_bg{
		width: 100%;
		min-height:20vh ;
		 background: url(../img/bg_tnc.jpg)top center;
		 background-size: 100% 100%;
        background-repeat: no-repeat;
		 z-index: 999;
        
	}


.vip-content2 {
    padding: 30px 30px;
    padding-bottom: 150px;
}
	

.img_b4login2 {
    width: 100%;
    margin-top: 40px;
}

.vipbg2 p{
    color: white;
    text-align: center;
    margin: 10px 0px;
    font-size: 14px;
    font-family: konsenBook;
}

.vipafterbg_bg{
		width: 100%;
		min-height:100vh ;
    padding-bottom: 100px;
		 background: url(../img/VIP_b4login1.jpg)top center;
		 background-size: 100% 100%!important;
        background-repeat: no-repeat;
		 z-index: 999;
        
	}

.vipafterbg2 h4 {
    color: white;
    letter-spacing: 1px;
    font-size: 18px;
    font-family: KonsenBold;
}

.logo_ranking {
    width: 85%;
    margin-top: 10px;
}


.nav-pills .nav-link.active{
    background-color: transparent!important;
    
}
.nav-link {
    padding: 0px!important;
}

.overlay {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-y: auto;
  transition: 0.5s;
  padding: 0 30px;
}

.overlay-content {
  position: relative;
  top: 10%;
  width: 100%;
  text-align: center;
  margin-top: 0px;
}

.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}

.overlay .closebtn {
  position: absolute;
  top: -20px;
  right: 20px;
  font-size: 60px;
    color: #f1f1f1;
}

#model{
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	height:800px ; //Height of the screen 
	background:rgba(30,30,30,0.7);
}

.vip_point input {
    text-align: right;
    width: 50px;
    background-color: transparent;
    color: white;
    border: 0;
}

.vip_point .right-result1{
    background-color: #090f3c;
    color: white;
    border: 0;
    padding: 10px 20px;
    margin-bottom: 2px;
    border-radius: 5px;
}
.vip_point .right-result2{
    background-color: #060924;
    color: white;border: 0;
    padding: 10px 20px;
    margin-bottom: 2px;
    border-radius: 5px;
}

#myNav2 .overlay-content li{
    text-align: left!important;
}
#myNav2 .nav-item {
    margin-bottom: 20px;
}

.vipafter-content2 .card1 {
    background-color: transparent!important;
    color: white!important;
    border: 1px solid white;
    padding: 10px;
    border-radius: 0px;
    margin-bottom: 5px;
}
.vipafter-content2 .card1:hover {
    background-color: white!important;
    margin-bottom: 0px;
}
.vipafter-content2 .card1:hover h5 , .vipafter-content2 .card1:hover p{
    color: black!important;
}

.vipafter-content2 .card1 h5 , .vipafter-content2 .card1 p{
    font-size: 12px!important;
    margin-bottom: 0px;
}
.bi-triangle-fill{
    width: 2%;
    height: 10px;
    align-self: center;
    font-size: 8px; opacity: 1;
    -webkit-text-stroke-width: 0px;
    transform: rotate(90deg);
}

.vipafter-content2 .card1:hover .bi-triangle-fill {
    transform: rotate(180deg)!important;
}

.vip_leaderboard ul li #seasonal-tab, .vip_leaderboard ul li #slots-tab {
    color: #818385;
    font-family: Cambria;
}
.vip_leaderboard #seasonal-tab.active, .vip_leaderboard #slots-tab.active {
    color: #ffffff!important;
    font-weight: 900!important;
        text-decoration-color: #f5e473;
    text-decoration-line: underline;
    text-underline-position: under;
}
.current_ranking tr td{
    font-size: 12px!important;
    padding: 5px 0px;
    vertical-align: middle;
}

.vip_points_ranking .bi-triangle-fill {
    font-size: 12px;
    color:  #00ff84
}

.vip_points_ranking table tr:nth-child(odd){
    background-color: #090f3c;
}
.vip_points_ranking table tr:nth-child(even){
    background-color: #060924;
}


#myNav_view_prizes li{
    text-align: left;
    margin-bottom: 0px;
}
#myNav_view_prizes h5, #myNav_view_prizes h6, #myNav_view_prizes p{
 text-align: left!important;
}

.vipafterbg2 .scrollmenu {
    padding: 15px;
    margin-bottom: 5%;
}
.vipafterbg2 .slide_ranking {
    border: 1px solid #FFB80A;
    border-radius: 10px;
    padding:8px;
}
.vipafterbg2 .slide_ranking .row{
    background: #1F1F1F;
    border-radius: 10px;
}
.vipafterbg2 .border-padding, .viprank .border-padding {
    display: inline-table;
    padding: 10% 15%;
    border: 1px solid #FFB80A;
    border-radius: 10px;
    position: relative;
    z-index: 999;
}

.viprank .border-padding{
    display:inline-block;
}

.vipafterbg2 .img_tick {
    width: 15px;
    margin-right:10px;
}
.vipafterbg2 .slide_ranking .col-5 {
    text-align-last: left;
    padding-left: 5px!important;
        align-content: center;
    padding-right: 10px;
}
.vipafterbg2 .slide_ranking .col-12 {
    
    padding-left: 6px!important;
}
.vipafterbg2 .border-padding h5, .viprank .border-padding h5 {
    font-family: konsenBold;
    margin: 0;
    font-size: 14px;
}
.vipafterbg2 p b {
    font-family: konsenBold;
    float: right;
    margin-bottom: inherit;
    font-size: 10px;
}
.vipafterbg2 .learn_more {
    padding-top: 2%;
    
}
.vipafterbg2 .learn_more a {
    font-family: konsenBold;
    color: black;
    font-size: 14px;
    background: #FFB80A;
    padding: 2% 4%;
    border-radius: 10px;
}
.vipafterbg2 .learn_more a:focus {
    color: black;
    text-decoration: none;
}
.vipafterbg2 .learn_more a:hover {
    color: black;
    text-decoration: none;
}


.vipafterbg2 .modal-fullscreen {
    width: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 0
}
.vipafterbg2 .modal h5 {
    height: 60px;
        align-content: center;
    font-family: konsenBold;
    color: grey;
    font-size: 11px;
    border: 1px solid #FFB80A;
    border-radius: 10px;
    padding: 10px;
    margin-top: 10%;
}
.vipafterbg2 .modal li a.active h5 {
    font-family: konsenBold;
    color: white;
    border: 1px solid #FFB80A;
    border-radius: 10px;
    padding: 10px;
    margin-top: 10%;
}

.vipafterbg2 .modal-content {
    height:600px;
    border: none;
    border-radius: 0;
    background: url(../img/bg_tnc.jpg)bottom center!important;
    background-size: 100% 100%!important;
    background-position: center;
    padding-bottom: 60px;
}

.modal.show{
    background: rgba(0, 0, 0, 0.8);
}

.vipafterbg2 .close_button {
    width: 50%;
}
.vipafterbg2 .padding_table {
    border:1px solid #FFB80A;
    border-radius: 10px;
    padding: 0;
}
.vipafterbg2 .padding_table table {
     width: 100%;
     border-collapse: collapse;
    border-radius: 10px;
    padding: 0;
    border-radius: 8px; 
    border-collapse:separate;
    border-spacing:0 4px;
    font-size: 14px;
    margin-bottom: 0;
    margin-top: -5px!important;
}
.vipafterbg2 .padding_table th, td {
    padding: 2px;
    text-align: center;
}
.vipafterbg2 .padding_table th:nth-child(1) {
    border-top-left-radius: 10px;
}
.vipafterbg2 .padding_table th:nth-child(3) {
    border-top-right-radius: 10px;
}
.vipafterbg2 .padding_table th {
    color: #000000;
    background: #FFB80A;
    vertical-align: middle!important;
}

.vipafterbg2 div.scrollmenu {
  overflow: auto;
    white-space: nowrap;
    padding: 10px;
}
.vipafterbg2 div.scrollmenu .slide_ranking {
    padding: 0.5% 5%!important;
  display: inline-block;
  color: black;
  text-align: center;
  text-decoration: none;
        max-width: 260px;
        height: auto;
}
.vipafterbg2 div.scrollmenu .slide_ranking .col-12 p {
    width: 80%;
}

.vipafterbg2 .margin_img_campaign {
    margin-left: -0.5%;
}
/* Change the color of the scrollbar */
.vipafterbg2 .scrollmenu::-webkit-scrollbar {
  display: none;
}

.vipafterbg2 .slide_ranking{
/*
    padding: 0%!important;
    flex: 0 0 22%;
    max-width: 22%;
    margin: 0 0.5%;
*/
}

.modal-body{
    overflow-x: hidden;
}

.modal-body button{
    margin-right: -25px;
    margin-top: -5px;
}

.viprank{
    border-radius: 10px;
    background-color:#1F1F1F!important;
    margin-bottom:0px!important;
}

.viprank td{
    width:50%;
    text-align: left;
    padding: 1px 10px!important;
}

.viprank td.aright{
    text-align: right;
}

.viprank td.vmid{
    vertical-align: middle;
}

#vipscroll{
    padding-top:10px;
}

#vipscroll .carousel-indicators{
    position:relative!important;
}

#vipscroll .carousel-control-next, #vipscroll .carousel-control-prev{
    width:8%!important;
}
/*
.vipafterbg2 tbody tr {
    border: 10px solid black;
}
*/
/*
.vipafterbg2 tbody {
    background: black;
}
*/
.vipafterbg2 .padding_table tbody tr td {
    padding: 0 10px 0 0; /* Add padding here */
    text-align: center;
    width: 33%;
    vertical-align: middle;
    background-color: #1F1F1F;
}

/* Optional: Adjust specific columns */
.vipafterbg2 .padding_table tbody tr td:nth-child(1) {
    background-color: transparent;
    padding: 0 0 0 10px;
}
.vipafterbg2 .padding_table tbody tr td:nth-child(1) p{
    background-color: #1F1F1F;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    margin: 0;
    padding: 5px;
}

.vipafterbg2 #rnb_tnc .padding_table tbody tr td:nth-child(2){
    background: transparent;
}
.vipafterbg2 #rnb_tnc .padding_table tbody tr td:nth-child(2) p{
    
    height: inherit;
    align-content: center;
}
.vipafterbg2 #rnb_tnc .padding_table th:nth-child(2) {
    border-top-right-radius: 10px;
}
.vipafterbg2 .padding_table tbody tr td:nth-child(2) p{
    background-color: #424242;
    border-radius: 5px;
    margin: 0;
    padding: 5px;
}
.vipafterbg2 .padding_table tbody tr td:nth-child(3) p{
    background-color: #424242;
    border-radius: 5px;
    margin: 0;
    padding: 5px;
}

#rnb_tnc h6 {
    color: #FFB80A;
    font-family: konsenBold;
    text-transform: uppercase;
    font-size: 14px;
}
#rnb_tnc a {
    color: #FFB80A;
    font-size: 14px;
    font-family: konsenBook;
    font-style: normal;
    text-decoration: none;
}
#rnb_tnc #tncbut {
    font-style: italic;
    text-decoration: underline;
}
#rnb_tnc li:active a{
    color: white;
}
#rnb_tnc li{
    color: white;
}
#rnb_tnc #product2  li{
    text-align: left;
    color: white;
    font-size: 12px;
}

#rnb_tnc p {
    font-family: konsenBook;
}
#rnb_tnc2 li {
    color: #ffffff;    
    font-size: 12px;
    font-family: konsenBook;
}
#rnb_tnc2 p {
    margin: 0;
}

.vipafterbg2 .slide_ranking .col-1 {
    padding: 0 0 0 5px;
}
.vipafterbg2 .slide_ranking .col-6 {
    padding: 0 0 0 5px;
}
.vipafterbg2 .slide_ranking .col-11 {
    padding: 0 0 0 5px;
}
.vipafterbg2 .slide_ranking p {
    font-family: konsenBook;
    color: white;
    font-size: 11px;
    margin-bottom: 8px;
}

.scrolling-container {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.scrolling-item {
  flex: 0 0 auto;
  width: 80%;
  scroll-snap-align: start;
  margin-right: 20px;
}

.logo_ranking, .img_tick {
  height: auto;
}

.border-padding {
  padding: 10px;
  border: 1px solid #ccc;
}

#rnb_tnc2 ul li {
    margin-bottom: 10px;
}


#rnb_tnc2 ul li {
    margin-bottom: 10px;
}

#rnb_tnc .category-link {
    width: 48%;
    margin: 1%;
}

#rnb_tnc .modal-dialog, #rnb_tnc2 .modal-dialog {
    margin: 0;
}

.vipafterbg2 .nav-pills {
    width: 100%!important;
}

.carousel-item table tr td:nth-child(1){
    width: 60%;
}

/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: transparent; 
  border-radius: 50px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #FFB80A; 
  border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}