/* General Styles */
		body {
			font-family: Arial, Verdana, sans-serif;
			min-height: 697px;
			background-color: #ddd;
			-webkit-font-smoothing: antialiased;
		}
		*{ padding:0px; margin:0px; }
		img{ border: none; }
		a:focus, a:active{ outline:none; }
		body{ text-align:center; background:#111; overflow:hidden; }
		h1{ font:bold 18px Helvetica, Arial, sans-sarif; color:#FFF; margin:20px 0 0 0; }
		
		/* Picture Styles */
		#picture{ position:relative; top:0px; width:1280px; height:698px; margin:0px auto; background:#FFF url('../img/snowman-321034_1280_2.jpg'); overflow:hidden;
			-webkit-background-size: 100%;
			-moz-background-size: 100%;
			-o-background-size: 100%; 
			background-size: 100%;
			background-repeat: no-repeat;
			width: 100%;
			max-width: 1280px; }
			
			/* General More Button */		
			/*.more{ position:absolute; width:100px; height:100px; background:url('dim.png'); border:1px dashed #f2d721; padding:5px; text-align:left; overflow:hidden; }
			.more span{ position:absolute; left:110px; width:190px; padding:15px 0 0 5px; color:#FFF; font:bold 13px Lucida Grande, Arial, sans-serif; text-shadow:#000 1px 1px 0px; }*/
			
			
			
			/* Item Specific More Button */
			/*#first{ top:25%; left:5%;}
			#first{ top:100px; left:100px;}
			#second{ top:18%; left:25%; }
			#second{ top:180px; left:250px; }
			#third{ top:33%; left:39%; }
			#third{ top:330px; left:390px; }
			#fourth{ top:5%; left:45%; }
			#fourth{ top:50px; left:450px; }
			#fifth{ top:55%; left:65%; }
			#fifth{ top:550px; left:650px; }
			#sixth{ top:350px; left:750px; }*/
			
			/* General Info Box */
			/*#infobox{ position:absolute; bottom:-200px; left: 550px; height:200px; width:300px; z-index:20; margin:0 0 -100px -150px; background:#FFF; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
				#infobox a, #infobox a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
				#infobox a:hover{ text-decoration:underline; }
			*/	
				/* Close button for info box */
			/*	span.close{position:absolute; right:5px; top:5px;}
			*/
			/* The dimmed background when the popup box is showing */	
			#fade_bg{ position:absolute; top:0px; left:0px; z-index:15; width:100%; height:100%; background: url('../img/dim.png'); display:none;pointer-events: none;z-index:1000;}
			
			#copyright{position:absolute; top:5px; right:10px;font-size:9px;color:#efefef;}
			#copyright a{color:#efefef;text-decoration:none;}
			/*.boxOpen {border: color:yellow;width:100%;height:auto;font-size:50px;text-decoration:none;text-align:left;}*/
			
		/* Close button on fadein dialog */
		.rectangle button.close-modal{position:absolute;top:-12.5px;right:-12.5px;display:block;width:30px;height:30px;text-indent:-9999px;background-size:contain;background-color:transparent;cursor:pointer;border:none;visibility:hidden;background-repeat:no-repeat;background-position:center center;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==')}
		
/* iPad portrait */
@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
	
			/* General More Button */		
			.more{ position:absolute; width:70px; height:70px; background:url('dim.png'); border:3px solid #f2d721; padding:5px; text-align:left; overflow:hidden; }
			.more span{ position:absolute; left:80px; width:160px; padding:15px 0 0 5px; color:#FFF; font:bold 11px Lucida Grande, Arial, sans-serif; text-shadow:#000 1px 1px 0px; }
			.more a img {width:70px; height:auto;}
}
/* Mobile phones */
@media only screen and (max-width: 685px), only screen and (max-device-width: 685px) {
			/* General More Button */		
			.more{ position:absolute; width:50px; height:50px; background:url('dim.png'); border:3px solid #f2d721; padding:5px; text-align:left; overflow:hidden; }
			.more span{ position:absolute; left:60px; width:140px; padding:15px 0 0 5px; color:#FFF; font:bold 10px Lucida Grande, Arial, sans-serif; text-shadow:#000 1px 1px 0px; }
			.more a img {width:100%; height:auto;}
}
		

.backDoor
{
  /*background-color: lightgrey;*/
  position:absolute;
  z-index: 1;
  border:1px dashed #f2d721;
  background-color: transparent;
  /*position:relative;*/
  width:100px;
  height:100px;
  
  margin: 0 auto;
  /*margin-top:50px;*/
	visibility: hidden;
	/*font-size: 50%;*/
	font-size: 12px;
	font-family: Arial;
	padding: 5px;
	background:url('../img/father-christmas-2021006_98.png'); 
	-webkit-background-size: 100%;
	-moz-background-size: 100%;
	-o-background-size: 100%; 
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center;
}
.backDoor img {
	visibility: hidden;
  /*width:50%;*/
  height: auto;
}
/*.backDoor p {
   transform: scale(0.2);
}*/

.door
{
  background:url('../img/dim.png'); 
  border:1px dashed #f2d721;
  position:absolute;
  top:-1px;
  left:-1px;
  width:100px;
  height:100px;
	visibility: visible;
	padding: 5px;
 
  transform-origin: left;
  /*Speed of the Door animation*/
  /*transition: all 0.5s ease-in-out;*/
  cursor: pointer;
}

.door img {
	visibility: visible;
}

.doorOpen
{
  /*prespectiv creates the door open effect*/
  transform: perspective(1200px) translateZ(0px) translateX(0px) translateY(0px) rotateY(-105deg);
}

.rectangle
{
   width: 100px;
   height: 100px;
   display: block;
   position: absolute;
   /*top: 400px;
   left: 50px;*/
   border: 1px dashed #f2d721;
   margin: 10px;
   background: #bd0404 url(../img/christmas-tree-op40-640.png);
   -webkit-background-size: 55%;
	-moz-background-size: 55%;
	-o-background-size: 55%; 
	background-size: 55%;
	background-repeat: no-repeat;
	background-position: center;
   /*z-index: 1;*/
	visibility:			hidden;
}

.square-small
{
   display: block;
   width: 90px;
   height: 90px;
   position: absolute;
   padding: 5px;
   margin: 0px 0;
      
	/*-webkit-transition: 1s;
	-moz-transition:    1s;
	-ms-transition:     1s;
	-o-transition:      1s;
	transition:         1s;*/

	/*background-color: #B2342C;*/
	background-color: #bd0404;
	background-color: transparent;
	border: none;
	border-radius: 0px;
	/*border: 2px solid #f2d721;
	border-radius: 5px;*/
	overflow: hidden;
	color: #efefef;
	text-align: center;
	visibility:			hidden;
}
.square-small h2 {
   /*transform: scale(0.5);*/
   font-size: 50%;
	-webkit-transition: 1s;
	-moz-transition:    1s;
	-ms-transition:     1s;
	-o-transition:      1s;
	transition:         1s;
	visibility:			hidden;
	margin-bottom: 10px;
	padding-bottom: 10px;
	/*line-height: 12px;*/
}
.square-small p {
	
   /*transform: scale(0.5);*/
   font-size: 50%;
	-webkit-transition: 1s;
	-moz-transition:    1s;
	-ms-transition:     1s;
	-o-transition:      1s;
	transition:         1s;
	visibility:			hidden;
	/*margin-top: 0px;
	padding-top: 0px;
	margin-bottom: 0px;
	padding-bottom: 0px;*/
}
.square-small a {
	color: #efefef;
}
.square-small img {
	max-width: 90%;
	max-height: 90%;
}