body {
    font-family: 'Barlow', sans-serif;
    font-size: 18px;
    margin: 0;
    overflow-x: hidden;
    color: rgba(4, 0, 66, 0.8313725490196079);
    letter-spacing: -0.5px;
}

.ui-autocomplete {
    font-size: 0.8em;
    font-weight: normal;
    padding: 0.25em;
    background-color: #deeefa;
}
.ui-autocomplete .ui-menu-item {
    background-color: wheat;
}

body.modal-open {
        overflow: initial !important;
    }

header {
    margin: 0 2px;
}

*, *:active, *:focus, *:hover {
    outline: none;
}

.mainContainer {
    margin: 3px 2px 0 2px;
}

.linethrough {
    text-decoration: line-through;
}

strong {
    font-weight: 600;
}

.maxwidth button, .maxwidth select {
    width: 100%;
}

.jconfirm-box-container {
    width: fit-content
}

.jconfirm-content {
    overflow: hidden !important;
}
.low {
    background-color: rgba(255, 0, 0, 0.65);
    color: white;
    text-shadow: 0 0 5px black;
    box-shadow: 0 0 15px rgba(0,0,0,0.3);
}

.high {
    background-color: rgba(255, 0, 0, 0.65);
    color: white;
    text-shadow: 0 0 2px red;
}

.highlight {
    background-color: rgba(255, 255, 0, 0.55);
    color: blue;
    box-shadow: 0 0 15px rgba(0,0,0,0.3);
    font-weight: bold;
}

.currency {
    font-weight: bold;
    display: inline-block;
    text-align: left;
}

.wordbreak {
    padding-left: 2vh;
}

.grid {
    display: grid;
    grid-auto-rows: 1fr;
    grid-template-areas: "a a a";
    width: fit-content
}

.grid5 {
    grid-template-areas: "a a a a a"
}

.green {
    color: green;
}

.red {
    color: red;
}

.blue {
    color: blue;
}

.lightgreen {
    color: lightgreen;
}

.lightblue {
    color: lightblue;
}

.yellow {
    color: yellow;
}

.orange {
    color: orange;
}

#brandSelection {
    margin: 0.9vh;
}

.pad1emh {
    padding: 0 1em !important;
}

.pad05emv {
    padding: 0.5em 0 !important
}

#brandSelection select {
    height: initial;
}

.btn {
    font-size: 90%;
    background-color: rgba(129, 234, 137, 0.2784313725490196) !important;
    color: rgba(4, 0, 66, 0.8313725490196079);
    border-width: 3px;
    min-width: 130px;
    border-color: rgb(90 169 147 / 68%);
    border-style: groove;
    border-radius: 5px;
}

.btn.btn-tiny {
    height: 30px;
    padding: 0 5px;
    margin: 0 5px 0 0;
    min-width: initial;
}

.btn.btn-danger {
    background-color: rgba(234, 129, 137, 0.2784313725490196) !important;
    border: 0;
}

.btn.btn-info {
    background-color: rgba(0, 102, 255, 0.33) !important;
    min-width: 90% !important;
}

.userhighlight, .userreferral, .userlanding {
    background-color: rgb(217, 244, 217);
}

.userhighlight a, .userreferral a, .userlanding a{
    padding: 0;
}

.userlanding {
    background-color: rgb(230, 230, 239);
}

.bad {
    color: red;
}

.good {
    color: green;
}

.grey {
    color: grey;
}

.unverified {
    color: orange;
}

.btn.disabled {
    opacity: .25;
}

.btn.disabled:hover {
    background-color: rgba(129, 234, 137, 0.2784313725490196) !important;
}

#frmConfig .btn {
    min-width: initial;
    margin: 0 1px;
    height: 32px;
    padding-top: 0;
    padding-bottom: 0;
}

.btn-primary {
    color: rgba(4, 0, 66, 0.8313725490196079);
    border: 0;
}

.btn-success {
    box-shadow: 0 0 1px black;
}

.btn:active, .btn:focus {
    color: rgba(4, 0, 66, 0.8313725490196079);
    border-color: initial;
}

.btn:hover {
    background-color: rgba(13,255,77,0.5) !important;
    color: rgba(4, 0, 66, 0.8313725490196079);
}

.row {
    margin: 0;
    padding-left: 2px;
}

.row div {
    padding: 0;
}

.ui-datepicker {
    font-size: 85%;
    z-index: 1000 !important;
}

.totalRow {
    font-weight: bold;
    border-top: 1px solid rgba(0, 0, 0, 0.75);
    background-color: #f5fff4 !important;
}

.split {
    word-wrap: break-word;
}

h4 {
    padding: 0.5vh 0;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0;
}

h3 {
    font-weight: bold;
    text-align: left;
}

.small {
    line-height: initial !important;
    font-weight: 300 !important;
    font-size: 85% !important;
}

.bitsmall {
    font-size: 95% !important;
}

.bitsmall .contactstatus {
    grid-template-areas: "a a a a a a";
    align-items: center;
    grid-template-rows: repeat(1, minmax(0, 1fr));
    column-gap: 0.25em;
}

.bitsmall .contactstatus svg {
    font-size: 1.5em;
}

/* Load progress */
    #loadProgress {
    width: 100px;
    height: 100px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin: -50px 0 0 -50px;
    background-image: url("/progress.svg");
    background-repeat: no-repeat;
    z-index: 10000;
}

ul li {
    list-style: none;
    float: left;
    background-color: rgba(204, 212, 205, 0.75);
    border: solid 1px rgba(0, 0, 0, 0.3);
    border-right: none;
}

    ul li:last-child {
        border-right: solid 1px rgba(0,0,0,0.5);
    }

button i {
    margin-right: 10px;
}

input, select {
    padding-left: 5px;
    border: 1px solid rgba(0, 0, 0, 0.20);
    background-color: rgba(211, 211, 211, 0.3);
    color: #444;
    width: fit-content;
    height: 32px;
}

.modal input, .modal select {
    width: 99%;
}

.modal input[type=checkbox] {
    width: inherit;
}

.hasDatepicker {
    max-width: 6em;
}

.page-header {
    margin: 0;
    border: 0;
    padding: 0;
}

nav ul {
    width: 100%;
}

.left {
    float: left;
}

.right {
    float: right !important;
}

h1, h2, h3, h4 {
    margin-top: 0;
}

h1 small, h2 small, h3 small, h4 small {
    margin-left: 20px;
}

.nav > li > a {
    padding: 0.3em;
}

.navbar {
    min-height: initial;
}

.navbar-nav {
    margin: 0;
}

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

.navbar-header {
    text-align: center;
}

.navbar-header i {
    margin-right: 10px;
}

.navbar-brand {
    font-weight: 600;
    font-size: 2vh !important;
    height: inherit;
    padding-top: 0;
    line-height: inherit;
    padding: 0;
    padding-right: 2vh;
    float: none;
}

.navbar li.selected {
    font-weight: 600;
    background-color: rgba(129, 195, 234, 0.2784313725490196) !important;
}

.navbar li a {
    color: #486680 !important;
}

#navSignout {
    float: right !important;
    display: inline;
    font-size: 36px;
}

.form-group {
    padding: 0.5vh;
    vertical-align: bottom !important;
    display: table-cell !important;
    border-right: solid 1px rgba(0,0,0,0.3);
}

.form-group label {
    padding-top: 2px;
}

label.small {
    font-size: inherit !important;
}


.form-group.general {
    background-color: rgba(122,245,255,0.3);
}

.form-group.set {
    background-color: rgba(240,187,127,0.4);
}

.form-group.analysis {
    background-color: rgba(233,233,144,0.4);
}

.inputlabel {
    width: 100%;
    text-align: center;
    font-weight: 500;
}

.clear {
    clear: both;
}

.error {
    color: red;
}

.navbar-right {
    padding-right: 5px;
    float: right;
}

.margin-top-10 {
    margin-top: 10px;
}

.margin-top-20 {
    margin-top: 20px;
}

.padding-bottom-10 {
    padding-bottom: 0.5em;
}

.padding-top-10 {
    padding-top: 0.5em;
}

.padding-right-10 {
    padding-right: 10px !important;
}

.padding-left-50 {
    padding-left: 50px !important;
}

.padding-right-0 {
    padding-right:0 !important;
}

.topbar {
    margin-right: 10px;
}

#analysisSize {
    width: 90px;
}

.smallnumber {
    width: 70px !important;
}

.tinynumber {
    width: 54px !important;
}

.scatterheight {
    line-height: 34px;
}

#SymbolEditModal {
    padding-bottom: 0;
}

.symbolmenu, #btnSymbolOrderStandard, #btnSymbolOrderBonusSpin {
    padding: 0 1vh;
}

.symbolmenu {
    font-weight: normal;
}

.symbolmenu.active { font-weight: bold;
    text-decoration: underline;
}

#ResourcesModalType li {
    padding-right: 5px;
}

.reelsymbolcount, .symbolpaytable, .bonusreelsymbolcount, .bonusspinrule {
    margin-right: 4px;
    padding: 5px;
    float: left;
    text-align: center;
    text-align: center;
    margin-bottom: 2px;
    width: 75% !important;
}

.symbolrow div {
    padding: 0;
}

.symbolrow {
    padding: 1vh 0;
}

.symbolrow:nth-child(even) {
    background-color: rgba(177,234,217,0.4);
}

.symbolreeltotal {
    font-weight: bold;
    margin-top: 2px;
    border-top: solid 2px black;
    text-indent: 0.8em;
}

.editheader {
    background-color: #A8FAFF;
    color: darkslategrey;
    padding-top: 10px;
    padding-bottom: 10px;
}

.editheader div {
    padding: 0;
}

#alertBox {
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    width: 75%;
    margin: 0 auto;
    margin-bottom: 20px;
}

#dashboardContent {
    padding: 0.5vh 0;
}

.symbolorder {
    cursor: pointer;
}
.symbolorder:hover {
    background-color:#a8faff
}

.headerbutton {
    width: 24px;
    height: 24px;
    padding: 0;
    min-width: 20px;
    font-size: 80%;
}

.headerbutton i {
    margin-right: 0;
}

.modal {
    background-color: white;
}

/*.modal input, .modal select {
    width: 90%;
}*/

    .nopad {
    padding: 0;
}

#dashServiceLights .servicelight {
    font-size: 85%;
    border: 1px solid black;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
    opacity: 0.9;
    color: rgba(4, 0, 66, 0.8313725490196079);
    width: fit-content;
}

#dashServiceLights .servicelight svg {
    font-size: 50%;
}

#dashServiceLights .servicelight .title {
    font-weight: 600;
}

#dashServiceLights .servicelight.green {
    background-color: lightgreen;
}

#dashServiceLights .servicelight.red {
    background-color: rgba(255, 0, 0, 0.65);
    color: white;
}

#dashServiceLights .servicelight.amber {
    background-color: rgba(255, 184, 53, 0.65);
}

#paylinesModalContent {
    padding-top: 20px;
    max-height: 400px;
    overflow-y: auto;
} 

#paylinesModalContent li {
    width: 100px;
    float: left;
    height: 100px;
}

#paylinesModalContent .paylineHeader {
     font-weight: bold;
}

    #paylinesModalContent .paylineTableRow {
    clear: both;
    height: 12px;
}

#paylinesModalContent .paylineTableRow input {
    width: 10px;
    height: 10px;
    border: solid 1px black;
    margin-bottom: 2px;
    min-height: initial;
}

#paylinesModalContent .paylineTableRow input.selected {
    background-color: black;
}

.modal-dialog {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 700px;
    max-height: 500px;
}

.modal-header {
    border: 0;
    background-color: lightblue;
}

.modal-header button.pull-left svg, .modal-header button.pull-right svg {
    font-size: 30px;
    margin: 0 5px;
}

.progress {
    width: 99%;
    margin: 12px auto;
}

.progress-bar {
    text-align: right;
    padding-right: 10px;
    min-width: 40px;
}

#simulateModalContainer .progress {
    width: 100% !important;
}

#simulateModalContainer .progress-bar {
    min-width: 0;
}

#simulateResults {
    max-height: 70vh;
    overflow-y: scroll;
}

.simulateTable td {
    width: 100px;
    text-align: center;
}

#analysisFiguresLabels {
    font-weight: bold;
    text-align: right;
}

#analysisfigures {
    text-align: right;
}

canvas {
    padding: 12px;
    background-color: #F4FEFF;
    cursor: pointer;
}

.form-inline .form-control {
    display: block;
}

.divider {
    clear: both;
    margin-bottom: 20px;
    border-bottom: dotted 3px rgba(0,0,0,0.1);
}

#analysisStats strong {
    margin-right: 10px;
}

#gameAnalysisOptions #gameAnalysisTable_filter input {
    width: fit-content;
    display: block;
}

#gameSelect {
    margin-right: 20px;
}

.topnavbutton {
    display: inline-block;
    font-size: 20px;
    position: relative;
    top: 4px;
    color: darkslategrey;
    cursor: pointer;
}

    .topnavbutton:hover {
        color: #337ab7
    }

#SymbolOrderContainer {
    text-align: center;
}

.reelsymbol, .reelpos {
    width: 100%;
    cursor: pointer;
    border: 1px rgba(0,0,0,0.3);
    border-style: solid solid none solid;
    font-weight: 300;
    display: block;
    float: none;
}

.reelpos {
    border: 1px rgba(0,0,0,0.0);
    border-style: solid solid none solid;
}

.reelsymbol.double {
    line-height: 32px;
}

.reelsymbol.triple {
    line-height: 48px;
}

.reelsymbol:last-child {
    border-style: solid;
}

.sortplaceholder {
    height: 18px;
    width: 100px;
    border: dashed 1px black;
    background-color: #A8FAFF
}

.alert {
    padding: 0 15px 0 15px;
    margin-bottom: 0;
}

#alertBox {
    display: inline-block;
    width: initial;
    margin: 0 0 0 20px;
    font-size: initial;
}

#alertBox i {
    margin-right: 10px;
}

.symbolorderheader li {
    width: 100px;
    font-size: 1.2em;
}

#SymbolEditList {
    overflow-y: scroll;
    overflow-x: hidden;
    max-height: 75vh;
    font-size: 85%;
}

    #SymbolEditList select {
        font-size: 0.9em;
        width: 75px;
    }

.editfooter {
        margin-left: -22px;
    }

.form-inline button {
    margin: 0 auto;
}

#gameSetup {
    font-size: 85%;
}

.modal .close {
    font-size: 32px;
    padding: 0;
    margin-right: 0;
}

.center {
    margin: 0 auto;
}

#SymbolOrderPositions {
    overflow-y: scroll;
    overflow-x: hidden;
    max-height: 70vh;
    font-size: 90%;
}

#SymbolOrderPositions div {
    padding: 0;
}

#SymbolOrderPositions ul {
    padding: 0;
    margin: 0;
}

#SymbolOrderPositions li {
    background-color: inherit;
}

#SymbolOrderPositions li:nth-child(even) {
    background-color: #e8faff
}

.poscolumn {
    width: 40px;
    text-align: center;
    float: left;
}

.table {
    margin: 0;
}

.tableCell {
    display: table-cell;
    vertical-align: middle;
}

.tableRow {
    display: table-row;
}

#analysisData .table {
    text-align: right;
    background-color: white;
}

#analysisData .table th {
    text-align: right;
}

#analysisData .table th.text-left {
    text-align: left;
}
thead tr {
    background-color: #A8FAFF;
}

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

.statclickable {
    cursor: pointer;
}

.strong {
    font-weight: 600;
}

.tabletitle {
    font-weight: 600;
    text-align: center;
    font-size: 1em;
    background-color: white;
    border-bottom: 2px solid black;
    padding: 5px;
}

.xls, .txt, .csv {
    text-transform: uppercase;
    font-size: 0.75em;
}

.totalrow {
    border-top: solid black 2px;
    border-bottom: solid black 2px;
    font-size: 90% !important;
}

select .small {
    font-size: 12px;
}

.inverse {
    background-color: rgba(4, 0, 66, 0.8313725490196079);
    color: white;
}

.inline .form-control {
    display: inline-block;
    margin-right: 0;
}

.navbar {
    margin-bottom: 0;
}

ul.nav {
    font-size: 24px;
    width: fit-content;
}

.navbar .btn {
    min-width: initial;
    height: 32px;
}

.nav {
    clear: both;
    padding-top: 3px;
}

.nav:first-child {
    padding:0
}

#slotNavBar {
    padding: 3px 0;
}

#slotNavBar #slotNavBarActions {
    position: absolute;
}

#frmConfig .form-inline > div:first-child {
    border: 1px solid rgba(0,0,0,0.5);
    background-color: #FFFEF4;
}

#tempConfig {
    float: right;
}

#tempConfigButtons {
    float: right;
}

#tempConfigButtons button {
    font-size: 70%;
    min-width: initial;
    margin-left: 15px;
}

#tempConfigButtons button svg {
    margin-right: 5px;
}

#slotGameExport {
    max-height: 60vh;
    font-size: 75%;
    overflow-y: scroll;
    word-break: break-all;
}

#importConfigContainer {
    width: 95%;
    margin-left: 2.5%;
}

#importConfigContent {
    width: 100%;
    height: 60vh;
    font-size: 75%;
    word-break: break-all;
}

#gameEndedJobsList {
    max-height: 50vh;
    overflow-y: scroll;
}

#analysisData {
    overflow: auto;
}

#analysisData .btn {
    min-width: initial;
}

#analysisDataHeader {
    background-color: white;
}

#analysisReportModeSelection {
    padding: 0.5vh 1vh;
    background-color: #e9e9e9;
}

#analysisDataHeader h4 {
    padding: 0 0.5vh;
    margin: 0;
}

.sorting, .sorting_asc, .sorting_desc {
    text-align: right;
}

#gameAnalysisTable {
    width: 100%;
    text-align: right;
}

#gameAnalysisTable tr {
    margin: 0;
    margin-top: 0.5vh;
    padding-bottom: 0.5vh;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

#gameAnalysisTable td {
    word-break: break-all;
}

#gameAnalysisTable thead tr {
    background-color: inherit;
}

#btnSymbolEdit {
    width: 21px;
    font-size: 70%;
    padding-left: 3px;
}

li.reelsymbol.ordererror {
    background-color: red;
}

.reelsymbol img {
    width: 20px;
    height: 20px;
}

.reelsymbol .weight {
    width: 50px;
    float: right;
    height: 100%;
}

iframe { width: 100%;
    height: 100%;
}

#previewModal {
    width: 1400px;
    max-height: 810px;
    overflow: hidden;
}

#previewModal .modal-title button {
    margin-right: 5px;
    margin-left: 5px;
}

#previewGame {
    height: 760px;
}

button.close {
    margin-right: 10px;
}

.spinlabel {
    font-weight: 600;
    position: absolute;
    bottom: 0;
}

.nopadding {
    padding: 0;
}

.nomargin {
    margin: 0;
}

#SymbolEditList .grid {
    width: 100%;
}

#SymbolEditList .grid input, #SymbolEditList .grid select {
    width: 75px;
}

#SymbolEditList .grid .rowlabel {
    width: 100px;
}

#SymbolEditList .bonusspinrow, #SymbolEditList .modetriggerrow {
    display: none;
}

#SymbolEditList .scatter .bonusspinrow, #SymbolEditList .scatter .modetriggerrow {
    display: grid;
}

#ResourcesGfx, #ResourcesSounds, #ResourcesAnimations, #ResourcesParticles {
    overflow-y: scroll;
    max-height: 60vh;
    overflow-x: hidden;
}

#ReelSymbolEditList {
    height: 70vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.subrow {
    font-size: 85%;
}

.perc75 {
    width: 75% !important;
}

.perc50 {
    width: 50% !important;
}

#SymbolReelEditRowTotal, #BonusSpinSymbolReelEditRowTotal {
    padding: 10px;
}

.rownumber {
    width: 18px;
    float: left;
    font-weight: bold;
    margin-left: 4px;
    margin-right: 4px;
    text-align: center;
}

.inline {
    display: inline-block;
}

#newGameModalContent label, #newGameModalContent button {
    margin-left: 10px;
    margin-right: 10px;
}

.modal-title .pull-left {
    font-weight: 600;
}

#elementsContainer {
    overflow-y: scroll;
    max-height: 60vh;
    overflow-x: hidden;
    clear: both;
    font-size: 80%;
}

#ModesContainer, #ModePrizesContainer {
    overflow-y: scroll;
    max-height: 60vh;
    overflow-x: hidden;
    clear: both;
}


.width100 {
     width: 100% !important;
}

.width5 {
    width: 5% !important;
}

/*Dashboard*/

    #dashStats {
    padding:0;
}

#dashStats button {
    min-width: fit-content;
    padding: 2px;
    font-size: 50%;
}

#dashboardDepositWithdrawalStatModalContent {
    max-height: 90vh;
}

.menu {
    font-size: 90%;
    float: left;
}

.menu button {
    font-weight: 500;
    border: solid 1px rgba(0,0,0,0.5);
    border-right: none;
    border-right: solid 1px rgba(0,0,0,0.5);
    font-size: 80%;
    padding: 2px;
}

nav button.selected, .menu button.selected {
    background-color: rgba(129, 195, 234, 0.2784313725490196) !important
}

.menu .menurow {
    font-size: 70%;
    float: left;
    margin-left: 10px;
}

.menurow input {
    min-height: initial;
    display: table-cell;
    vertical-align: middle;
}

.gamestats {
    margin-top: 1vh;
}

.gamestats.first {
    margin-top: 2vh;
}

.statsHeader {
    text-align: center;
    padding: 0;
}

.statsHeader .number {
    font-weight: 600;
}

.statsHeader div.normal {
    text-align: left;
}

.statsRow {
    text-align: center;
}

.statsRow .btn {
    border: 0;
    width: 100%;
    text-align: left;
}

.statsHeader div, .statsRow div {
    padding: 0;
}

    .statsHeader div:first-child {
        padding-left: 5px;
    }

#userHeader {
    font-weight: bold;
    text-align: center;
}

#dashboardUserList, #dashboardTicketList, #dashboardDrawList, #supportPlayerList, #dashboardLogList {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 75vh;
}

.userRow, .withdrawalRow {
    text-align: center;
}

    .userRow:nth-child(even), .drawRow:nth-child(even), .automatedPromoRow:nth-child(even), .supportrow:nth-child(even), .withdrawalRow:nth-child(even) {
        background-color: #e8faff
    }

    .userRow .duplicate {
        background-color: rgba(255,95,95,0.5)
    }

#firstHalf, #secondHalf {
    float: left;
}


#drawHeader, #userHeader, #ticketHeader, .supportheader, .dashboardheader, #logHeader, #promoHeader, #wheelHeader, #automatedPromoHeader, .stakerHeader, #jackpotHeader {
    font-weight: 500;
    padding: 0 0.5vh;
    background-color: rgba(128, 128, 128, 0.8);
    color: white;
}

#promoHeader {
    position: sticky;
    top: 42px;
    z-index: 999;
    background-color: grey !important;
}

.drawRow, .statsRow, .ticketRow, .userRow, .supportrow, .withdrawalRow, .logRow, .automatedPromoRow, .stakerRow, .jackpotRow, .jackpotCurrencyRow {
    text-align: center;
    margin: 0;
    word-break: break-all;
    clear: both;
    letter-spacing: 0.1px;
    margin-bottom: 1px;
}

/* Support */
#supportContent button {
    margin: 0.2vh 0;
    border: 1px solid rgba(0,0,0,0.1);
    min-width: 50px;
}

.summaryrow {
    background: rgb(127,255,212);
    background: linear-gradient(270deg, rgba(127,255,212,0.5018382352941176) 0%, rgba(255,255,255,1) 100%);
    border-width: 1px;
    border-color: rgba(50,50,50,0.5);
    border-style: solid none none none;
}

.useraction {
    font-size:75%;
}
button.btn.btnsummarybalance {
    margin-right: 0.5em !important;
    padding: 0.5em;
    min-width: inherit !important;
}

.jackpotRow {
    padding: 0 0.5vh;
    text-align: left;
    border-top: 1px solid black;
}
.jackpotRow:first-child {
    border-top: none;
}

.jackpotWinRow {
    text-align: left;
    font-weight: bold;
    font-size: 90%;
    text-indent: 0.5vh;
}

.drawRow:nth-child(even), .logRow:nth-child(even), .jackpotRow.even, .jackpotCurrencyRow.even, .statsRow:nth-child(even), .ticketRow:nth-child(even), .userRow:nth-child(even), .supportrow:nth-child(even), .withdrawalRow:nth-child(even), .accountrow:nth-child(even), .automatedPromoRow:nth-child(even) {
    background-color: #f4fbff;
}

.accountrow {
    text-align: left;
}

#supportHistoryModal .supportheader div {
    padding: 0;
}

.dashboardheader div {
    padding: 0;
}

#supportUserContactLogModalContent .supportrow {
    margin: 0;
}

.modal {
    width: 100%;
    height: fit-content;
    max-height: 100vh;
    max-width: 99%;
    border: 2px solid black;
    box-shadow: 0 0 10px rgb(131 140 171 / 93%);
    min-width: 700px;
}

#settingsModal {
    width: fit-content;
}

#supportHistoryModal, #supportDepositModal, #supportAddressModal, #supportWithdrawalModal, #supportTicketModal, #supportScratchcardModal, #supportRouletteInfoModal, #supportSlotInfoModal, #supportUserDuplicateInfoModal, #supportUserRiskModal, #supportUserContactLogModal,
#supportUserAdjustModal, #supportPromosModal {
    max-height: 100%;
}

    .desktop {
        display: none;
    }

.profitloss { background-color: rgba(255, 230, 0, 0.08); }
.cashstake {
    background-color: rgba(150, 255, 0, 0.1);
}

#supportHistoryModal .modal-header {
    display: table;
    width: 100%;
}

#supportHistoryModal .modal-header div {
    display: table-cell;
    vertical-align: middle;
}

#supportHistoryModalContent div {
    padding: 0.1vh;
}

#supportHistoryModalContent .date {
    color: #f79323;
    background-color: rgba(255,255,255,0.1);
    font-weight: bold;
    margin: 1vh 0;
    text-indent: 1vh;
}

#supportHistoryModalContent .supportrow, #supportSessionLogModalContent .supportrow {
    text-align: left;
    margin: 0;
    padding: 0.5vh;
    font-size: 80%;
}

#supportFingerprintModalContent {
    display: grid;
    grid-template-areas: "a a a";
}

#supportSessionLogModal .fp {
    background-color: lightgoldenrodyellow !important;
}

#supportSessionLogModal .probity {
    background-color: lightgray !important;
}

#supportSessionLogModalContent .userlanding {
    background-color: initial !important;
}

#supportHistoryModalContent .supportrow:nth-child(even) {
    background-color: rgba(211, 221, 226, 0.1);
}

#supportHistoryModalContent .eventrow .activity {
    font-size: 75% !important;
    padding: 0;
    font-weight: bold;
    text-transform: uppercase;
    padding: 0;
}

#txtSupportHistoryDate {
    width: initial;
}

.modal .content {
    overflow-y: auto;
    padding: 0.5vh;
    max-height: 72vh;
}

#supportUserProfitLossModalContent {
    overflow: hidden;
    max-height: initial;
}

#supportHistoryDateControls {
    padding-left: 5px;
}

.full-content {
    margin: 0 2px;
}

#supportTicketModalContent .ticketrow {
    border: 1px solid rgba(0,0,0,0.2);
    border-style: none none solid none;
    padding: 10px 0;
    pointer-events: none;
}
    
.drawNumberList, .ticketNumberList {
    display: table;
    position: relative;
    left: -3px;
}

.drawNumber {
    display: table-cell;
    font-weight: bold;
    padding: 0 3px;
}

.ticketNumber {
    display: table-cell;
    padding: 0 3px;
}

#supportTicketModalContent, #supportScratchcardModalContent {
    font-size: 80%;
}

#supportTicketModalContent .ticketrow .selected {
    background-color: limegreen;
}

#supportTicketModalContent .ticketrow.lotterywin .selected {
    background-color: #4f5d4f;
}

#supportTicketModalContent .ticketrow.lotterywin {
    background-color: #18c3e6;
    color: white;
}

#supportSlotInfoModal {
    height:95vh;
    overflow-y: hidden;
}

#supportSlotInfoModal .modal-header {
    font-size: 80%;
}

#supportSlotInfoModalContent .supportrow {
    margin-bottom: 1vh;
}

#supportSlotInfoModalContent .showwin {
    padding: 0 0.5vh; 
}

#supportSlotInfoModalContent .showwin.selected {
    border: 2px solid black;
}


#supportSlotInfoModalContent .reels div.symbol.wild::before {
    content: "R";
    font-size: 80%;
    font-weight: bold;
}

#supportSlotInfoModalContent .reels div.symbol.wild {
    background-color: #0000ff80;
    text-align: center;
}


#supportSlotInfoModalContent .reels div.symbol {
    width: 48px;
    height: 48px;
    border: 4px solid transparent;
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: center;
    margin: 3px;
}

#supportSlotInfoModalContent .reels div.symbol.part2_2 {
    background-position-y:100%;
}

    #supportSlotInfoModalContent .reels div.symbol.won {
        border: 2px solid rgba(255,255,255,1);
        z-index: 200;
        position: relative;
        border: solid 4px rgba(108,224,136,1);
    }

#supportSlotInfoModalContent .payline .cell {
    width: 32px;
    height: 32px;
    background-color: white;
    border: 1px solid rgba(0,0,0,0.3);
}

#supportSlotInfoModalContent .row.nowin .payline .cell {
    display: none;
}

#supportSlotInfoModalContent .payline .cell.won {
    background-color: black;
}

#supportSlotInfoModalContent .payline .paylineInfo {
    text-align: left;
    font-weight: bold;
    padding: 1vh 0;
    font-size: 150%;
}

.legend {
    float: left;
    margin-right: 1vh;
    margin-left: 2vh;
    font-weight: 600;
}

.box {
    min-width: 20px;
    min-height: 20px;
    border: 1px solid black;
}

#supportCashbackModal .pending {
    background-color: orange !important;
}

#supportCashbackModal .available {
    background-color: lightseagreen !important;
}

#supportCashbackModal .expired {
    background-color: lightgrey !important;
}

#supportCashbackModal .reset {
    background-color: lightcoral !important;
}

#supportCashbackModal .claimed {
    background-color: lightblue !important;
}

#supportCashbackModal .unconfirmed {
    color: red;
    font-weight: bold;
}

#supportPromosModal .awaitingstart {
    background-color: lightseagreen !important;
}

#supportPromosModal .awaitingstart:nth-child(even) {
    background-color: rgba(32, 178, 170, 0.75) !important;
}

#supportPromosModal .inprogress {
    background-color: lightgoldenrodyellow !important;
}

#supportPromosModal .inprogress:nth-child(even) {
    background-color: rgba(250, 250, 210, 0.75) !important;
}

#supportPromosModal .awaitingplaythrough {
    background-color: orange !important;
}

#supportPromosModal .awaitingplaythrough:nth-child(even) {
    background-color: rgba(255, 165, 0, 0.75) !important;
}

#supportPromosModal .completed {
    background-color: lightgreen !important;
}

#supportPromosModal .completed:nth-child(even) {
    background-color: rgba(144, 238, 144, 0.75) !important;
}

#supportPromosModal .available {
    background-color: lightblue !important;
}

#supportPromosModal .available:nth-child(even) {
    background-color: rgba(173, 216, 230, 0.75) !important;
}

#supportPromoListContent {
    max-height: 72vh;
    overflow-y: scroll;
}

#selHouseType {
    width: fit-content;
}

.notdrawn, .notdrawn:nth-child(even), .depositunconfirmed, .promouncompleted, .promouncompleted:nth-child(even), .depositunconfirmed:nth-child(even) {
    background-color: lightyellow;
}

.ticketwon, .ticketwon:nth-child(even), .depositconfirmed, .promocompleted, .depositconfirmed:nth-child(even), .promocompleted:nth-child(even) {
    background-color: lightgreen;
}

.promoredeemed, .promoredeemed:nth-child(even) {
    background-color: lightgreen;
}

.promolost, .promolost:nth-child(even) {
    background-color: #ffd4c3;
}

.promostarted, .promostarted:nth-child(even) {
    background-color: lightyellow;
}

.promopaused, .promopaused:nth-child(even) {
    background-color: lightgray;
}

.promoawaitingnextphase, .promoawaitingnextphase:nth-child(even) {
    background-color: #cee7f7;
}

.promoawaitingplaythrough, .promoawaitingplaythrough:nth-child(even) {
    background-color: yellow;
}

.promofinished, .promofinished:nth-child(even) {
    background-color: greenyellow;
}

.externaldepositconfirmed, .externaldepositconfirmed:nth-child(even), .refundallocated {
    background-color: #90eebe
}

.externaldepositincomplete, .externaldepositincomplete:nth-child(even) {
    background-color: lightgrey;
    font-size: 75%;
}

.refundunallocated {
    background-color: lightgrey;
}

.externaldepositfailed, .externaldepositfailed:nth-child(even) {
    background-color: #f3b9b9
}

.ticketwonnotauth {
    background-color: lightblue;
}


.lotterywin {
    background-color:lightblue;
}

.ticketnowin, .ticketnowin:nth-child(even) {
    background-color: #f9e6e6;
}

#dashboardTicketList .row {
    border-bottom: 1px solid rgba(0,0,0,0.3);
}

#ticketLegend, #depositLegend, #promoLegend {
    float: left;
    font-size: 80%;
}

#promoLegend {
    position: sticky;
    top: 0;
    background-color: white;
    z-index: 999;
    width: 100%;
}

    #searchPlayer {
        margin: 1vh 0;
    }

.supportheader, .dashboardheader {
    text-align: left;
}

#supportPlayerList .row {
    text-align: left;
}

#supportPlayerList .full-width {
    width: 100%;
}

.duplicate {
    color: red;
    font-weight: bold;
}

#supportUserDuplicateInfoContent {
    font-size: 90%;
}

#supportUserDuplicateInfoContent .guid {
    font-size: 80%;
}

#supportUserDuplicateInfoModal .original {
    background-color: lightgreen;
}

#supportUserDuplicateInfoModal .duplicate {
    background-color: #6b8e6b;
    color: white;
    font-weight: normal;
}

#supportUserDuplicateInfoModal {
    width: 95vw;
    height: 90vh;
    max-height: initial;
    max-width: initial;
    overflow: hidden;
}

#supportUserDuplicateInfoModal .duplicateSet {
    margin-bottom: 1vh;
}

#supportUserDuplicateInfoModal .content {
    overflow: hidden;
    max-height: initial;
}

#supportScratchcardModal {
    max-width: 95%;
    width: 2000px;
}

#supportScratchcardModal .row .seed {
    word-break: break-all;
}

.brandletter {
    padding: 0 0.5em !important;
    background-color: #008013ad;
    color: white;
    margin: 0 5px;
    vertical-align: top;
}

.fitcontent {
    width:fit-content !important;
}

#duplicateNetworkContainer {
    width: 95vw;
    height: 85vh;
    margin: 0 auto;
    background-color: #445;
}

#duplicateNetworkContainer canvas {
    background-color: inherit;
    padding:0
}

#withdrawalControls span {
    margin-left: 2vh;
}

.withdrawalRow textarea {
    width: 100%;
    resize: none;
}

.withdrawalApproved {
    background-color: lightblue;
}

.withdrawalPaid {
    background-color: palegreen !important;
}

.withdrawalRejected {
    background-color: #fdd0d0 !important;
}

.underReview {
    background-color: #feffc6 !important;
}

#dashboardApprovedWithdrawalsContent {
    font-size: 90%;
}

#dashboardApprovedWithdrawalsContent .row div {
    padding: 0 15px !important;
}

#dashboardApprovedWithdrawalsContent .row.success {
    background-color: lightgreen;
}

#dashboardApprovedWithdrawalsContent .row.success:nth-child(even) {
    background-color: lightseagreen;
}

#dashboardApprovedWithdrawalsContent .row.fail {
    background-color: lightcoral;
}

#dashboardWithdrawalList .notes strong {
    font-weight: normal;
    background-color: yellow;
    padding: 0 5px;
    word-break: normal;
}

#dashboardControls {
    padding-left: 0;
}

#walletInfo {
    padding-left: 0;
}

#walletInfo ul {
    padding: 0;
}

    #walletInfo li {
        float: left;
        background-color: #fff9b38c
    }

#btnRefreshWallet {
    height: 60px;
    float: right;
    font-weight: bold;
    margin-top: 8%;
}

#walletInfo .content {
    font-family: 'Fira Mono';
    font-size: 85%;
    letter-spacing: -1.5px;
    color: #3090a9;
    font-weight: 500;
    padding: 0 4px;
    text-align: right;
}

#walletInfo li .loading {
    color: #375ca8;
    opacity: 0.8;
}

.walletInfo {
    cursor: pointer;
}

.walletInfo .title {
    background-color: #d7f4d9;
    padding: 0 2px;
    font-size: 90%;
    font-weight: bold;
    color: rgb(49 49 110 / 90%);
}

.walletInfo .subtitle {
    background: rgb(255,255,255);
    background: linear-gradient(41deg, rgba(255,255,255,0.5) 0%, rgba(94,209,32,0.5) 100%);
    font-size: 80%;
    color: #16180a;
    font-weight: 500;
    text-align: center;
    padding-right: 4px;
    font-family: 'Fira Mono';
    letter-spacing: -1px;
}

.walletInfo .subtitle:hover {
    background: rgb(255,255,255);
    background: linear-gradient(41deg, rgba(255,255,255,0.5) 0%, rgb(209 32 32 / 50%) 100%);
}

.usdamount {
    text-align: center;
    font-weight: 600;
    color: #6e36c5;
}

.unconfirmedbalance, .confirmedbalance, .utxobalance {
    text-align: right;
}

.confirmedbalance {
    color: #017d0d;
    font-weight: 500;
}

.unconfirmedbalance {
    color: rgba(247,48,74,0.75);
}

.version.warning {
    font-weight: bold !important;
}

.utxobalance {
    font-weight: bold;
}

#withdrawalWalletUtxoContent .row {
    font-size: 80%;
}
/* Automated promo */
        .automatedNew {
    background-color: palegreen;
}

.automatedDepositing, .automatedWaning {
    background-color: lightsteelblue;
}

.automatedFreeloader, .automatedLapsed {
    background-color: lightcyan;
}

.automatedHighRoller, .automatedActive {
    background-color:yellow
}

#currentAutomatedPromos {
    font-size: 90%;
    margin-top: 10px;
}

.automatedPromoHistoryRow {
    font-size: 80%;
}

#automatedPromoTakeupList {
    overflow-y: scroll;
    max-height: 600px;
}

.automatedPromoRow.disabled {
    background-color: rgba(0, 0, 0, 0.2);
}

.automatedPromoRow .box {
    padding: 0 1vh;
    font-weight: bold;
    border: 0;
    width: fit-content;
    cursor: pointer;
    box-shadow: 0 0 3px rgba(0,0,0,0.3);
}

.automatedPromoRow .plannotifications .notify {
    padding-right: 0.5vh;
}

.automatedPromoRow .plannotifications .notify.email, .automatedPromoRow .plannotifications .notify.sms {
    cursor: pointer;
}


.automatedPromoRow .usernotify {
    padding-right: 0.5vh;
}

.automatedPromoRow .usernotify svg {
    color: lightgrey;
}

    .automatedPromoRow .usernotify svg.fa-envelope-open, .automatedPromoRow .usernotify svg.fa-flag {
        color: green;
    }

.automatedPromoRow .usernotify svg.fail {
    color: red;
}

#dashboardAutomatedPromoPlanHistoryLogContent .automatedPromoRow.claimed {
    background-color:lightgreen
}

#approvedWithdrawalsRow {
    font-weight: bold;
    border-bottom: 1px solid rgba(0,0,0,0.5);
    padding: 1vh;
    border-top: 1px solid rgba(0,0,0,0.5);
    background-color: rgba(0,0,0,0.05);
    font-size: 90%;
}

#approvedWithdrawalsCount {
    color: mediumseagreen;
    font-size: 120%;
    position: relative;
    top: 1px;
}

#payApprovedSecurity {
    padding-bottom: 1vh;
}

#payApprovedSecurity .input {
    margin-right: 2vh;
}

#dashboardApprovedWithdrawalsModal {
    width: 95%;
}

#dashboardApprovedWithdrawalsModal .content .row:hover {
    background-color: initial;
}

#dashboardApprovedWithdrawalsModal .content .row.strong:hover {
    background-color: #a8faff;
}

.wrap {
    word-wrap: break-word;
}

#secretTable td {
    padding: 10px;
}

/*Slot Analysis*/
#dashboardGameAnalysisModal .content {
    overflow-y: auto;
    font-size: 90%;
}

#dashboardGameAnalysisModal .header {
    font-weight: 600;
    background-color: #deefec;
    text-align: left;
    font-size: 80%;
    padding: 0.5vh;
}

/* Best Win */

#bestWin {
    border: 1px solid black;
    margin-left: 1vh;
    padding: 1vh;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

#bestWin .showwin {
    padding: 0 0.5vh;
    border: 2px solid gray;
}

#bestWin  .showwin.selected {
    border: 2px solid black;
}

#bestWin .reels .table {
    background-color: rgba(56,255,248,0.2);
    margin-bottom: 1vh;
}

#bestWin .reels img {
    width: 64px;
    border: 1px solid rgba(255,255,255,0.0);
}

#bestWin .reels img.wild {
    background-color: rgba(0,255,0,0.5);
}

#bestWin  .reels img.won {
    border: 1px solid rgba(255,255,255,0.8);
    box-shadow: 0 0 15px black;
    z-index: 200;
    position: relative;
    border-radius: 0.5vh;
}

#bestWin  .reels img.notwon {
    opacity: 0.6;
}

#bestWin .paylinewins {
    max-height: 200px;
    overflow-y: auto;
}


#bestWin .payline .table {
    width: initial;
    margin: 0 auto !important;
}

#bestWin .payline .cell {
    height: 5vh;
    width: 5vh;
    background-color: white;
    border: 1px solid rgba(0,0,0,0.3);
}

#bestWin .row.nowin .payline .cell {
    display: none;
}

#bestWin .payline .cell.won {
    background-color: black;
}

#bestWin .payline .paylineInfo {
    font-size: 120%;
    text-align: center;
    margin-bottom: 1vh;
}

/* Support User Adjustment */
.userhouseadjustmentcash, .userhouseadjustmentawardamount, .userhouseadjustmentpromo {
    width: 100px !important;
    text-align: right;
}

.userhouseadjustmentawardplay {
    width: 50px !important;
    text-align: center;
}

.houseTypeOfferContent .supportrow input {
    width: 120px;
}

/* Profit And Loss */
#profitLossChartContainer {
    width: 100%;
    height: 70vh;
    position: relative;
}

#profitLossChartContainer canvas {
    max-height: 70vh;
    max-width: 95%;
    margin: 0 auto;
}

/* Admin Reports */
li.reportName {
    margin: 0.5vh;
    float: left;
    border: 2px solid;
    border-radius: 1vh;
    box-shadow: 0 0 1px black;
}

.dt-buttons {
    float: left;
}

.dt-buttons button {
    font-size: 80%;
    box-shadow: 0 0 1px black;
    border-radius: 1vh;
    font-weight: bold;
    padding: 0 0.5vh;
    margin: 0;
    position: relative;
    background-color: transparent;
    border-width: 1px;
}

button.reportGroup {
    font-size: 100%;
    padding: 4px;
}

.reportGroupList button {
    border: 0;
    padding: 4px;
    font-weight: initial;
    margin-top: -4px;
    text-align: center;
}

#reportsResultModal {
    max-width: 99.5%;
    padding-bottom: 0;
    font-size: 60%;
    font-family: 'Cutive Mono', monospace;
    letter-spacing: -1px;
    font-weight: bold;
}

#reportTable_filter {
    font-size: 80%;
}

#reportTable_filter input {
    font-size: 100%;
}

#reportContent table th, .fixedHeader-locked th, .fixedHeader-floating th{
    background-color: #557ea6;
    color: white;
    font-weight: normal;
    padding-right: 20px;
    vertical-align: top;
    text-align: center;
    white-space: normal;
    background-position-y: 13px;
}

.fixedHeader-locked th, .fixedHeader-floating th {
    font-size: 70%;
    font-weight: normal;

}

#reportContent table td {
    padding-right: 20px;
    text-align: center;
}

#reportContent table tr:nth-child(even) {
    background-color: #e4f1f9;
}

#reportContent table td.drill {
    cursor: pointer;
    text-decoration: underline;
}

#reportList {
    padding: 0;
}

#reportTitle, .reportTitle {
    font-weight: 600;
    text-align: center;
    padding-top: 1vh;
}

#reportContent .reportContainer {
    transform: rotateX(180deg);
    overflow-x: scroll;
}

    #reportContent .reportContainer table {
        transform: rotateX(180deg);
    }

table tr.drillrow {
    background-color: lightgoldenrodyellow !important;
}

table tr.drillrow.success {
    background-color: #d2fad5 !important;
}

table.dataTable thead th, table.dataTable thead td {
    padding: 8px 0;
    position: sticky;
    top: 0;
}

.reportControls {
    background-color: #f9eddd;
    border: 1px solid black;
    padding: 0.25em !important;
    margin: 0.5em 0;
}

.promotype, .coin {
    display: inline;
}

.promotype svg, .coin svg {
    max-width: 20px;
}
    .promotype img, .coin img {
        max-width: 20px;
        max-height: 20px;
        width: 100%;
        height: 100%;
        position: relative;
        top: -3px;
    }

    .promoinfo {
        text-transform: uppercase;
        font-weight: bold;
        font-size: 80%;
    }

.activity .promoinfo {
    font-size: inherit;
}

.balancerow .promoinfo {
    background-color: rgba(255, 165, 0, 0.25) !important;
    font-weight: 500;
}

.comboTable, .reelsTable, .winDistributionTable, .symbolComboTable {
    width: fit-content;
    margin: 0 auto;
    max-width: 98%;
}

#withdrawalWalletUtxoContent table td {
    max-width: 10vw;
}

#houseAdjustmentFilters {
    display: inline-block;
    padding: 0 0 0.5em 0.5em;
}

#houseAdjustmentFilters select {
    width: fit-content;
}

@media (orientation: portrait) {
    body {
        font-size: 18px;
    }

    input, select {
        min-height: 20px;
        max-width: 200px;
    }

    .btn {
        min-width: 50px;
        font-size: 70% !important;
        font-weight: 700;
    }

    .navbar {
        font-size: 90%;
    }

    nav ul {
        font-size: 80% !important;
    }

    .supportheader, .dashboardheader {
        font-size:70%;
    }

    .menurow {
        margin-top: 0;
    }

    .menurow input[type='checkbox'] {
        top: 6px;
    }

    #gameAnalysisTable tr, #dashboardUserList, #dashboardTicketList, #dashboardDrawList, #supportPlayerList, #dashboardLogList, #dashboardPromoList {
        font-size: 90%;
    }
    
    #firstHalf, #secondHalf {
        margin-top: 5vh;
    }

    .statsHeader, .statsRow {
        font-size: 60%;
    }

    #searchPlayer {
        font-size: 90%;
    }

    .drawRow, .statsRow, .ticketRow, .userRow, .supportrow, .withdrawalRow, .logRow, .automatedPromoRow {
        font-size: 60%;
    }

    #walletInfo li {
        font-size:60%
    }

    #approvedWithdrawalsRow {
        font-size: 60%;
    }

    .modal-dialog {
        min-width:initial;
    }
}

@media (orientation: landscape) {
    #firstHalf, #secondHalf {
        width: 50%;
    }

    #dashboardContent, #supportContent {
        margin: 0 auto;
    }

    .desktop {
        display: inline;
    }

    .reduced, .portrait {
        display: none;
    }

    #supportContent .row, .summaryrow, .supportrow {
        margin: 0 auto
    }

    .summaryrow, .minimal {
        max-width: 1000px;
    }
}