body, html {
    height:100vh;
    overflow: hidden;
	margin:0;padding:0;
}
div {
	margin:0;padding:0;
}
* {
    -webkit-tap-highlight-color: transparent;
}
/* total width: 78 with margins: 95,6 */
.painel_window {
	border:0px solid blue;
    float:left;
    height:auto;
    width:17.5vw;
	height:22.6vh;
	margin-right:0.5vw;
	
	cursor:pointer;
}

.painel_window_a {
	border:0px solid blue;
    float:left;
    height:auto;
    width:13vw;
	height:22.6vh;
	margin-right:1.1vw;
	
	cursor:pointer;
}
.painel_window_b {
	border:0px solid blue;
    float:left;
    height:auto;
    width:13vw;
	height:22.6vh;
	margin-right:10.1vw;
	
	cursor:pointer;
}
.painel_window img,.painel_window_a img,.painel_window_b img {
	position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%) ;	
	max-width:100%;
	max-height:100%;
    object-fit:contain;

}
.floating1 { 
	animation-name: floating1; 
	animation-duration: 9s; 
	animation-iteration-count: infinite; 
	animation-timing-function: ease-in-out; 
} 

@keyframes floating1 { 
	0% { transform: translate(0, 0px); } 
	50% { transform: translate(0, 15px); } 
	100% { transform: translate(0, -0px); }	 
} 


.floating2 { 
	animation-name: floating2; 
	animation-duration: 9s; 
	animation-iteration-count: infinite; 
	animation-timing-function: ease-in-out; 
} 

@keyframes floating2 { 
	10% { transform: translate(0, 0px); } 
	60% { transform: translate(0, 15px); } 
	100% { transform: translate(0, -0px); }	 
} 

.floating3 { 
	animation-name: floating3; 
	animation-duration: 9s; 
	animation-iteration-count: infinite; 
	animation-timing-function: ease-in-out; 
} 

@keyframes floating3 { 
	0% { transform: translate(0, 0px); } 
	40% { transform: translate(0, 15px); } 
	90% { transform: translate(0, -0px); }	 
} 

.gray {
	filter: gray; /* IE6-9 */
	-webkit-filter: grayscale(0); /* Google Chrome, Safari 6+ & Opera 15+ */
	filter: grayscale(0); /* Microsoft Edge and Firefox 35+ */
	opacity: 0.2;
  }

  .lang_txt {
	  font-family: Arial, Helvetica, sans-serif;
	  font-size:xx-large;
	  font-weight: bold;
	  margin-right:0.5em;
	  cursor:pointer;
  }
.bg {
    background-image: url("../images/movie_frame1d.png");
  
  
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.centered {
	position: fixed;
	top: 50%;
	left: 50%;
	/* bring your own prefixes */
	transform: translate(-50%, -50%);
  }