/* PARALLAX SCROLLING EXPERIMENT
   Master Styles
   Author: Jonathan Nicol (f6design.com)
*****************************************************************/


/* Global reset
   http://meyerweb.com/eric/tools/css/reset/ 
*****************************************************************/

/*-------------Import fonts ---------------------------------------*/
@font-face {
    font-family:'FuturaPT-Book';
    src: url('../fonts/FuturaPT-Book_gdi.eot');
    src: url('../fonts/FuturaPT-Book_gdi.eot?#iefix') format('embedded-opentype'),
        url('../fonts/FuturaPT-Book_gdi.woff2') format('woff2'),
        url('../fonts/FuturaPT-Book_gdi.woff') format('woff'),
        url('../fonts/FuturaPT-Book_gdi.ttf') format('truetype'),
        url('../fonts/FuturaPT-Book_gdi.svg#FuturaPT-Book') format('svg');
}
@font-face {
    font-family:'futurastd-bold';
    src: url('../fonts/futurastd-bold.eot');
    src: url('../fonts/futurastd-bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/futurastd-bold.woff2') format('woff2'),
        url('../fonts/futurastd-bold.woff') format('woff'),
        url('../fonts/futurastd-bold.ttf') format('truetype'),
        url('../fonts/futurastd-bold.svg#FuturaPT-Book') format('svg');
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}

/* Header 100% video */

section {
  width: 100%;
  padding: 0 7%;
  display: table;
  margin: 0;
  max-width: none;  
	background: url(../img/isla.jpg) no-repeat center center; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
  height: 100vh;
  
}

#footer{
 font-family:'FuturaPT-Book';

 font-size:12px;
 width:100%; 
 height:30px; 
 background:#fff;
 top:2px;
}

#footer a{
	float:left;
	width:100%;
	text-decoration:none;
	margin:7px auto;
	text-align:center;
	 color:#444;
	 line-height:16px;
}

.intro2{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: url(../img/etnography-bg1.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
  height: 100vh;
  
}

.intro-about1{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: url(../img/about-bg3.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
  height: 50vh;
  
}

.intro-about2{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: url(../img/about-bg2.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
  height: 100vh;
  
}

.intro-contacto{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: url(../img/about-bg1.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
  height: 100vh;
  min-height: 500px;
  
}


.intro-about3{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: url(../img/about-bg3.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
  height: 100vh;
  
}


.intro-film1{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: url(../img/thefilm-bg1.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
  height: 100vh;
  
}

.intro-film2{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: url(../img/thefilm-bg2.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
  height: 100vh;
  
}

.intro4{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: url(../img/etnography-bg2.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
  height: 100vh;
  
}

.intro3{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  background: #009fe3;
  height: 100vh;
  
}

.contenedor-imagenes{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  
}

.oscuro{
	
  background: #D6D6D6;
  
}

.claro{
	
  background: #EAEAEA;
  
}

.azul{
  background:#00adef;
}


#vimeo{
	width:80%;  
	height:55%;  
	position:absolute; 
	left:0; 
	right:0; 
	margin-left:auto; 
	margin-right:auto; 
	z-index:99; 
	top:20%;
	
	}
	
#logo-home img{
	width:22%;
	position:absolute; 
	left:0; 
	right:0; 
	margin-left:auto; 
	margin-right:auto; 
	z-index:99; 
	top:0;
	
	}
	
#video-ingles a{
	font-family:'FuturaPT-Book';
	font-size:40px;
	color:#fff;
	text-align:center;
	width:33%; 
	position:absolute; 
	left:0; 
	z-index:99; 
	top:20%;
	line-height:33px;
	
	}
	
#video-ingles a:hover{
	-webkit-animation: flickerAnimation3 2s infinite;
	-moz-animation: flickerAnimation3 2s infinite;
	-o-animation: flickerAnimation3 2s infinite;
	 animation: flickerAnimation3 2s infinite;
	}
	
.texto-pequeno{
	font-size:28px;
	}
	
#video-espanol a{
	font-family:'FuturaPT-Book';
	font-size:40px;
	color:#fff;
	text-align:center;
	width:33%; 
	position:absolute; 
	right:0; 
	z-index:99; 
	top:20%;
	line-height:33px;
	
	}
	
#video-espanol a:hover{
	-webkit-animation: flickerAnimation3 2s infinite;
	-moz-animation: flickerAnimation3 2s infinite;
	-o-animation: flickerAnimation3 2s infinite;
	 animation: flickerAnimation3 2s infinite;
	}
	
#flecha{
	width:40px; 
	position:absolute; 
	left:0; 
	right:0; 
	margin-left:auto; 
	margin-right:auto;
	z-index:99;
	bottom:3%;
	-webkit-animation: flickerAnimation 2s infinite;
	-moz-animation: flickerAnimation 2s infinite;
	-o-animation: flickerAnimation 2s infinite;
	 animation: flickerAnimation 2s infinite;
	
	}



.cont-contenido{
	
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;  
  height: 90vh;
  
}

.contenido{
	width:100%;
	font-family:'FuturaPT-Book';
	display: table-cell;
  vertical-align: middle;
  text-align:center;
	}
	
.contenido-vertical{
	font-family: 'Karla', sans-serif;
	display: table-cell;
  vertical-align: middle;
	}
	
.texto-etno{
text-transform: uppercase;
    font-size: 2.4em;
    display: block;
    color: #fff;
    font-weight: 300;
    text-shadow: 2px 2px 2px #000;
    margin: 30px 0 25px 0;
	}

.titulo-idioma1{
	text-transform:uppercase;
  font-size:18px;
  display: block;
  color: #fff;
  font-weight: 300;
  margin:50px 0 0 0;
	}
	
.texto-historia1{
font-size: 14px;
display: block;
color: #666;
font-weight: 300;
width:80%;
left:0; 
right:0; 

margin:0 auto 0 auto;
text-align: justify;
}

.titulo-idioma2{
	text-transform:uppercase;
  font-size:18px;
  display: block;
  color: #fff;
  font-weight: 300;
  margin:50px 0 0 0;
	}
	
.titulo-idioma-film1{
	position:absolute;
	font-family:'FuturaPT-Book';
	color:#fff;
	font-size: 14px;
	text-align:left;
	margin:40px 0 10px 6%;
	text-transform:uppercase;
  font-size:18px;
  display: block;
  color: #fff;
  font-weight: 300;
	}
	
.titulo-idioma-film2{
	position:absolute;
	font-family:'FuturaPT-Book';
	color:#fff;
	font-size: 14px;
	text-align:left;
	margin:40px 0 10px 52%;
	text-transform:uppercase;
  font-size:18px;
  display: block;
  color: #fff;
  font-weight: 300;
	}
	
.titulo-idioma-concept1{
	position:absolute;
	font-family:'FuturaPT-Book';
	color:#666;
	font-size: 14px;
	text-align:left;
	margin:40px 0 10px 6%;
	text-transform:uppercase;
  font-size:18px;
  display: block;
  color: #fff;
  font-weight: 300;
	}
	
.titulo-idioma-concept2{
	position:absolute;
	font-family:'FuturaPT-Book';
	color:#666;
	font-size: 14px;
	text-align:left;
	margin:40px 0 10px 52%;
	text-transform:uppercase;
  font-size:18px;
  display: block;
  color: #fff;
  font-weight: 300;
	}
	
	.texto-etno-co{
	float:left;
	display:block;
  width:40%;
  font-size: 1em;
  display: block;
  color: #666;
  font-weight: 300;
  text-align:justify;
  margin-left:6%;
      margin-top: 75px;
	}
	
.titulo-idioma2 a{
	text-decoration:none;
	text-transform:uppercase;
  font-size:22px;
  display: block;
  color: #fff;
  font-weight: 300;
  margin:50px 0 0 0;
	}
	
.texto-historia2{
font-size: 14px;
display: block;
color: #666;
font-weight: 300;
width:80%;
left:0; 
right:0; 

margin:0 auto 50px auto;
text-align: justify;
}

#menu{
	width:100%;
	height:80px;
	background:#fff;	
}

#botonera-movil a{
	    font-family: 'FuturaPT-Book';
    /* font-weight: bold; */
    font-size: 12px;
    margin: 1px 0 0 0;
    /* padding: 1em; */
    float: left;
    text-align: center;
    border-bottom: 0;
    border-right: 1px solid #EAEAEA;
    width: 100%;
    height: 20px;
    background: #fff;
    padding: 5px 0;
	color:#333;
}


#logo-menu{
	float:left;
	display:block;
	width:100%;
	height:49px;	
}

#logo-text a{
	font-family:'FuturaPT-Book';
	font-size:18px;
	color:#000;
	float:left;
	display:block;
	margin: 11px 0 0 13px;
	text-transform:uppercase;
}
	
.texto-etno2{
	
  font-size: 2em;
  display: block;
  color: #fff;
  font-weight: 300;
  text-shadow: 2px 2px 0px #000;
	}
	
.texto-quienes {
    font-size: 1.5em;
    width: 70%;
    display: table;
    color: #fff;
    font-weight: 300;
    text-shadow: 2px 2px 0px #000;
    position: relative;
    left: 0;
    right: 0;
    margin-bottom: 49px;
    margin-left: auto;
    margin-right: auto;
}
	
.texto-espe{
	
 font-size: 1.4em;
    display: table;
    color: #fff;
    font-weight: 300;
    text-align: left;
    position: relative;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
	}

.texto-etno-ti{
	 margin-left:6%;
	text-transform:uppercase;
  font-size: 3em;
  display: block;
  color: #fff;
  font-weight: 300;
	}
	
.texto-etno-bi{
	float:left;
	display:block;
  width:40%;
  font-size: 1em;
  display: block;
  color: #fff;
  font-weight: 300;
  text-align:justify;
  margin-left:6%;
      margin-top: 75px;
	}
	
#boton-galeria a{
	float:left;
	display:block;
  width:240px;
  height:240px;
  background:url(../img/boton-galeria.png);
  -moz-transition:all 0.3s ease-in-out;    
	-o-transition:all 0.3s ease-in-out;   
	-webkit-transition:all 0.3s ease-in-out;   
	transition:all 0.3s ease-in-out;
}

#boton-galeria a:hover{
  background:url(../img/boton-galeria.png) bottom;
}

#btn-video{
	
	left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
	display:block;
  width:720px;
  height:240px;

}

#boton-galeria2 a{
	float:left;
	display:block;
  width:240px;
  height:240px;
  background:url(../img/boton-video1.png);
  -moz-transition:all 0.3s ease-in-out;    
	-o-transition:all 0.3s ease-in-out;   
	-webkit-transition:all 0.3s ease-in-out;   
	transition:all 0.3s ease-in-out;
}

#boton-galeria2 a:hover{
  background:url(../img/boton-video1.png) bottom;
}

#boton-galeria3 a{
	float:left;
	display:block;
  width:240px;
  height:240px;
  background:url(../img/boton-video2.png);
  -moz-transition:all 0.3s ease-in-out;    
	-o-transition:all 0.3s ease-in-out;   
	-webkit-transition:all 0.3s ease-in-out;   
	transition:all 0.3s ease-in-out;
}

#boton-galeria3 a:hover{
  background:url(../img/boton-video2.png) bottom;
}
	
.texto-etno3{
  font-size: 1em;
  display: block;
  color: #666;
  font-weight: 300;
  width:80%;
  left:0; 
	right:0; 

	margin:2% auto 5% auto;
	text-align:center;
	}
	

.texto-espe span{
	float:left;
	display:block;
	margin:30px 0 0 0;
	}
	
	
.contenido img{
	float:left;
  display: block;
  margin-right:20px;
  width:46px;
	}
	
.contenido-vertical img{
  display: block;
  color: #666;
  font-weight: 300;
  width:60%;
  max-width:1600px;
  left:0; 
	right:0; 
	margin-left:auto; 
	margin-right:auto;
	margin-top:5%;
	-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.27);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.27);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.27);
	}

#linea-menu{
  width: 100%;
  height:5px;
  background:#00adef;
  margin-top:49px;
  
}

#linea-menu2{
	float:left;
	display:block;
  width: 100%;
  height:2px;
  background:#00adef;
  
}



.content_header {
  display: table-cell;
  vertical-align: middle;
}

h1 {
  font-size: 3em;
  display: block;
  color: white;
  font-weight: 300;
}

p {
  font-size: 1.5em;
  font-weight: 500;
  color: #C3CAD9;
}

/* Header 100% video */


ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Extended base styles (site specific)
*****************************************************************/

html { 
	overflow-y: scroll; /* always force a scrollbar in non-IE */
	}
body {
	/*background: url(../img/ilustracionFINALrapanui.jpg) no-repeat center center ; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;*/
	

	line-height: 1.5;
	color: #000;
	font-size: 14px;
	font-family: Arial,sans-serif;
}
h1 {
	color: #21a97e;
}
a, a:link,
a:active,
a:visited {
	-webkit-transition: color 0.25s ease-out;
	-moz-transition: color 0.25s ease-out;
	-o-transition: color 0.25s ease-out;
	transition: color 0.25s ease-out;

	outline: none;
	text-decoration:none;
	}
	a:hover { 
		color:#000;
		}
img { 
	display:block;
	}
p {
	margin:1em 0;
	}

/* Common shared styles
*****************************************************************/

hr {
	margin: 0;
	border: none;
	border-top: 1px solid #3b3b3b;
	border-bottom: 1px solid #3b3b3b;
	height: 3px;
}

/* Page structure
*****************************************************************/

#wrapper {
	position: relative;
}
#branding {
	width: 100%;
	background: #fff;
	}
	#branding h1 {
		width: 940px;
		padding: 10px 15px;
		margin: 0 auto;
		text-transform: uppercase;
		font-size: 18px;
		font-weight: bold;
		}

/* Nav
*****************************************************************/

nav#primary {
	z-index: 5;
	position: fixed;
	top: 50%;
	right: 16px;
	margin-top: -40px;
}
nav#primary li {
	position: relative;
	height: 20px;
}
nav#primary a {
	display: block;
	width: 20px;
	height: 20px;
	text-indent: -9999px;
	background: transparent url('../img/nav-dot.png') 4px 4px no-repeat;
}
nav#primary a:hover, nav#primary a.active {
	background: transparent url('../img/nav-dot.png') 4px -16px no-repeat;
}
nav#primary h1 {
	position: absolute;
	right: 22px;
	top: -7px;
	display: none;
	padding: 4px 20px 4px 7px;;
	color: #fff;
	white-space: nowrap;
	background: transparent url('../img/nav-arrow.png') 100% 50% no-repeat;
	}
nav.next-prev {
	margin: 20px 0 0 0;
	}
	a.prev,
	a.next {
		display: block;
		width: 15px;
		height: 11px;
		text-indent: -9999px;
		}
	/*a.prev {
		margin: 0 auto 5px auto;
		background: transparent url('../img/scroll-arrow-up.png') 0 0 no-repeat;
		}
		a.prev:hover {
			background: transparent url('../img/scroll-arrow-up.png') 0 -11px no-repeat;
			}
	a.next {
		margin: 5px auto 0 auto;
		background: transparent url('../img/scroll-arrow-down.png') -1px 0 no-repeat;
		}
		a.next:hover {
			background: transparent url('../img/scroll-arrow-down.png') -1px -11px no-repeat;
			}*/

/* Parallax
*****************************************************************/

/* content */
#content {
	z-index: 4;
	position: fixed;
	max-width: 940px;
	padding: 0 10px;
	margin: 0 auto;
	line-height: 1.7;

	}
	#content article {
		width: 300px;
		}
		#manned-flight ,
		#frameless-parachute,
		#english-channel,
		#about {
			padding-top: 105px;
			}
		#manned-flight {
			position: absolute;
			top: 0px;
			}
		#frameless-parachute {
			position: absolute;
			top: 1090px;
			}
		#english-channel {
			position: absolute;
			top: 2180px;
			}
			#content h1 {
				margin: 0 0 25px 0;
				font-size: 60px;
				font-family: Georgia, serif;
				font-weight: normal;
				line-height: 65px;
				}
		#about {
			position: absolute;
			top: 3270px;
			}
/* foreground (ballons/landscape) */
#parallax-bg3 {
	z-index: 3;
	position: fixed;
	left: 50%; /* align left edge with center of viewport */
	top: 0;
	width: 940px;
	margin-left: -470px; /* move left by half element's width */
	}
	/* balloon */
	#bg3-1 {
		position: absolute;
		top: 200vh;
		left: 555px;
		}
	#bg3-2 {
		position: absolute;
		top: 210vh;
		left: -1621px;
		}
	#bg3-3 {
		position: absolute;
		top: 270vh;
		left: 403px;
		}
	#bg3-4 {
		position: absolute;
		top: 320vh;
		left: -85px;
		}
		
		
		
		/* foreground (ballons/landscape) */
#parallax-bg-ojo {
	z-index: 3;
	position: fixed;
	left: 50%; /* align left edge with center of viewport */
	top: 0;
	width: 20%;
	margin-left: -470px; /* move left by half element's width */
	}
	/* balloon */
	#bg-ojo-1 {
		position: absolute;
		top: 880vh;
		left: 355px;
		}
		
	#bg-ojo-2 {
		position: absolute;
		top: 660vh;
		left: 155px;
		}
		
/* foreground (ballons/landscape) */
#parallax-bg-loro {
	z-index: 3;
	position: fixed;
 /* align left edge with center of viewport */
	top: 0;
	width: 100%;
	}
	/* balloon */
	#bg-loro-1 {
		position: absolute;
		top: 120vh;
		left: 0;
		}

	
		
		
/* midground (clouds) */
#parallax-bg2 {
	z-index: 3;
	position: fixed;
	left: 50%; /* align left edge with center of viewport */
	top: 120vh;
	}
	#bg2-1 {
		position: absolute;
		top: 262vh;
		left: 200px;
		}
	#bg2-2 {
		position: absolute;
		top: 120vh;
		left: 20%;
		}
	#bg2-3 {
		position: absolute;
		top: 130vh;
		left: -35px;
		}
	#bg2-4 {
		position: absolute;
		top: 220vh;
		left: 250px;
		}
	#bg2-5 {
		position: absolute;
		top: 180vh;
		left: 890px;
		}
/* background (clouds) */
#parallax-bg1 {
	z-index: 1;
	position:absolute;
	left: 0; /* align left edge with center of viewport */
	top: 0;
	width: 100%;
	margin-left: 0px; /* move left by half element's width */
	}
	
#parallax-botones {
	font-family:'FuturaPT-Book';
	color:#fff;
	font-size:14px;
	z-index: 4;
	position: absolute;
	left: 0; /* align left edge with center of viewport */
	top: 0;
	width: 100%;
	margin-left: 0px; /* move left by half element's width */
	}
	

	
#parallax-botones a{
	/*opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */*/
/*	-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;*/
	font-size:60px;
	color:#FFF;
	
	-webkit-animation: flickerAnimation 2s infinite;
	-moz-animation: flickerAnimation 2s infinite;
	-o-animation: flickerAnimation 2s infinite;
	 animation: flickerAnimation 2s infinite;
}

#parallax-botones a:hover{
	/*opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
	font-size:60px;
	
	-webkit-animation: flickerAnimation2 0.5s ;
	-moz-animation: flickerAnimation2 0.5s ;
	-o-animation: flickerAnimation2 0.5s ;
	 animation: flickerAnimation2 0.5s ;
	
}

#parallax-botones a img{
	/*opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */*/
/*	-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;*/
	font-size:60px;
	color:#FFF;
	
	
}
	
	#bg1-1 {
		position: absolute;
		top: 100vh;
		left: 0px;
		}
		
	#video-extra-1 img{
		position: relative;
		float:left;
		left: 40%;
		width:183px;
		height:125px;
		margin-top:22%;
		}
		
	#video-extra-2 img{
		position: relative;
		float:left;
		left: 30%;
		width:183px;
		height:125px;
		margin-top:57%;
		}
		
	#video-extra-3 img{
		position: relative;
		float:left;
		left: 50%;
		width:183px;
		height:125px;
		margin-top:57%;
		}
		
	#video-extra-4 img{
		position: relative;
		float:left;
		left: 15%;
		width:183px;
		height:125px;
		margin-top:77%;
		}
		
		#video-extra-5 img{
		position: relative;
		float:left;
		left: 10%;
		width:183px;
		height:125px;
		margin-top:70%;
		}
	
		
	#video-extra-6 img{
		position: relative;
		float:left;
		left: -40%;
		width:183px;
		height:125px;
		margin-top:80%;
		}
		
	@media screen and (max-width: 1460px){	
	#video-extra-4 img{
		position: relative;
		float:left;
		left: 12%;
		width:183px;
		height:125px;
		margin-top:77%;
		}
		#video-extra-6 img{
		position: relative;
		float:left;
		left: -50%;
		width:183px;
		height:125px;
		margin-top:80%;
		}
	}
		
	@media screen and (max-width: 1290px){	
		#video-extra-4 img{
		position: relative;
		float:left;
		left: 5%;
		width:183px;
		height:125px;
		margin-top:77%;
		}
		
		#video-extra-6 img{
		position: relative;
		float:left;
		left: -68%;
		width:183px;
		height:125px;
		margin-top:80%;
		}
	}
		
	
		
	@media screen and (max-width: 1100px){
	#video-extra-4 img{
		position: relative;
		float:left;
		left: -10%;
		width:183px;
		height:125px;
		margin-top:77%;
		}
	#video-extra-3 img{
		position: relative;
		float:left;
		left: 35%;
		width:183px;
		height:125px;
		margin-top:57%;
		}
		
			
	#video-extra-5 img{
		position: relative;
		float:left;
		left: 0%;
		width:183px;
		height:125px;
		margin-top:70%;
		}
		
	#video-extra-6 img{
		position: relative;
		float:left;
		left: -65%;
		width:183px;
		height:125px;
		margin-top:0%;
		}


	}
		
	
		
	#bg1-4 img{
		position: absolute;
		top: 220vh;
		left: 35%;
		width:50px;
		height:50px;
		}
		
	#bg1-5 img{
		position: absolute;
		top: 110vh;
		left: 70%;
		width:50px;
		height:50px;
		}
		
	#bg1-6 img{
		position: absolute;
		top: 120vh;
		left: 55%;
		width:50px;
		height:50px;
		}
		
@keyframes flickerAnimation {
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-o-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-moz-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-webkit-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}

@keyframes flickerAnimation2 {
  0%   { opacity:0; }
  100% { opacity:1; }
}
@-o-keyframes flickerAnimation2{
  0%   { opacity:0; }
  100% { opacity:1; }
}
@-moz-keyframes flickerAnimation2{
  0%   { opacity:0; }
  100% { opacity:1; }
}
@-webkit-keyframes flickerAnimation2{
  0%   { opacity:0; }
  100% { opacity:1; }
}

@keyframes flickerAnimation3 {
  0%   { opacity:1; }
  50%  { opacity:0.6; }
  100% { opacity:1; }
}
@-o-keyframes flickerAnimation3{
  0%   { opacity:1; }
  50%  { opacity:0.6; }
  100% { opacity:1; }
}
@-moz-keyframes flickerAnimation3{
  0%   { opacity:1; }
  50%  { opacity:0.6; }
  100% { opacity:1; }
}
@-webkit-keyframes flickerAnimation3{
  0%   { opacity:1; }
  50%  { opacity:0.6; }
  100% { opacity:1; }
}



.box a{
		position: absolute;
		top: 125vh;
		left: 45%;			
		background: url(../img/player2.png);
		background-size: 60px 60px;
		background-repeat: no-repeat;
		cursor: pointer;
		line-height: 95px;
		text-align: center;
		transition-property: width, height;
		transition-duration: 0.2s;
		transition-timing-function:ease-in-out;
		width: 80px;
		height: 80px;
}
.box a:hover {
background-size: 70px 70px;


}

/*TOOLTIP*/

/* Tooltip container */
.tooltip {
   /* position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */*/
}

/* Tooltip text */
.tooltip .tooltiptext {
	font-family:'FuturaPT-Book';
    visibility: hidden;
    width: 400px;
    background-color: black;
    color: #fff;
    text-align: left;
    padding: 10px 20px;
    border-radius: 6px;
	font-size:13px;
 
    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 9999999;
	margin:0 auto;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
}

.tooltip .tooltiptext {
    opacity: 0;
    transition: opacity 1s;
}

.tooltip:hover .tooltiptext {
    opacity: 1;
}

.tooltip .tooltiptext {
    top: 30%;
    left: 50%; 
    margin-left: -200px; /* Use half of the width (120/2 = 60), to center the tooltip */
}

/*TOOLTIP*/

/* Tooltip container */
.tooltip2 {
   /* position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */*/
}

/* Tooltip text */
.tooltip2 .tooltiptext2 {
	font-family:'FuturaPT-Book';
    visibility: hidden;
    width: 400px;
    background-color: black;
    color: #fff;
    text-align: left;
    padding: 10px 20px;
    border-radius: 6px;
	font-size:13px;
 
    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 9999999;
	margin:0 auto;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip2:hover .tooltiptext2 {
    visibility: visible;
}

.tooltip2 .tooltiptext2 {
    opacity: 0;
    transition: opacity 1s;
}

.tooltip2:hover .tooltiptext2 {
    opacity: 1;
}

.tooltip2 .tooltiptext2 {
    top: 30%;
    left: 50%; 
    margin-left: -200px; /* Use half of the width (120/2 = 60), to center the tooltip */
}


/*FORMULARIO*/

#contacto-formulario{
	
    width: 100%;
    height: 446px;
	min-height: 500px;
    position: absolute;
    top: 200px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
	
	-moz-transition:all 0.3s ease-in-out;    
	-o-transition:all 0.3s ease-in-out;   
	-webkit-transition:all 0.3s ease-in-out;   
	transition:all 0.3s ease-in-out;	
}

#titulo-contacto {
	 font-family: 'Open Sans Condensed', sans-serif;
    position: absolute;
    color: #fff;
    font-size: 17px;

    height: 22px;
    z-index: 8;
    top: 42px;
    text-align: center;
	left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}

.label {
	font-family: 'Open Sans Condensed', sans-serif;
	line-height:14px;
	font-weight: normal; 
	font-size:14px; 
	color:#fff;
	text-align:left;
}

#boxformulario {
	position: absolute;
    width: 305px;
    height: 255px;
    z-index: 7;
    top: 95px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}

input[type=text] {
    color:#000;
	width:294px;
	height:20px;
    background: #fff;
    margin: 10px 0 10px 0px;
    padding-left: 10px;
	border:none;
}

#rut input[type=text] {
	float: left;
	display:block;
    color:#000;
	width:245px;
	height:20px;
    background: #fff;
    margin: 10px 0 10px 0px;
    padding-left: 10px;
	border:none;
}

#dv input[type=text] {
	float:left;
	display:block;
    color:#000;
	width:20px;
	height:20px;
    background: #fff;
    margin: 10px 0 10px 0px;
    padding-left: 10px;
	border:none;
}

#guion{
	float:left;
	display:block;
    color:#fff;
	width:10px;
	height:20px;
    margin: 10px 0 10px 0px;
    padding-left: 10px;
	border:none;
}


.select {

  border: none;
  width: 305px;
  height:21px;
  margin:10px 0 10px 0px;
  background-color: #fff;
  
}
  .select:before {
    content: '';
    position: absolute;
    right: 5px;
    top: 7px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7px 5px 0 5px;
    border-color: #000000 transparent transparent transparent;
    z-index: 5;
    pointer-events: none;
  }
  .select select {
    padding: 5px 8px;
    width: 130%;
    border: none;
    box-shadow: none;
    background-color: transparent;
    background-image: none;
    appearance: none;
  }
	
textarea{
	width:293px;
	height:41px;
	background:#fff;
	margin:5px 0 0 0px;
	border:none;
	resize: none;
	color:#000;
	padding:0 0 0 10px;
	}
	
input[type=submit]{
	float:left;
	display:block;
	width:67px;
	height:21px;
	background: #009fe3;
	margin:5px 0 0 238px;
	border:none;
	cursor:pointer;
	color:#fff;
	}
	


#obligatorio{
	font-size: 10px;
    color: #fff;
    margin: 5px 0 0 0;
	}