/*Shared HTML5 Interactive User Interface Elements*/
canvas {
	-moz-user-select: none;
	-webkit-user-select: none;
}
/*Module container*/
#html5module {
	position: relative;
	width: 800px;
	height: 600px;
	margin: 0 auto;
	border:1px solid;
	border-color: #999;
	box-shadow: 5px 5px 4px #EEE;
	background-color: #FFF;
}

/*Sapling logo*/
#logo {
	position: absolute;
	width:150px;
	height:48px;
	top:10px;
	left:645px;
	background-image: url('../img/SaplingLearning_logo_small.png');
    background-image: -webkit-image-set( url(../img/SaplingLearning_logo_small.png) 1x, 
                                        url(../img/SaplingLearning_logo_2x.png) 2x);
}

/*Help message text box*/
.help-text {
    position: relative;
    visibility: hidden;
    top: 100px;
    left: 25px;
    width: 300px;
    border: 1px #999 solid;
	background-color:#FFFFE5;
	padding:12px 16px 16px 16px;
	border-radius: 8px;
    font: 14px Arial, Helvetica, sans-serif;
    text-align: left;
    box-shadow: 3px 3px 5px #CCC;
    z-index: 10;
    cursor: default;
}

/*UI button style for Help, Reset, etc.*/
.ui-font {
    font: 14px Arial, Helvetica, sans-serif;
}
.ui-button {
    position: absolute;
    display: inline-block;
    line-height: 30px;
    color: black;
    background-color: #eeeeee;
    border: 1px solid #999999;
    border-radius: 10px;
    font: 14px Arial, Helvetica, sans-serif;
    padding: 11px 18px 11px 18px;
    cursor: pointer;
}
.ui-button:hover {
    background-color: #cccccc;
}

.ui-checkbox {
    background-repeat: no-repeat;
    background-image: url('../img/ui_checkbox.png');
    background-image: -webkit-image-set( url(../img/ui_checkbox.png) 1x, 
                                        url(../img/ui_checkbox_2x.png) 2x);
    padding-left: 40px;
    background-position: 13px -23px;
}
.ui-checkbox.checked {
    background-position: 13px 7px;
}