body {
    color: white;
}

.logo {
    margin-top: -42px; 
}

.wheel-container {
    position: absolute;
    right: 200px;
    top: 70%;
    transform: translateY(-50%);

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0px; 
}

.left-panel {
    position: absolute;
    left: 200px;
    top: 75%;
    transform: translateY(-50%);

    display: flex;
    flex-direction: row;
    gap: 40px;

    text-align: center;
}

.bet-option {
    margin-bottom: 20px;
}

.state {
    font-size: 40px;
    margin: 0;
}

.state.off {
    color: red;
}

.state.on {
    color: lime;
}

body {
    text-align: center;
    background-color: #000000;
    margin: 0;
    min-height: 100vh;

    border: 8px solid red;

    animation: rgbBorder 3s linear infinite;
    box-shadow:
        0 0 20px red,
        0 0 40px red,
        0 0 60px red;
}

@keyframes rgbBorder {
    0% {
        border-color: red;
        box-shadow: 0 0 20px red, 0 0 40px red;
    }
    25% {
        border-color: lime;
        box-shadow: 0 0 20px lime, 0 0 40px lime;
    }
    50% {
        border-color: cyan;
        box-shadow: 0 0 20px cyan, 0 0 40px cyan;
    }
    75% {
        border-color: blue;
        box-shadow: 0 0 20px blue, 0 0 40px blue;
    }
    100% {
        border-color: red;
        box-shadow: 0 0 20px red, 0 0 40px red;
    }
}




#rouletteNumber {
    font-size: 100px;
    color: white;
    margin-bottom: 20px;
    text-shadow:
        0 0 10px red,
        0 0 20px red,
        0 0 40px red;
}





.button{
  position:relative;
  display:inline-block;
  margin:20px;
}

.button a{
  color:white;
  font-family:Helvetica, sans-serif;
  font-weight:bold;
  font-size:36px;
  text-align: center;
  text-decoration:none;
  background-color:#FFA12B;
  display:block;
  position:relative;
  padding:20px 40px;
  
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  text-shadow: 0px 1px 0px #000;
  filter: dropshadow(color=#000, offx=0px, offy=1px);
  
  -webkit-box-shadow:inset 0 1px 0 #FFE5C4, 0 10px 0 #915100;
  -moz-box-shadow:inset 0 1px 0 #FFE5C4, 0 10px 0 #915100;
  box-shadow:inset 0 1px 0 #FFE5C4, 0 10px 0 #915100;
  
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

.button a:active{
  top:10px;
  background-color:#F78900;
  
  -webkit-box-shadow:inset 0 1px 0 #FFE5C4, inset 0 -3px 0 #915100;
  -moz-box-shadow:inset 0 1px 0 #FFE5C4, inset 0 -3pxpx 0 #915100;
  box-shadow:inset 0 1px 0 #FFE5C4, inset 0 -3px 0 #915100;
}

.button:after{
  content:"";
  height:100%;
  width:100%;
  padding:4px;
  position: absolute;
  bottom:-15px;
  left:-4px;
  z-index:-1;
  background-color:#2B1800;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}