/* CSS Document */

body{
  touch-action: none;	
}

.PageMover .TabBox {
   margin: 10px;	
}

.AnimationSequence{
   position: relative;	
   z-index: 100;
}

.little-number{
   z-index: 110;	
}

.Animation-frame{
  position: absolute;
  top: 0px;
  left: 0px;
  display: none;	
}

.drag-button{
   height: 60px;
   width: auto;	
   z-index: 1000;
}

.drag-button{
   cursor: pointer;	
}

.drag-button.cursordisabled{
   cursor: default;	
}

.DragBox .LightWrapBox{
	padding: 10px;
	width: 405px;
	float: left;
	margin-left: 30px;
	text-align: center;
}

.DragBox .LightWrapBox .iconwrapper{
   text-align: center;
   min-width: 65px;
   display: inline-block;	
}

.DragBox .LightWrapBox hr{
   color: white;
   background-color: white;
   height: 1px;	
}

.aDroppable .LightWrapBox{
   width: 100px;
   height: 100px;	
   
}

.PageMover .WhiteBackgroundColor{
   background-color: #F8F6F4;	
}

.aDroppable{
   margin-top: 15px;	
}

.DragArea{
   margin-top: 10px;
  
}

.DropArea{
	 width: 800px;
	 margin: 0px auto;
     padding-top: 0px;	
	 text-align: center;	
}

.DropArea>div{
	margin-right: 20px;
}

.DropArea>div::last-of-type{
	margin-right: 0px;
}

.ThePopupAudioText.padding-left{
  padding-left: 35px;
}

@media print{
    
	
  html{
	   display: table;	
	   width: 580px;
	   height: 970px;
	   position: absolute;
	   top: 0px;
	   left: 0px;
	}
	
    body{  
	text-align: left;
	vertical-align: middle;
	display: table-cell;
	height: 970px;
	width: 580px;
	max-width: 580px;  
	max-height: 100%;    
   }
   
   body.IsAndroid{
	   padding-left: 240px;   
   }
    
   #wrapper{
	   transform: rotate(90deg);
	   display: inline-block;
	   margin-left: -200px;
	      
   }
   
   body.IsAndroid #wrapper{
	   transform:  rotate(90deg) scale(0.8);   
   }
   
  
}