body {
        font-family: 'Geneva', sans-serif;
    } 
    .content-app {
        height: 100%;
        padding-bottom: 80px;
    }
    
    /*************** HEADER ***************/
    .header {
        z-index: 99;
        background-color: #262427;
        border-bottom: 3px solid #1a1b21;
        height: auto;
        color:  #fff;
        position:  fixed;
        width: 100%;
    }
    .after-header {
        height : 142px;
    }
    
    .after-header-login {
        height : 184px;
    }
    
    .logo-wrapper img {
        margin-left: 30px;
    }
    .credential-area {
        width: 100%;
    }
    .top-center-align {
        display : inline-block;
    }
    .form-control-wrapper {
        padding-right: 5px
    }
    .form-control-wrapper input {
        width: 150px;
        background: #F0F0F0;
        border-color: #A0A0A0;
        border-radius: 2px !important;
        color: #181818 !important;
        font-size: 12px;
        padding-left: 3px !important;
    }
    .form-control-wrapper input:focus {
        background: #F0F0F0;
        border-color: #A0A0A0;
        border-radius: 0px !important;
        box-shadow: none;
    }
    .token-bg {
        margin : 0px;
        width: 60px;
        margin-right: 5px;
        border-radius: 2px;
        height: 28px;
    }
    #generateToken3 {
        font-size: 20pt;
        margin-top: -2px;
    }
    .form-control-wrapper button {
        border: none;
        height: 31px;
        width: 100px;
        border-radius: 3px;
        font-size: 14px;
        font-weight: bold;
        letter-spacing: 3px;
    }
    .form-control-wrapper button[type=submit] {
        background:linear-gradient(to bottom, #e7be4e 5%, #ffef96 100%);
        background-color:#e7be4e;
        color: #404040;
    }
    .register-btn {
        background:linear-gradient(to top, #C00000 5%, #ff6f69 100%);
        background-color:#C00000;
        background-color: red;
        color: #fff;
    }
    
    .top-wrapper {
        padding-right: 30px;
        padding-top: 10px;
    }
    .top-wrapper img {
        position: absolute;
    }
    
    /*************** TOP NAVBAR ***************/
    .menu-game span {
        color: #fff;
        font-weight: bold;
        padding-top: 2px;
    }
    .icon {
        filter: brightness(0) invert(1);
        height: 25px;
        width: 25px;
        text-align: center;
    }
    .menu-icon {
        text-align: center;
        padding-right: 2px;
        padding-left: 2px;
    }
    .menu-name span {
        font-size: 11px;
        font-weight: bold;
        color: #fff;
        letter-spacing: 1.5px;
    }
    .icon-game-active {
        border-bottom : 2px solid gold;
    }
    
    .icon-game-active img {
        filter: invert(95%) sepia(41%) saturate(5614%) hue-rotate(39deg) brightness(180%) contrast(86%);
        -webkit-filter: invert(95%) sepia(41%) saturate(5614%) hue-rotate(39deg) brightness(180%) contrast(86%);
        -moz-filter: invert(95%) sepia(41%) saturate(5614%) hue-rotate(39deg) brightness(180%) contrast(86%);
    }
    
    .name-icon-game-active {
        background: -webkit-linear-gradient(#e7bf4e, #ffef96);
        background-clip: border-box;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    
    /*************** TOP NAVBAR ***************/
    
    .bg-main {
        background-color: #17181d;
    }
    
    .content-wrapper {
        background: radial-gradient(800px 700px at top center,#5e5e5e,#262427,#262626);
        margin-top: 40px;
        border: 1px solid #A0A0A0;
        border-radius: 6px; 
        padding: 20px 20px 20px 20px;
        z-index: 98;
    }
    
    .username-balance {
        text-transform: uppercase;
        background: -webkit-linear-gradient(#e7bf4e, #ffef96);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: bold;
    }
    .dropdown-menu {
        background-color: #17181d;
        padding-top: 0;
        padding-bottom: 0;
        border-radius: 6px !important;
        margin-right: 13px;
    }
    .dropdown-menu .dropdown-item {
        border-bottom: 1px solid #202b49;
        color: #ffffff;
    }
    .dropdown-menu .dropdown-item:hover {
        color: #ffffff;
        background: transparent;
    }
    
    .menus {
        display: flex;
        width: 100%;
        justify-content:center;
    }
    .menu-icon {
        margin-right: 10px;
        margin-left: 10px;
    }
    .top-menu-icon {
        padding: 10px 0px 5px 0px;
    }
    
    /*************** SOCIAL MEDIA ICON ***************/
    
    .welcome {
        padding-bottom: 10px;
        display:flex;
        justify-content: flex-end;
        font-size: 20px;
    }
    .welcome #data-toggle{
        color: #e7bf4e;
    }
    
    .medsos-wrapper {
        margin-top: 80px;
        border-bottom: 1px solid #292b33;
    }
    .medsos-wrapper h4 {
        color: #888888;
        font-weight: bold;
    }
    .medsos {
        margin-top: 30px;
        margin-bottom: 30px;
        color: #888888;
        width: 88%;
    }
    .medsos-icons {
        display: inline-block;
        margin-right: 40px;
        margin-left: 40px;
    }
    .medsos-icons span {
        background: -webkit-linear-gradient(#e7bf4e, #ffef96);
        background-clip: border-box;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: bold;
    }
    .medsos-icon {
        height: 25px;
        width: 25px;
        margin: 5px 0px 0 0px;
        color:  #fff;
        font-weight: bold;
    }
    .medsos-id {
        font-size: 10px;
        margin-top: 5px;
    }
    /*************** END SOCIAL MEDIA ICON ***************/
    
    /*************** MAIN CONTENT ***************/
    .main-content h4 {
        font-size:  15px;
    }
    
    .main-content-wrapper {
        background-color: #080b13;
        background-image: linear-gradient(315deg, #080b13 0%, #1b2132 94%);
        padding: 50px 20px 50px 20px;
        z-index: 98;
        color: #fff;
    }
    /*************** END MAIN CONTENT ***************/
    
    /*************** BANK SUPPORT ***************/
    .bank-wrapper {
        margin-top: 60px;
        box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
    }
    .bank-wrapper h4 {
        color: #888888;
    }
    .bank-icon {
        height: 50px;
        width: 125px;
        box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
    }
    /*************** END BANK SUPPORT ***************/
    
    .services-about {
        padding: 10px 30px 10px 30px;
        color: #e7bf4e;
        display: flex;
        justify-content: center;
        margin-top: 25px;
        background: #414F76;
        background: -webkit-radial-gradient(center, #414F76, #1B2030);
        background: -moz-radial-gradient(center, #414F76, #1B2030);
        background: radial-gradient(ellipse at center, #414F76, #1B2030);
    }
    .service {
        margin-right: 20px;
        margin-left: 20px;
    }
    .service img {
        text-align: center;
        width : 80px !important;
        height : 60px !important;
    }
    .service-name {
        padding-top: 15px !important;
        text-align: center;
    }
    .service-name span {
        background: -webkit-linear-gradient(#e7bf4e, #ffef96);
        background-clip: border-box;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: bold;
    }
    
    /*************** FOOTER NOTE ***************/
    .footer-note {
        margin-top: 60px;
        color: #888888;
        padding : 0 7%;
    }
    .footer-note img {
        position:absolute;
        opacity: 0.1;
        right:0;
        left:0;
        width: 100%;
    }
    .footer-note h4 {
        font-size:  19px;
        z-index: 99;
    }
    .footer-note p {
        font-size:  18px;
        z-index: 99;
    }
    .merdekatoto {
        background: -webkit-linear-gradient(#e7bf4e, #ffef96);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: bold;
    }
    /*************** END FOOTER NOTE ***************/
    
    /*************** CASAGROUP FOOTER ***************/
    .casa-logo {
        margin-bottom: 10px;
        display: flex;
        justify-content: center;
        background: radial-gradient(1600px 1400px at top center,#080b13,#262427,#262626);
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .casagroup p {
        background: -webkit-linear-gradient(#e7bf4e, #ffef96);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: bold;
    }
    #casa-logo {
        height: 70px;
        width: 70px;
    }
    .casagroup {
        padding-top: 10px;
        padding-bottom: 7px;
    }
    .casagroup p {
        font-size: 25px;
        font-weight: bold;
    }
    /*************** END CASAGROUP FOOTER ***************/
    
    /*************** GAMES BETTINGAN ***************/
    .pasaran-select {
        border: 1px solid #202b49;
        background-color: #080b13;
        background-image: linear-gradient(315deg, #080b13 0%, #1b2132 94%);
        box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
    }
    .pasaran-select .form-control {
        border-radius: 2px !important;
        background: transparent;
        border: none;
        color: #696969;
        font-size: 25px;
        letter-spacing: 3px;
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        text-align-last:center;
        direction: rtl;
    }
    .game-bet, .bet-type {
        display: flex;
        font-weight: bold;
    }
    .game-bet .btn {
        width: 100% !important;
        height: 35px;
        margin-right: 3px;
        margin-left: 3px;
        font-size: 14px;
        vertical-align: middle;
        padding-top: 5px;
        border: 2px solid #e7bf4e;
        font-weight: bold !important;
    }
    .gameActive, .actived-bet {
        background-color: #A00000 !important;
        background-image: linear-gradient(315deg, #A00000 0%, #FF0000  74%) !important;
        color: #fff !important;
        font-weight: bold !important;
        border: 2px solid #A00000 !important;
        border-radius: 0px !important;
        margin-bottom: 5px;
    }
    .type-game-btn {
        margin-top: 10px;
        border-bottom: 1px solid #202b49;
        padding: 7px 5px 5px 5px;
        border-radius: 2px;
        background-color: #080b13;
        background-image: linear-gradient(315deg, #080b13 0%, #1b2132 94%);
        box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    }
    .type-game-btn .btn-warning, .game-general-btn .btn-warning {
        background-color: #e7bf4e;
        background-image: linear-gradient(315deg, #e7bf4e 0%, #ffef96 74%);
        margin-bottom:5px;
        color: #404040;
        border-radius: 0px !important;
    }
    .game-general-btn .btn {
        width: 100%;
        height: 35px;
    }
    .btn-submit .btn-warning {
        background-color: #e7bf4e;
        background-image: linear-gradient(315deg, #e7bf4e 0%, #ffef96 74%);
        color: #404040;
        border-radius: 0px !important;
    }
    .bet-table #submit {
        height: 50px;
        width: 140px;
        padding-top: 13px;
        font-weight: bold;
        margin-bottom: 15px;
        text-transform: uppercase;
        box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
    }
    .bbfs-pl {
        background-color: #e7bf4e;
        background-image: linear-gradient(315deg, #e7bf4e 0%, #ffef96 74%);
        color: #404040;
        border-color: none;
        border-color: 1px #e7bf4e;
        border-radius: 0px !important;
    }
    
    .btn-jenis-bet {
        margin-top: 20px;
        margin-bottom: 9px;
        border-radius: 2px;
        background-color: #080b13;
        background-image: linear-gradient(315deg, #080b13 0%, #1b2132 94%);
        box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
        padding: 5px;
    }
    .bet-type {
        margin-top: 10px;
    }
    .bet-type a {
        height: 35px;
        margin: 6px 3px 3px 3px;
        font-size: 14px;
        border-radius: 0px !important;
        text-align: center;
        padding-top: 6px !important;
        width: 100%;
        border: none;
        padding-top: 5px;
        padding-bottom: 5px;
        color: #404040;
        background-color: #ffef96;
        font-weight: bold;
        text-decoration: none;
    }
    .type-game-btn .btn {
        width: 140px;
    }
    
    .nd-category, .ds-category, .bb-category {
        background-color: #FF0000 !important;
        color: #ffffff !important;
    }
    .nd-category {
        background-color: #7c2323  !important;
        color: #ffffff !important;
    }
    .ds-category {
        background-color: #084608  !important;
        color: #ffffff !important;
    }
    .bb-category {
        background-color: #ad8a00 !important;
        color: #ffffff !important;
    }
    
    .nd-category-table {
        background-color: #7c2323 !important;
    }
    .ds-category-table {
        background-color: #084608  !important;
    }
    .bb-category-table {
        background-color: #ad8a00 !important;
        color: #ffffff !important;
    }
    .bb-category-table .bbfs-checklist .checkboxtext,
    .bb-category-table thead,
    .bb-category-table tbody tr td,
    .bb-category-table .bet_name,
    .bb-category-table #value_4d, 
    .bb-category-table #value_3dd, 
    .bb-category-table #value_3d,
    .bb-category-table #value_2dd, 
    .bb-category-table #value_2dt,
    .bb-category-table #value_2d,
    .bb-category-table .headerBet span, 
    .bb-category-table .input-group-addon {
        color: white !important;
    }
    .bet-table {
        padding-top: 10px !important;
        padding: 3px;
        border-radius: 3px;
        margin-bottom: 50px;
        box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;
    }
    .bet-table thead {
        font-weight: bold;
    }
    
    .game-list-table {
        padding: 15px;
        border-radius: 3px;
        background-color: #17181d;
        box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;
    }
    .game-list-table thead {
       background-color: black;
    }
    .game-list-table tbody tr:nth-child(even) {
        background-color: #eaf8e6;
        color: #404040;
    }
    .game-list-table tbody tr:nth-child(odd) {
        background-color: #ffffff;
        color: #404040;
    }
    .game-list-table thead tr th {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        color: #ffffff;
        border-top: none !important;
    }
    .game-list-table tbody tr td {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        border-top: none !important;
    }
    /*************** END GAME BETTINGAN ***************/
    
    /*************** PAGINATION ***************/
    .page-link {
        position: relative;
        display: block;
        padding: .5rem .75rem;
        margin-left: -1px;
        line-height: 1.25;
        color: #FFFFFF;
        background-color: transparent;
        border: 1px solid #dee2e6;
        font-size: 14px;
    }
    .page-item.active .page-link{
        z-index: 3;
        color: #404040;
        background-color: #fff;
        border-color: #ffffff;
    }
    .page-item.disabled .page-link{
        z-index: 3;
        color: #404040 !important;
        background-color: transparent !important;
        border-color: #ffffff !important;
    }
    .page-wrapper {
        overflow: auto;
        margin-top: 35px;
    }
    .logo-login {
        position : absolute;
        margin-top : 10px;
        margin-left: -5px !important;
    }
    .logo-before-login {
        position : absolute;
        margin-left: -5px !important;
    }
    .login-area {
        text-align : center;
    }
    /*************** END PAGINATION ***************/
    
    /*************** API GAME ***************/
    .header-games {
	    border: 1px solid #202b49;
        padding-top: 15px;
        padding-bottom: 15px;
        border-radius: 2px;
        background-color: #080b13;
        background-image: linear-gradient(315deg, #080b13 0%, #1b2132 94%);
        box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px; 
	}
    .saldo-games {
	    font-size : 28px;
	    background: -webkit-linear-gradient(#e7bf4e, #ffef96);
        background-clip: border-box;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
	}
	.wrapper1 {
  		display: flex-start;
  		justify-content: space-between;
  		flex-wrap: wrap;
  		width: 100%;
  		margin-top: 30px;
  	}
  	.games {
  		display: inline-block;
  		margin: 5px;
  	}
  	.icon {
  		display: inline-block;
  		flex-wrap: wrap
  	}
  	.game-type {
  	    margin-top: 20px;
  	    text-align: center;
  	} 
  	.game-type .btn-game, .game-back-btn {
  	    border: 0px !important;
	    background:linear-gradient(to bottom, #e7be4e 5%, #ffef96 100%);
        background-color:#e7be4e;
	    color: #404040;
	    padding: 5px 5px 5px 5px;
	    width: 100px;
	    height: 35px;
	    letter-spacing: 1px;
  	}
    /*************** END API GAME ***************/
    .notif-badge {
        position:absolute;
        margin-top: -52px;
        margin-left: 4px;
        font-size: 13px !important;
        background-image: linear-gradient(315deg, #A00000 0%, #FF0000 74%);
        color: #ffffff !important;
        padding: 0px 6px 0px 6px;
        border-radius: 50%;
    }