@charset "utf-8";
.img-responsive-vert {
	height: 100%;
	width: auto;
}

.dia, .noche{
	display: none;
}
#inicio_off > #dia, #inicio_off > #noche {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: transparent;
	background-size: cover;
	-webkit-background-size: cover;
	overflow: hidden;
	z-index: 1;
}

#inicio_off > div > div {
	position: absolute;
}

#inicio_off .avion {
	position: absolute;
    width: 22%;
    top: 60%;
    left: -22%;
    z-index: 10;
	-webkit-animation: avion 30s linear infinite;
	-moz-animation: avion 30s linear infinite;
	animation: avion 30s linear infinite;	
}

@keyframes avion {
    0%   {top: 60%; left: -22%;}
    8%  {top: 20%; left: 14%;}
    16%  {top: 50%; left: 50%;}
    24%  {top: 10%; left: 86%;}
    32% {top: 35%; left: 122%;}
	100% {top: 35%; left: 122%;}
}

@-webkit-keyframes avion {
    0%   {top: 60%; left: -22%;}
    8%  {top: 20%; left: 14%;}
    16%  {top: 50%; left: 50%;}
    24%  {top: 10%; left: 86%;}
    32% {top: 35%; left: 122%;}
	100% {top: 35%; left: 122%;}
}

@-moz-keyframes avion {
    0%   {top: 60%; left: -22%;}
    8%  {top: 20%; left: 14%;}
    16%  {top: 50%; left: 50%;}
    24%  {top: 10%; left: 86%;}
    32% {top: 35%; left: 122%;}
	100% {top: 35%; left: 122%;}
}

#inicio_off .avion > .in_avion {
	position: relative;
	-webkit-animation: sh_avion 0.4s ease-in-out infinite alternate;
	-moz-animation: sh_avion 0.4s ease-in-out infinite alternate;
	animation: sh_avion 0.4s ease-in-out infinite alternate;
}

@keyframes sh_avion {
    from {margin-top: -15%}
    to {margin-top: 15%}
}

@-webkit-keyframes sh_avion {
    from {margin-top: -15%}
    to {margin-top: 15%}
}

@-moz-keyframes sh_avion {
    from {margin-top: -15%}
    to {margin-top: 15%}
}

#inicio_off .avion > .in_avion > .explosion {
	position: absolute;
	width: 28%;
	top: 18%;
	left: -7%;
	-ms-transform: scale(0.0, 0.0);
	-webkit-transform: scale(0.0, 0.0);		
	-moz-transform: scale(0.0, 0.0);		
	-o-transform: scale(0.0, 0.0);
	transform: scale(0.0, 0.0);
	-webkit-animation: exp_avion 0.3s ease-in-out infinite;
	-moz-animation: exp_avion 0.3s ease-in-out infinite;
	animation: exp_avion 0.3s ease-in-out infinite;		
}

@keyframes exp_avion {	
	from {
		-ms-transform: scale(0.0, 0.0);
    	-webkit-transform: scale(0.0, 0.0);		
		-moz-transform: scale(0.0, 0.0);		
		-o-transform: scale(0.0, 0.0);
    	transform: scale(0.0, 0.0);
	}
    to {
		-ms-transform: scale(1, 1);
    	-webkit-transform: scale(1, 1);
		-moz-transform: scale(1, 1);		
		-o-transform: scale(1, 1);
    	transform: scale(1, 1);
	}
}

@-webkit-keyframes exp_avion {	
	from {		
    	-webkit-transform: scale(0.0, 0.0);
		transform: scale(0.0, 0.0);
	}
    to {		
    	-webkit-transform: scale(1, 1);
		transform: scale(1, 1);
	}
}

@-moz-keyframes exp_avion {	
	from {			
		-moz-transform: scale(0.0, 0.0);
		transform: scale(0.0, 0.0);
	}
    to {		
		-moz-transform: scale(1, 1);
		transform: scale(1, 1);
	}
}

#inicio_off .stars1 {
	opacity: 1;
	-webkit-animation: stars 0.5s ease-in-out infinite alternate;
	-moz-animation: stars 0.5s ease-in-out infinite alternate;
	animation: stars 0.5s ease-in-out infinite alternate;	
}

#inicio_off .stars2 {
	opacity: 1;
	-webkit-animation: stars 0.5s ease-in-out 0.5s infinite alternate;
	-moz-animation: stars 0.5s ease-in-out 0.5s infinite alternate;
	animation: stars 0.5s ease-in-out 0.5s infinite alternate;
}


@keyframes star1 {
    0%   {
		opacity: 0;		
	}
	23%  {
		opacity: 0;						
	}
	24%  {
		opacity: 1;						
	}
	25%  {
		opacity: 0;						
	}
	100% {		
		opacity: 0;		
	}
}

@-webkit-keyframes star1 {
    0%   {
		opacity: 0;		
	}
	23%  {
		opacity: 0;						
	}
	24%  {
		opacity: 1;						
	}
	25%  {
		opacity: 0;						
	}
	100% {		
		opacity: 0;		
	}
}

@-moz-keyframes star1 {
    0%   {
		opacity: 0;		
	}
	23%  {
		opacity: 0;						
	}
	24%  {
		opacity: 1;						
	}
	25%  {
		opacity: 0;						
	}
	100% {		
		opacity: 0;		
	}
}

@keyframes stars {
    from {opacity: 1}
    to {opacity: 0.3}
}

@-webkit-keyframes stars {
    from {opacity: 1}
    to {opacity: 0.3}
}

@-moz-keyframes stars {
    from {opacity: 1}
    to {opacity: 0.3}
}

#inicio_off .cohete {
	position: absolute;
    width: 60%;
    top: 66%;
    left: 30%;
	margin-left: -15%;
    z-index: 10;
	opacity: 1;
	-webkit-animation: cohete 40s ease-in-out infinite;
	-moz-animation: cohete 40s ease-in-out infinite;
	animation: cohete 40s ease-in-out infinite;
}

@keyframes cohete {
    0%   {top: 100%; left: 30%; opacity: 1;}	
    8%  {top: 66%; left: 30%;}
    30%  {top: 66%; left: 30%;}
	33% {opacity: 1;}
    34% {top: -28%; left: 30%;}
	36% {opacity: 0;}
	100% {top: -28%; left: 30%; opacity: 0;}
}

@-webkit-keyframes cohete {
    0%   {top: 100%; left: 30%; opacity: 1;}	
    8%  {top: 66%; left: 30%;}
    30%  {top: 66%; left: 30%;}
	33% {opacity: 1;}
    34% {top: -28%; left: 30%;}
	36% {opacity: 0;}
	100% {top: -28%; left: 30%; opacity: 0;}
}

@-moz-keyframes cohete {
    0%   {top: 100%; left: 30%; opacity: 1;}	
    8%  {top: 66%; left: 30%;}
    30%  {top: 66%; left: 30%;}
	33% {opacity: 1;}
    34% {top: -28%; left: 30%;}
	36% {opacity: 0;}
	100% {top: -28%; left: 30%; opacity: 0;}
}

#inicio_off .cohete .turbina {
	position: absolute;
    width: 41%;
    top: 22%;
    left: 40%;
	opacity: 1;	
	overflow: hidden;
	-webkit-animation: turbina 0.3s ease-in-out infinite;
	-moz-animation: turbina 0.3s ease-in-out infinite;
	animation: turbina 0.3s ease-in-out infinite;	
}

#inicio_off .cohete .turbina > img {
	margin-top: -10%;
}

@keyframes turbina {
    from {opacity: 1;}
    to {opacity: 0;}
}

@-webkit-keyframes turbina {
    from {opacity: 1;}
    to {opacity: 0;}
}

@-moz-keyframes turbina {
    from {opacity: 1;}
    to {opacity: 0;}
}

#inicio_off .cohete .torre {
	position: absolute;
    width: 15%;
    top: 6%;
    left: 40%;
	opacity: 1;	
    -ms-transform-origin: 27% 100%;  
    -webkit-transform-origin: 27% 100%;
	-moz-transform-origin: 27% 100%;		
	-o-transform-origin: 27% 100%;
    transform-origin: 27% 100%;
	-ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);		
	-o-transform: rotate(0deg);
    transform: rotate(0deg);
	-webkit-animation: torre 40s ease-in-out infinite;
	-moz-animation: torre 40s ease-in-out infinite;
	animation: torre 40s ease-in-out infinite;	
}

@keyframes torre {
    0%   {
		top: 6%;
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);		
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		opacity: 1;
	}	
    30%  {
		top: 6%;
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);		
		-o-transform: rotate(0deg);
		transform: rotate(0deg);		
	}
	34%  {
		top: 86%;		
	}
	36%  {
		top: 86%;
		-ms-transform: rotate(-90deg);
		-webkit-transform: rotate(-90deg);
		-moz-transform: rotate(-90deg);		
		-o-transform: rotate(-90deg);
		transform: rotate(-90deg);
		opacity: 1;
	}
	37%  {
		top: 86%;		
		opacity: 0;
	}
	100% {
		top: 6%;
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);		
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		opacity: 0;
	}
}

@-webkit-keyframes torre {
    0%   {
		top: 6%;		
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		opacity: 1;
	}	
    30%  {
		top: 6%;		
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	34%  {
		top: 86%;		
	}
	36%  {
		top: 86%;		
		-webkit-transform: rotate(-90deg);
		transform: rotate(-90deg);
		opacity: 1;
	}
	37%  {
		top: 86%;		
		opacity: 0;
	}
	100% {
		top: 6%;		
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		opacity: 0;
	}
}

@-moz-keyframes torre {
    0%   {
		top: 6%;
		-moz-transform: rotate(0deg);
		transform: rotate(0deg);
		opacity: 1;
	}	
    30%  {
		top: 6%;		
		-moz-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	34%  {
		top: 86%;		
	}
	36%  {
		top: 86%;
		-moz-transform: rotate(-90deg);
		transform: rotate(-90deg);
		opacity: 1;
	}
	37%  {
		top: 86%;		
		opacity: 0;
	}
	100% {
		top: 6%;
		-moz-transform: rotate(0deg);
		transform: rotate(0deg);
		opacity: 0;
	}
}

#inicio_off .cohete .torre .asensor, #inicio_off .cohete .torre .pasajero, #inicio_off .cohete .torre .asensor2 {
	position: absolute;
    width: 100%;
    top: 100%;
    left: 0px;
	opacity: 0;
}

#inicio_off .cohete .torre .asensor, #inicio_off .cohete .torre .asensor2 {
	-webkit-animation: asensor 40s ease-in-out infinite;
	-moz-animation: asensor 40s ease-in-out infinite;
	animation: asensor 40s ease-in-out infinite;	
}

@keyframes asensor {
    0%   {top: 100%; opacity: 0;}	
    8%  {top: 100%; opacity: 0;}
	9%  {opacity: 1;}
	16%  {top: 0%;}
	22%  {top: 0%;}
    30%  {top: 100%; opacity: 1;}
	31%  {opacity: 0;}
	100% {top: 100%; opacity: 0;}
}

@-webkit-keyframes asensor {
    0%   {top: 100%; opacity: 0;}	
    8%  {top: 100%; opacity: 0;}
	9%  {opacity: 1;}
	16%  {top: 0%;}
	22%  {top: 0%;}
    30%  {top: 100%; opacity: 1;}
	31%  {opacity: 0;}
	100% {top: 100%; opacity: 0;}
}

@-moz-keyframes asensor {
    0%   {top: 100%; opacity: 0;}	
    8%  {top: 100%; opacity: 0;}
	9%  {opacity: 1;}
	16%  {top: 0%;}
	22%  {top: 0%;}
    30%  {top: 100%; opacity: 1;}
	31%  {opacity: 0;}
	100% {top: 100%; opacity: 0;}
}

#inicio_off .cohete .torre .pasajero {
	-webkit-animation: pasajero 40s ease-in-out infinite;
	-moz-animation: pasajero 40s ease-in-out infinite;
	animation: pasajero 40s ease-in-out infinite;	
}

@keyframes pasajero {
    0%   {top: 100%; opacity: 0; left: 0px;}	
    8%  {top: 100%; opacity: 0; left: 0px;}
	9%  {opacity: 1;}
	16%  {top: 0%; left: 0px;}
	22%  {top: 0%; left: 100%;}
    30%  {top: 100%; opacity: 1; left: 100%;}
	31%  {opacity: 0; left: 0px;}
	100% {top: 100%; opacity: 0; left: 0px;}
}

@-webkit-keyframes pasajero {
    0%   {top: 100%; opacity: 0; left: 0px;}	
    8%  {top: 100%; opacity: 0; left: 0px;}
	9%  {opacity: 1;}
	16%  {top: 0%; left: 0px;}
	22%  {top: 0%; left: 100%;}
    30%  {top: 100%; opacity: 1; left: 100%;}
	31%  {opacity: 0; left: 0px;}
	100% {top: 100%; opacity: 0; left: 0px;}
}

@-moz-keyframes pasajero {
    0%   {top: 100%; opacity: 0; left: 0px;}	
    8%  {top: 100%; opacity: 0; left: 0px;}
	9%  {opacity: 1;}
	16%  {top: 0%; left: 0px;}
	22%  {top: 0%; left: 100%;}
    30%  {top: 100%; opacity: 1; left: 100%;}
	31%  {opacity: 0; left: 0px;}
	100% {top: 100%; opacity: 0; left: 0px;}
}

#inicio_off > .glass {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background-image: url(../images/bk_glass.png);
	background-position: center center;
	background-size: cover;
	z-index: 10;
}