@charset "utf-8";
/* CSS Document */

 

body{
	background: #ddd url(../images/bg3.jpg) repeat top;
	padding:0;
	margin:0 auto;
	font-family: 'Open Sans Condensed','Arial Narrow', serif;

}

.container > header {

	margin:0 auto;
	text-align: center;
	height:200px;
	
}
section {
	
	margin:auto;
	max-width:1024px;
		
}
	.cuadrados {
	
	width:552px;
	margin:-140px 0px 0px 470px;
	height:315px;
}

/*efecto logo*/
	#logo{

	width:411px;
	height:92px;
	margin-top:46px;
	background-image: url(../images/logopresentacion.svg);
	-webkit-animation: scaleUp 350ms 0.5s ease-in-out both;
	animation: scaleUp 350ms 0.5s ease-in-out both;
	
	}
	@-webkit-keyframes scaleUp {
	0% { -webkit-transform: translateX(0) scale(0); }
	100% { -webkit-transform: translateX(0) scale(1); }
	}

	@keyframes scaleUp {
	0% { -webkit-transform: translateX(0) scale(0); transform: translateX(0) scale(0); }
	100% { -webkit-transform: translateX(0) scale(1); transform: translateX(0) scale(1); }
	}
/*efecto logo- fin*/
	#sobra{
	
	width:441px;
	height:84px;
	margin-left:453px;
	background-image:url(../images/sobra.svg);
	}
	
	#objeto_{
	
	width:153px;
	height:162px;
	background-image:url(../images/objeto2.svg);
	margin-left:859px;
	margin-top:-21px;
	
	}
	
	#holaa{
	position:absolute;
	width: 100px;
	height: 100px;
	margin-left:140px;
	margin-top:-150px;
	-webkit-animation: scaleUp 350ms 0.8s ease-in-out both;
	animation: scaleUp 350ms 0.8s ease-in-out both;
	
	}
	@-webkit-keyframes scaleUp {
	0% { -webkit-transform: translateX(0) scale(0); }
	100% { -webkit-transform: translateX(0) scale(1); }
	}

	@keyframes scaleUp {
	0% { -webkit-transform: translateX(0) scale(0); transform: translateX(0) scale(0); }
	100% { -webkit-transform: translateX(0) scale(1); transform: translateX(0) scale(1); }
	}
	
	
	
	
/*efecto*/
#cuadro-movimiento{
	margin:0 auto;
	width: 552px;
	height: 315px;
	position:absolute;

	}

#cuadromov{
	
	width: 303px;
	height: 120px;
	left:94px;
	background-image: url(../images/1cuadro.png);
	position: absolute;
	animation: animarcuadromov 1.8s normal;
	-moz-animation: animarcuadromov 1.8s normal;
	-o-animation: animarcuadromov 1.8s normal;
	-webkit-animation: animarcuadromov 1.8s normal; 
	}
	
#cuadromovdos{
	
	width: 340px;
	height: 120px;
	left:212px;
	top:111px;
	background-image: url(../images/2cuadro.png);
	position: absolute;
	animation: animarcuadromovdos 1.5s normal;
	-moz-animation: animarcuadromovdos 1.5s normal;
	-o-animation: animarcuadromovdos 1.5s normal;
	-webkit-animation: animarcuadromovdos 1.5s normal; 
	}

#cuadromovseis{
	width:395px;
	height:121px;
	left:0;
	top:192px;
	background-image:url(../images/3cuadro.png);
	position:absolute;
	animation: animarcuadromovseis 1s normal;
	-moz-animation: animarcuadromovseis 1s normal;
	-o-animation: animarcuadromovseis 1s normal;
	-webkit-animation: animarcuadromovseis 1s normal;	
	
	
	}

/*---Animaciones cuadro 1---*/
@keyframes animarcuadromov{
	from{left:0px; top:-600px;}
	
	to{left:94px; top:0px;}
	
	}
@-moz-keyframes animarcuadromov{
	from{left:0px; top:-600px;}
	
	to{left:94px; top:0px;}
	
	}
@-o-keyframes animarcuadromov{
	from{left:0px; top:-600px;}
	to{left:94px; top:0px;}
	
	}
@-webkit-keyframes animarcuadromov{
	from{left:0px; top:-600px;}
	to{left:94px; top:0px;}
	
	}
	

/*---Animaciones cuadro 2--*/
@keyframes animarcuadromovdos{
	from{left:600px; top:111px;}
	
	to{left:212px; top:111px;}
	
	}
@-moz-keyframes animarcuadromovdos{
	from{left:600px; top:111px;}
	
	to{left:212px; top:111px;}
	
	}
@-o-keyframes animarcuadromovdos{
	from{left:600px; top:111px;}
	
	to{left:212px; top:111px;}
	
	}
@-webkit-keyframes animarcuadromovdos{
	from{left:600px; top:111px;}
	
	to{left:212px; top:111px;}
	
	}
	
/* Animacion cuadro 3*/
@keyframes animarcuadromovseis{
	from{left:-600px; top:192px;}
	to{left:0px; top:192px;}
	}
	
@-moz-keyframes animarcuadromovseis{
	from{left:-600px; top:192px;}
	to{left:0px; top:192px;}
	}
	
@-o-keyframes animarcuadromovseis{
	from{left:-600px; top:192px;}
	to{left:0px; top:192px;}
	}
	
@-webkit-keyframes animarcuadromovseis{
	from{left:-600px; top:192px;}
	to{left:0px; top:192px;}
	}