.SudokuContainer {
float: left;
clear: left;
border: 1px solid black;
margin: 0 30px 0 0;
padding: 0;
width: 294px;
height: 294px;
}

.HintContainer {
float: left;
clear: none;
border: 1px solid black;
margin: 0;
padding: 0;
width: 294px;
height: 294px;
}

.SudokuSubBox {
float: left;
border: 1px solid black;
margin: 0;
padding: 0;
width: 96px;
height: 96px;
}

.HintSubBox {
float: left;
border: 1px solid black;
margin: 0;
padding: 0;
width: 96px;
height: 96px;
}

.SudokuCell {
float: left;
border: 1px solid gray;
margin: 0;
padding: 0;
width: 30px;
height: 30px;
text-align: center;
}

.HintCell {
float: left;
border: 1px solid gray;
margin: 0;
padding: 0;
width: 30px;
height: 30px;
text-align: center;
}

.SudokuInput {
font: 26px Arial;
border: 0;
margin: 0;
padding: 0;
width: 30px;
height: 30px;
text-align: center;
}

.SudokuCell #UNKNOWN{
color: #780078;
}

.SudokuCell #INCORRECT{
background-color: #FF0000;
}

.SudokuLogic {
float: left;
font: 8px Arial;
border: 0;
margin: 0;
padding: 0;
width: 10px;
height: 10px;
text-align: center;
}

.HintCell #CORRECT {
background-color: #00FF00;
font-weight: bold;
}

.HintCell #INCORRECT {
background-color: #FF0000;
}

.HintCell #OBVIOUS {
background-color: #3030FF;
font-weight: bold;
}

.HintCell #NOSOLUTION {
background-color: #BB0000;
}

.SudokuButtons {
float: none;
clear: both;
border: 0;
margin: 0;
padding: 20px 0 0 0;
}

.LBContainer {
float: none;
clear: both;
width: 100%;
height: 110px;
border: 0;
margin: 0;
padding: 0;
}

.BannerContainer {
float: left;
clear: none;
border: 0;
margin: 0px 0px 0px 20px;
padding: 0;
}

.LegendContainer {
float: left;
clear: none;
border: 1px solid black;
margin: 0;
padding: 0;
width: 200px;
height: 110px;
}

.LegendEntry {
border: 1px solid red;
float: none;
clear: both;
border: 0;
padding: 5px;
margin: 0;
}

.LegendEntry #TEXT {
float: left;
clear: none;
padding-left: 20px;
}

.LegendEntry #CORRECT {
float: left;
clear: none;
width: 30px;
height: 30px;
background-color: #00FF00;
}

.LegendEntry #INCORRECT {
float: left;
clear: none;
width: 30px;
height: 30px;
background-color: #FF0000;
}

.LegendEntry #OBVIOUS {
float: left;
clear: none;
width: 30px;
height: 30px;
background-color: #3030FF;
}

.LegendEntry #NOSOLUTION {
float: left;
clear: none;
width: 30px;
height: 30px;
background-color: #BB0000;
}