@import url('https://fonts.googleapis.com/css2?family=Karla&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300&family=Karla&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300&display=swap');

a{
    text-decoration: none;
}

* {
    box-sizing: border-box;
}
  
*{
    outline: none! important;
    font-family: 'Karla', sans-serif;
    font-weight: 600;
}


#val{
    font-size: 54px; font-weight: 700; padding-right:5px
}
::-webkit-scrollbar{
    width: 0;
}
  
button:focus{
    outline: thin dotted;
    outline: 0px auto -webkit-focus-ring-color;
}
  
a:focus{
    outline: thin dotted;
    outline: 0px auto -webkit-focus-ring-color;
    outline-offset: 0px;
}
  
img:focus{
    outline: thin dotted;
    outline: 0px auto -webkit-focus-ring-color;
    outline-offset: 0px;
}
  
input:focus{
    outline: thin dotted;
    outline: 0px auto -webkit-focus-ring-color;
    outline-offset: 0px;
}
  
img{
    user-drag: none; 
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}
    
html,body{
    -webkit-user-select: none;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
    user-select: none;
    font-family: 'Quicksand', sans-serif;
    padding: 0;
    border: 0;
    margin: 0;
    overflow-x: hidden;
    display: flex;
    width:100%;
    min-height: 100%;
    position: relative;
    background-color: #fff;
}


body{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    min-height: 100%;
    min-width: 100%;
    justify-content: flex-start;
}

nav{
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    flex-direction: row;
    width: 100%;
    background: #390933;
    box-shadow: rgb(171 133 115 / 16%) 0px 2px 10px;
    position: relative;
    z-index: 100;
    padding: 10px 20px;
    height: 64px;
}

[onclick="connectWalletChamada()"][l],[onclick="accountDetails()"][l]{
    background: linear-gradient(67.5deg, #ed3f57, #56bbe5);
    height: 100%;
    border: 1px solid #fff;
    border-radius: 5px;
    width: 150px;
    height: 45px;
    padding: 2px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
}

[onclick="connectWalletChamada()"][l] p,[onclick="accountDetails()"][l] p{
    height: 100%;
    width: 100%;
    text-align: center;
    color: #fff;
    background-color: #390933;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    font-size: 17px;
}

[onclick="accountDetails()"][l] p span{
    flex:1;
    width: 100%;
    text-align: left;
}

[onclick="accountDetails()"][l] img{
    height: 60%;
    margin-left: 10px;
    margin-right: 10px;
    filter: invert(1);
}

#connectWallet{
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    background: rgba(41,44,48,.32);
    z-index: 10000;
    flex-wrap: nowrap;
    flex-direction: column;
    justify-content: flex-start;
    padding-top: 80px;
}

#connectWallet article{
    display: inline-block;
    position: relative;
    max-width: 400px;
    margin: 0px;
    border-radius: 20px;
    box-shadow: 0 8px 24px rgb(0 0 0 / 12%);
    background-color: var(--w);
    padding: 40px;
    box-sizing: border-box;
    width: 100%;
    border-radius: 20px;
    box-shadow: 0 8px 24px 0 rgb(0 0 0 / 12%);
    background: url(/img/connect.svg) no-repeat 0 32px #390933;
    padding: 0;
}

.close-popup{
    width: 15px;
    height: 14px;
    position: absolute;
    cursor: pointer;
    -webkit-transform: none;
    transform: none;
    background: url(/img/icon-close-white.08312e38.svg);
    top: 0;
    right: 0;
    margin: 17px 17px 0 0;
}

.popup-header{
    font-size: 26px;
    font-weight: 600;
    text-align: center;
    color: #fff;
    line-height: 32px;
    margin-top: 48px;
    margin-bottom: 48px;
}

.popup-header-info{
    color: #fff;
    font-size: 14px;
    line-height: 20px;
    width: 230px;
    margin: 8px auto 40px;
}


.popup-header-info a{
    color: #fff;
    text-decoration: underline;
}


.popup-actions{
    display: block;
    background: #fff;
    padding: 40px;
    border-radius: 0 0 20px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    flex-wrap: nowrap;
}

.popup__button{
    flex: none;
    display: flex;
    align-items: center;
    padding: 0 30px;
    height: 50px;
    font-size: 18px;
    color: #333;
    border: 0;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.popup__button_proceed{
    background: white;
    border: 1px solid #e0e0e0;
    margin-bottom: 10px;
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}

.recommended-badge{
    text-transform: uppercase;
    position: absolute;
    top: -8px;
    left: 12px;
    color: #390933;
    font-style: normal;
    font-weight: 400;
    font-size: 9px;
    line-height: 12px;
    height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    background: #ebb3e3;
    border-radius: 6px;
}

#connectWallet article img, #connectWallet article svg{
    height: 70%;
    animation: floatIconWallet 3s ease-in-out infinite;
}

.popup__link{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    font-size: 15px;
    text-decoration: underline;
    color: #390933;
}

nav div{
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    height: 64px;
}

nav div:nth-child(2){
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    height: 64px;
}

nav div a{
    padding: 0px 20px;
    color: #fff;
    font-size: 17px;
}

nav div a img{
    height: 54px;
    width: 54px;
}

#Coin_Flip1,#Referrals1,#Dice1{
    display: none;
}

#root{
    width: 100%;
    height: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
}

#root article{
    width: 100%;
    max-width: 1000px;
    min-height: 100%;
    margin: 0px auto;
    padding: 0px 60px;
    padding-top: 40px;
}

.menuAccount button[s]:hover{
    box-shadow: -5px 5px 5px 0px #e0e0e0;
}

.menuAccount button[s] p{
    flex: 1;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    text-align: left;
}
.menuAccount button[s] svg{
    width: 20px;
    height: 20px;
}
.menuAccount{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: space-between;
    position: relative;
}

.menuAccount button[close]{
    position: absolute;
    top: 0px;
    right: 0px;
    background-color: #fff;
    border: none;
}

.menuAccount div[acc]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    margin-top: 15px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e0e0e0;
}

.menuAccount div[acc] img{
    height: 60px;
    width: 60px;
    border-radius: 50%;
}

.menuAccount div[acc] div:nth-child(2){
    flex: 1;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: center;
    padding: 0px 20px;
}

.menuAccount div[acc] div:nth-child(2) p{
    margin-bottom: 5px;
}

.menuAccount div[acc] div:nth-child(2) a{
    color: #018c77;
    margin-bottom: 10px;
    font-size: 14px;
}

.menuAccount div[sald]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    padding: 20px 0px;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 15px;
}

.menuAccount div[sald] img{
    height: 40px;
    border-radius: 50%;
}

.menuAccount div[sald] div:nth-child(2){
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-left: 10px;
}

.menuAccount div[sald] div:nth-child(2) p{
    font-size: 16px;
    margin: 0px;
}

.menuAccount button[s]{
    margin: 5px 5px;
    height: 56px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    background-color: #fff;
    text-align: center;
}

.menuAccount button[s] p{
    font-size: 16px;
}

.menuAccount button[s] svg{
    margin: 0px 10px;
}


[arc]{
    display: none;
}

#root #Referrals1{
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: nowrap;
}

#root #Referrals1 div div{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
}

#root #Referrals1 div div[a1],#root #Referrals1 div div[a2]{
    box-shadow: -5px 5px 10px 0px #e0e0e0;
    margin-bottom: 30px;
    padding: 5px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
}

#root #Referrals1 div div[a1] p,#root #Referrals1 div div[a2] p,#root #Referrals1 div div[a2] input{
    margin: 0px;
    font-size: 16px;
    flex: 1;
    margin: 0px 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    color: #333;
    background-color: #fff;
    border: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#root #Referrals1 div div[a1] button,#root #Referrals1 div div[a2] button{
    border: 1px solid #fff;
    background-color: #390933;
    color: #fff;
    font-size: 15px;
    padding: 10px 12px;
    border-radius: 10px;
    width: 75px;
    text-align: center;
}


#root #Referrals1 div div#loadInvites {
    min-height: 200px;
    flex: 1;
    border: 1px solid #e0e0e0;
    border-style: dashed;
    border-radius: 10px;
    position: relative;
    display: flex;
    margin-bottom: 30px;
}

#root #Referrals1 div div#invites {
    display: none;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    padding: 20px;
}

#root #Referrals1 div div#invites a{
    margin-bottom: 10px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 20px;
    box-shadow: -5px 5px 10px 0px #e0e0e0;
}

#root #Referrals1 div div#invites a p{
    margin-top: 0px;
}

#root #Referrals1 div div#invites a p,#root #Referrals1 div div#invites a span{
    font-size: 14px;
    color: #333;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    text-align: left;
    width: 100%;
    word-break: break-all;
}

#root #Referrals1 div div#loadInvites p[o]{
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: #fff;
    color: #333;
    font-size: 18px;
    text-align: center;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin: 0px;
    border-radius: 10px;
}

#root #Dice1, #root #Coin_Flip1,#root #Poker1 {
    display: flex;
    flex-flow: column nowrap;
    align-items: stretch;
    justify-content: flex-start;
}

#root #Dice1 [bb2], #root #Coin_Flip1 [bb2],#root #Poker1 [bb2]{
    flex: 1;
    min-height: 200px;
    display: flex;
    position: relative;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
}

#root #Dice1 [bb2] [c1], #root #Coin_Flip1 [bb2] [c1],#root #Dice1 [bb2] [c2], #root #Coin_Flip1 [bb2] [c2],#root #Poker1 [bb2] [c1],#root #Poker1 [bb2] [c2]{
    width: 100%;
    height: 100%;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    box-shadow: -5px 5px 10px 0px #e0e0e0;
    padding: 20px;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
}

#root #Dice1 [bb2] [c1], #root #Coin_Flip1 [bb2] [c1],#root #Poker1 [bb2] [c1]{
    margin-right: auto;
    display: none;

}

#root #Dice1 [bb2] [c2], #root #Coin_Flip1 [bb2] [c2],#root #Poker1 [bb2] [c2]{
    margin-left: auto;
}

#root #Dice1 [bb1],#root #Coin_Flip1 [bb1]{
    min-height: 300px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    align-content: center;
}
#root #Dice1 [bb1] [vx]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: stretch;
}

#root #Dice1 [bb1] [vx] [cd],#root #Dice1 [bb1] [vx] [dc]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    padding: 0px 60px;
}

#root #Dice1 [bb1] [vx] [cd] button,#root #Dice1 [bb1] [vx] [dc] button{
    font-size: 20px;
    background-color: #fff;
    border: none;
    color: #333;
    padding:10px 0px;
    border-bottom: 2px solid #fff;
}

#root #Dice1 [bb1] [vx] div button[select]{
    color: #018c77;
    border-bottom: 2px solid #018c77;
    padding:10px 0px;
}

#root #Dice1 [bb1] [vx] [ccd]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    align-content: flex-start;
    border: 2px solid #018c77;
    border-radius: 10px;
    box-shadow: -5px 5px 10px #e0e0e0;
}

#root #Dice1 [bb1] [vx] [ccd] div{
    height: 186px;
    width: 186px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}

#root #Dice1 [bb1] [vx] [ccd] div:nth-child(1){
    border-right: 1px solid #018c77;
}

#root #Dice1 [bb1] [vx] [ccd] div:nth-child(2){
    border-left: 1px solid #018c77;
}

#root #Dice1 [bb1] [vx] [ccd] div h1,#root #Dice1 [bb1] [vx] [ccd] div input{
    border: none;
    flex: 1;
    background-color: #fff;
    font-size: 52px;
    color: #333;
    display: flex;
    width: 120px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 0px;
    margin-top: 10px;
    font-weight: 300;
}

#root #Dice1 [bb1] [vx] [ccd] div p{
    color: #333;
    font-size: 16px;
}

#root #Dice1 [bb1] [vx] [ccd] div h1{
    color: #018c77;
}

.carregamento{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    background-color: white;
    z-index: 9999;
    animation-name: carrge;
    animation-delay: 0.65s;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    display: flex;
    flex-direction: column;
}


@keyframes carrge {
    0%,50%{
        opacity: 1;
    }
    50%,100%{
        opacity: 0;
        z-index: -9999;
        display: none;
    }
}

.carregamento div{
    height: 100%;
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}

.carregamento div .a{
    width: 120px;
    height: 100px;
}

.carregamento article{
    width: 0%;
    height: 3px;
    background-color: #390933;
    animation-name: cc;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}

.carregamento div .maincircular .circular,  .carregamento div .maincircular .circular:after {
    border-radius: 50%;
}

@keyframes cc {
    0%,25%{
        width: 0%;
    }
    25%,50%{
        width: 10%;
    }
    50%,75%{
        width: 40%;
    }
    75%,100%{
        width: 100%;
    }
}


  .carregamento div .maincircular{
    display:grid;
    text-align: center;
    place-items: center;
    background: white;
    position: fixed;
    top: 15px;
    right: 15px;
    height: var(--tt);
    width: var(--tt);
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: space-between;
  }

  .carregamento div .maincircular .circular{
      width: 100%;
      height: 100%;
      border-radius: 50%;
      border: 4px solid #390933;
      height: var(--tt);
      width: var(--tt); 
      font-size: 10px;
    position: relative;
    text-indent: -9999em;
    border-top: 0.3em solid rgba(225, 1, 1, 0.2);
    border-right: 0.3em solid rgba(191, 8, 8, 0.2);
    border-bottom: 0.3em solid rgba(255, 9, 9, 0.2);
    border-left: 0.3em solid #5b0000;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 .25s infinite linear;
    animation: load8 .25s infinite linear;

 }

@keyframes load8 {
    0% {
        -webkit-transform: rotate(
    0deg);
        transform: rotate(
    0deg);
    }
    100% {
        -webkit-transform: rotate(
    360deg);
        transform: rotate(
    360deg);
    }
}
.carregamento div .maincircular .circular,  .carregamento div .maincircular .circular:after {
    border-radius: 50%;
}

.logo-nav{
    display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: flex-start;
}

.logo-nav div:nth-child(2) img{
    height: 25px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    margin-top: -20px;
}

.logo-nav div:nth-child(1) span{
    letter-spacing: .1em;
    line-height: 0.5rem;
    color: #333;
    font-size: 24px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

#titledarkmode{
    color: #fff;
    margin-left: -110px;
    margin-top: -50px;
    opacity: 0;
}


@media screen and (max-width: 390px){
    .logo-nav div:nth-child(1) span{
        font-size: 20px;
    }
}

#root #Dice1 [info], #root #Coin_Flip1 [info], #root #Poker1 [info]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    padding: 20px 0px;
}

#root #Dice1 [info] button, #root #Coin_Flip1 [info] button, #root #Poker1 [info] button{
    border: none;
    background: white;
    color: #333;
    font-size: 22px;
    border-bottom: 1px #ffffff solid;
    margin: 0px 20px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

#root #Dice1 [info] button[select], #root #Coin_Flip1 [info] button[select], #root #Poker1 [info] button[select]{
    border-color: #390933;
    color: #390933;
}
.thead {
    display: table-header-group;
}

.thead .th {
    display: table-cell;
    color: #333;
    padding: 10px 7px;
    text-align: left;
    border-bottom: 1px #333 solid;
    text-transform: uppercase;
    flex:1;
}

.tr {
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
}

.thead .th:first-child {
    padding-left: 20px;
}

.right {
    text-align: right!important;
}

.center {
    text-align: center!important;
}

.thead .th:nth-child(3){
    flex: 2.5;
    text-align: center;

}

#root #Dice1 [bb1] [bxd],#root #Coin_Flip1 [bb1] [bxd]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    width: 100%;
    max-width: 376px;
    /* margin: auto; */
    margin: 20px 0px;
    margin-left: 20px;
    border: 1px solid #e0e0e0;
    padding: 15px;
    box-shadow: -5px 5px 10px 0px #e0e0e0;
    border-radius: 10px;
}

#root #Dice1 [bb1] [bxd] [ox],#root #Coin_Flip1 [bb1] [bxd] [ox]{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    flex: 1;
}

#root #Dice1 [bb1] [bxd] [ox]:nth-child(2),#root #Coin_Flip1 [bb1] [bxd] [ox]:nth-child(2){
    flex: 0.4;
    margin-left: 15px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

#root #Dice1 [bb1] [bxd] [ox]:nth-child(2) span,#root #Coin_Flip1 [bb1] [bxd] [ox]:nth-child(2) span{
    color: #333;
    font-size: 14px;
    text-align: center;
}

#root #Dice1 [bb1] [bxd] [ox]:nth-child(2) p,#root #Coin_Flip1 [bb1] [bxd] [ox]:nth-child(2) p {
    border: 1px solid #e0e0e0;
    width: 100%;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    height: 36px;
    /* box-shadow: -5px 5px 10px 0px #e0e0e0; */
    border-radius: 10px;
    margin: 10px 0px;
    margin-bottom: 15px;
}

#root #Dice1 [bb1] [bxd] [ox] [x12],#root #Coin_Flip1 [bb1] [bxd] [ox] [x12]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}

#root #Dice1 [bb1] [bxd] [ox] [x12] span,#root #Coin_Flip1 [bb1] [bxd] [ox] [x12] span{
    font-size: 14px;
    color: #000;
    flex: 1;
}

#root #Dice1 [bb1] [bxd] [ox] [x12] button,#root #Coin_Flip1 [bb1] [bxd] [ox] [x12] button{
    border-radius: 2px;
    border: 0px;
    background-color: #018c77;
    color: #fff;
    font-size: 13px;
    margin: 0px 2px;
    text-transform: lowercase;
}

#root #Dice1 [bb1] [bxd] [ox] input,#root #Coin_Flip1 [bb1] [bxd] [ox] input{
    color: #333;
    font-size: 16px;
    border: 1px solid #e0e0e0;
    padding: 5px 16px;
    border-radius: 10px;
    height: 36px;
    text-align: center;
    display: flex;
    margin: 10px 0px;
    margin-bottom: 15px;
}
input[type="number"]::-webkit-inner-spin-button { 
    -webkit-appearance: none;
    
}
input[type="number"] { 
   -moz-appearance: textfield;
   appearance: textfield;

}
p[x12]{
    color: #018c77;
    font-size: 14px;
    margin: 0px;
    margin-bottom: 10px;
}

p[x12] span{
    margin-left: 5px;
}

#root #Dice1 [bb1] [bxd] [ox] button[rol],#root #Coin_Flip1 [bb1] [bxd] [ox] button[rol]{
    border: 1px solid #018c77;
    background: #018c77;
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
    border-radius: 10px;
    height: 40px;
}

[onselect="menu()"]{
    display: none;
    width: 45px;
    height: 45px;
    border: 1px solid #390933;
    background: #390933;
    border-radius: 10px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    padding: 0px;
}

[onselect="menu()"] img{
    width: 60%;
    height: 60%;
    filter: invert(1);
}



@media screen and (max-width: 690px){
    nav div a{
        display: none;
    }
    nav div a[href="#Home"],[onselect="menu()"]{
        display: flex;
    }
}



@media screen and (max-width: 340px){
#root #Dice1, #root #Coin_Flip1{
    padding: 20px;
}
}

.menu{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
}

.menu a{
    color: #333;
    border: 1px solid #390933;
    border-radius: 10px;
    padding: 10px !important;
    margin-top: 10px !important;
    height: fit-content !important;
    background-color: #390933;
    color: #fff !important;
    font-size: 16px;
}


.menu a p{
    margin: 0px;
    color: #fff !important;
}

.menu h3{
    margin: 10px 0px;
    font-size: 22px;
    color: #333;
}

#balanceW,#balanceW1{
    display: flex !important;
}

#root #Coin_Flip1 [bb1] [bxd] [ox] button[rol][select]{
    box-shadow: -5px 10px 10px 0px #e0e0e0;
}

#root #Dice1 [bb2] [c2] a, #root #Coin_Flip1 [bb2] [c2] a,#root #Poker1 [bb2] [c2] a,#root #Poker1 [bb2] [c1] a,
#root #Dice1 [bb1] [c2] a, #root #Coin_Flip1 [bb1] [c2] a,
#root #Dice1 [bb2] [c1] a, #root #Coin_Flip1 [bb2] [c1] a,
#root #Dice1 [bb1] [c1] a, #root #Coin_Flip1 [bb1] [c1] a{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    color: #333;
}

#root #Dice1 [bb2] [c2] a p, #root #Coin_Flip1 [bb2] [c2] a p,#root #Poker1 [bb2] [c2] a p,#root #Poker1 [bb2] [c2] a span,
#root #Dice1 [bb1] [c2] a p, #root #Coin_Flip1 [bb1] [c2] a p,#root #Poker1 [bb2] [c1] a p,#root #Poker1 [bb2] [c1] a span,
#root #Dice1 [bb2] [c2] a span, #root #Coin_Flip1 [bb2] [c2] a span,
#root #Dice1 [bb1] [c2] a span, #root #Coin_Flip1 [bb1] [c2] a span,
#root #Dice1 [bb2] [c1] a p, #root #Coin_Flip1 [bb2] [c1] a p,
#root #Dice1 [bb1] [c1] a p, #root #Coin_Flip1 [bb1] [c1] a p,
#root #Dice1 [bb2] [c1] a span, #root #Coin_Flip1 [bb2] [c1] a span,
#root #Dice1 [bb1] [c1] a span, #root #Coin_Flip1 [bb1] [c1] a span{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    text-align: center;
}

#root #Dice1 [bb2] [c2] a p:nth-child(1), #root #Coin_Flip1 [bb2] [c2] a p:nth-child(1),#root #Poker1 [bb2] [c1] a p:nth-child(1),#root #Poker1 [bb2] [c2] a p:nth-child(1),
#root #Dice1 [bb1] [c2] a p:nth-child(1), #root #Coin_Flip1 [bb1] [c2] a p:nth-child(1),
#root #Dice1 [bb2] [c1] a p:nth-child(1), #root #Coin_Flip1 [bb2] [c1] a p:nth-child(1),
#root #Dice1 [bb1] [c1] a p:nth-child(1), #root #Coin_Flip1 [bb1] [c1] a p:nth-child(1){
    max-width: 100px;
    margin-right: 20px;
    border-bottom: 1px solid #333;
}

#root #Dice1 [bb2] [c2] a span:nth-child(2), #root #Coin_Flip1 [bb2] [c2] a span:nth-child(2),#root #Poker1 [bb2] [c2] a span:nth-child(2),
#root #Dice1 [bb1] [c2] a span:nth-child(2), #root #Coin_Flip1 [bb1] [c2] a span:nth-child(2),#root #Poker1 [bb2] [c1] a span:nth-child(2),
#root #Dice1 [bb2] [c1] a span:nth-child(2), #root #Coin_Flip1 [bb2] [c1] a span:nth-child(2),
#root #Dice1 [bb1] [c1] a span:nth-child(2), #root #Coin_Flip1 [bb1] [c1] a span:nth-child(2){
    max-width: 150px;
}

#root #Dice1 [bb2] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c2] a p:nth-child(3),
#root #Dice1 [bb1] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c2] a p:nth-child(3),
#root #Dice1 [bb2] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c1] a p:nth-child(3),
#root #Dice1 [bb1] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c1] a p:nth-child(3){
    margin: 0px 100px;
}

#root #Dice1 [bb2] [c2] a span:nth-child(4), #root #Coin_Flip1 [bb2] [c2] a span:nth-child(4),
#root #Dice1 [bb1] [c2] a span:nth-child(4), #root #Coin_Flip1 [bb1] [c2] a span:nth-child(4),
#root #Dice1 [bb2] [c1] a span:nth-child(4), #root #Coin_Flip1 [bb2] [c1] a span:nth-child(4),
#root #Dice1 [bb1] [c1] a span:nth-child(4), #root #Coin_Flip1 [bb1] [c1] a span:nth-child(4){
    margin-right: 30px;
}

@media screen and (max-width: 900px){
    #root #Poker1 [bb2] [c2] a p:nth-child(3),#root #Poker1 [bb2] [c1] a p:nth-child(3),#root #Dice1 [bb2] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c2] a p:nth-child(3), #root #Dice1 [bb1] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c2] a p:nth-child(3),
    #root #Dice1 [bb2] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c1] a p:nth-child(3), #root #Dice1 [bb1] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c1] a p:nth-child(3){
        margin: 0px 70px;
    }
}

@media screen and (max-width: 730px){
    #root #Dice1 [bb1] [vx]{
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
    }
    #root #Dice1 [bb1] [vx] [cd], #root #Dice1 [bb1] [vx] [dc]{
        padding: 20px 60px;
    }
    .thead .th:nth-child(3){
        display: none;
    }
    #root #Poker1 [bb2] [c2] a p:nth-child(2),#root #Poker1 [bb2] [c1] a p:nth-child(2),#root #Dice1 [bb2] [c2] a span:nth-child(2), #root #Coin_Flip1 [bb2] [c2] a span:nth-child(2), #root #Dice1 [bb1] [c2] a span:nth-child(2), #root #Coin_Flip1 [bb1] [c2] a span:nth-child(2),
    #root #Dice1 [bb2] [c1] a span:nth-child(2), #root #Coin_Flip1 [bb2] [c1] a span:nth-child(2), #root #Dice1 [bb1] [c1] a span:nth-child(2), #root #Coin_Flip1 [bb1] [c1] a span:nth-child(2){
        display: none;
    }
    #root #Poker1 [bb2] [c2] a p:nth-child(3),#root #Poker1 [bb2] [c1] a p:nth-child(3),#root #Dice1 [bb2] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c2] a p:nth-child(3), #root #Dice1 [bb1] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c2] a p:nth-child(3),
    #root #Dice1 [bb2] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c1] a p:nth-child(3), #root #Dice1 [bb1] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c1] a p:nth-child(3){
        margin: 0px 20px;
    }
}

@media screen and (max-width: 453px){
    #root #Dice1, #root #Coin_Flip1, #root #Referrals1{
        padding: 20px;
        padding-top: 40px;
        margin: 0px;
    }
    .thead{
        display: none;
    }

    #root #Dice1 [bb1] [vx] [ccd] div{
        width: 140px;
    }

    #root #Dice1 [bb1] [bxd], #root #Coin_Flip1 [bb1] [bxd]{
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: nowrap;
        align-items: stretch;
        margin: 0px;
    }
    #root #Dice1 [bb1] [bxd] [ox] [x12] span, #root #Coin_Flip1 [bb1] [bxd] [ox] [x12] span{
        display: none;
    }
    #root #Poker1 [bb2] [c2] a p:nth-child(3),#root #Poker1 [bb2] [c1] a p:nth-child(3),#root #Dice1 [bb2] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c2] a p:nth-child(3), #root #Dice1 [bb1] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c2] a p:nth-child(3),
    #root #Dice1 [bb2] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c1] a p:nth-child(3), #root #Dice1 [bb1] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c1] a p:nth-child(3){
        margin: 0px 5px;
    }
    #root #Poker1 [bb2] [c2] a span:nth-child(4),#root #Poker1 [bb2] [c1] a span:nth-child(4),#root #Dice1 [bb2] [c2] a span:nth-child(4), #root #Coin_Flip1 [bb2] [c2] a span:nth-child(4), #root #Dice1 [bb1] [c2] a span:nth-child(4), #root #Coin_Flip1 [bb1] [c2] a span:nth-child(4),
    #root #Dice1 [bb2] [c1] a span:nth-child(4), #root #Coin_Flip1 [bb2] [c1] a span:nth-child(4), #root #Dice1 [bb1] [c1] a span:nth-child(4), #root #Coin_Flip1 [bb1] [c1] a span:nth-child(4){
        margin-right: 10px;
    }
}

@media screen and (max-width: 390px){
    #root #Poker1 [bb2] [c2] a p:nth-child(3),#root #Poker1 [bb2] [c1] a p:nth-child(3),#root #Dice1 [bb2] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c2] a p:nth-child(3), #root #Dice1 [bb1] [c2] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c2] a p:nth-child(3),#root #Dice1 [bb2] [c2] a span:nth-child(4), #root #Coin_Flip1 [bb2] [c2] a span:nth-child(4), #root #Dice1 [bb1] [c2] a span:nth-child(4), #root #Coin_Flip1 [bb1] [c2] a span:nth-child(4),
    #root #Dice1 [bb2] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb2] [c1] a p:nth-child(3), #root #Dice1 [bb1] [c1] a p:nth-child(3), #root #Coin_Flip1 [bb1] [c1] a p:nth-child(3),#root #Dice1 [bb2] [c1] a span:nth-child(4), #root #Coin_Flip1 [bb2] [c1] a span:nth-child(4), #root #Dice1 [bb1] [c1] a span:nth-child(4), #root #Coin_Flip1 [bb1] [c1] a span:nth-child(4){
        display: none;
    }
}

#root #Dice1, #root #Coin_Flip1, #root #Referrals1{
    display: none;
}

#root #Poker1{
    display: flex;
}

[assets]{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
    height: 50px;
}

[assets] button{
    color: #333;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    background-color: #fff;
    font-size: 18px;
    height: 100%;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    max-width: 376px;
    width: 100%;
    box-shadow: -5px 5px 10px 0px #e0e0e0;
    padding: 0px 20px;
    margin-left: 20px;
}
[assets] button p{
    flex: 1
}

[assets] button img{
    height: 60%;
}

#selectToken{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    padding: 30px 0px;
}

#selectToken div:nth-child(1),#selectToken div:nth-child(4){
    display: flex;
    width: 80%;
    margin: auto;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    margin-bottom: 30px;
}

#selectToken div:nth-child(1) p{
    flex: 1;
    font-size: 18px;
    color: #333;
}

#selectToken div:nth-child(1) button{
    background-color: #fff;
    width: 23px;
    height: 23px;
    border: none;
    color: #390933;
}

#selectToken div input{
    width: 71.2%;
    padding: 8px 14px;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    font-size: 16px;
}
#selectToken div:nth-child(3){
    width: 80%;
    margin: 10px auto;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    margin-top: 0px;
    overflow-y: auto;
    height: 300px;
}

#selectToken div:nth-child(3) p{
    width: 100%;
    text-align: left;
    font-size: 16px;
    color:#333;
}

#selectToken div:nth-child(2){
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}


#selectToken div:nth-child(3) button{
    flex: 1;
    border: 1px solid #e0e0e0;
    background: #fff;
    color: #333;
    padding: 10px 0px;
    border-radius: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px;
    box-shadow: -5px -5px 10px 0px #e0e0e0;
    font-size: 17px;
}


.darkmodeswitch{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 100%;
    background: #ffb237;
    color: #fff;
}

.darkmodeswitch p{
    font-weight: 400;
    line-height: 1.5;
    font-size: 16px;
    margin-left: 10px;
}

.NGDqM{
    -webkit-box-align: center;
    align-items: center;
    background-color: #bdc2c4;
    border-radius: 24px;
    box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,.1);
    cursor: pointer;
    display: inline-flex;
    height: 32px;
    position: relative;
    transition: background-color 200ms ease 0s;
    width: 56px;
}

.jvmsuU {
    cursor: pointer;
    opacity: 0;
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 3;
}

.hzjdsu {
    background-color: #fff;
    border-radius: 50%;
    cursor: pointer;
    height: 26px;
    left: 3px;
    position: absolute;
    top: 3px;
    transition: left 200ms ease-in 0s;
    width: 26px;
    z-index: 1;
}

.hRJWfO {
    display: flex;
    justify-content: space-around;
    -webkit-box-align: center;
    align-items: center;
}

.cbIPWo {
    width: 100%;
    height: 100%;
}

.hBHgZr {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}

.qopKT {
    height: 100%;
}

@supports (-webkit-text-size-adjust:none) and (not (-ms-accelerator:true)) and (not (-moz-appearance:none)){
    .FKqoM {
        filter: none !important;
    }
}

.FKqoM {
    align-self: center;
    fill: #ffb237;
    color: #ffb237;
    flex-shrink: 0;
}

@supports (-webkit-text-size-adjust:none) and (not (-ms-accelerator:true)) and (not (-moz-appearance:none)){
    .kONOCo {
        filter: none !important;
    }
    
}

.kONOCo {
    align-self: center;
    fill: #fff;
    color: #fff;
    flex-shrink: 0;
}

#selectToken div:nth-child(4){
    display: none;
    margin-bottom: 0px;
    margin-top: 20px;
    padding: 10px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
}

#selectToken div:nth-child(4) div{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    flex: 0;
    margin: 0px;
}

#selectToken div:nth-child(4) button{
    margin-left: auto;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    padding: 10px;
    background: #fff;
}

#root #Poker1{
    display: flex;
    padding: 0px;
    align-items: stretch;
    justify-content: flex-start;
}

#root #Poker1 iframe{
    width: 100%;
    height: 400px;
}