:root {
    --light-grey: #c2c2c2;
    --dark-grey: #777777;
    --red: #a91920;
    --redtxt: #f74951;
    --light-red: #f7888c;
    --blue: #1974a9;
    --bluetxt: #49d4f7;
    --light-blue: #5bc2fd;
    --orange: #F74B09;
    --orangetxt: #F79812;
    --light-orange: #F7BB2E;
}

/* RED */

::-webkit-scrollbar-thumb:hover {
    background: var(--red)
}

.txt-color-red {
    color: var(--redtxt);
}

.line-separator {
    background-color: var(--light-red);
}

.divider-100 {
    background-color: var(--red);
}

.menu-top li.active, .menu-top li.active.hvr-overline-from-center:before {
    border-top: 1px solid var(--red);
}

.menu-left .btn.active .line {
    background-color: var(--red);
}

.corner-top-left {
    border-left: 1px solid var(--red);
    border-top: 1px solid var(--red);
}

.corner-bottom-right {
    border-right: 1px solid var(--red);
    border-bottom: 1px solid var(--red);
}

.btn-red-border {
    border: 1px solid var(--red);
}

.btn-red-border:active {
    border: 1px solid var(--red);
}

.slot-bg .line {
    background-color: var(--red);
}

.logo-slot {
    filter: drop-shadow(0 0 0px red);
}

.menu-top-small ul {
    border-left: 1px solid var(--red);
}

.menu-top-small ul li:active {
    color: var(--red);
}

.nav-btn .icon svg, .footer-btn .icon svg {
    fill: var(--red);
}

.nav-btn:active .icon svg {
    fill: var(--red);
}

.footer .cell .txt {
    /*color: var(--light-red);*/
    color: #fff;
}

#cube .cubie {
    background-color: rgba(255, 0, 0, 0.25);
}

#cube .cubie.use.active, #cube .cubie.active.hover {
    -webkit-box-shadow: 0px 0px 40px 0px rgba(255, 0, 0, 1);
    -moz-box-shadow: 0px 0px 40px 0px rgba(255, 0, 0, 1);
    box-shadow: 0px 0px 40px 0px rgba(255, 0, 0, 1);
}

#cube .cubie.hover {
    background: var(--red);
    -webkit-box-shadow: 0px 0px 40px 0px rgba(255, 0, 0, 1);
    -moz-box-shadow: 0px 0px 40px 0px rgba(255, 0, 0, 1);
    box-shadow: 0px 0px 40px 0px rgba(255, 0, 0, 1);
}

#cube .cubie svg {
    fill: rgba(231, 77, 77, 0.75);
}

#cube .cubie.active svg, #cube .cubie.active.hover svg {
    fill: var(--red);
}

.logo-slot {
    background-image: url("../img/slot-logo.png");
}

.gfx-table {
    background-image: url("../img/red-table.png");
}

.about-ico.first .ico {
    background-image: url("../img/poker-cards1.svg");
}

.about-ico.second .ico {
    background-image: url("../img/diamond.svg");
}

.about-ico.third .ico {
    background-image: url("../img/lucky.svg");
}

/* BLUE */

.blue ::-webkit-scrollbar-thumb:hover {
    background: var(--blue)
}

.blue .txt-color-red {
    color: var(--bluetxt);
}

.blue .line-separator {
    background-color: var(--light-blue);
}

.blue .divider-100 {
    background-color: var(--blue);
}

.blue .menu-top li.active, .blue .menu-top li.active.hvr-overline-from-center:before {
    border-top: 1px solid var(--blue);
}

.blue .menu-left .btn.active .line {
    background-color: var(--blue);
}

.blue .corner-top-left {
    border-left: 1px solid var(--blue);
    border-top: 1px solid var(--blue);
}

.blue .corner-bottom-right {
    border-right: 1px solid var(--blue);
    border-bottom: 1px solid var(--blue);
}

.blue .btn-red-border {
    border: 1px solid var(--blue);
}

.blue .btn-red-border:active {
    border: 1px solid var(--blue);
}

.blue .slot-bg .line {
    background-color: var(--blue);
}

.blue .logo-slot {
    filter: drop-shadow(0 0 0px blue);
}

.blue .menu-top-small ul {
    border-left: 1px solid var(--blue);
}

.blue .menu-top-small ul li:active {
    color: var(--blue);
}

.blue .nav-btn .icon svg, .blue .footer-btn .icon svg {
    fill: var(--blue);
}

.blue .nav-btn:active .icon svg {
    fill: var(--blue);
}

.blue .footer .cell .txt {
    color: var(--light-blue);
}

.blue #cube .cubie {
    background-color: rgba(0, 140, 255, 0.25);
}

.blue #cube .cubie.use.active, .blue #cube .cubie.active.hover {
    -webkit-box-shadow: 0px 0px 40px 0px rgba(0, 140, 255, 1);
    -moz-box-shadow: 0px 0px 40px 0px rgba(0, 140, 255, 1);
    box-shadow: 0px 0px 40px 0px rgba(0, 140, 255, 1);
}

.blue #cube .cubie.hover {
    background: var(--blue);
    -webkit-box-shadow: 0px 0px 40px 0px rgba(0, 140, 255, 1);
    -moz-box-shadow: 0px 0px 40px 0px rgba(0, 140, 255, 1);
    box-shadow: 0px 0px 40px 0px rgba(0, 140, 255, 1);
}

.blue #cube .cubie svg {
    fill: rgba(77, 187, 231, 0.75);
}

.blue #cube .cubie.active svg, .blue #cube .cubie.active.hover svg {
    fill: var(--blue);
}

.blue .logo-slot {
    background-image: url("../img/slot-logo-blue.png");
}

.idot .logo-slot {
    background-image: url("../img/slot-logo_idot.png");
}

.blue .gfx-table {
    background-image: url("../img/red-table-blue.png");
}

.idot .gfx-table {
    background-image: url("../img/red-table_idot.png");
}

.idot .gfx-cards {
    background-image: url("../img/flying-cards_idot.png");
}

.idot .reel.first {
    background-image: url("../img/reel1_idot.png");
}

.idot .reel.second {
    background-image: url("../img/reel2_idot.png");
}

.idot .reel.third {
    background-image: url("../img/reel3_idot.png");
}

.blue .about-ico.first .ico {
    background-image: url("../img/poker-cards1-blue.svg");
}

.blue .about-ico.second .ico {
    background-image: url("../img/diamond-blue.svg");
}

.blue .about-ico.third .ico {
    background-image: url("../img/lucky-blue.svg");
}

/* ORANGE */

.orange ::-webkit-scrollbar-thumb:hover {
    background: var(--orange)
}

.orange .txt-color-red {
    color: var(--orangetxt);
}

.orange .line-separator {
    background-color: var(--light-orange);
}

.orange .divider-100 {
    background-color: var(--orange);
}

.orange .menu-top li.active, .orange .menu-top li.active.hvr-overline-from-center:before {
    border-top: 1px solid var(--orange);
}

.orange .menu-left .btn.active .line {
    background-color: var(--orange);
}

.orange .corner-top-left {
    border-left: 1px solid var(--orange);
    border-top: 1px solid var(--orange);
}

.orange .corner-bottom-right {
    border-right: 1px solid var(--orange);
    border-bottom: 1px solid var(--orange);
}

.orange .btn-red-border {
    border: 1px solid var(--orange);
}

.orange .btn-red-border:active {
    border: 1px solid var(--orange);
}

.orange .slot-bg .line {
    background-color: var(--orange);
}

.orange .logo-slot {
    filter: drop-shadow(0 0 0px orange);
}

.orange .menu-top-small ul {
    border-left: 1px solid var(--orange);
}

.orange .menu-top-small ul li:active {
    color: var(--orange);
}

.orange .nav-btn .icon svg, .orange .footer-btn .icon svg {
    fill: var(--orange);
}

.orange .nav-btn:active .icon svg {
    fill: var(--orange);
}

.orange .footer .cell .txt {
    color: var(--light-orange);
}

.orange #cube .cubie {
    background-color: rgba(255, 97, 0, 0.4);
}

.orange #cube .cubie.use.active, .orange #cube .cubie.active.hover {
    -webkit-box-shadow: 0px 0px 40px 0px rgb(255, 130, 0);
    -moz-box-shadow: 0px 0px 40px 0px rgba(255, 130, 0, 1);
    box-shadow: 0px 0px 40px 0px rgba(255, 130, 0, 1);
}

.orange #cube .cubie.hover {
    background: var(--orange);
    -webkit-box-shadow: 0px 0px 40px 0px rgba(255, 130, 0, 1);
    -moz-box-shadow: 0px 0px 40px 0px rgba(255, 130, 0, 1);
    box-shadow: 0px 0px 40px 0px rgba(255, 130, 0, 1);
}

.orange #cube .cubie svg {
    fill: rgba(231, 149, 79, 0.75);
}

.orange #cube .cubie.active svg, .orange #cube .cubie.active.hover svg {
    fill: var(--orange);
}

.orange .logo-slot {
    background-image: url("../img/slot-logo_orange.png");
}

.orange .logo-slot {
    background-image: url("../img/slot-logo_orange.png");
}

.orange .gfx-table {
    background-image: url("../img/red-table-orange.png");
}


.orange .gfx-cards {
    background-image: url("../img/flying-cards_orange.png");
}

.orange .reel.first {
    background-image: url("../img/reel1_orange.png");
}

.orange .reel.second {
    background-image: url("../img/reel2_orange.png");
}

.orange .reel.third {
    background-image: url("../img/reel3_orange.png");
}

.orange .about-ico.first .ico {
    background-image: url("../img/poker-cards1-orange.svg");
}

.orange .about-ico.second .ico {
    background-image: url("../img/diamond-orange.svg");
}

.orange .about-ico.third .ico {
    background-image: url("../img/lucky-orange.svg");
}