:root {
    /*Default Color*/
    --pp-bg-color-default: #151515;
    --pp-color-1: #860101;
    --pp-color-2: #ba4e12;
    --pp-color-3: #3d0900;
    --pp-color-balance: #ffe06e;
    --pp-color-hover: #ba4e12;
    --pp-color-bg-account: #0c6810;
    --pp-color-border-account: #c7f4bc;
    --pp-color-1-active: #3d0900;
    --pp-color-2-active: #917232;
    --pp-color-3-active: #ffe06e;
    --pp-color-error: #ffe06e;
    --pp-color-success: #19d219;
    --pp-gradient-navbar: linear-gradient(180deg, #860101 19%, #ba4e12 80%);
    --pp-gradient-sidebar: linear-gradient(60deg, #860101 0%, #860101 88%);
    --pp-gradient-sidebar-active: linear-gradient(90deg, #860101 20%, #ba4e12 100%);
    --pp-gradient-footer-menu: linear-gradient(180deg, rgba(89,3,1,1) 19%, rgba(37,7,2,1) 80%);
    --pp-gradient-menuicon: var(--pp-gradient-navbar), linear-gradient(180deg, rgba(145,145,145,1) 40%, rgba(255,255,255,1) 100%);
    --pp-gradient-menuicon-active: linear-gradient(180deg, var(--pp-color-1-active), var(--pp-color-2-active)), linear-gradient(180deg, #ffffff, var(--pp-color-3-active));
    --pp-gradient-login-form: var(--pp-gradient-navbar);
    --pp-gradient-balance-credit: var(--pp-gradient-sidebar-active);
    --pp-gradient-title: linear-gradient(180deg, #ffffff 20%, #c7f4bc 50%, #ffffff 80%);
    --pp-gradient-btn-primary: linear-gradient(180deg, #ffda71, #876313), linear-gradient(90deg, #9c6727, #fdf6ae 31.53%, #bd8d42 64.87%, #fdf6ae);
    --pp-gradient-btn-primary-hover: var(--pp-gradient-btn-primary);
    --pp-gradient-modal: linear-gradient(180deg, #860101 19%, #230702 80%);
    /*Default background image*/
    --pp-body-bg-image: linear-gradient(168deg, var(--pp-bg-color-default), transparent), url('../images/bg/01.jpg') center center;
    --pp-section2-bg-image: linear-gradient(45deg, var(--pp-bg-color-default), transparent), url('../images/bg/10.jpg') center center;
    --pp-section3-bg-image: linear-gradient(45deg, var(--pp-bg-color-default), transparent), url('../images/bg/04.jpg');
    --pp-section4-bg-image: linear-gradient(45deg, var(--pp-bg-color-default), transparent), url('../images/bg/08.jpg');
    --pp-footer-bg-image: none;
    /*Body Style*/
    --pp-font-default: 'Nokora','Kanit','Roboto', sans-serif !important;
    --pp-body-color: #ffffff;
    --pp-body-bg: var(--pp-bg-color-default);
    --pp-body-bg-after: var(--pp-bg-color-default);
    --pp-body-bg-image-after: var(--pp-body-bg-image);
    --pp-body-font-size: 14px;
    --pp-body-font-family: var(--pp-font-default);
    /*Side Game Bar*/
    --pp-sidegamebar-bg: none;
    --pp-sidegamebar-width: 200px;
    --pp-sidegamebar-mobile-width: 110px;
    /*Tab Game Menu*/
    --pp-tabgamemenu-bg: linear-gradient(155deg, #424242, #101010);
    --pp-tabgamemenu-bg-active: linear-gradient(155deg, #fffe97, #917232);
    --pp-tabgamemenu-box-shadow: 0 0 10px #151515;
    --pp-tabgamemenu-border-radius: 20px;
    --pp-tabgamemenu-border: none;
    --pp-tabgamemenu-font-size: 16px;
    --pp-tabgamemenu-mobile-font-size: 0.8rem;
    --pp-tabgamemenu-before-width: 3px;
    --pp-tabgamemenu-before-border-radius: 0 20px 20px 0;
    --pp-tabgamemenu-before-bg: hsla(0, 0%, 100%, .3);
    --pp-tabgamemenu-img: 60px;
    --pp-tabgamemenu-mobile-img: 40px;
    --pp-tabgamemenu-scroll-bg: rgb(147,1,24);
    --pp-tabgamemenu-scroll: linear-gradient(90deg, #fffe97 0%, #917232 100%);
    --pp-tabgamemenu-scroll-hover: linear-gradient(180deg, #fffe97 0%, #917232 50%, #917232 100%);
    --pp-tabgamemenu-scroll-track: #930118;
    /*Header NavBar Main*/
    --pp-navbarmain-height: 75px;
    --pp-navbarmain-bg: linear-gradient(180deg, #292929, #101010);
    --pp-navbarmain-border-bottom: none; /* 1px solid #917232;*/
    /*Header Menu Icon*/
    --pp-menuicon-margin-left: 195px;
    --pp-menuicon-button-padding: 0 2px 2px; /*top padding is 0px right and left paddings are 2px bottom padding is 2px*/
    --pp-menuicon-button: linear-gradient(180deg, #3a3a3a, #101010), linear-gradient(180deg, #fefd96, #151515);
    --pp-menuicon-button-active: linear-gradient(180deg, #ffce45, #a17511), linear-gradient(180deg, #ffffff, #ffc83c);
    --pp-menuicon-button-max-width: 100px;
    --pp-menuicon-button-height: 90px;
    --pp-menuicon-button-margin-right: 5px;
    --pp-menuicon-button-border-radius: 0 0 15px 15px;
    --pp-menuicon-button-font-size: 12px;
    /*Swalalert2 Modal Background*/
    --pp-swal-modal-bg: linear-gradient(180deg, #930702 0%, #230702 80%);
    --pp-swal-modal-border-radius: 20px;
    --pp-swal-modal-color: #ffffff;
    /*Swalalert2 Button Confirm*/
    --pp-btn-confirm: linear-gradient(180deg, rgba(169,53,13,1) 23%, rgba(186,78,18,1) 100%);
    --pp-btn-confirm-border-radius: 20px;
    --pp-btn-confirm-box-shadow: 0 0 10px #151515;
    --pp-btn-confirm-border: none;
    --pp-btn-confirm-color: #ffffff;
    --pp-btn-confirm-width: 100%;
    --pp-btn-confirm-min-width: 200px;
    --pp-btn-confirm-padding: 8px 10px;
    --pp-btn-confirm-font-weight: normal;
    --pp-btn-confirm-font-size: 1.1rem;
    /*Customize bootstrap*/
    /*Form*/
    --pp-form-control-border-radius: 9px;
    --pp-form-control-bg: #ffffff;
    --pp-form-control-color: #060606;
    --pp-form-control-box-shadow: 0 0 2px #ba4e12, 0 0 15px #860101;
    --pp-form-control-color-placeholder: #bbbbbb;
    --pp-form-control-bg-disabled: #ffffff;
    --pp-form-control-border: none;
    --pp-form-control-line-height: 40px;
    /*Button primary*/
    --pp-btn-primary-bg: linear-gradient(180deg, #3a3a3a, #101010), linear-gradient(90deg, #9c6727, #fdf6ae 31.53%, #bd8d42 64.87%, #fdf6ae);
    --pp-btn-primary-bg-before: linear-gradient(270deg, rgba(234, 182, 113, 0), #eab671 50.8%, rgba(234, 182, 113, 0));
    --pp-btn-primary-bg-after: linear-gradient( 270deg, rgba(234, 182, 113, 0), #eab671 50.8%, rgba(234, 182, 113, 0));
    --pp-btn-primary-color: #fffcdb;
    --pp-btn-primary-padding: 8px;
    --pp-btn-primary-font-size: 0.9rem;
    --pp-btn-primary-border-radius: 12px;
    --pp-btn-primary-border: 2px solid transparent;
    --pp-btn-primary-hover: linear-gradient(180deg, #ffda71, #876313), linear-gradient(90deg, #9c6727, #fdf6ae 31.53%, #bd8d42 64.87%, #fdf6ae);
    --pp-btn-primary-hover-border-color: #fcf5ad;
    --pp-btn-primary-box-shadow: none;
    --pp-btn-primary-bg-image-second-child: linear-gradient(180deg, #3a3a3a, #101010), linear-gradient(90deg, #9c6727, #fdf6ae 31.53%, #bd8d42 64.87%, #fdf6ae);
    /*Button success*/
    --pp-btn-success-color: #fff;
    --pp-btn-success-bg: linear-gradient(180deg, #860101 19%, #ba4e12 80%);
    --pp-btn-success-shadow: inset 0 3px 5px rgba(0, 0, 0, 1);
    --pp-btn-success-border-color: #ba4e12;
    --pp-btn-success-hover-color: #fff;
    --pp-btn-success-hover-bg: #ba4e12;
    --pp-btn-success-hover-border-color: #860101;
    --pp-btn-success-focus-shadow: 60, 153, 110;
    --pp-btn-success-active-color: #fff;
    --pp-btn-success-active-bg: #ba4e12;
    --pp-btn-success-active-border-color: #860101;
    --pp-btn-success-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --pp-btn-success-disabled-color: #fff;
    --pp-btn-success-disabled-bg: #ba4e12;
    --pp-btn-success-disabled-border-color: #ba4e12;
    /*Button danger*/
    --pp-btn-danger-color: #fff;
    --pp-btn-danger-bg: #dc3545;
    --pp-btn-danger-shadow: inset 0 3px 5px rgba(0, 0, 0, 1);
    --pp-btn-danger-border-color: #dc3545;
    --pp-btn-danger-hover-color: #fff;
    --pp-btn-danger-hover-bg: #bb2d3b;
    --pp-btn-danger-hover-border-color: #b02a37;
    --pp-btn-danger-focus-shadow: 225, 83, 97;
    --pp-btn-danger-active-color: #fff;
    --pp-btn-danger-active-bg: #b02a37;
    --pp-btn-danger-active-border-color: #a52834;
    --pp-btn-danger-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --pp-btn-danger-disabled-color: #c0c0c0;
    --pp-btn-danger-disabled-bg: #dc3545;
    --pp-btn-danger-disabled-border-color: #dc3545;
    /*General*/
    --pp-header-title-color: linear-gradient(90deg, #ffe29b 20%, #b38c2c 80%);
    --pp-header-title-font-size: calc(1rem + 1vw);
    --pp-scrollbar-bg: #fffafa;
    --pp-scrollbar-bg-hover: #aa9249;
    --pp-scrollbar-box-shadow: inset 0 0 5px #353535;
    --pp-scrollbar-bg-track: inset 0 0 5px #353535;
    --pp-balance-credit-bg: linear-gradient(346deg, #4c3a0d, #a1860f);
    --pp-balance-credit-font-size: 1rem;
    --pp-balance-credit-color: #ffffff;
    --pp-contact-padding: 10px;
    --pp-contact-margin: 5px 0;
    --pp-contact-border-radius: 10px;
    --pp-contact-phone-bg: #3d9ee1;
    --pp-contact-line-bg: #19d219;
    --pp-contact-telegram-bg: #249fdb;
    --pp-contact-messenger-bg: #1989fc;
    --pp-runtext-bg: linear-gradient(90deg, #860101 23%, #ba4e12 100%);
    --pp-btn-click-deposit-bg: linear-gradient(90deg, #ffe29b 20%, #b38c2c 80%);
    /*Login Form (When use only one form login)*/
    --pp-body-login-form-bg: radial-gradient(circle, #272727 0, #060606 70%);
    /*Footer Menu*/
    --pp-footer-menu-bg: linear-gradient(#262626, #030303);
    --pp-footer-menu-border-top: 3px solid #ffe06e;
    --pp-footer-menu-height: 70px;
    --pp-footer-menu-stop-color1: #262626;
    --pp-footer-menu-stop-color2: #030303;
    --pp-footer-menu-img-width: 30px;
    --pp-footer-menu-img-width-animation: 45px;
}