html {
	background-color: #bfc0cd;
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 100%;
	height: -webkit-fill-available;
}

body {
	font-family: sans-serif;
	background-color: #bfc0cd;
	color: #000000;
	font-size: 16px;
	margin: 0px;
    padding: 0px;
	overflow: hidden; 
	width: 100%;
	height: 100%;
	height: -webkit-fill-available;
	-webkit-tap-highlight-color: transparent;
}

::backdrop {
	background-color: #bfc0cd;
}

button {
	height: 12mm;
	font-size: 16px;
	margin: 2mm;
	padding: 1mm;
}

input {
	height: 12mm;
	font-size: 16px;
	margin: 2mm;
}

select {
	height: 12mm;
	font-size: 16px;
	margin: 2mm;
}

.divWin {
	z-index: 0;
	position: absolute;
	overflow: hidden; 
	top: 0;
    left: 0;
	width: 400px;
	height: auto;
	margin: 0;
	padding: 8px;
	background-color: #ffffff;
	color: #000000;
	font-size: 16px;
	
	text-align: center;
	
	border-radius: 8px;
	box-shadow: 4px 4px 8px #00000055;
}

#btnEndWin {
	height: 12mm;
	font-size: 16px;
}

.btnclosewin {
	background-image: url('../gfx/btnclose.svg');
	background-size: cover;
	background-color: #ffffff;
	color: #ffffff;
	width: 12mm;
	height: 12mm;
    position: absolute;
    border: none;
    top: 10px;
    right:10px;
}

.btnclosewin:hover {
	background-image: url('../gfx/btnclose.svg');
	background-size: cover;	
}

.buttonsize {
	visibility: hidden;
	width: 5.5em;
	height: 5.5em;
}

.buttonspace {
	visibility: hidden;
	width: 0.5em;
	height: 0.5em;
}

.mainpage {
	text-align: center;
	margin: 0px;
    padding: 0px;
	user-select: none; /* supported by Chrome and Opera */
	-webkit-user-select: none; /* Safari */
	-khtml-user-select: none; /* Konqueror HTML */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
}

.divGrid {
	margin: 0px;
    padding: 0px;
}

#canvasMain {
	cursor:default;
	text-align: center;
	user-select: none; /* supported by Chrome and Opera */
	-webkit-user-select: none; /* Safari */
	-khtml-user-select: none; /* Konqueror HTML */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
}

#sudokuTableScores {
	width: 100%;
	font-family: sans-serif;
	font-size: 16px;
	border: 0px;
	border-collapse: collapse;
}

#sudokuScoresOptions {
	width: 100%;
}

.divScore {
	background-color: #FFFFFF;
	text-align: center;
	width: auto;
	margin: 2mm;
	padding: 2mm;
	border-radius: 8px;
	box-shadow: 4px 4px 8px #00000055;
}

.divMessage {
	background-color: #FFFFFF;
	text-align: left;
	width: auto;
	margin: 4mm;
	padding: 4mm;
	border-radius: 8px;
	box-shadow: 4px 4px 8px #00000055;
}

.textMessageTitle {
	font-size: 18px;
}

.textMessage {
	font-size: 16px;
}

.divCredits {
	background-color: #FFFFFF;
	text-align: center;
	width: auto;
	margin: 2mm;
	padding: 2mm;
	border-radius: 8px;
	box-shadow: 4px 4px 8px #00000055;
}

.divNewGrid {
	background-color: #FFFFFF;
	text-align: center;
	width: auto;
	margin: 2mm;
	padding: 2mm;
	border-radius: 8px;
	box-shadow: 4px 4px 8px #00000055;
}

.divConnect {
	background-color: #FFFFFF;
	text-align: center;
	width: auto;
	margin: 2mm;
	padding: 2mm;
	border-radius: 8px;
	box-shadow: 4px 4px 8px #00000055;
}

.divHelp {
	background-color: #FFFFFF;
	text-align: center;
	width: auto;
	margin: 2mm;
	padding: 2mm;
	border-radius: 8px;
	box-shadow: 4px 4px 8px #00000055;
}

.divSettings {
	background-color: #FFFFFF;
	text-align: center;
	width: auto;
	margin: 2mm;
	padding: 2mm;
	border-radius: 8px;
	box-shadow: 4px 4px 8px #00000055;
}

table {
	margin: 0px;
	border: 0px;
}

#imgButtonUndo {
	display:none;
}

#imgButtonRedo {
	display:none;
}

#imgButtonSoundOff {
	display:none;
}

#imgButtonSoundOn {
	display:none;
}

#imgButtonNew {
	display:none;
}

#imgButtonPause {
	display:none;
}

#imgButtonDelete {
	display:none;
}

#imgButtonHelp {
	display:none;
}

#imgButtonScores {
	display:none;
}

#imgButtonInfo {
	display:none;
}

#imgButtonBuy {
	display:none;
}

#imgButtonFullscreen {
	display:none;
}

#imgButtonPrint {
	display:none;
}

#imgButtonSave {
	display:none;
}

#imgButtonLoad {
	display:none;
}

#imgButtonSettings {
	display:none;
}

#imgButtonLogin {
	display:none;
}

#imgButtonLogout {
	display:none;
}

#imgButtonPen {
	display:none;
}


#hsName {
	background-color: #222222;
	color: #ffffff;
	font-weight: bold;
	font-size: 18px;
}

#hsNumber {
	background-color: #222222;
	color: #ffffff;
	font-weight: bold;
	font-size: 18px;
}

#hsTime {
	background-color: #222222;
	color: #ffffff;
	font-weight: bold;
	font-size: 18px;
}

.trScore {
	background-color: #DDDDDD;
}

.trScore:nth-child(even) {
	background-color: #CCCCCC;
}

th, td {
	padding: 8px;
}


select {
	padding: 4px;	
}

button {
	padding: 4px;	
}

#btnBuy {
	font-size: 18px;
	font-weight: bold;
	padding: 8px;
}

#inputLogin {
	font-size: 18px;
	padding: 4px;
	width: 200px;
	height: 32px;
	line-height: 16px;
}

#inputPassword {
	font-size: 18px;
	padding: 4px;
	width: 200px;
	height: 32px;
	line-height: 16px;
}

#txtLogin {
	font-size: 18px;
	padding: 4px;
}

#txtPassword {
	font-size: 18px;
	padding: 4px;
}

#btnSendConnect {
	font-size: 18px;
}

#txtErrorConnect {
	font-size: 16px;	
	color: #FF0000;
}

#dpi {
    height: 1in;
    left: -100%;
    position: absolute;
    top: -100%;
    width: 1in;
	margin: 0;
	padding: 0;
	user-select: none; /* supported by Chrome and Opera */
	-webkit-user-select: none; /* Safari */
	-khtml-user-select: none; /* Konqueror HTML */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
}