/*div#container {height:500px;width:500px;}*/

@media only screen and (max-width: 600px) {
	.festive-container, #festive-container{
	display:none;
}
}

.pum-active{
	opacity:1 !important;
	display:block !important;
}

.festive-container canvas{
	z-index: 9 !important;
	top:200px;
	x:200px;
	width: 100vw !important;
	height: 50vw !important;
	border:none;
	position: relative;
}
@media only screen and (max-width: 600px) {
	.festive-container canvas{
	height: 100vw !important;
	}
}
.festive-container{
	position: absolute;
	width: 100% !important;
	height: 50vw !important;
	pointer-events: none; 
	top: -200px;
}
@media only screen and (max-width: 600px) {
	.festive-container{
	height: 100vw !important;
	}
}











div.a,div.c,div.d,div.e {
width: 10vw;
height: 10vw;
 /*background-color:green;*/
position:absolute;
pointer-events: all; 
    
}


div.b {
width: 8vw;
height: 8vw;
 /*background-color:green;*/
position:absolute;
pointer-events: all; 
    
}











#festive-container {
	pointer-events: none;
    position: absolute;
	width: 100%;
	height: 50vw !important;
	top: 0px;
	z-index: 8;
/*   
   top: 50%;
    transform: translateY(-50%);
    right: -100%;
    opacity: 0;
    transition: all 2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
	*/
}

#festive-container.show {
    right: 50%;
    opacity: 1;
}