/*.pickedNumbers {
    font-family: Arial;
    padding: 2px;
    width: 100px;
}
    
#pickedNumbers tr {
    border-bottom: 1px solid grey;
}*/

#picked-numbers > tbody > tr > td.unpicked-number {
    color: #DADAD0;
}

#picked-numbers > tbody > tr > td.picked-number {
    color: green;
    font-weight: bold;
}

#picked-numbers > tbody > tr > td.last-picked-number {
    color: red;
    font-weight: bold;
}

.ball-container {
    display: inline;
}

.ball-table {
    width: 100%;
}

.ball {
    /*display: inline;*/
    border: 20px solid green;
    border-radius: 50%;
    box-sizing: border-box;
    text-align: center;
    margin: 10px;
    vertical-align: middle;

    font-size: 200%;
    line-height: 100%;

}

.ball:nth-of-type(1) {
    opacity: 1;
}

.ball:nth-of-type(2) {
    opacity: 0.90;
}

.ball:nth-of-type(3) {
    opacity: 0.80;
}

.ball:nth-of-type(4) {
    opacity: 0.70;
}

.ball:nth-of-type(5) {
    opacity: 0.60;
}

.ball:nth-of-type(6) {
    opacity: 0.50;
}

.ball:nth-of-type(7) {
    opacity: 0.45;
}

.ball:nth-of-type(8) {
    opacity: 0.40;
}

.ball:nth-of-type(9) {
    opacity: 0.35;
}

.ball:nth-of-type(10) {
    opacity: 0.30;
}


/* ---------------------------------------------- */
/* -- Message box --- */
/* ---------------------------------------------- */
.message-container {
    display: block;
    width: 100%;
}

.message-box {
    border: 2px solid grey;
    border-radius: 10px;

    padding: 10px;

    color: black;
}

.close-button {
    color: white;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
.close-button:hover {
    cursor: pointer;
}

.error-box {
    background-color: red;
}

.info-box {
    background-color: green;
}
/* ---------------------------------------------- */
/* -- Message box --- */
/* ---------------------------------------------- */


/* ---------------------------------------------- */
/* -- Last numbers --- */
/* ---------------------------------------------- */
.last-number-list-item {
    margin: 5px;
    background-color: lightgreen;
    border-radius: 90%;
    color: black;
    font-weight: bold;
    font-size: 200%;
    text-align: center;
}

.last-number-list-item:nth-of-type(1) {
    opacity: 1;
}

.last-number-list-item:nth-of-type(2) {
    opacity: 0.87;
}

.last-number-list-item:nth-of-type(3) {
    opacity: 0.74;
}

.last-number-list-item:nth-of-type(4) {
    opacity: 0.61;
}

.last-number-list-item:nth-of-type(5) {
    opacity: 0.48;
}

.last-number-list-item:nth-of-type(6) {
    opacity: 0.35;
}
/* ---------------------------------------------- */
/* -- Last numbers --- */
/* ---------------------------------------------- */