.towersOfHanoi {
	float: left;
    position: relative;
}
.towersOfHanoi .canvas {
    position: relative;
	float: left;
}

.towersOfHanoi .canvas .canvasDisablingLayer {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    display: none;
}
.towersOfHanoi.solved .canvas .canvasDisablingLayer,
.towersOfHanoi.isSolving .canvas .canvasDisablingLayer
{
    display: block;
}


.towersOfHanoi .rodSection {
	width: 100px;
	float: left;
	position: relative;
}
.towersOfHanoi .rodSection .rod {
	width: 10px;
	height: 200px;
	margin-left: auto;
	margin-right: auto;
}
.towersOfHanoi .rodSection .discContainer {
	position: absolute;
	right: 0px;
	bottom: 0px;
	left: 0px;
}
.towersOfHanoi .rodSection .hitArea {
	position: absolute;
	top: 0px;
	right: 10px;
	bottom: 0px;
	left: 10px;
}


.towersOfHanoi .disc {
	margin-left: auto;
	margin-right: auto;
}
.towersOfHanoi .disc.size-1 {
	width: 30px;
}
.towersOfHanoi .disc.size-2 {
	width: 35px;
}
.towersOfHanoi .disc.size-3 {
	width: 40px;
}
.towersOfHanoi .disc.size-4 {
	width: 45px;
}
.towersOfHanoi .disc.size-5 {
	width: 50px;
}
.towersOfHanoi .disc.size-6 {
	width: 55px;
}
.towersOfHanoi .disc.size-7 {
	width: 60px;
}
.towersOfHanoi .disc.size-8 {
	width: 65px;
}
.towersOfHanoi .disc.size-9 {
	width: 70px;
}
.towersOfHanoi .disc.size-10 {
	width: 75px;
}
.towersOfHanoi .disc.size-11 {
	width: 80px;
}
.towersOfHanoi .disc.size-12 {
	width: 85px;
}


.towersOfHanoi .dragHelper {
	position: absolute;
}

.towersOfHanoi .dragHelper .disc {
    margin: 0px; /* for ie7 */
}




/* Controls */

.towersOfHanoi .controls {
}

.towersOfHanoi .controls .btn-restart {
	cursor: pointer;
}
.towersOfHanoi .controls .btn-solve {
	cursor: pointer;
}

.towersOfHanoi .controls .dec-inc-group {
    overflow: hidden;
}
.towersOfHanoi .controls .dec-inc-group.disabled {
    background: gray;
}

.towersOfHanoi .controls .dec-inc-group .btn-decreaseDiscCount,
.towersOfHanoi .controls .dec-inc-group .btn-increaseDiscCount {
    float: left;
    cursor: pointer;
}
.towersOfHanoi .controls .dec-inc-group .btn-decreaseDiscCount.disabled,
.towersOfHanoi .controls .dec-inc-group .btn-increaseDiscCount.disabled {
}

.towersOfHanoi .controls .dec-inc-group .numberOfDiscsIndicator {
    float: left;
}

.towersOfHanoi.isSolving.hideStepCountForComputerSolution .stepCountIndicator, 
.towersOfHanoi.solved-by-computer.hideStepCountForComputerSolution .stepCountIndicator {
    visibility: hidden;
}

.towersOfHanoi .controls .timer-group .btn-hideTimer {
    display: none;
}
.towersOfHanoi .controls .timer-group .timeIndicator {
    display: none;
}
.towersOfHanoi .controls .timer-group.visible .btn-hideTimer {
    display: block;
}
.towersOfHanoi .controls .timer-group.visible .btn-showTimer {
    display: none;
}
.towersOfHanoi .controls .timer-group.visible .timeIndicator {
    display: block;
}


/* Controls - WHEN PLACED ON THE RIGHT  */

.towersOfHanoi.controlsPlacement-right .controls {
	margin-left: 10px;
	width: 200px;
    float: left;
}


/* Controls - WHEN PLACE AT THE BOTTOM */

.towersOfHanoi.controlsPlacement-bottom .controls {
    clear: both;
}