html{margin:0% 0%; padding:0;}

body{background-color:#2F4F4F; background-repeat: no-repeat; background-position: left; background-attachment: fixed; background-size: 1380px 768px;
border:none;width:100%; position:relative; left:-8px; top:-5px;}

bodyyy{background-image: url("dibujo.jpg"); background-repeat: no-repeat; background-position: left; background-attachment: fixed; background-size: 100vw;
background-clip:padding-box;}

#wrapper {  margin: 0 0 0 0; padding:0 0 0 0; 	text-align:center; 	width:100%; background-color:#2F4F4F;	bbackground-color:#2E8B57; 
position:relative; leftt:-5px; topp:-10px; border:none;}

#idiomas{ float:right; border: none; background-color:#2F4F4F; list-style-type: none; top:0; position:static; margin:0% 0%; padding: 0px 0px;}
#idiomas2 {display: block; padding:2px 10px 0px 2px; color:#00ff00; text-align: center; text-decoration:none; float:left; top:0; position: static;}







		#juanito{color:orange}


		.encabezado{display:flex; flex-direction:row; height: 59.5px; background-color: none; margin: 0% 0%; }
		.encabezado > div { flex:1; display:block }

		.logo{ background-color: #2F4F4F ; z-index:20; padding: 0px 0px; margin:0 12 ; position:absolute;}
		.logo2{display:block; padding: 0px 0px; background-color: #2F4F4F; margin:0 0; }

		.huemul{color: #000000; text-align:center; display:block;padding:0px 0px; font-size:9px; position:relative; top:-130; z-index:6;}
		
		.textoencabezado{position: relative; text-align:center; color:white; text-shadow: 2px 2px 3px black; float: center; 
		font-family: 'Happy Monkey'; bottom: 15px; left: 350px; 
		background-color: none; padding-left: 0px; padding-right: 0px; opacity: 1; font-size: 40px;}
		.textoencabezadoo{font-family: '';font-size: 22px;}




		
		.button { background-color: #FF7F50; border: none; color: white; padding: 20px 40px ; text-align: center; text-decoration: none; 
		display: inline-block; font-size: 16px; cursor: pointer;}
		.button1 {border-radius: 10px;   box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);}
		.button2{margin: 0px 0px; padding: 10px 20px; position:static;}

		.callus{float:right; position:relative; top: 15px;left: 100px; width: 120px; height: 0px; }

		.button3 { background-color: #FF7F50; border: none; color: white; padding: 20px 40px ; text-align: center; text-decoration: none; 
		display: inline-block; font-size: 16px; cursor: pointer;}
		.button4 {border-radius: 10px;   box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);}
		.button5{margin: 0px 0px; padding: 8px 15px; position:static;}

		.button6 { background-color: #FF7F50; border: none; color: white; padding: 20px 40px ; text-align: center; text-decoration: none; 
		display: inline-block; font-size: 16px; cursor: pointer;}
		.button7 {border-radius: 10px;   box-shadow: 0 7px 7px 0 rgba(255,127,80,0.5), 0 6px 20px 0 rgba(0,0,0,0.19);}
		.button8 {margin: 0px 0px; padding: 15px 30px; position:static;}




/* %%%%%%%%%%%%%%%%%   COPYRIGHT     %%%%%%%%%%%%%%%% */ 

		.copyright{float:center; margin:-9px 0 0 0; padding: 0 0 0 0; background-color:rgba(255,255,255,0.2); boder:none; width:100%; height: 80%}

		.logocopy{float:center; background-color:rgba(255,255,255,0);margin:0% 0% 0 0;}

		.barralogo{height: 1px; border: 0; box-shadow: inset 0 9px 9px -3px rgba(0,0,0,1); -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
		border-radius: 5px; width:100%; float:center; z-index:4; }

		.barralogo2{height: 2px; border: 0; box-shadow: inset 0 9px 9px -3px rgba(100,0,0,1);  -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px;
		border-radius: 5px; width:width:100%; float:center; }

		.cuadros{margin:0 0;padding:0 0; display:flex; flex-direction:row; width:100%; height:80%; color:white;}
		.cuadros > div {flex:1; display:block;}
		.cuadro1{background-color:none; padding: 0 100 0 100; text-align:center; color:white; text-font:Arial; text-shadow: 1px 1px grey; }
		.cuadro2{background-color:none;  padding: 0 100  0 100; margin:0 0 15% 0;}
		.cuadro2direccion{background-color:none; text-align:left; color:white; text-font:Arial; text-shadow: 1px 1px grey}
		.cuadro2telefono{background-color:none; text-align:left; color:white; text-font:Arial; text-shadow: 1px 1px grey}
		.cuadro2socialmedia{background-color:blue;}

		.copy{display:flex; flex-direction:row; background-color:none;text-align: center; text-decoration: none; color:black;}
		.copy > div {flex:1; display:block;}
		.copy1{}
		.copy1 a {text-align: center; text-decoration: none; color:black;}

		#top{position:absolute;bottom:0; left:50%;}


/* %%%%%%%%%%%%%%%%%   - - - - - -    %%%%%%%%%%%%%%%% */ 




/* %%%%%%%%%%%%%%%%%   MENU     %%%%%%%%%%%%%%%% */

		.menu{margin: 0% 0%; position:  -webkit-sticky; position:sticky; top:0; z-index:5; float:left; width:100%;} 

		ul.lista2 {list-style-type: none; margin:0% 0%; padding:0; overflow:hidden; background-color:#2F4F4F; borderrr: 1px solid #3CB371; 
		float:center; width:100%; height:59.5px;}
		li.left {float:left; margin:0 0 0 0; padding:0 0 0 0;  position:relative;bottom:6px;}
		li.left a {display: block; padding:8px 12px; color:white; text-align: center; text-decoration:none; text-shadow: 2px 2px 1px grey;}
		.dropbtn {display: inline-block; padding: 20px 15px 0px 15px; color: white; text-align: center; text-decoration: none; 
		text-shadow: 2px 2px 1px grey; position:relative; bottom:0px;
		font-size:18;}
		li.dropdown {display: inline-block; float:center;}
		li.donatee{float:right; position:relative; bottom: -15px; right:20px;}
		li.left a:hover {background-color:rgb(60,90,90)}
		.dropdown:hover .dropbtn { background-color: rgb(60,90,90); width:100%; height: 69px;}
		.dropdown-content { display: none; position: absolute; top:59.5px; background-color: #f9f9f9; min-width: 173px; 
		box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 5; }
		.dropdown-content a { color: black; padding: 8px 10px; text-decoration: none; display: block; text-align: left; }
		.dropdown-content a:hover {background-color: #708090}
		.dropdown:hover .dropdown-content {display: block;}

/* %%%%%%%%%%%%%%%%%   - - - - -     %%%%%%%%%%%%%%%% */


		







/* %%%%%%%%%%%%%%%%%   HOME     %%%%%%%%%%%%%%%% */









	/* %%%%%%%%%%%%%%%%%   LEMA     %%%%%%%%%%%%%%%% */

		.lema{margin:0 0 0 0; font-family: 'Bad Script'; font-size:40; color:white; text-shadow:2px 1px black; padding: 120 100 20 100; 
		height:500px; text-align:center; float:center;
		background-image: url("box1.jpg"); background-repeat: no-repeat; background-position: center; background-attachment: fixed; 
		background-size: 100%;}

		.hello{margin:0 0 0 0; font-family: Arial; font-size:20; color:white; text-shadow:2px 2px grey; padding: 100 100 20 100; 
		height:500px; text-align:center;
		background-image: url("malerocks.png"); background-repeat: no-repeat; background-position: center; background-attachment: fixed; 
		background-size: 100%;}
		
		.botonhello{position:relative; bottom:-120px;}

	/* %%%%%%%%%%%%%%%%%   ----     %%%%%%%%%%%%%%%% */








	/* %%%%%%%%%%%%%%%%%   VIDEOHOME   %%%%%%%%%%%%%%%% */

		.videohome{ display:flex; flex-direction:row; height: 80%; background-color: #2F4F4F ; margin: 0% 0%; top:0; width:100%;}
		.videhome > div { flex:1; display:block }
		.videohometexto { background-color:#2F4F4F; margin: 0% 0%; padding: 40 50; color: white; text-shadow:1px 1px grey; display:block; text-align:center; width:50%;}
		.videohometexto1{display:flex; flex-direction:row; }
		.videohometexto1 > div { flex:1; display:block;}
		.videohometexto2{text-align:left;}
		.videohome2{margin:5; padding:5; background-color:#2F4F4F;}
		.videohomevideo { background-color:none; margin: 0% 0%;  width:50%; padding: 50 20 0 0;}

		.lineavideotexto{height: 5px; border: 1px solid rgb(200,127,80); box-shadow: inset 0 9px 9px -3px #FF7F50; padding: 0 0 0 0; margin: -6% 80% 0% 0%;}
		


		.buttonvideo {position: relative; top:60;}
		.buttonvideo1 { background-color: #FF7F50; border: none; color: white; padding: 20px 40px ; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; cursor: pointer;}
		.buttonvideo2 {border-radius: 10px;   box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);}


	/* %%%%%%%%%%%%%%%%%    - - - - -      %%%%%%%%%%%%%%%% */










/* %%%%%%%%%%%%%%%%%    BOXS HOME     %%%%%%%%%%%%%%%% */

.contenedor1{margin:0% 0 0 0; padding: 50 50 0 50; background-color: #DCDCDC; width:100%; max-height: 535px;}  /*  Este es el bloque general */

.contenedor2{ display:flex; flex-direction:row; max-height: 90%; background-color: #DCDCDC; margin: 0% 0% 0% 0%; } /*  Este es el bloque de cada fila */

.contenedor2 > div { flex:1; display:block }     /*  Este dice que cada vez que venga un "div" adentro del contenedor2 pase lo que dice ahi adentro */
		
.fila0 {background-color:none; margin: 0% 0; padding: 0 0 0 0; width:100%;max-height: 90%;} 
/* Este da las caracteristicas de cada BOX en particular por ejemplo: height dice que tiene que tener el 100% de la altura que tenga el contendor2*/

		


.descripcion{color: white; text-align:center; display:block;padding:0px 0px;}

.botonbox{position:relative; bottom:-150;}

.photopark{position:relative; bottom:170;left: 40; display:block; overflow:auto; float:left;}

.textboxcontainerhome{ position: relative; top: -420px; left: 40; font-family: Arial; margin: 0%; padding:0; border:none; width:95%; height:420px;} 
/* Este es sobre las caracteristicas de donde va a estar apoyado el recuadro negro */

.textboxhome{  position:absolute ;  top: 0px; left: 0px;  background-color: rgba(0,0,0,0.5); color: white; padding-left: 20px; padding-right: 20px;  
padding-bottom:20px; padding-top: 20px; margin:2%;  width:90%; height:90%;}  /* Este es el recuadro negro en si */

/* %%%%%%%%%%%%%%%%%    - - - - - -     %%%%%%%%%%%%%%%% */








/* %%%%%%%%%%%%%%%%%    BIBLIOGRAPHY     %%%%%%%%%%%%%%%% */

.bibliography{margin:0; padding: 70px 300px 50px 200px; background-color:black; width:100%; height:600px;color:white; text-align:justify;}

.bibliography2{margin:0; padding: 30px 300px 50px 200px; background-color:#696969; width:100%; heightt:800px;color:white; text-align:justify;}


/* %%%%%%%%%%%%%%%%%    - - - - - -     %%%%%%%%%%%%%%%% */





/* %%%%%%%%%%%%%%%%%    PRESENTATIONS    %%%%%%%%%%%%%%%% */

.presentations0{position:relative; margin:0; padding:100px 0 0 0; text-align:center; background-color:black; width:100%;color:white;
font-family:'Andada'; font-size:23px;}
.presentations{display:flex; flex-direction:row; position:relative;margin:0px; padding: 50px 0px 100px 0px; pbackground-color:black; pwidth:100%; 
hheight:600px;color:white; ptext-align:justify;}
.presentationsimage{margin:0px 50px 0 100px; max-width:500px;}
.presentationspdf{width:550px; height:335px;}

/* %%%%%%%%%%%%%%%%%    - - - - - -     %%%%%%%%%%%%%%%% */




.portadaportada{font-family:'Shadows Into Light Two'; font-size:30px; color:white; text-shadow: 1px 2px black; position:absolute; left:200px; top:100px;}
.portadaportadabutton{position:absolute; left:520px; top:400px;}

.portadaportada2{font-family:'Shadows Into Light Two'; font-size:30px; color:	#FF7F50; text-shadow: 1px 2px black; position:absolute; left:280px; top:80px;}




/* %%%%%%%%%%%%%%%%%    EDUCATION PROGRMMS    %%%%%%%%%%%%%%%% */

.jornadas0{position:relative; margin:-40 0 -0px 0; padding:50px 0 0 0; text-align:center; background-color:black; width:100%;color:white; font-size:23px;
font-family:'Andada'}

.jornadas{display:flex; flex-direction:row; position:relative;margin:0px; padding: 50px; pbackground-color:black;
color:white; }

.jornadas1{padding:0px 20px;min-width:500px;}

.jornadaphoto1{margin:50px;padding:15px; background-color:white;}
.jornadaphoto2{margin:0%;padding:50px;}



.jornadass0{background-image: url("Fotos/jornadas/promotinghiking.jpg"); background-repeat: no-repeat; background-position: center; 
background-attachment: fixed; background-size: 100%;min-height:500px; color:white; text-shadow:2px 1px black; font-size:30px; font-family:'Flamenco';}

.jornadasstexto{position:relative; top:190px; font-family:'Flamenco'; color:white; text-shadow:2px 1px black; font-size:30px; font-family:'Flamenco';}

.jornadasss0{background-image: url("Fotos/jornadas/bookfair2.png"); background-repeat: no-repeat; background-position: center; 
background-attachment: fixed; background-size: 100%;min-height:500px; color:white; text-shadow:2px 1px grey; font-size:25px; font-style:; margin:-40px;
padding: 0 0 0;}


/* %%%%%%%%%%%%%%%%%    - - - - - -     %%%%%%%%%%%%%%%% */



















/* %%%%%%%%%%%%%%%%%    EXTENSION    %%%%%%%%%%%%%%%% */


.portadaextension{background-image: url("Fotos/portadaextension.jpg"); background-repeat: no-repeat; background-position: center; 
background-attachment: fixed; background-size: 100%;min-height:800px; color:red; text-shadow:2px 1px black; font-size:25px; font-style:; 
margin:0px 0 0 0; padding: 0 0 0 0;}
.portadatextoextension{padding:200 120 100 120;}

.textboxextension{  position: absolute;  top: 150px; left: 100px; right:100px;  background-color: rgba(0,0,0,0.5); color: white; padding-left: 20px; 
padding-right: 100px;  padding-bottom:0px;}




/* %%%%%%%%%%%%%%%%%    - - - - - -     %%%%%%%%%%%%%%%% */





/* %%%%%%%%%%%%%%%%%    OUR LOCATION     %%%%%%%%%%%%%%%% */

.ourlocationportada{background-image: url("Fotos/location.png"); background-repeat: no-repeat; background-position: center; 
background-attachment: fixed; background-size: 100%;min-height:600px;  ; 
margin:0px 0 0 0; padding: 0 0 0 0;}


.ourlocationportadatexto{font-size:80px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:130px; padding:0 120 0 120;}


	.ourlocation{position:relative; display:flex; flex-direction:row; margin:-93px 0% 0 0%; padding:100px 50px 100px 50px; background-color:rgba(255,255,224,0.5)}

	.imagenlocation{width:50%; padding:0 20 0 0px;}
	.textolocation{width:50%; padding:0 0 0 20px; text-align:justify; font-size:18px;}

/* %%%%%%%%%%%%%%%%%    - - - - - -     %%%%%%%%%%%%%%%% */





/* %%%%%%%%%%%%%%%%%    QUESTION AND ANSWER     %%%%%%%%%%%%%%%% */


	#rta0, #rta1,#rta2,#rta3,#rta4,#rta5,#rta6,#rta7,#rta8,#rta9, #rta10 { width: 100%;  padding: 50px 50px;  text-align: center; 
	background-color: lightblue;   margin-top: 0px; display:none; }

		.buttonqa { width: 100%; background-color: #2F4F4F;border: none; color: white; padding: 20px 40px ; text-align: center; 
		text-decoration: none; display: inline-block; font-size:2vw; 
		cursor: pointer; font-family: "Kristen ITC"; font-weight: bold; text-shadow: 2px 2px 1px grey; }
		.buttonqa2 {border-radius: 0px;   box-shadoww: 0 8px 16px 0 rgba(0,0,0,0.2),}
		.buttonqa3 {margin: 0px 0px; padding: 10px 20px; position:static;}
		.buttonqa:hover {background-color:#708090}
		


		.qa{margin: 0% 0%; float:center; width:100%}
		ul.qa2 {list-style-type: none; margin:0; padding:0; overflow:hidden; background-color:none; border: none; float:none;}
		#qa3{display: block; float:none;}
		#qa3:hover {background-color:grey;}
		#pregunta {display: inline-block; padding: 8px 10px; color: white;  text-shadow: 2px 2px 1px grey; text-align: center; 
		text-decoration: none; float:none; position:relative; font-family: "Kristen ITC";  font-weight: bold; font-size:2vw; width:100%;}
	
		#respuesta div{ display:none; float:left; position: static; background-color: #90EE90; width:100%; color:black;}
		#respuesta div:target {display: block; target-position:behind;}

		.qaportada{background-image: url("Fotos/qa.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%;min-height:600px; margin:0px 0 -50px 0; padding: 0 0 0 0;}
		
		.qaportadatexto{font-size:50px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:130px; padding:0 120 0 120;}



		#respuesta0{padding: 100 0 50 0;}
		#respuesta1{padding: 100 0 50 0;}
		#respuesta2{padding: 100 0 50 0;}
		#respuesta3{padding: 100 0 50 0;}
		#respuesta4{padding: 100 0 50 0;}
		#respuesta5{padding: 100 0 50 0;}
		#respuesta6{padding: 100 0 50 0;}

/* %%%%%%%%%%%%%%%%%    ---    %%%%%%%%%%%%%%%% */




/* %%%%%%%%%%%%%%%%%    NEWS   %%%%%%%%%%%%%%%% */

		.news0{background-color:grey;position:relative; display:block;margin:50px 0% 0% 0%; }
		.news{ display:flex; flex-direction:row; background-color:none;  }
		.news > div { flex:1; display:block }
		.news1photo { background-color:grey; margin: 2% 0% ; max-height:200px; max-width:300px; overflow:hidden; position:relative; left: 100px;}
		.news1 { background-color:grey; margin: 5% 0%; }
		.news1 a{text-decoration:none; color:black; text-align:center; text-size:20pt;}
		

/* %%%%%%%%%%%%%%%%%    ----	 %%%%%%%%%%%%%%%% */





/* %%%%%%%%%%%%%%%%%    SHOP  y PHOTOGALLERY   %%%%%%%%%%%%%%%% */

		.contenedorshop{background-color:#00FA9A;}
		.contenedor2shop{ display:flex; flex-direction:row; height: 70%; background-color:#00FA9A; margin: 0% 0%; }
		.contenedor2shop > div { flex:1; display:block }
		.fila0shop { background-color:#00FA9A; margin: 5% 2%;}

		.foto{display:block; padding: 15px 0px;}
		.descripcion{color: #000000; text-align:center; display:block;padding:0px 0px;}

/* %%%%%%%%%%%%%%%%%     - - - - - -  - --    %%%%%%%%%%%%%%%% */






/* %%%%%%%%%%%%%%%%%   ABOUT US     %%%%%%%%%%%%%%%% */

		.whyshoonem{ background-image: url("dibujo.jpg"); background-repeat: no-repeat; background-position: center; background-attachment: fixed; background-size: 1380px 768px;
		margin: 0 0 0 0; padding:0;}
		.whyshoonemm{margin:0% 10%; background-color: rgba(144,238,144,0.85);}
		.whyshoonemlogo{padding: 0 0 0 0; position:relative; top:-15;}

		#whyshoonemtext{margin:0% 10%; text-align:center; padding: 50 0 0 0;}
		#whyshoonemtext2{margin:0% 10%; text-align:left; padding: 0 0 30 0;}



		.whyshoonem0{margin: 0% 0%; position:relative; top:0; z-index:4; float:left; width:100%;} 
		.whyshoonem1{list-style-type: none; margin:0% 0%; padding:0 0 0 0; overflow:hidden; background-color:#90EE90; borde4r: 1px solid #CCFF88; float:left; width:100%; text-decoration:none;}
		.whyshoonem2{display: inline-block; padding:0px 10px; color:#00ff00; text-align: center; text-decoration:none; }
		.whyshoonem2 a {display: block; padding:13px 12px 13 12; color:white; text-align: center; text-decoration:none; text-shadow: 2px 2px 1px grey;}
		.whyshoonem2 a:hover {background-color:rgb(112,128,144);}

		.whyshoonemportada{background-image: url("Fotos/whyshoonem.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 1380px 768px; height:600px;}
		.whyshoonemportadatexto{font-size:40px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:150px;}




/* %%%%%%%%%%%%%%%%%      -----     %%%%%%%%%%%%%%%% */




	.ourhistory{margin: -8.5% 0 0 0;}










/* %%%%%%%%%%%%%%%%%     OUR MISSION    %%%%%%%%%%%%%%%% */

		.ourmissionportada{background-image: url("Fotos/tito.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 1380px 768px; height:600px;}
		.ourmissionportadatexto{font-size:19px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Flamenco';
		 position:relative; top:350px; padding:0 120 0 120;}
/* %%%%%%%%%%%%%%%%%      -----     %%%%%%%%%%%%%%%% */



/* %%%%%%%%%%%%%%%%%     DONATE   %%%%%%%%%%%%%%%% */

		.donateee1{background-image: url("Fotos/donate.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%; height:600px;}
		.donateee1texto{font-size:45px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:180px; padding:0 120 0 120;}

		.donatephrase{background-color:rgba(255,255,224,0.5); width:100%; height:200px; margin:0 0 -20px 0; padding:25 100 0 100;color:white; text-aling:center; 
		text-shadow:2px 1px black; font-size:30px; font-family:'Alice'}
		.donateways{background-color:black; color:white; height:280px;}
		.donateways1{diplay:flex; flex-direction:row;}

/* %%%%%%%%%%%%%%%%%      -----     %%%%%%%%%%%%%%%% */






/* %%%%%%%%%%%%%%%%%      OUR PEOPLE    %%%%%%%%%%%%%%%% */

		.ourpeopleportada{background-image: url("Fotos/ourpeople2.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size:100%; height:540px;}
		.ourpeopleportadatexto{font-size:40px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:130px; padding:0 120 0 120;}

	
	.videobackground{background-image: url("dibujo.jpg"); background-repeat: no-repeat; background-position: left; background-attachment: fixed; 
	background-size: 100vw;}

	.ourpeople0{margin:0% 15%;  background-color: rgba(255,255,255,0.6); padding: 50 0;}
	.ourpeople{ display:flex; flex-direction:row; background-color: none ; margin: 0 0 0 0; top:0; width:100% }
	.ourpeople > div { flex:1; display:block }
	.ourpeoplephoto{margin:0 0 0 0;padding: 0 0 0 0;background-color:rgba(255,127,80,0.8); margin:2%; padding:30; max-width:300px;}
	.ourpeopletexto{ position:relative; background-color:none; margin: 0% 0% 0 0; padding: 0 0 0 0; color: black; text-shadow:1px 1px grey; display:block; text-align:center; font-size:19; }



/* %%%%%%%%%%%%%%%%%      -----     %%%%%%%%%%%%%%%% */








/* %%%%%%%%%%%%%%%%%   VIDEOS     %%%%%%%%%%%%%%%% */
	
	.videobackground{background-image: url("dibujo.jpg"); background-repeat: no-repeat; background-position: left; background-attachment: fixed; background-size: 100vw;}

	.video0{margin:0% 15%;  background-color: white; opacity:0.92; padding:3%;}
	.video{ display:flex; flex-direction:row; height: 250px; background-color: white ; margin: 0 0 0 0; top:0; opacity:0.92; width:100% }
	.video > div { flex:1; display:block }
	.videovideo{margin:0 0 0 0;padding: 0 0 0 0; }
	.videotexto{ background-color:none; margin: 0% 0% 0 0; padding: 0 0 0 0; color: black; text-shadow:1px 1px grey; display:block; text-align:left; font-size:19; }

	.visitus{font-size:18; color:black; background-color:#DCDCDC; opacity:0.92; margin: 0% 15%;}



/* %%%%%%%%%%%%%%%%%      -----     %%%%%%%%%%%%%%%% */



/* %%%%%%%%%%%%%%%%%   OUR EXPERTS    %%%%%%%%%%%%%%%% */
	
	.videobackground{background-image: url("dibujo.jpg"); background-repeat: no-repeat; background-position: left; background-attachment: fixed; background-size: 100vw;}

	.ourexperts0{margin:0% 15%;  background-color: rgba(255,255,255,0.6); padding: 100 0;}
	.ourexperts{ display:flex; flex-direction:row; background-color: none ; margin: 0 0 0 0; top:0; width:100% }
	.ourexperts > div { flex:1; display:block }
	.ourexpertsphoto{margin:0 0 0 0;padding: 0 0 0 0;background-color:rgba(255,127,80,0.8); margin:10%; padding:30; max-width:300px;}
	.ourexpertstexto{ position:relative; background-color:none; margin: 0% 0% 0 0; padding: 0 0 0 0; color: black; text-shadow:1px 1px grey; display:block; text-align:center; font-size:19; }



/* %%%%%%%%%%%%%%%%%      -----     %%%%%%%%%%%%%%%% */








/* %%%%%%%%%%%%%%%%%   PUBLICATIONS    %%%%%%%%%%%%%%%% */
	
	.videobackground{background-image: url("dibujo.jpg"); background-repeat: no-repeat; background-position: left; background-attachment: fixed; 
	background-size: 100vw; text-decoration:none;}

	.publications0{margin:0% 15%;  background-color: rgba(0,0,0,0.5); padding: 50 50; text-decoration:none;}

	.publications{ display:flex; flex-direction:row; height: 10%; background-color: none ; margin: 0 0 0 0; top:0; width:100%; text-decoration:none; }
	.publications > div { flex:1; display:block }
	.publicationphoto{margin:0 0 0 0;padding: 0 0 0 0; }

	.publicationstexto{ background-color:none; margin: 0%; padding: 0 0 0 0; display:block; text-align:left; padding:0 0 30 0;  }
	.publicationstexto a{text-decoration:none; color:black;  text-shadow:1px 1px grey; font-size:19; }




.publicationsportada{background-image: url("Fotos/publications.jpg"); background-repeat: no-repeat; background-position: center; 
background-attachment: fixed; background-size: 100%;min-height:600px; margin: 0 0 -49px 0;}
.publicationsportadatexto{font-size:37px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:160px; padding:0 0 0 0;}


/* %%%%%%%%%%%%%%%%%      -----     %%%%%%%%%%%%%%%% */










/* %%%%%%%%%%%%%%%%%  SHOONEM PARK   %%%%%%%%%%%%%%%% */

		.shoonempark{ background-image: url("shoonempark/resilencia.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size:100%; margin: 0 0 0 0; padding:0;}
		.shoonemparkk{margin:0 100px; background-color: rgba(144,238,144,0.8); padding: 50px}
		.whyshoonemlogo{padding: 0 0 0 0; position:relative; top:-15;}

		#whyshoonemtext{margin:0% 10%; text-align:center; padding: 50 0 0 0;}



/* %%%%%%%%%%%%%%%%%      -----     %%%%%%%%%%%%%%%% */
















/* %%%%%%%%%%%%%%%%%   SLIDE-HOW    %%%%%%%%%%%%%%%% */

* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {   width: 100%;   position: relative;  margin: 0 0 0 0; z-index:1; left:0px; top:0px; }


/* Hide the images by default */
.mySlides {   display: none; }


/* Next & previous buttons */
	.prev, .next {   cursor: pointer;   position: absolute;   top: 50%;   width: auto;   margin-top: -22px;   padding: 16px;   color: white;   font-weight: bold;   font-size: 18px;   transition: 0.6s ease; 
  	border-radius: 0 3px 3px 0;   	user-select: none; z-index:2; }


/* Position the "next button" to the right */
	.next {  right: 0;   border-radius: 3px 0 0 3px; }


/* On hover, add a black background color with a little bit see-through */
	.prev:hover, .next:hover {  background-color: rgba(0,0,0,0.8); }


/* Caption text */
	.text {   color: #f2f2f2;   font-size: 15px;   padding: 8px 12px;   position: absolute;   bottom: 8px;   width: 100%;   text-align: center; }


/* Number text (1/3 etc) */
	.numbertext {   color: #f2f2f2;   font-size: 12px;   padding: 8px 12px;   position: absolute;   top:0;}


/* TEXTO SIGNIFICADO SHOONEM */
	.shoonemhuemul {   color: red;   font-size: 30px;   padding: 8px 12px;   position: absolute;   top:100px; }


/* The dots/bullets/indicators */
	.dot {   cursor: pointer;   height: 15px;   width: 15px;   margin: 0 0px;   background-color: #bbb;   border-radius: 50%;    display: inline-block;  
	transition: background-color 0.6s ease; z-index:100} 

	.active, .dot:hover {   background-color: #717171; }

	.dots{position:relative; bottom:90; float: center; margin: 0 0 -1.4% 0}


/* Fading animation */
 	.fade {   -webkit-animation-name: fade;   -webkit-animation-duration: 5s;   animation-name: fade;   animation-duration: 5s; }

@-webkit-keyframes fade {  	from {opacity: .4}   to {opacity: 1}   }

@keyframes fade {   from {opacity: .4}   to {opacity: 1}  }









/* %%%%%%%%%%%%%%%%%		TEXT-BOX-CONTAINER       %%%%%%%%%%%%%%%% */


.textboxcontainer{ position: relative; font-family: Arial;}
.textbox{  position: absolute;  top: 0px; left: 0px;  background-color: rgba(0,0,0,0.8); color: white; padding-left: 20px; padding-right: 20px;  padding-bottom:20px; margin-bottom: 100px;
margin-right: 700px; margin-top:180px; margin-left: 90px;}

.textboxcontainer2{ position: relative; font-family: Arial;}
.textbox2{  position: absolute;  top: 150px; right: 100px;  background-color: rgba(160,82,45,0.6); color: white; padding-left: 20px; padding-right: 20px; }

.textboxcontainer3{ position: relative; font-family: Arial;}
.textbox3{  position: absolute;  bottom: 100px; right: 530px;  background-color: none; color: white; padding-left: 20px; padding-right: 20px; opacity: 1;}

.textboxcontainer4{ position: relative; font-family: Arial;}
.textbox4{  position: absolute;  top: 70px; left: 100px;  background-color: black; color: white; padding-left: 20px; padding-right: 20px;  padding-bottom:0px; opacity: 0.8;}

.textboxcontainerourmission{ position: relative; font-family: Arial;}
.textboxourmission{  margin: 5% 5% 5% 5%; position: absolute;  top: 70px; left: 70px;  background-color: 	#E0FFFF; color: black; padding-left: 20px; padding-right: 20px;  
padding-bottom:0px; opacity: 0.8; text-shadow: 1px 1px 1px grey}

.textboxcontainerphotogallery{ position: relative; font-family: Arial; hheight:500px; z-index:1}
.textboxphotogallery{  position: absolute;  top: 17%; left: 41%;  background-color: black; color: white; padding-left: 20px; padding-right: 20px;  
padding-bottom:0px; opacity: 0.8; font-size:30; z-index:2;}


.textboxcontainervideos{ position: relative; font-family: Arial;}
.textboxvideos{  position: absolute;  top: 17%; left: 43%;  background-color: black; color: white; padding-left: 40px; padding-right: 40px;  padding-bottom:0px; padding-top:-20px
opacity: 0.8; font-size:30}


.enconstruccion{position:relative; top: 30px;}
.textboxcontainerconstruccion{position: absolute;  top: 220px; left: 430px;  background-color: none; color: white; padding-left: 40px; padding-right: 40px;  
padding-bottom:0px;  font-size:90; text-shadow:2px 1px 1px black; font-family: Tangerine;}




/* %%%%%%%%%%%%%%%%%		- - - - - - - - - - - - - -- -       %%%%%%%%%%%%%%%% */













/* %%%%%%%%%%%%%%%%%    PHOTO GALLERY - BOXS    %%%%%%%%%%%%%%%% */

		.contenedor1photo{margin:0 0 0 0; padding: 0 0 0 0; background-color: #DCDCDC; width:100%;height:120%;}  /*  Este es el bloque general */

		.contenedor2photo{ display:flex; flex-direction:row; max-height:350px; background-color: #DCDCDC; margin: 0% 3% 0% 3%; } /*  Este es el bloque de cada fila */
		.contenedor2 > div { flex:1; display:block }     /*  Este dice que cada vez que venga un "div" adentro del contenedor2 pase lo que dice ahi adentro */
		
		.fila0photo {background-color:none; margin: 0; padding: 20 5 0 0; width:100%;  clip:rect(0, 0, 10px, 20px);max-height:350px;} 
		/* Este da las caracteristicas de cada BOX en particular por ejemplo: height dice que tiene que tener el 100% de la altura que tenga el contendor2*/
		

		.fila0photo:hover { -ms-transform: scale(1.18);   -webkit-transform: scale(1.18);   transform: scale(1.18); transition:transform .3s}
		


		.textboxcontainerphoto{ position: relative; top: -250; left: 0; font-family: Arial; margin: 0% 20%  ;padding:0; border:none; } /* Este es sobre las caracteristicas de donde va
		 a estar apoyado el recuadro negro */

		.textboxphoto{  position:absolute ;  top: 0px; left: 0px;  background-color: rgba(0,0,0,0.0); color: white; padding-left: 0px; 
		padding-right: 0px;  padding-bottom:0px; 
		padding-top: 0px; margin:0%;  font-size:23; text-decoration:none; text-shadow: 2px 2px black;}  /* Este es el recuadro negro en si */
		.textboxphoto11{position:absolute; left:-50px;}
		
		.textboxphoto a {text-decoration:none; color:white;}

		.photogallerybar{position:relative; top:0;}

		.dietdiet{position:absolute; left:80px; top:20px;}
		.behaviorbehavior{position:absolute; left:20px; top:50px;}

/* %%%%%%%%%%%%%%%%%    - - - - - -     %%%%%%%%%%%%%%%% */




		.photogalleryportada{background-image: url("Fotos/photogallery.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%; height:600px;}
		.photogalleryportadatexto{font-size:60px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:180px; padding:0 120 0 120;}

		.photogalleryportadahistoricals{background-image: url("Fotos/historicals/historicals1.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%; height:600px;}
		.photogalleryportadatextohistoricals{font-size:60px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:180px; padding:0 120 0 120;}

		.photogalleryportadacharacteristics{background-image: url("Fotos/tito2.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%; height:600px;}
		.photogalleryportadatextocharacteristics{font-size:60px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:180px; padding:0 120 0 120;}

		.photogalleryportadawithfamily{background-image: url("Fotos/family/family1.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%; height:600px;}
		.photogalleryportadatextowithfamily{font-size:60px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:180px; padding:0 120 0 120;}

		.photogalleryportadabehavior{background-image: url("Fotos/pissing.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%; height:600px;}
		.photogalleryportadatextobehavior{font-size:60px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:180px; padding:0 120 0 120;}

		.photogalleryportadaissues{background-image: url("Fotos/huemulissues/issues0.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%; height:600px;}
		.photogalleryportadatextoissues{font-size:60px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:180px; padding:0 120 0 120;}

		.videosportada{background-image: url("Fotos/videos.jpg"); background-repeat: no-repeat; background-position: center; 
		background-attachment: fixed; background-size: 100%; height:600px;}
		.videosportadatexto{font-size:60px; text-align:center; text-shadow:2px 1px black; color:white; font-family:'Shadows Into Light';
		 position:relative; top:230px; padding:0 120 0 120;}



/* %%%%%%%%%%%%%%%%%		PHOTO GALLERY - HISTORICALS     %%%%%%%%%%%%%%%% */

* {   box-sizing: border-box; }

.row{margin:2% 0%; display:flex; flex-direction:row; overflow:hidden; max-height:250px;z-index:3;}

.row > .column {flex:1; display:block;   padding: 0 8px; }



.column {   float: left;   width: 25%; margin:1% 0%;}




/* The Modal (background) */

.modal { 
  display: none;
  position: fixed;
  z-index: 111;
  padding-top: 10px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: none;
  margin: auto;
  padding: 0;
  width: 57%;            			<--- /*MODIFICAR ESTE SI QUIERO CAMBIAR TAMAÑO */
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlidesphoto {
  display: none; background-color:none;
}

.cursor {
  cursor: pointer;
}

/* Next & previous buttons */

.prev {cursor: pointer;
  position: absolute;
  top: 50%;
  left:0%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;}

.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  right:0%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

.prev:hover, 
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}


.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}

.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}

img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



/* %%%%%%%%%%%%%%%%%		- - - - - - - - - - - - - -- -       %%%%%%%%%%%%%%%% */