.btn-menu-1-1, .btn-menu-1-0:hover, .btn-menu-1-1:hover  {
    /*green - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: #28A745;
    border-color: #28A745;
}

.btn-menu-1-0 {
    /*green - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #28A745;
    background-color: #FFFFFF;
    border-color: #28A745;
}


.btn-menu-2-1, .btn-menu-2-0:hover, .btn-menu-2-1:hover  {
    /*yellow - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #333333;
    background-color: #FFC107;
    border-color: #FFC107;
}

.btn-menu-2-0 {
    /*yellow - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FFC107;
    background-color: #FFFFFF;
    border-color: #FFC107;
}


.btn-menu-3-1, .btn-menu-3-0:hover, .btn-menu-3-1:hover  {
    /*blue - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: #17A2B8;
    border-color: #17A2B8;
}

.btn-menu-3-0 {
    /*blue - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #17A2B8;
    background-color: #FFFFFF;
    border-color: #17A2B8;
}

.btn-menu-4-1, .btn-menu-4-0:hover, .btn-menu-4-1:hover  {
    /*red - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: #DC3545;
    border-color: #DC3545;
}

.btn-menu-4-0 {
    /*red - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #DC3545;
    background-color: #FFFFFF;
    border-color: #DC3545;
}


.btn-menu-5-1, .btn-menu-5-0:hover, .btn-menu-5-1:hover  {
    /*green 2 - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: #3D9970;
    border-color: #3D9970;
}

.btn-menu-5-0 {
    /*green 2 - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #3D9970;
    background-color: #FFFFFF;
    border-color: #3D9970;
}

.btn-menu-6-1, .btn-menu-6-0:hover, .btn-menu-6-1:hover  {
    /*orange - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #222222;
    background-color: #FF851B;
    border-color: #FF851B;
}

.btn-menu-6-0 {
    /*orange - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FF851B;
    background-color: #FFFFFF;
    border-color: #FF851B;
}


.btn-menu-7-1, .btn-menu-7-0:hover, .btn-menu-7-1:hover  {
    /*dark blue - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: #6610F2;
    border-color: #6610F2;
}

.btn-menu-7-0 {
    /*dark blue - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #6610F2;
    background-color: #FFFFFF;
    border-color: #6610F2;
}


.btn-menu-8-1, .btn-menu-8-0:hover, .btn-menu-8-1:hover  {
    /*dark red - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: #D81B60;
    border-color: #D81B60;
}

.btn-menu-8-0 {
    /*dark red - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #D81B60;
    background-color: #FFFFFF;
    border-color: #D81B60;
}

.btn-menu-9-1, .btn-menu-9-0:hover, .btn-menu-9-1:hover  {
    /*grey (practice test) - done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: #ADB5BD;
    border-color: #ADB5BD;
}

.btn-menu-9-0 {
    /*grey (practice test)  - not done*/
    width: 40px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 40px !important;
    text-align: center;
    padding: 0px;
    font-size: 12px;
    color: #ADB5BD;
    background-color: #FFFFFF;
    border-color: #ADB5BD;
}