body 
{ 
    background-color: #fff;
    margin: 0;
	webkit-user-select:none !important;
	webkit-touch-callout:none !important;
	webkit-text-size-adjust:none !important;
}
.mainSelect {
	overflow:auto;
}	
	

#divCanvas {
	overflow:hidden;
	}
	
canvas
{
    overflow: hidden;   
    position: relative;
	touch-action:none;
	webkit-user-select:none ;
}
#canvas {
	background-image: content/images/whiteLinen;
}
.puzzle-image
{
    overflow: hidden;   
    position: absolute;
	z-index: 20000;
	user-select:none;
}

.puzzle-image1
{
    display:none;
	overflow: hidden;   
    position: absolute;
}

.icons
{ 
    cursor: pointer;
	padding: 5px;
	user-select:none;
	webkit-user-select:none;
}

.charms
{   z-index: 10;
    top: 10px;
    position: absolute;
    right: 10px;
	user-select:none !important;
	webkit-touch-callout:none !important;
	webkit-text-size-adjust:none !important;
	webkit-user-select:none !important;
}
.backButton
{   z-index: 10;
    top: 10px;
    position: absolute;
    left: 10px;
	user-select:none !important;
	webkit-touch-callout:none !important;
	webkit-text-size-adjust:none !important;
	webkit-user-select:none !important;
}

#eyeView , #backSVG {
	width:30px;
	height:30px;
	fill: midnightblue;
}
.icons:hover
{
    opacity: 1.0;
}
.finish {
	position:absolute;
	top:0px;
	z-index:18000;
	object-fit: contain !important;
	left:0px;
    animation: fadeIn ease 10s;
	display:block;
}
@keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

.showPuzzleOutline {
	display:block !important;
}
.start { display:none;position:absolute;z-index:19000;
}
#congrat {
	text-align: center;
	width: 100%;
	font-size: 40px;
	position: absolute;
	top: 0rem;
	left: 0;
	right: 0;
	color: white;
	font-weight: 900;
	font-family: sans-serif;
	color:white;
	text-shadow: 4px 4px #000000;
}
div.fSelect {
	flex: 1;
	color: white;
	cursor: pointer;
    width: 110px;
    height: 95px;
}
div.fSelect label h3 {
	cursor: pointer;
	padding: 5px;
}