.error{
    background:#ba1f38;
    color:#fff;
    width:100%;
    z-index:10000;
    }
    
    .top{
    display:flex;
    flex-direction:row;
    align-items:center;
    width:100%;
  }
    
    .top-logo{
      display:flex;
      flex-direction:row;
      justify-content:flex-start;
      align-items:center;
      padding-left:1px;
      }
    
      .top-title{
        display:flex;
        flex-direction:row;
        justify-content:space-around;
        flex:1;
        align-items:center
        }
      
      .top-controls{
      display:flex;
      flex-direction:row;
      align-items:center;
      justify-content:flex-end;
      flex:1;
      }
    
    .top-controls>*{
    margin-left:4px
    }
    
    .balance{
    display:flex;
    flex-direction:row;
    border-radius:4px;
    padding:1px;
    height:24px;
    box-sizing:border-box;
    background:#000;
    font-size:10px
    }
    
    .balance-label{
    padding:0px 1px;
    display:flex;
    align-items:center;
    color:#fff
    }
    
    .balance-value{
    display:flex;
    align-items:center;
    border-top-right-radius:4px;
    border-bottom-right-radius:4px;
    padding:0px 1px;
    background:#fff;
    color:#000;
    font-weight:bold
    }
    
    .balance-value .currency{
    color:#797d88;
    font-weight:normal
    }
    
    .top-button{
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:4px;
    width:24px;
    height:24px;
    cursor:pointer;
    box-sizing:border-box;
    color:#fff;
    }
    
    .top-button:hover,.top-button:active,.top-button:focus{
    background:rgba(0,0,0,0.9)
    }
    
    .top-button>*{
    width:6px;
    height:16px
    }
    
    .info-page{
    font-family:'Noto Sans', sans-serif;
    padding:0 8px 16px;
    margin-top:24px
    }
    
    
    
    .info-page p{
    margin:0 0 8px;
    font-size:14px
    }
    
    .info-page div{
    margin-bottom:16px
    }
    
  html,body{
    margin:0;
    padding:0;
    font-family:'Noto Sans', sans-serif;
    height:100%;
    overflow:auto;
    color:#000;
    background-color:#57694F;
    font-size:14px;
    box-sizing: border-box;
    }
  
    
    .wrapper{
    display:flex;
    flex-direction:column;
      height: 100vh;
      justify-content: center;
      align-items: center;
      position:relative;
  
    }
    
    .game-area{
  
    display:flex;
    flex-direction:column;
    position:relative
    }
    
    .game-area-content{
      padding-left:5px;
      padding-right: 5px;
    }
    .game-area-results{
  
    display:flex;
    width:100%;
    flex-direction:column;
    align-items:center;
    text-align:center;
    position:relative;
    z-index:+1;
    padding:0px;
    }
    
    .game-area-results>svg{
    height:74px
    }
    
    .game-area-value{
    display:flex;
    flex-direction: column;
    align-items: center;
      
    height:30px;
    width:100%;
    }
     .game-area-value h1{
    margin:0;
    font-size:14px;
    font-weight:bold;
    color:#000
    }
  
    
    .game-area-value-row {
      display:flex;
      flex-direction: column;
      align-items: center;
      flex:1;
    }
    .game-area-value-info {
      display:flex;
      flex-direction: column;
      align-items: flex-start;
     
    }
    .game-area-value-icon {
      width:40px;
      padding: 0px 10px;
    }
  
    .game-area-results .payout{
    display:flex;
    flex-direction:row;
    text-align:right;
    padding:8px 24px;
    border-radius:8px;
    margin-top:8px;
    width:100%;
    background-color:#fff
    }
    .contentForm {
        display:flex;
        flex-direction:column;
        position:relative;
    
        width:100%;
        z-index:+1;
    }
  

    
    
    .history{
    display:flex;
    flex-direction:row;
    color:#fff;
    background:#000}
  
    .bets{
    display:flex;
    align-items:center;
    flex-direction: row;
    overflow:hidden;
    margin-left:5px;}
    
    .bets .no-bets{
    color:rgba(255,255,255,0.57);
    font-size:10px;
    font-style:italic}
    
    .bets .entry{
    display:block;
    padding:2px 4px;
    border-radius:4px;
    margin-right:4px;
    font-size:10px;
    color:#fff}
    

    
   
    .payoutrow{
    display:flex;
    flex-direction:column;
    align-items:center;
    color:#000;
    background:#fff}
    
    .payout-calculation{
    display:flex;
    flex-direction:row;
    align-items:center;
    background-color: #fff;
    border-width:0px;
    padding:0px 0;
    font-size:14px}
    
    .payout-calculation>span{
    flex:1;
    color:rgba(0,0,0,0.57)}
    
    
    .payout-calculation .button{
    display:flex;
    flex-direction:row;
    align-items:center;
    border-radius:4px;
    border:0;
    cursor:pointer;
    background:#fff;
    color:#000}
    
    .payout-calculation .button>div{
    display:flex;
    align-items:center}
    
    .payout-calculation .button span{
    font-weight:bold;
    font-size:14px}
    
    .payout-calculation .button svg{
    width:21px;
    height:21px;
    margin-right:4px;
    fill:#000}
    
    .input-group{
    border-radius:0px;
    display:flex;
    flex-direction:row;
    height:35px;
    position:relative;
    overflow:hidden;
    border:1px solid #000}
    
    .input-group>*{
    flex:1}
    
    .input{
    display:flex;
    flex-direction:row;
    align-items:flex-end}
    
    .input .label{
    position:absolute;
    top:0;
    left:1px;
    color:#797d88;
    font-size:10px}
    
    .input .labelWhite{
        position:absolute;
        top:0;
        left:4px;
        color:#fff;
        font-size:10px}
    
   
  
    
    .stake-button{
    margin:3px;
    border:0;
    border-radius:4px;
    cursor:pointer;
    background:#000;
    color:#fff}
    
   
    .stake-button.selected{
    background:#efd68b;
    color:#000}
    
    input.align-right{
    text-align:right}
    
    
    .goal {
      width: 100%;
      height: 40px;
      position: relative;
      border-top: 2px solid black;
      border-left: 2px solid black;
      border-right: 2px solid black;
      box-sizing: border-box;
        
    }
    
  
      
      .goalkeeper {
        width: 4px;
        position: absolute;
        left: 30%;
        margin-left: -2px;
        z-index: +1;
        bottom: 0;
      }
      
  
        .controlsArea{
           border-top-left-radius:8px;
          border-top-right-radius:8px;
          background:#fff;
            margin-top:180px;
          }
          
          .controlsArea form{
          display:flex;
          flex-direction:column;
          margin:0}
          
        .control-settings {
          display:flex;
            flex-direction:row;
            align-items:center;
            background-color:#000;
        }
        
        .control-div {
          flex:1;
          display:flex;
            flex-direction:row;
            position:relative;
            box-sizing:border-box;
            align-items:center;
            background-color:#333;
            padding:2px;
              width:100%;
        }
        
        .goalyrow {
          width:100%;
          display:flex;
            flex-direction:column;
            box-sizing:border-box;
            padding:2px;
            background-color:#333;
        }
        
        .controls {
          width:100%;
          
          display:flex;
            flex-direction:column;
            box-sizing:border-box;
            background-color:#333;
        }
        .controls-labels {
        
            display:flex;
            flex-direction:row;
            align-items:center;
            font-size:10px;
            color: #fff;
            padding-left: 5px;
            padding-right: 5px;
        }
        .controls-labels label {
            flex:1;
            white-space:nowrap;
            text-overflow: clip;
            text-align:center;
            
        }
  
        .controls-labels label:first-of-type {
          flex:unset;
          width:40%;
        }
        
        .controls-controls {
            display:flex;
            flex-direction:row;
            align-items:center;
            background-color:#333;
            margin-bottom: 2px;
            flex:1;
        }
  
        .controls-footer {
          display:flex;
          flex-direction:row;
          align-items:center;
          background-color:#333;
          padding: 2px;
          flex:1;
      }
        .stake-input {
            display: flex;
            flex-direction: row;
            padding:1px;
            border-radius:2px;
            height:100%;
            box-sizing: border-box;
            background-color: #555;
            padding-left:5px;
            
        }
        .stake-input>button {
          display:block;
            width:18px;
            height:18px;
            border-radius:18px;
            cursor:pointer;
            border:0;
            appearance: none;
            outline:none;
            background-color: #333;
            color:#f18901;
        }
         .stake-input>input {
            height:100%;
            box-sizing: border-box;
            height:100%;
            min-width:0;
            display:inline-block;
            text-align:center;
            appearance: none;
            outline: none;
            border: 0;
            background-color: #555;
            font-size:12px;
            color:white;
              width: 10ch;
        }
  
      .stake-inputInput{
          width:4ch;
          }
        
        .stake-buttons {
         
          flex:1;
            display: flex;
            flex-direction: row;
            padding:1px;
          border-radius:2px;
            height:100%;
            box-sizing: border-box;
            background-color: #e8ce3c;
            padding:3px;
            margin-left:2px;
            margin-right: 2px;
        }
        
        .stake-buttons>button {
          flex:1;
            height:100%!important;
            margin:0;
            padding:0px;
            text-align:center;
            cursor:pointer;
            border:0;
            border-radius:2px;
            appearance: none;
            outline:none;
            font-size:12px;
            color:#fff;
            background: #614F69;
        }

        .button-border:not(:empty) {
          transform: translateZ(0);}
  
        .CTA {
          display:flex;
            flex-direction:row;
            align-items:flex-start;
            box-sizing:border-box;
            flex:1;
            height:90px;
        
        }
        
        
        .CTA>button {
            flex:1;
            height:100%!important;
            width:46px;
            margin:0;
            padding:0;
            text-align: center;
            position:relative;
            cursor:pointer;
            border:0;
            appearance: none;
            outline:none;
            border-radius:2px;
            background-color: #f18901;
            color:#fff;
        }

        .slots{
            display:flex;
            flex-direction:row;
            align-items:center;
            margin: 0px;
            flex:1;
            border:2px;
            border-style: solid;
          }
    
          .slot-buttons {
           
              flex:1;
              display: flex;
              flex-direction: row;
              padding:1px;
              border-radius:2px;
              height:100%;
              box-sizing: border-box;
              background-color: #fff;
              padding:6px;
              margin:0px;
              border:2px;
              border-style: solid;
          }

          .slot-buttonsTop {
       
            flex:1;
            display: flex;
            flex-direction: row;
            padding:1px;
            border-radius:2px;
            height:100%;
            box-sizing: border-box;
            background-color: #fff;
            padding:6px;
            padding-top:0px;
            padding-bottom: 6px;
            margin:0px;
            border:2px;
            border-style: solid;
        }
    
        .slot-buttonsBottom {
           
          flex:1;
          display: flex;
          flex-direction: row;
          padding:1px;
          border-radius:2px;
          height:100%;
          box-sizing: border-box;
          background-color: #fff;
          padding:6px;
          padding-bottom:0px;
          padding-top: 6px;
          margin:0px;
          border:2px;
          border-style: solid;
      }
  
    .table-container {
      display: flex;
      flex-direction: column;
      height: 100vh;
      justify-content: top;
      align-items: center;
      position:relative;
      width:100%;
      max-width: 800px;
      margin:auto;
    }
    
    table {
      width: 100%;
      height: 100vh;
      border-collapse: collapse;
      border: 0px solid #000;
      box-sizing:border-box;
    }
  
    th, td {
      text-align: center;
      border:none;
      padding:0;
    }
  
    th:first-child {
  
    }
  
    th:last-child,
    td:last-child {
      text-align: right;
  
    }
  
    tr:nth-child(2) th:first-child {
      text-align: center;
      colspan: 4;
  
  
    }
  
    tr:nth-child(3) th:first-child,
    tr:nth-child(3) td:first-child {
  
      text-align: center;
      colspan: 4;
    }
  
    tr:nth-child(4) th:first-child,
    tr:nth-child(4) td:first-child {
      text-align: left;
      colspan: 4;
  
  
    }
  
    tr:nth-child(5) th,
    tr:nth-child(5) td {
      colspan=1;
  
  
    }
  
    tr:nth-child(6) th:first-child,
    tr:nth-child(6) td:first-child {
      text-align: center;
      colspan: 4;
  
  
    }
  
  .row1{
      height:27px;
  }
  .row2{
      height:30px;
  }
  .row3{
      height:auto;
  }
  .row4{
      height:20px;
  }
  .row5{
      height:20px;
  }
  
  
  .colspan-1 {
      colspan:1;
  }
  .colspan-2 {
      colspan:2;
  }
  .colspan-4 {
      colspan:4;
  }
  
  .colleft {
      text-align: left;
  }
  .colright {
      text-align: right;
  }
  .colcenter {
      text-align: center;
  }
