html {
    background-color: #000000;
    border-color: brown;
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    display: block;
    font-family: 'itgaming05';
    font-size: 1.6vw;
}
  
body {
    margin: 0;
    padding: 0;
    color: white;
}

embed {
    margin: 0;
    padding: 0;
}

/* HD Configuration Information */

#help-hd {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: no-repeat center center fixed;
    background-image: url("./images/ui/help_background.png");
    background-size: cover;
}

#help-hd__content {
    max-height: 89vh;
    overflow-y: scroll;
}

#help-hd__footer {
    text-align: center;
    background-color: black;
}

#help-hd__content h1 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 3vw;
    background: linear-gradient(180deg, #d1ac30,
    #ffff66 16%, #ffffff 20%, #ffe600 42%, #e3b600 67%, #ffff66 87%, #fffbdb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#help-hd__content h3 {
    margin-top: 0;
    margin-bottom: 0;
    font-size:2.1vw;
    background: linear-gradient(180deg, #d1ac30,
    #ffff66 16%, #ffffff 20%, #ffe600 42%, #e3b600 67%, #ffff66 87%, #fffbdb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#help-hd__content ul {
    margin: 0;
    padding: 0;
    padding-left: 1.6vw;
    list-style-type: square;
}

#help-hd__last {
    background-color: black;
}

.help-hd__last--box {
    position: relative;
    padding-left: 5%;
    font-size: 1vw;
}

.help-hd__last--table-btns {
    position: absolute;
    top: 0.3vh;
    left: 0.3vw;
    width: 87%;
    height: auto;
    margin-left: 5%;
    padding: 1vw;
    font-size: 1.4vw;
    vertical-align: middle;
}

/* Navigation Buttons for HD */
.nav-menu-hd table {
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    vertical-align: middle;
}

.nav-menu-hd button {
    border: none;
    background-color: #000000;
    margin: 0;
    padding: 0;
    background-image: url("./images/ui/page_button_off.png");
    background-size: 3vw 3vw;
    background-repeat: no-repeat;
    width: 3vw;
    height: 3vw;
    display: block;
}

/* Navigation Buttons -- Page 1 */
.nav-item-hd__page1 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-hd__page1:hover .nav-item-hd__page1--on {
    opacity: 1;
}

.nav-item-hd__page1--on {
    position: absolute;
    top: 0vh;
    left: 0;
    opacity: 0;
    width: 3vw;
    height: 3vw;
    transition: all .4s ease;
}

.nav-item-hd__page1--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 1.2vw;
    height: 3vh;
    font-size: 1.7vw;
    color: white;
}

/* Navigation Buttons -- Page 2 */

.nav-item-hd__page2 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-hd__page2:hover .nav-item-hd__page2--on {
    opacity: 1;
}

.nav-item-hd__page2--on {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 3vw;
    height: 3vw;
    transition: all .4s ease;
}

.nav-item-hd__page2--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 1.2vw;
    height: 3vh;
    font-size: 1.7vw;
    color: white;
}

/* Navigation Buttons -- Page 3 */

.nav-item-hd__page3 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-hd__page3:hover .nav-item-hd__page3--on {
    opacity: 1;
}

.nav-item-hd__page3--on {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 3vw;
    height: 3vw;
    transition: all .4s ease;
}

.nav-item-hd__page3--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 1.2vw;
    height: 3vh;
    font-size: 1.7vw;
    color: white;
}

/* Navigation Buttons -- Page 4 */

.nav-item-hd__page4 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-hd__page4:hover .nav-item-hd__page4--on {
    opacity: 1;
}

.nav-item-hd__page4--on {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 3vw;
    height: 3vw;
    transition: all .4s ease;
}

.nav-item-hd__page4--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 1.2vw;
    height: 3vh;
    font-size: 1.7vw;
    color: white;
}

/* Navigation Buttons -- Page 5 */

.nav-item-hd__page5 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-hd__page5:hover .nav-item-hd__page5--on {
    opacity: 1;
}

.nav-item-hd__page5--on {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 3vw;
    height: 3vw;
    transition: all .4s ease;
}

.nav-item-hd__page5--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 1.2vw;
    height: 3vh;
    font-size: 1.7vw;
    color: white;
}

/* Navigation Buttons -- Page 6 */

.nav-item-hd__page6 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-hd__page6:hover .nav-item-hd__page6--on {
    opacity: 1;
}

.nav-item-hd__page6--on {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 3vw;
    height: 3vw;
    transition: all .4s ease;
}

.nav-item-hd__page6--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 1.2vw;
    height: 3vh;
    font-size: 1.7vw;
    color: white;
}

/* Navigation Buttons -- Last Page */

.nav-item-hd__last {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-hd__last:hover .nav-item-hd__last--on {
    opacity: 1;
}

.nav-item-hd__last--on {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 3vw;
    height: 3vw;
    transition: all .4s ease;
}

.nav-item-hd__last--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 1.2vw;
    height: 3vh;
    font-size: 1.7vw;
    color: white;
}

#nav-item-hd__done {
    position: relative;
    margin: 0;
    padding: 0;
    height: 4.4vh;
}

#nav-item-hd__done button {
    border: none;
    background-color: #000000;
    margin: 0;
    padding: 0;
    background-image: url("./images/ui/page_button_done.png");
    background-size: 8vw 5vh;
    background-repeat: no-repeat;
    width: 8vw;
    height: 5vh;
    display: block;
}

#nav-item-hd__done--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 4.7vw;
    height: 3vh;
    font-size: 1.7vw;
    color: white;
}

/* SD Configuration Information */

#help-sd {
    display: flex;
    flex-direction: column;
    font-size: 3.0vw;
}

#help-sd__content {
    max-height: 86vh;
    overflow-y: scroll;
}

#help-sd__content h1 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 4.5vw;
    background: linear-gradient(180deg, #d1ac30,
    #ffff66 16%, #ffffff 20%, #ffe600 42%, #e3b600 67%, #ffff66 87%, #fffbdb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#help-sd__content h3 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 4vw;
    background: linear-gradient(180deg, #d1ac30,
    #ffff66 16%, #ffffff 20%, #ffe600 42%, #e3b600 67%, #ffff66 87%, #fffbdb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#help-sd__content ul {
    margin: 0;
    padding: 0;
    padding-left: 3vw;
    list-style-type: square;
}

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

.help-sd__last--box {
    position: relative;
}

.help-sd__last--table-btns {
    position: absolute;
    top: 0;
    left: 0;
    height: auto;
    margin: 0;
    padding: 2vw;
    vertical-align: middle;
}

/* Navigation Buttons for SD */
.nav-menu-sd table {
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    vertical-align: middle;
}

.nav-menu-sd button {
    border: none;
    background-color: #000000;
    margin: 0;
    padding: 0;
    background-image: url("./images/ui/page_button_off.png");
    background-size: 9.5vw 9.5vw;
    background-repeat: no-repeat;
    width: 9.5vw;
    height: 9.5vw;
    display: block;
}

/* Navigation Buttons -- Page 1 */
.nav-item-sd__page1 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-sd__page1--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 2vw;
    height: 2.5vh;
    font-size: 2vh;
    color: white;
}

/* Navigation Buttons -- Page 2 */

.nav-item-sd__page2 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-sd__page2--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 2vw;
    height: 2.5vh;
    font-size: 2vh;
    color: white;
}

/* Navigation Buttons -- Page 3 */

.nav-item-sd__page3 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-sd__page3--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 2vw;
    height: 2.5vh;
    font-size: 2vh;
    color: white;
}

/* Navigation Buttons -- Page 4 */

.nav-item-sd__page4 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-sd__page4--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 2vw;
    height: 2.5vh;
    font-size: 2vh;
    color: white;
}

/* Navigation Buttons -- Page 5 */

.nav-item-sd__page5 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-sd__page5--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 2vw;
    height: 2.5vh;
    font-size: 2vh;
    color: white;
}

/* Navigation Buttons -- Page 6 */

.nav-item-sd__page6 {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-sd__page6--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 2vw;
    height: 2.5vh;
    font-size: 2vh;
    color: white;
}

/* Navigation Buttons -- Last Page */

.nav-item-sd__last {
    position: relative;
    margin: 0;
    padding: 0;
    height: 5vh;
}

.nav-item-sd__last--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 2vw;
    height: 2.5vh;
    font-size: 2vh;
    color: white;
}

.nav-item-sd__done {
    position: relative;
    margin: 0;
    padding: 0;
    height: 4.4vh;
}

.nav-item-sd__done button {
    border: none;
    background-color: #000000;
    margin: 0;
    padding: 0;
    background-image: url("./images/ui/page_button_done.png");
    background-size: 20vw 4.59vh;
    background-repeat: no-repeat;
    width: 20vw;
    height: 4.59vh;
    display: block;
}

.nav-item-sd__done--num {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 12vw;
    height: 2vh;
    font-size: 2vh;
    color: white;
}

/* font converted using font-converter.net. thank you! */

@font-face {
    font-family: "itgaming05";
    
    src: url("./fonts/itgaming05.woff") format("woff"), /* Modern Browsers */
        url("./fonts/itgaming05.woff2") format("woff2"); /* Modern Browsers */
    font-weight: normal;
    font-style: normal;
}

/* Test Code */

/* Uncomment to Hide Linked Text */
/*
.linked {
    display: none;
}
*/

/* Uncomment to Hide Jackpot Text */
/*
.jackpot {
    display: none;
}
*/

/* Uncomment to view all Table Frames */
/*
table, th, td {
    border: 1px solid;
}
*/

/*
ul, li {
    border: 1px solid;
}
*/

/* Uncomment to Hide HD Text */
/*
#help-hd {
    display: none;
}
*/

/* Uncomment to show HD table borders */
/*
#help-hd__content table, #help-hd__content tr, #help-hd__content td {
    border: 1px solid;
}
*/

/* Uncomment to Hide SD Text */
/*
#help-sd {
    display: none;
}
*/

/* Uncomment to show SD table borders */
/*
#help-sd__content table, #help-sd__content tr, #help-sd__content td {
    border: 1px solid;
}
*/

/* Uncomment to Hide Last Page Buttons */
/*
.help__last--auto {
    display: none;
}
*/

/*
.help__last--lobby {
    display: none;
}
*/

/*
.help__last--turbo {
    display: none;
}
*/

/*
.help__last--sound {
    display: none;
}
*/

/*
.help__last--recall {
    display: none;
}
*/

/*
.help__last--help {
    display: none;
}
*/
