body { 
	margin:0;
	padding: 0px;	
	color: #333333;
	background-color: #000000;
	font-family: 'Open Sans', sans-serif;
	overflow-x: hidden;
	overflow-y: hidden;
	overflow: hidden;

}

@keyframes preload {
  0% { background-position:0 }
  100% { background-position:-752px }
}
#popup_area{
	position:fixed;
	display: none;
	top: 0px; 
	left: 0px; 
	width:100%;
	height: 100%;	
	background-color: rgba(0, 0, 0, .8);
	padding:0px;
	margin:auto;
	text-align:center;
}
#popup{	
	position: relative;
	overflow: hidden;
	width:1000px;
	height:480px;
	padding:0px;
	margin:auto;
	margin-top: 100px;
	background-image: url("../images/fondo_popup.png");
	background-repeat: no-repeat;

	text-align:	center;	
}
#popup p{	
	position: relative;
	width:1000px;	
	margin:auto;
	width:700px;
	
	margin-top: 20px;
	margin-bottom: 20px;
	
	font-family:Arial, Helvetica, sans-serif;	
	font-size:24px;
	color: #FFFFFF;
	
}
#popup img{	
	padding-top: 30px;
	padding-left: 10px;
	
}
.popup-contenido{
	margin-top: 30px;	
}

#preload{
	position:absolute;
	width:100%;
	height:100%;	
	background-color: rgba(0, 0, 0, .25);
}
#preload_anim{	
	position: absolute;
  	top: 50%; 
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	width:94px;
	height:94px;		
	background: url('../images/new_preload.png') repeat-x;
	animation: preload 1s steps(8) infinite;	
}
@keyframes ver_episodios {
  0% { background-position:0 }
  100% { background-position:-1848 }
}
#flecha1 {
	visibility:hidden
}
#flecha2 {
	visibility:hidden
}
#flecha3 {
	visibility:hidden
}
#flecha4 {
	visibility:hidden
}
#flecha5 {
	visibility:hidden
}
#flecha6 {
	visibility:hidden
}
#tx_pre_episodio{
	padding-left: 6px ;
}
#tx_titulo{
	padding-top: 10px ;
}
#tx_bajada{
	padding-top: 6px ;
	padding-bottom: 19px ;
}
.sel_fondo_home{
	position:relative;
	margin:0px;
	padding: 0px;	

	background-image: url("../images/sel_background.jpg");
	background-repeat: no-repeat;
	background-position: center top;
	background-color: #000000;
	background-size: 1900px auto;

	width: 100%;
	height: auto;

}
.sel-logo{
		position:relative;
	margin:auto;
	padding:0px;
	padding-top:100px;
	width:100%;
	text-align:center;
}
.sel-texto{
		position:relative;
	margin:auto;
	padding:0px;
	width:100%;
	text-align:center;
	color:#666666;
}
.sel-navegacion{
	position:relative;
	margin:auto;
	padding:0px;
	
	width:100%;
	text-align:center;
}
.sel-navegacion img{
	text-align:center;
}

.fondo_home{
	position:relative;
	margin:0px;
	padding: 0px;	

	background-image: url("../images/new_background.jpg");
	background-repeat: no-repeat;
	background-position: center top;
	background-color: #000000;
	background-size: 1900px auto;

	width: 100%;
	height: auto;

}
.anim{
	position: relative;	
	width: 100%;
	height: 382px;
	margin: auto;
	padding: 0px;

}
.personaje-arriba{
	position: absolute;	
	width: 100%;
	height: 382px;
	margin: auto;
	padding: 0px;

	background-image: url("../images/p_optimus_1.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 1425px 382px;
	margin-top: -55px;
}
.personaje-medio{
	position: absolute;	
	width: 100%;
	height: 510px;
	margin: auto;
	padding: 0px;
	
	background-image: url("../images/p_optimus_2.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 1425px 382px;
	margin-top: -60px;
}
.personaje-abajo{
	position: absolute;	
	width: 100%;
	height: 382px;
	margin: auto;
	padding: 0px;
	
	background-image: url("../images/p_optimus_3.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 1425px 382px;
	margin-top: -60px;
}
.personaje-arriba img{
	height: 382px;
}
.personaje-abajo img{
	height: 382px;
}

.logo{
	position: relative;	
	width: 100%;
	height: auto;
	margin: auto;
	padding: 0px;
	text-align:center;	
}
.logo img{
	width: 760px;
	margin-top: -150px;
}



.video-contenido{	
	position: relative;	
	margin: auto;
	width: 100%;
	height:auto;
	padding: 0px;
	text-align:center;	
	margin-top:0px;

}
.video-contenido video{	
	position: relative;	
	margin: auto;
	width: 70%;
	height:auto;
	padding: 0px;
	text-align:center;	
	margin-top:0px;

}
.video-contenido img{	


}

.separador{
	position: relative;	
	width: 100%;
	height: auto;
	margin: auto;
	padding: 0px;
	text-align:center;
	padding-top: 50px;
	padding-bottom: 50px;
}
.juguetes{
	position:relative; 
	width:100%;		
	padding: 0px;
	margin:auto;
	text-align:center;

}
.juguetes-centrar{
	position:relative; 
	width:80%;		
	margin:auto;
	padding: 0px;
	text-align:center;
	background-color:#F0F;
}

.juguete-personaje{
	position:relative; 
	width:50%;
	margin:auto;
	padding: 0px;
	float: left;
	text-align:right;
}
.juguete-personaje img{
	position:relative; 
	//width:100%;
	text-align:right;
}
.juguete-info{
	position:relative; 
	width:25%;
	margin:auto;
	padding: 0px;
	padding-left: 30px;
	padding-top: 20px;
	float: left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:19px;
	color: #d5cdcd;
	text-align:left;	
}
.flecha-1{
	position:relative; 
	width:50px;
	margin:auto;
	padding: 0px;
	padding-top:200px;
	padding-left:20px;
	padding-right:20px;
	float: left;
}
.flecha-2{
	display:inline-block;
	position:relative; 
	width:50px;
	margin:auto;
	padding: 0px;
	padding-top:200px;
	padding-left:20px;
	padding-right:20px;
	float: left;
}
.flecha-2-mobile{
	display:none;
	position:relative; 
	width:50px;
	margin:auto;
	padding: 0px;
	padding-top:200px;
	padding-left:20px;
	padding-right:20px;
	float: left;
}

.footer{
	position:relative;
	clear:both;
	width: 50%;
	margin:auto;

	padding-top: 50px;
	padding-bottom: 25px;
}
.ft-imagen{
	position:relative;
	float: left;
	width: 80px;
}
.ft-texto{
	position:relative;
	width: 85%;

	float: left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color: #7c7c7c;
	text-align:left;
	
	padding-bottom: 50px;	
}

	
	
@media all and (max-width: 990px){
	

#popup_area{
}
#popup{	

	// overflow: hidden;
	width:90%;
	height:90%;
	margin-top: 20px;
	background-color: #000000;
	background-image: none;

}
#popup p{	
	width:80%;	
	font-size:18px;	
}
#popup img{		
}
.popup-contenido{	
}	
	
.fondo_home{
	background-size: 100% auto;
}
.anim{
	position: relative;	
	width: 100%;
	height: 255px;
	margin: auto;
	padding: 0px;
}
.personaje-arriba{
	height: 255px;
	background-size: 950px 255px;
	margin-top: -35px;
}
.personaje-medio{

	height: 255px;

	background-size: 950px 255px;
	margin-top: -40px;
}
.personaje-abajo{

	height: 255px;

	background-size: 950px 255px;
	margin-top: -40px;
}
.personaje-arriba img{
	height: 255px;
}
.personaje-abajo img{
	height: 255px;
}
	
.logo img{
	margin-top: -90px;
	width: 90%;
}
.video-contenido{	

	margin-top:0px;
}
.video-contenido img{	
width: 90%;

}
.separador{
	position: relative;	
	width: 100%;
	height: auto;
	margin: auto;
	padding: 0px;
	text-align:center;
	padding-top: 50px;
	padding-bottom: 50px;
}
.separador img{
	width: 100%;
}


.juguetes{
	position:relative; 
	width:100%;		
	padding: 0px;
	margin:auto;
	text-align:center;

}
.juguetes-centrar{
	position:relative; 
	width:90%;		
	margin:auto;
	padding: 0px;
	text-align:center;
	background-color:#F0F;
}

.juguete-personaje{
	width:70%;
	text-align:center;
}
.juguete-personaje img{
	width:100%;
}
.juguete-info{
	position:relative;
	margin:auto; 
	width:70%;
	padding: 0px;
	clear:both;
	
	padding-top: 5%;
	padding-left: 15%;
	padding-right: 15%;
	
	text-align:center;
	
}

		

.juguete-info img{
	text-align:center;	
}
.flecha-1{
	width:14%;
	padding-top:100px;
	padding-left:0px;
	padding-right:1%;
}
.flecha-1 img{
	width:100%;
}
.flecha-2{
	display:none;
}
.flecha-2-mobile{
	width:14%;
	display:inline-block;
	padding-top:100px;
	padding-left:1%;
	padding-right:0px;
}
.flecha-2-mobile img{
	width:100%;
}
.footer{

	clear:both;
	width: 80%;
	margin:auto;

}
.ft-imagen{
	clear:both;
	width: 100%;
		margin:auto;
	text-align:center;	
}
.ft-texto{
	width: 100%;
	clear:both;
		margin:auto;

	font-size:10px;

	text-align:center;	
	padding-top: 20px;
}
.sel-logo img{
	width:80%;

}

}