table {
    border-collapse: collapse;
    border: solid 2px #999;
    display: inline-block;
}

td.sudokubox{
    min-width: 3rem;
    min-height: 3rem;
    line-height: 2.8rem;
    font-size : 1.5rem; 
    display: inline-block;   
}

.clickabletd{
    cursor: pointer;
}

.prefilled{
    font-weight: bold;
    background: #F4F4F4;
}

.markedtd{
    background : radial-gradient(  #E0E0E0 , #A0A0A0 ) !important;
    color : #FFF;
}

.selectabletd{
    background : radial-gradient(  #d5d8dc , #34495e ) !important;
    color : #FFF;
    cursor: pointer;
}

.lifeline{
    color: green;
    cursor: pointer;
    margin-right: 5px;
    font-size: 1.5rem;
}
.usedlifeline{
    color: #B0B0B0;
    margin-right: 5px;
    font-size: 1.5rem;
}

@media screen and ( max-width : 750px ){
    td.sudokubox {
        min-width: 2.5rem;
        min-height: 2.5rem;
        line-height: 2rem;
        font-size : 1.3rem;
    }  

}
@media screen and ( max-width : 480px ){
    td.sudokubox {
        min-width: 2.2rem;
        min-height: 2.2rem;
        line-height: 2rem;
        font-size : 1rem;
    } 
}