table {
    border: solid 2px lightgrey;
    width: 100%;
    margin: auto;
    text-align: center;
    font-family: 'Orbitron', sans-serif;
    color: rgb(36, 173, 36);
    background-color: rgba(100, 100, 100, 0.4);
    font-weight: 500;
    border-radius: 10px;
    /* color: rgb(199, 199, 199) */
}
table th {
    font-size: 22px;
    font-weight: 450;
}
canvas {
    width: 100px;
    height: 50px;
}
.main {
    text-align: center;
}
.joke {
    display: none;
    color: red;
}
#bottom-text {
    text-align: right;
}
body {
    background: linear-gradient(to bottom, rgba(92, 77, 66, 0) 0%, rgba(92, 77, 66, 00) 100%), url("../img/background.jpg");
    background-color: #000;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
    color: rgb(36, 173, 36);
}
.laser {
    font-size: 20px;
    font-family: 'Orbitron', sans-serif;
    font-weight: 600;
    color: rgb(36, 173, 36);
    margin-left: 30px;
}
@media screen and (max-width: 1100px) {
    .main, .laser, th {
        font-size: 14px !important;
    }
    h1, h2, h3 {
        font-size: 22px !important;
    }
}
@media screen and (max-width: 800px) {
    .main, .laser, th {
        font-size: 10px !important;
    }
    h1, h2, h3 {
        font-size: 16px !important;
    }
}