@font-face{ font-family: "Muli-extralight"; src: url('fonts/Muli-extralight.ttf') format('truetype');}
@font-face{ font-family: "Muli-extralightitalic"; src: url('fonts/Muli-extralightitalic.ttf') format('truetype');}
@font-face{ font-family: "Muli-light"; src: url('fonts/Muli-light.ttf') format('truetype');}
@font-face{ font-family: "Muli-regular"; src: url('fonts/Muli-regular.ttf') format('truetype');}
@font-face{ font-family: "Muli-semibold"; src: url('fonts/Muli-semibold.ttf') format('truetype');}
@font-face{ font-family: "Muli-italic"; src: url('fonts/Muli-italic.ttf') format('truetype');}
@font-face{ font-family: "ArNarr-regular"; src: url('fonts/ArNarr-regular.ttf') format('truetype');}


/* MENSAJE OLD BROWSER IE 9 >.................................................................................................................... */
#Mensajes { position:relative; width: 100%; height:100%; text-align:center; background-color:#ccc; font-family:Arial, Helvetica, sans-serif !important;}
    #CuerpoMensaje { position:absolute; top:50%; left:50%; width:600px; padding:20px 0; margin:-100px 0 0 -300px; background-color:#fff;}
    #CuerpoMensaje p#AlertaPrincipal { font-style:italic; font-weight:normal; color: #666; font-size:20px; display:block; margin-bottom:15px; text-align:center;}
    #CuerpoMensaje div { width:100%;  border-top:1px solid #ccc; text-align:left;}
    #CuerpoMensaje div p { width:100%; font-size:11px; color:#666; display:block; text-align:center; margin:10px 0;}
    #CuerpoMensaje ul { list-style:none; width:260px; text-align:center; margin:10px 0 0 180px; }
    #CuerpoMensaje ul li { float:left;}
    #CuerpoMensaje ul li a { width:60px; margin:0 10px; display:block; text-decoration:none; font-size:12px; color:#666;}
    

/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* GLOBAL////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* ORIENTACION HORIZONTAL////////////////////////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

@media screen {	
/* RESET PAGE */
html, body,
div, span,
h1, h2, h3, h4, h5, h6, p,
a, em, font, img, strong,
dl, dt, dd, ol, ul, li,
form, label, fieldset, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
header, main, footer, 
article, aside, canvas, embed, 
picture, figure, figcaption, hgroup, 
menu, nav, output, ruby, section, details, summary,
address, blockquote, cite,
time, mark, audio, video {margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:none;                          
                          box-sizing: border-box;}

h1, h2, h3, h4, h5, h6 { font-weight:normal;}

input, textarea, select, button  { margin:0; padding:0; outline:0; border:0;                                
                                    box-sizing: border-box;}
    
/*HTML 5*/
header, main, footer,
article, aside, canvas, embed, 
picture, figure, figcaption, hgroup, 
menu, nav, output, ruby, section, details, summary,
address, blockquote, cite,
time, mark, audio, video {display: block;}

a { text-decoration:none !important; }
a, figure, img { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
 
/*LOADER*/
#Loader { -webkit-transition: opacity 0.3s ease-out, visibility 0.3s ease-out; transition: opacity 0.3s ease-out, visibility 0.3s ease-out; }
#Loader.off { opacity:0; visibility:hidden; }

/* 1 - SETEOS GLOBALES.................................................................................................................... */
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
html, body { height:100%;} 
html { font-size:18px  /*1rem = 18px*/ }

body {   
    margin:0 auto;
    text-align:center;
	font-family: "Muli-regular", Arial, Helvetica, sans-serif;
	background-color:#333333;
  } 

.SafeZone { width:100%; height:100%; /*max-width:1920px;*/ margin:0 auto; font-size:0;}
	.Viewport { position:relative; width:100%; max-width:1600px; height:100%;  margin:0 auto;}	
    
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*HEADER...................................................................................................................................*/ 
header.General { position:absolute; z-index:1000; top:0; left:0; text-align:left;}
   header.General .Viewport {}
		#Logo { width:320px; background-color:#FFF; text-align:center; margin-bottom:2px; padding:30px 25px;}
			#Logo a { display: block; margin: 0 auto;}
			#Logo img { max-width: 100%; display: block;}
		
		#Menus { width:320px; background-color:#F2F2F2;}
			#Slogan {font-family: "Muli-italic", Arial, Helvetica, sans-serif; font-style:italic; font-size:1.6rem; color:#666666; display:block; padding:30px 25px; background-color:#FFF;}
			#Menus ul { list-style:none;}
			
			#MenuGeneral { display:block; vertical-align:middle; text-align:left; background-color: #fff;}
				#MenuGeneral li { display: block;}			 			
				#MenuGeneral li a { display: block;  font-size:1.1rem; color:#333333; padding:30px 25px;  border-bottom:1px solid #CBCDC2;
									-webkit-transition: box-shadow ease-out 0.4s;									 
									 transition: box-shadow ease-out 0.4s;}  

				#MenuGeneral li:last-child a { border:none;}
				
				/*Desktop*/
				.Desktop #MenuGeneral li:not(.select):hover a { box-shadow: inset 400px 0 0 0 #ccc;}

				/*select*/
				#MenuGeneral li.select a { color:#E43730; background-color:#DDDED8; cursor:default;}
				/*......*/	
			
		/*Mobile*/
		a#BtnMobile { display:none;}
		/*......*/
	
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*CENTER..................................................................................................................................*/  
main {}	  
#Home main { position:relative; width:100%; height:100%;  text-align:left; /*background:#000 url(imagenes/foto-ciudad.jpg) no-repeat 50% 50%;*/ background-repeat: no-repeat; background-position: 50% 50%; background-size:cover;}
	
	a#BtnIdioma { position: absolute; z-index: 300; top: 30px;  right: 30px; display: block; width: 30px; height: 30px;}
		.Castellano { background: url(imagenes/bandera-castellano.jpg) no-repeat 0 0;}
		.Ingles { background: url(imagenes/bandera-ingles.jpg) no-repeat 0 0;}
	
	a#BtnPulsar { position:fixed; z-index:200; right:230px; bottom:100px; width:130px; height:130px; display: block; cursor:pointer;}						
		a#BtnPulsar div { position:relative; width:100%; height:100%; display:block; border-radius:50%; text-align:center;}
		
		a#BtnPulsar div.top { background:rgba(143, 196, 105, 0.5);
							-webkit-animation: fade 0.7s infinite alternate;
							animation: fade 0.7s infinite alternate;}
						
		a#BtnPulsar div.middle { background:rgba(143, 196, 105, 0.6);
								-webkit-animation: blink 0.7s infinite alternate;
								animation: blink 0.7s infinite alternate;}
						
		a#BtnPulsar div.bottom { background-color:#97CF6D;
								-webkit-animation: blink 0.5s infinite alternate;
								animation: blink 0.5s infinite alternate; }

		a#BtnPulsar div.close { position: fixed; top: 30px; right: 30px; width: 40px; height: 40px; background:rgba(143, 196, 105, 0.5) url(imagenes/icono-menu-close.svg) no-repeat 50% 50%; background-size:20px auto; display: none; }
		
			a#BtnPulsar p { position:absolute; z-index:100; top:0; margin-top:50px; width:100%; display:block; text-align:center; font-family: "Muli-italic", Arial, Helvetica, sans-serif; font-style:italic; font-weight:bold; font-size:13px; color:#000;}
	
	/*Preguntas*/
	#Preguntas { position:fixed; display:flex; z-index:150; top:0; right:0; width:calc(100% - 320px); height:100%;}
		#Preguntas section { margin:auto;  width:1000px; /*border:1px solid yellow;*/}
			
			#Preguntas header { position:absolute; z-index:100; top:50%; left:50%; text-align:center; width:300px; height:125px; margin:-62px 0 0 -150px; border-radius:50%; background:rgba(143, 196, 105, 0.5);
								-webkit-transform-origin: 50% 50%;
								transform-origin: 50% 50%;
								-webkit-transform: scale(0);
								transform: scale(0);
								-webkit-transition: -webkit-transform 0.4s ease-in-out;
								transition: transform 0.4s ease-in-out;}
				
				#Preguntas header div { width:100%; height:100%; display:block; border-radius:50%; background:rgba(143, 196, 105, 0.6);}
					#Preguntas header div.middle { -webkit-transform: scale(0.7);
										   			transform: scale(0.7);}	
												
					#Preguntas header div.bottom { -webkit-transform: scale(0.5);
										   			transform: scale(0.5);}
					
					#Preguntas h1 { position:absolute; z-index:500; top:35px; left:0; width:100%; text-align:center; font-family: "Muli-italic", Arial, Helvetica, sans-serif; font-style:italic; font-weight:bold; font-size:1.4rem; color:#000;}
								
			
			
			#Preguntas footer { width:100%; text-align:center; padding:0; opacity:0; /*outline:1px solid yellow;*/
								-webkit-transform: scale(0);
								transform: scale(0);
								-webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
								transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
								-webkit-transition-delay: 0.3s;
								transition-delay: 0.3s;}
								
				#Preguntas .fila { width:100%; display:block;}					
				.fila > div { position:relative; overflow:hidden; display:inline-block; vertical-align:middle; width:50%; padding:10px; height:100px; /*outline:1px solid blue;*/}
					#q3 { width:calc(50% - 180px); margin-right:165px; margin-left:15px;}
					#q4 { width:calc(50% - 180px); margin-left:165px; margin-right:15px;}
					
					.fila a { position:absolute; top:50%; left:20%; width:60%; display:block; text-align:center; opacity:0; visibility:hidden;
							  -webkit-transform: translate(-20px, -50%);
							  transform: translate(-20px, -50%);
							  -webkit-transition: -webkit-transform 0.3s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
							  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;}
						
						.fila h2 { display:block; font-size:1.25rem; color:#FFF; margin:0 auto; text-shadow: 2px 2px #000;
									-webkit-transition: color 0.3s ease-in-out;
								    transition:  color 0.3s ease-in-out;}
					
		#Black { position:absolute; z-index:100; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); opacity:0; visibility:hidden;
				-webkit-transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
				 transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;}
		
		/*Desktop*/		
		.Desktop a#BtnPulsar:not(.stop):hover div {-webkit-animation: none;
										 animation: none;									 
										 -webkit-animation-play-state: paused;
										  animation-play-state: paused;}										  
		
		.Desktop a#BtnPulsar:not(.stop):hover div.top { -webkit-transform: scale(1);
										   transform: scale(1);}
										   
		.Desktop a#BtnPulsar:not(.stop):hover div.middle { -webkit-transform: scale(0.7);
										   		transform: scale(0.7);}
										   
		.Desktop a#BtnPulsar:not(.stop):hover div.bottom { -webkit-transform: scale(0.4);
										   		transform: scale(0.4);}		


		/*open*/
		main.open a#BtnIdioma { display: none;}
		main.open #Preguntas header {-webkit-transform: scale(1);
									transform: scale(1);}
								
		main.open #Preguntas footer { opacity:1;
										-webkit-transform: scale(1);
										transform: scale(1);}		
		
		main.open #BtnPulsar { position:absolute; top:50px; right:0;}

		main.open #BtnPulsar div {-webkit-animation: none !important;
							 animation: none !important;}
		
		
		/*main.open #BtnPulsar div.top { background-image: url(imagenes/icono-menu-close.svg) !important; background-repeat:no-repeat; background-position:50% 50%; background-size:30px auto;
										-webkit-transform: scale(0.35);
										transform: scale(0.35);
										-webkit-transition: -webkit-transform 0.3s ease-in-out;
										transition: transform 0.3s ease-in-out;}*/
		main.open #BtnPulsar div.top,						
		main.open #BtnPulsar div.middle,										   
		main.open #BtnPulsar div.bottom {  opacity:0;}

		main.open #BtnPulsar div.close { display: block;}
		
		main.open #BtnPulsar p { display:none;}
		
		
		.Desktop main.open #BtnPulsar div.top:hover {-webkit-transform: scale(0.4);
												transform: scale(0.4);}
												
		main.open #Black { opacity:1; visibility:visible;}
		
		
		/*ANIMACIONES FRASES - 4 pasadas de 7.5s c/u = 30s*/
		a#t1, a#t5, a#t9, a#t13, a#t17, a#t21, a#t25, a#t29 { -webkit-animation:t1 30s linear infinite forwards; opacity:1; visibility:visible; 
															  animation:t1 30s linear infinite forwards;
															  -webkit-transform: translate(0, -50%);
							  								  transform: translate(0, -50%);}
															  
		a#t2, a#t6, a#t10, a#t14, a#t18, a#t22, a#t26, a#t30 { -webkit-animation:t2 30s linear infinite forwards; 
															   animation:t2 30s linear infinite forwards;}
															   
		a#t3, a#t7, a#t11, a#t15, a#t19, a#t23, a#t27, a#t31 {  -webkit-animation:t3 30s linear infinite forwards;
															    animation:t3 30s linear infinite forwards;}
																
		a#t4, a#t8, a#t12, a#t16, a#t20, a#t24, a#t28, a#t32 { -webkit-animation:t4 30s linear infinite forwards;
															   animation:t4 30s linear infinite forwards;}

		a#t4b, a#t8b, a#t12b, a#t16b, a#t20b, a#t24b, a#t28b, a#t32b { -webkit-animation:t5 30s linear infinite forwards;
															  			animation:t5 30s linear infinite forwards;}	
		
		#q0 a {}
		#q2 a {-webkit-animation-delay: 0.15s; animation-delay: 0.15s;}
		#q4 a {-webkit-animation-delay: 0.3s; animation-delay: 0.3s;}
		#q6 a {-webkit-animation-delay: 0.45s; animation-delay: 0.45s;}
		#q7 a {-webkit-animation-delay: 0.6s; animation-delay: 0.6s;}
		#q5 a {-webkit-animation-delay: 0.75s; animation-delay: 0.75s;}
		#q3 a {-webkit-animation-delay: 0.9s; animation-delay: 0.9s;}
		#q1 a {-webkit-animation-delay: 1.05s; animation-delay: 1.05s;}
		
		
		/*Desktop*/
		.Desktop #Preguntas footer:hover a[id] {  -webkit-animation-play-state: paused !important;  animation-play-state: paused !important;}
		.Desktop .fila a[id]:hover { opacity:1 !important; visibility:visible !important;}
		.Desktop .fila a[id]:hover h2 { color: #9CD966;}	
		/*.......*/
	

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*FOOTER...................................................................................................................................*/
footer.General { position:absolute; z-index:200; bottom:20px; width: 100%;}
	#Home footer.General .Viewport { max-width: none; padding: 0 30px;}	
	#Legales { width: 100%; }
		#Legales p,
		#Legales a {  font-size:9px; color:#FFF; text-shadow:1px 1px #000;}

		p#Copy { float: left; }
		p#CreacionUno { font-family:Arial, Helvetica, sans-serif; float: right;}
		p#CreacionUno a { color:#FFF;}

	#Legales::after { content: ""; display: block; clear: both; }
  
/*INTERNAS:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*SOLUTION.................................................................................................................................*/
.SafeZone * { line-height: 1.2em !important;}

/*header*/
.Interna header.General { position: relative; background-color: #fff; }
.Interna header.General .Viewport { background-color: #fff; }

	.Interna #Logo { display:inline-block; vertical-align:top; width:250px; padding-right:5px; padding-bottom:6px; padding-top:6px; padding-left: 0;}
		.Interna #Logo a { padding-top:15px; padding-bottom:15px;}
	
	.Interna a#BtnMobile { position:relative;  z-index:9100; display:inline-block; vertical-align:top; width:35px; height:35px; margin-top:15px; cursor:pointer;}
		.Interna a#BtnMobile span { -webkit-transition: color 0.3s ease-in-out;
						    transition: color 0.3s ease-in-out;}
		.Interna #Barritas { display:block; width:100%; height:100%; background:url(imagenes/icono-menu-open.svg) no-repeat center center;}
		.Interna #Equis { display:none; width:100%; height:100%; background:url(imagenes/icono-menu-close.svg) no-repeat center center; }	
			
	.Interna #Menus { position:absolute; overflow-x: hidden; overflow-y:auto; z-index:9000; top:92px; left:0; width:100%; max-width:250px; background:rgba(255, 255, 255, 0.9);
					-webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);			
					clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
					-webkit-transition: -webkit-clip-path 0.3s ease-in-out;
					transition: clip-path 0.3s ease-in-out;}

		.Interna p#Slogan { font-size: 0.8rem; padding-top: 10px; padding-bottom: 10px; }

		#Sombra { position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); opacity: 0; visibility: hidden;
				-webkit-transition: opacity ease-out 0.3s, opacity ease-out 0.3s;									 
				 transition:opacity ease-out 0.3s, opacity ease-out 0.3s;  }	

		/*menumode*/
		.menumode {}
		.menumode #Barritas { display:none;}
		.menumode #Equis { display:block;}
		.menumode #Menus { overflow:auto;							
						   -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
						   clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}	

		.menumode #Sombra { opacity: 1; visibility: visible; }
		
		/*fixedclippath*/
		.fixedclippath #Menus { max-height: 0; border-top: 0;							
			    			  -webkit-transition:  max-height 0.3s ease-in-out;
			    			  transition:  max-height 0.3s ease-in-out;}

		.fixedclippath.menumode #Menus { max-height: 2000px;}
		
		/*fixedflex*/
		.fixedflex #MenuGeneral { position:absolute; top:50%; left:0; width:100%; text-align:center; margin:0;							
								-webkit-transform: translateY(-50%);
								transform: translateY(-50%);}
		/*.......*/

		p.General { display: block; font:normal 0.95rem "Muli-extralight", Arial, Helvetica, sans-serif; line-height: 1.6em !important; }
		p.General u { font-family: "Muli-extralightitalic", Arial, Helvetica, sans-serif; }

		ul.General { list-style: none; text-align: left; }
		ul.General li { position: relative; display: block; font-size: 1.05rem; font-family: "Muli-light", Arial, Helvetica, sans-serif; color: #525252; padding:3px 0 3px 15px;  }
		ul.General li::before { content: "\2022"; position: absolute; top: 3px; left:0; color: #9AC774;}

		.verde { display: inline-block; background-color: #ACD15F; padding: 10px 25px; font: 0.9rem "Muli-semibold", Arial, Helvetica, sans-serif; color: #fff; 
				    -webkit-transition: box-shadow ease-out 0.4s;
    				transition: box-shadow ease-out 0.3s;}

    	/*Desktop*/
    	.Desktop .verde:hover { box-shadow: inset 200px 0 0 0 #000;}
    	/*.......*/

/*main*/
.Interna main { height: auto;}

	#IntroInterna { background: linear-gradient(to right, #F2F2F2 50%, #fff 50%); }
		#IntroInterna header { position: absolute; z-index: 2000; top: -50px; right: 130px; }
		#IntroInterna h1 {font-family: "Muli-light", Arial, Helvetica, sans-serif; font-size: 2.7rem; color: #666666; }

	#ContentIntro { display: table; background-color: #F2F2F2; }		
		#ContentIntro div { display: table-cell; vertical-align: middle; padding: 80px 70px; }
		#Solutions #ContentIntro div { padding-top: 60px; padding-bottom: 60px; }
			#ContentIntro blockquote { position: relative; text-align: left;}
				#ContentIntro blockquote p {font:1.2rem "Muli-italic", Arial, Helvetica, sans-serif; line-height: 1.5em !important; color: #535353; padding-left: 35px; display: inline-block; }
				#ContentIntro blockquote span { width: 27px; height: 21px; }
				span.abre { position: absolute; top: 0; left: 0; display: block; background: url(imagenes/internas/comilas-open.png) no-repeat 0 0; }
				span.cierre { display: inline-block; vertical-align: top; margin-left: 10px; background: url(imagenes/internas/comilas-close.png) no-repeat 0 0; }
		
		#ContentIntro > aside { display: table-cell; vertical-align: middle; width: 300px; padding-bottom: 5px; background-color: #fff; text-align: left; }
		#ContentIntro > figure {  display: table-cell; vertical-align: middle; width: 430px; }
		/*#Solutions #ContentIntro figure { background: url(imagenes/internas/foto-solutions.jpg) no-repeat 50% 50%; background-size: cover;  }*/
		
		.SeparadorArcoiris { width: 100%; height: 5px; background: url(imagenes/internas/filete.jpg) repeat-x 0 0; display: block; }

	#ContentInterna { background-color: #fff; }
		#ContentInterna .Viewport { background-color: #fff;}
		#ContentInterna .Viewport > header { width: calc(100% - 300px); padding:40px 70px; display: inline-block; vertical-align: top;  }
		#AboutUs #ContentInterna .Viewport > header { width: calc(100% - 430px); }
			
			#IntroSolutions { display: inline-block; vertical-align: top; width: 43%; padding-right: 20px; }
				#IntroSolutions p { font-size: 1rem; line-height: 2.1em !important; color: #525252; text-align: left; }

			#VentajasSolutions {display: inline-block; vertical-align: top; width: 57%; text-align:left; padding-left: 20px;}
				#VentajasSolutions h2 { font:1.1rem "Muli-semibold", Arial, Helvetica, sans-serif; color: #9AC774; display: block; margin-bottom: 5px; padding-left: 10px; border-left: 4px solid #9AC774; }
				
				#VentajasSolutions ul { list-style: none; margin-left: 15px; margin-bottom: 25px; }
				#VentajasSolutions li { position: relative; display: block; font-size: 0.85rem; color: #525252; padding:5px 0 5px 15px;  }
				#VentajasSolutions li::before { content: "\2022"; position: absolute; top: 3px; left:0; color: #9AC774;}
				#VentajasSolutions h3 {  display: block; font-family: "Muli-light", Arial, Helvetica, sans-serif;}
				


		#ContentInterna aside { width: 300px; display: inline-block; vertical-align: top; text-align: left; }
		#AboutUs #ContentInterna aside { width: 430px; }

		#ContentInterna aside img { max-width: 100%; display: block; }
			.DestacadoVerde { display: block; padding: 25px; background-color: #ACD15F; }
			.DestacadoVerde p,
			.DestacadoVerde h2 { display: inline-block; font:1.1rem "Muli-italic", Arial, Helvetica, sans-serif; line-height: 1.5em !important; color: #fff; }
			.DestacadoVerde h2 { font-weight: bold; }
			
			#NavSolution { display: inline-block; }	
				#NavSolution ul { list-style: none; }
				#NavSolution li { display: block; margin: 3px 0;  padding-right: 10px; }
				#NavSolution li:first-child { margin-top: 0 !important;  }	
				#NavSolution li:last-child { margin-bottom: 0 !important;  }	
				#NavSolution a { font:0.85rem "Muli-extralight", Arial, Helvetica, sans-serif; color: #000; display: block; border-left: 4px solid #9AC774;
								-webkit-transition: box-shadow ease-out 0.4s;									 
								transition: box-shadow ease-out 0.4s; }	
				#NavSolution h3 {  padding:6px 0 3px 7px; border-left: 2px solid #fff; }	

			/*#Solutions #NavSolution { width: 100%; max-width: 300px; margin-top: 10px; }*/

				/*Desktop*/
				.Desktop #NavSolution a:hover { box-shadow: inset 400px 0 0 0 #D5E8AF; }
				

				/*select*/
				#NavSolution li.select a { box-shadow: inset 400px 0 0 0 #D5E8AF;}
				/*.......*/

	#MapaSitio { background-color: #f2f2f2;}
	#MapaSitio .Viewport { padding: 30px 0 30px 0; background-color: #f2f2f2; text-align: left; }	
		#ContentMapaSitio { border-left: 5px solid #ACD15F; padding-left: 20px; }
			
			#LogoMapaSitio { width: 100px; display: block; margin-bottom: 20px; }
			#LogoMapaSitio img { max-width: 100%; display: block;   }

			#NavMapaSitio > ul { list-style: none; display: inline-block; vertical-align: top; margin-right: 50px; }
			#NavMapaSitio > ul > li { display: block; margin-bottom: 10px; }
			#NavMapaSitio > ul > li > a { display: block; font:0.6rem "Muli-semibold", Arial, Helvetica, sans-serif; color: #333; padding-bottom: 10px;}
			#NavMapaSitio a { -webkit-transition: color ease-out 0.4s;									 
							  transition: color ease-out 0.4s;}

			#NavMapaSitio > ul ul {  list-style: none; display: inline-block; vertical-align: top; margin-right: 25px; }
			#NavMapaSitio > ul ul li { display: block; margin: 6px 0; }
			#NavMapaSitio > ul ul li a { display: block; font:0.7rem "Muli-regular", Arial, Helvetica, sans-serif; color: #333; padding: 3px 0;}

			/*Desktop*/
			.Desktop #NavMapaSitio a:hover { color: #ACD15F; }

/*footer*/
.Interna footer.General { position: relative; z-index:0; bottom: auto; padding: 10px 0 20px 0; }

/*DETALLE SOLUTIONS*/
/*main*/
	#IntroSolution { width: 100%; text-align: left; background: linear-gradient(to right, #F2F2F2 50%, #fff 50%); border-bottom: 15px solid #fff; }
		#IntroSolution .Viewport { display: table;}
			#IntroSolution header { display: table-cell; vertical-align: middle; padding: 15px 70px 15px 0;  background-color: #F2F2F2; }
			#IntroSolution h1 { font:normal 2.6rem "Muli-extralight", Arial, Helvetica, sans-serif; color: #525252;}
			#IntroSolution p { display: block; margin: 10px 0; font:normal 1.5rem "Muli-extralightitalic", Arial, Helvetica, sans-serif; line-height: 1.3em !important; color: #525252; }

			#IntroSolution aside { display: table-cell; vertical-align: top; width: 300px; background-color: #fff; }
			

	#ContentInnovation {  background-color: #fff;}
		.ModuloSolution {  text-align: left; }
		.ModuloSolution .Viewport { display: table; width: 100%; background-color: #fff;}
		
		/*Branding..........................................*/
		#BrandStudy .Viewport { background: #fff url(imagenes/internas/branding/branding-opportunity.jpg) no-repeat 100% 50%; background-size: auto 100%; }
		#SegmentationStudy .Viewport { background: #fff url(imagenes/internas/branding/segmentation.jpg) no-repeat 0 50%; background-size: auto 100%; }

		/*Custom Experience Understanding..........................................*/
		#CustomExperienceStudy .Viewport { background: #fff url(imagenes/internas/ceu/customer-experience.jpg) no-repeat 100% 50%; background-size: auto 100%; }
		#CustomExperienceStudy2 .Viewport { background: #fff url(imagenes/internas/ceu/customer-experience-2.jpg) no-repeat 0 50%; background-size: auto 100%; }

		/*Innovation..........................................*/
		#FindingOpportunities .Viewport { background: #fff url(imagenes/internas/innovation/finding-opportunities.jpg) no-repeat 100% 50%; background-size: auto 100%; }
		#PrioritizingChoosing { background-color: #fafafa;  }
		#PrioritizingChoosing .Viewport { background: #fafafa url(imagenes/internas/innovation/prioritizing-choosing.jpg) no-repeat -100px 50%; background-size: auto 100%;}
		#Optimizing { background-color: #fff; }
		#SolutionDesign .Viewport {background: #fff url(imagenes/internas/innovation/solutions-design.jpg) no-repeat -100px 50%; background-size: auto 100%;}
		
		/*Comunication Packaging*/
		#BehaviouralDigitalCampaign .Viewport { background: #fff url(imagenes/internas/comunication-packaging/behaviorual-digital-campaign.jpg) no-repeat 100% 50%; background-size: auto 100%; }
		#PackTest .Viewport { background: #fff url(imagenes/internas/comunication-packaging/pack-test.jpg) no-repeat 0 50%; background-size: auto 100%; }

		/*PriceSimulator*/
		#PriceSimulator .Viewport { background: #fff url(imagenes/internas/price-line-strategy/price-line-simulator.jpg) no-repeat 100% 50%; background-size: auto 100%; }
		#PriceSimulator2 .Viewport { background: #fff url(imagenes/internas/price-line-strategy/price-line-simulator-2.jpg) no-repeat 0 50%; background-size: auto 100%; }

		/*Shopper Understanding*/
		#RetailStudy .Viewport { background: #fff url(imagenes/internas/shopper-understanding/retail-opportunity-study.jpg) no-repeat 100% 50%; background-size: auto 100%; }
		#ShopperStudy .Viewport { background: #fff url(imagenes/internas/shopper-understanding/shopper-study.jpg) no-repeat 0 50%; background-size: auto 100%; }
		#PriceLine .Viewport { background: #fff url(imagenes/internas/shopper-understanding/price-line-strategy-simulator.jpg) no-repeat 100% 50%; background-size: auto 100%; }

		/*Predictive Analytics................................*/
		#MeasureReturn .Viewport { background: #fff url(imagenes/internas/predictive-analytics/measure-return.jpg) no-repeat 100% 50%; background-size: auto 100%;}
		#ReadingSocialMedia .Viewport { background: #fafafa url(imagenes/internas/predictive-analytics/reading-social-media.jpg) no-repeat 0% 50%; background-size: auto 100%;}
		#OptimizePricing .Viewport { background: #fff url(imagenes/internas/predictive-analytics/optimizing-pricing.jpg) no-repeat 100% 50%; background-size: auto 100%;}
		#SeizeLocation .Viewport { background: #fff url(imagenes/internas/predictive-analytics/seizelocation.jpg) no-repeat 0% 50%; background-size: auto 100%;}
		/*.........................................................*/

			.SolutionTxt { display: table-cell; vertical-align: top; width: 55%;  }
			.SolutionFoto { display: table-cell; vertical-align: top; width: 45%;  }

			.doble .SolutionTxt.left  { width: 45%; }
			.doble .SolutionTxt.right { width: 65%; }
			
			.SolutionTxt.left { padding: 40px 35px 40px 0;}
			.SolutionTxt.right { padding: 40px 0 40px 35px;}
				.SolutionTxt h2 { font:normal 2rem "Muli-extralight", Arial, Helvetica, sans-serif; color: #ACD15F; padding-left: 10px; border-left: 5px solid #ACD15F;}
				.SolutionTxt h2 em { font-style: normal; font-family: "Muli-italic", Arial, Helvetica, sans-serif; } 
				.SolutionTxt p.General { font-size: 1.1rem !important; margin: 20px 0; }
				.SolutionTxt a { margin-right: 20px; }	

				ul.ListaDetalleSolucion { list-style: none; padding-left: 50px; }
				ul.ListaDetalleSolucion > li { position: relative; display: block; font:normal 1.05rem "Muli-light", Arial, Helvetica, sans-serif; color: #000; padding: 3px 0 3px 15px; margin-bottom: 15px;	}
				ul.ListaDetalleSolucion > li::before { content: "\2022"; position: absolute; top: 3px; left: 0;  color: #9AC774;}

				ul.ListaDetalleSolucion ul { list-style: none; }
				ul.ListaDetalleSolucion ul > li { position: relative;  padding: 3px 0 3px 10px;  font-family: "Muli-extralight", Arial, Helvetica, sans-serif;}
				ul.ListaDetalleSolucion ul > li::before { content: "›"; position: absolute; top: 3px; left: 0;}

			.SolutionFoto { position: relative; }
				.EpigrafeFoto { position: absolute; background: rgba(146,180,78,0.7); padding: 20px 25px; font:normal 1.05rem "Muli-italic", Arial, Helvetica, sans-serif; color: #fff; text-align: left; }
				.SolutionFoto.left .EpigrafeFoto { bottom: 0; left: 0;}
				.SolutionFoto.right .EpigrafeFoto { bottom: 0; right: 0;}

		#AccesoInterna { text-align: center; padding: 35px 0; }
			#AccesoInterna p { margin: 0 auto;  font:normal 1.6rem "Muli-light", Arial, Helvetica, sans-serif; color: #525252; margin-bottom: 15px; }
			#AccesoInterna a { margin: 0 15px; }

			a[title="Read more"] { display: none; }

/*ABOUT US*/
/*main*/
	#AboutUs #IntroInterna header { right: 250px; }
	#AboutUs #ContentIntro figure { background: url(imagenes/internas/foto-about-us.jpg) no-repeat 50% 50%; background-size: cover;  }

	#AboutUs ul.General { margin-top: 15px; }
	p#PaisesOperate { display: block; font:normal 2.2rem "Muli-light", Arial, Helvetica, sans-serif; line-height: 1em !important; margin-bottom: 20px; }
	
	p#ContactPhone { font:normal 1.1rem "Muli-italic", Arial, Helvetica, sans-serif; color: #525252;   }
	p#ContactPhone strong { font:bold 1.25rem "Muli-regular", Arial, Helvetica, sans-serif; display: inline-block; vertical-align: top; padding-right: 10px;}

	#WhoWeAre { padding-bottom: 50px; }
		#WhoWeAre header { width: 100%; padding: 20px 70px 10px 70px; }	
			#WhoWeAre h2 { display: block; font:2rem "Muli-semibold", Arial, Helvetica, sans-serif; color: #525252; text-align: left;}
		
		#ContentWoWeAre { padding: 0 0 30px 70px; }
			#ListaDirectiva { list-style: none; text-align: left; }
			#ListaDirectiva li { display: inline-block; vertical-align: top; width: 50%; } 
				#ListaDirectiva figure { display: inline-block; vertical-align: middle; width: 160px; }
				#ListaDirectiva img { max-width: 100%; display: block; }
				#ListaDirectiva figcaption { display: block; font:1.3rem "Muli-semibold", Arial, Helvetica, sans-serif; color: #fff; background-color: #ACD15F; padding: 15px; }
				#ListaDirectiva p.Bio { display: inline-block; vertical-align: middle; width: calc(100% - 160px);  padding: 0 30px 0 20px; font:normal 0.9rem "Muli-light", Arial, Helvetica, sans-serif; line-height: 1.5em !important;	}

			.DestacadoGris { display: block; margin: 30px 0; padding: 25px 20px; font:normal 1.2rem "Muli-light", Arial, Helvetica, sans-serif; background-color: #F2F2F2; }

			#ListaClients { list-style: none; width: 100%; margin: 0 auto; padding: 40px 0; }
				#ListaClients li { width: 16.66%; display: inline-block; vertical-align: middle; text-align: center; padding:30px 15px; }
				#ListaClients img { max-width: 100%; margin: 0 auto; display: block; }

			.DestacadoWe { display: inline-block; vertical-align: top; width: 50%; text-align: left;}
			.DestacadoWe p {display: block;  font-size: 1.1rem; line-height: 1.5em !important; color: #525252; padding-right: 30px; }
			.DestacadoWe strong { font-size: 1.7rem; color: #ACD15F; display: block; }

/*CONTAC US*/
/*modal*/
#ModalEnvio { position: fixed; z-index: 9999; top:0; left:0; width: 100%; height: 100%; background: rgba(255,255,255,0.8); display:none;}
    .ContentModal { position: absolute; top:50%; left:50%; width: 300px; padding: 20px; text-align:center; border:1px solid gray; background-color: #fff;
                    -webkit-transform:translate(-50%, -50%);
					transform:translate(-50%, -50%);}
		#ModalForm {}		
			#ModalForm span { display:block; width:32px; height:32px; margin:0 auto; }
			#ModalForm div.Ok span { background:url(imagenes/icono-ok.svg) no-repeat center center;}
			#ModalForm div.Fail span { background:url(imagenes/icono-fail.svg) no-repeat center center;}
			#ModalForm p { display:block; font-size:1.3rem; color:#000; margin:10px auto;}
			
			a#BtnAceptarForm { background:none; cursor:pointer; font-size:1.2rem; color:#1F9999; border:1px solid #1F9999; padding:5px; margin-top:10px;}
			
#ModalEnvio.open { display:block;}

/*main*/
#ContacUs #IntroInterna header { right: auto; left: 50%; margin-left: -100px; }

#FormContacto { width: 100%; max-width: 850px; padding:80px 0; margin:0 auto;  }      

	#FormContacto div { width: 50%; display: inline-block; vertical-align: top; padding: 10px; }
	    #FormContacto input[type="text"],
	    #FormContacto input[type="email"],
	    #FormContacto textarea { width:100%; font:1rem "Muli-regular", Arial, Helvetica, sans-serif; border:1px solid #999;  padding:10px; background-color:#FFF;  margin-bottom:10px;}
	    
		fieldset.captcha-group { width:100%; display:block;}
			input#captcha { display:inline-block; vertical-align:top; width:calc(100% - 100px) !important;}
			fieldset.captcha-group span { display:inline-block; vertical-align:top; width:100px;}
	    
	    #FormContacto textarea { height:190px; overflow:auto; margin-bottom:10px;}
	    
	    #FormContacto input[type="submit"] { width:100%; background:none; border:none; cursor:pointer; text-align:right; font-size:1.3rem; color:#ACD15F;}
	    
	    /*focus*/
	    #FormContacto input[type="text"]:focus,
	    #FormContacto input[type="email"]:focus,
	    #FormContacto input[type="tel"]:focus,
	    #FormContacto textarea:focus { outline:1px solid #ACD15F;}   
	        
	    /*Desktop*/
	    .Desktop #FormContacto input[type="text"]:hover,
	    .Desktop #FormContacto input[type="email"]:hover,
	    .Desktop #FormContacto input[type="tel"]:hover,
	    .Desktop #FormContacto textarea:hover { border-color:#ACD15F; }
	    
	    .Desktop #FormContacto input[type="submit"]:hover { color:#000;}
	    /*.......*/

p.General { text-align:justify;
			-webkit-hyphens: auto;
			-moz-hyphens: auto;
			-ms-hyphens: auto;
			-o-hyphens: auto;					     
			hyphens: auto;}

}

/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*ANCHOS///////////////////////////////////////////////////////////////////////////////////////////////*/
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@media (max-width: 1920px) {
html { font-size: 15px; /*1rem = 15px*/} 
	.Viewport { max-width:1360px;}	   
}

@media (max-width: 1470px) { 
	.Viewport { max-width:1200px;}	

/*ABOUT US*/
/*main*/
	#ListaDirectiva figure,
	#ListaDirectiva p.Bio { vertical-align: top; }

	.DestacadoGris span { display: block; }

/*SOLUTIONS*/
/*main*/
	#Solutions #ContentIntro div { padding-top: 40px; padding-bottom: 40px; }
}

@media (max-width: 1220px) { 
/*header*/
	.fila h2 { font-size: 1.1rem; }
}

@media (max-width: 1300px) { 
.Viewport { padding:0 30px; max-width:none;}

/*header*/
header.General { }	
	#Home #Logo,
	#Home #Menus { width: 220px; }

	#Slogan {font-size: 1.1rem; padding-top:15px; padding-bottom:15px;}	
	#MenuGeneral > li > a { padding-top:15px; padding-bottom:15px;}
	
#Preguntas { width:calc(100% - 250px);}

/*INTERNA*/
/*header*/
.Interna header.General .Viewport { padding-left: 15px; padding-right: 5px; }
	.Interna #Logo { width: 155px; padding: 0; }
	.Interna a#BtnMobile { margin-top: 10px; }

	.Interna #Menus { top: 77px; }

/*main*/
	#IntroInterna .Viewport,
	#ContentInterna .Viewport { padding-left: 0 !important; padding-right: 0 !important; }

	#ContentInterna header,
	#MapaSitio .Viewport { padding-left: 35px !important; padding-right: 35px !important; }

/*ABOUT US*/
/*main*/
	#ContentWoWeAre { padding-right: 35px !important; padding-left: 35px !important; }

	.DestacadoWe p { font-size: 1rem;	}
	.DestacadoWe strong { font-size: 1.5rem;}

/*DETALLE SOLUTION*/
	#IntroSolution .Viewport { padding: 0; }
		#IntroSolution header { padding-left: 35px; padding-right: 35px; }
		.SolutionTxt.left { padding-left:0; padding-right: 35px; }
}

@media (max-width: 1200px) {
/*INTERNA*/
/*main*/
	#IntroSolutions {display: block; width: 100%; padding-right: 0; margin-bottom: 25px;}
	#VentajasSolutions {display: block; width: 100%; padding-left: 0; }

/*DETALLE SOLUTION*/
/*main*/
	#IntroSolution header { padding-top: 30px; padding-bottom: 30px; }
	#IntroSolution aside { padding-left: 0; vertical-align: middle; }
}

@media (max-width: 1100px) {
/*DETALLE SOLUTIONS*/
/*main*/
	.SolutionTxt,
	.SolutionFoto { width: 50%;  }
	.SolutionTxt { background-color: #fff; }
	.SolutionTxt.left { padding-left: 35px;}
}

@media (max-width: 1023px) { 
.SafeZone { display:block;}

/*header*/
header.General { background-color:#FFF;}
	#Logo { display:inline-block; vertical-align:top; width:200px; padding-right:5px; padding-bottom:5px; padding-top:5px;}
		#Logo a { padding-top:15px; padding-bottom:15px;}
	
	a#BtnMobile { position:relative;  z-index:9100; display:inline-block; vertical-align:top; width:35px; height:35px; margin-top:15px; margin-right: 15px; cursor:pointer;}
		a#BtnMobile span { -webkit-transition: color 0.3s ease-in-out;
						    transition: color 0.3s ease-in-out;}
		#Barritas { display:block; width:100%; height:100%; background:url(imagenes/icono-menu-open.svg) no-repeat center center;}
		#Equis { display:none; width:100%; height:100%; background:url(imagenes/icono-menu-close.svg) no-repeat center center; }	
			
	#Menus { position:fixed; overflow-x: hidden; overflow-y:auto; z-index:9000; top:92px; left:0; width:100%; max-width:250px; background:rgba(255, 255, 255, 0.9);
			-webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);			
			clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
			-webkit-transition: -webkit-clip-path 0.3s ease-in-out;
			transition: clip-path 0.3s ease-in-out;}

		#Home #Logo { width: 200px; } 
		#Home #Menus { width: 100%; }
		
		p#Slogan {}
		
		#MenuGeneral { width:100%;}						
			#MenuGeneral li { display:block !important; height:auto; margin:0; text-align:left;  }					
			#MenuGeneral a { width:100%; font-size:1.7rem; padding:10px 15px;}

		
/*main*/
main { overflow-x: hidden; width:100%; height:100%;}
	#Preguntas { width:100%;}
	
	a#BtnPulsar { right: 50px;}
	
	a#BtnIdioma { top: 20px;}
	

/*INTERNA*/
/*header*/
	#IntroInterna header { position: relative !important; z-index: 0; top: auto !important; right: auto !important; text-align: left; background-color: #fff;}
	#IntroInterna header h1 { width: 100%; padding:0 15px; }
	
	#ContentIntro div { padding: 70px 25px; }
	#ContentIntro blockquote p { font-size: 1rem; }

	#ContentInterna header,
	#AboutUs #ContentInterna .Viewport > header { display: block; width: 100%; padding-top: 0; }
		#IntroSolutions,
		#VentajasSolutions { padding:0; }

	#ContentInterna aside,
	#AboutUs #ContentInterna aside { display: block; width: 100%; }

	#NavSolution { max-width: none !important; padding: 25px 25px 0 25px !important;}
	#Solutions #NavSolution { padding: 25px 25px 35px 25px !important; }
		#NavSolution li { width: 33.33% !important; display: inline-block !important; vertical-align: top !important; }

	.DestacadoVerde { padding-left: 25px; padding-right: 25px; }
	#ContentInterna header, 
	#MapaSitio .Viewport { padding-left: 25px !important; padding-right: 25px !important;}

/*SOLUTIONS*/
/*main*/
	#Solutions #ContentIntro,
	#Solutions #ContentIntro header,
	#Solutions #ContentIntro aside { display: block; width: 100% !important; }
	#Solutions #NavSolution { padding-top: 15px; padding-bottom: 15px !important; }

	#Solutions #ContentInterna .Viewport > header { display: block; width: 100%; }
	#Solutions #ContentInterna .Viewport > aside { display: none; }

/*DETALLE SOLUTION*/
/*main*/
	#IntroSolution .Viewport,
	#IntroSolution header,
	#IntroSolution aside { display: block; width: 100% !important; }

	#IntroSolution aside { padding-left: 5px; }

	.ModuloSolution { }
	.ModuloSolution:nth-child(odd) { background-color: #f2f2f2 !important;}
	.ModuloSolution .Viewport { display: block; width: 100%; padding: 35px 0; background: none !important;}	
		.SolutionTxt { display: block; width: 100% !important; padding: 0 30px !important; background-color: transparent; }	
		.SolutionFoto { display: none !important; }
		.doble .SolutionTxt { width: 100%; }

	#AccesoInterna { padding-top: 5px; }

/*ABOUT US*/
/*main*/
#AboutUs #IntroSolutions { padding-top: 30px; }

	#ZonaOperacion { display: inline-block; vertical-align: top; width: auto; padding-right: 30px;  border-right: 1px solid #fff;}
	#TelefonoContacto { display: inline-block; vertical-align: top;  padding-left: 30px; }
	p#ContactPhone strong { display: block; margin-top: 7px; padding-right: 0; }

	#WhoWeAre {}
		#WhoWeAre header { display: block; padding: 30px 25px 15px 25px !important; }
		#ContentWoWeAre { padding-left: 25px !important; padding-right: 25px !important; }
		#ListaClients { padding-top: 10px; }


/*CONTACT US*/
/*main*/
	#FormContacto { padding: 40px 20px; }
	#ContacUs #IntroInterna header { left: auto; margin-left: 0;}
	#ContacUs #IntroInterna header h1 { width: 100%; text-align: center;}		
}

@media (max-width: 1023px) and (max-height: 468px) {
/*header*/
	/*fixedflex*/
	.fixedflex #MenuGeneral { top:0; 
							 -webkit-transform: none;
							 transform: none;}
	/*.......*/
}

@media (max-width: 900px) { 
/*main*/
	.fila h2 { font-size:1rem;}

/*ABOUT US*/
/*main*/
#ContentWoWeAre { padding-bottom: 0; }
	#ListaDirectiva li { display: block;  width: 100%; margin-bottom: 25px;}
	#ListaDirectiva figure,
	#ListaDirectiva p.Bio { vertical-align: middle; padding-right: 0; }
	#ListaDirectiva figcaption { font-size: 1.1rem; }

	.DestacadoGris span { display: inline-block; }

	#ListaClients li { width: 25%; }
}

@media (max-width: 800px) { 
/*INTERNA*/
/*main*/
	#ContentIntro figure { width: 200px; }

	#NavMapaSitio > ul > li > a { font-size: 0.6rem; }
	#NavMapaSitio > ul ul li a { font-size: 0.6rem;}

/*ABOUT US*/
/*main*/
	#ListaDirectiva figure { width: 120px;vertical-align: top;  }
	#ListaDirectiva p.Bio { width: calc(100% - 120px); vertical-align: top; }

	.DestacadoWe {display: block; width: 100%; text-align: left; margin-bottom: 15px;}
}

@media (max-width: 660px) { 
/*INTERNA*/
/*main*/
	#NavMapaSitio > ul { width: 100%; }
		ul#MapaRaiz li { width: 33.33%; display: inline-block; vertical-align: top;  }	
		#NavMapaSitio ul { margin-right: 0 !important;}
		ul#MapaSolutions ul { width: 50%;  display: inline-block; vertical-align: top;  }

/*SOLUTIONS*/
/*main*/
	#Solutions #NavSolution { padding-top: 10px !important; padding-bottom: 20px !important; }
	#NavSolution li	{ width: 50% !important; }

/*CONTACT US*/
/*main*/
	#FormContacto div {width: 100%; display:block; padding: 0;}
}

@media (max-width: 600px) { 
#Home { height: auto; }

/*main*/
#Home main { padding-top:120px;}
	a#BtnPulsar { position: absolute; }
	#Preguntas { position:relative; display:block; top:auto; right:auto; width:100%; height:auto;}
		#Preguntas section { width:100%;}
		#Preguntas header { position:relative; z-index:0; top:auto; left:auto; margin:0 auto;}
		.fila > div { display: block; width:100%; height:50px;}
		.fila a { width:100%; margin:0; left:0; padding:5px 30px;
				  -webkit-transform: none;
				  transform: none; }
				 
		#q3, #q4 {width:100%; margin:0;}
		
		#q0 a {}
		#q1 a {-webkit-animation-delay: 0.15s; animation-delay: 0.15s;}
		#q2 a {-webkit-animation-delay: 0.3s; animation-delay: 0.3s;}
		#q3 a {-webkit-animation-delay: 0.45s; animation-delay: 0.45s;}
		#q4 a {-webkit-animation-delay: 0.6s; animation-delay: 0.6s;}
		#q5 a {-webkit-animation-delay: 0.75s; animation-delay: 0.75s;}
		#q6 a {-webkit-animation-delay: 0.9s;  animation-delay: 0.9s;}
		#q7 a {-webkit-animation-delay: 1.05s; animation-delay: 1.05s;}
	
footer.General { position:relative; bottom:auto; padding:15px; left:0; text-align: center; background-color:#000;}
	p#Copy,
	p#CreacionUno { float: none; display: block; text-align: center; }

	p#CreacionUno { margin-top: 20px; }

/*DETALLE SERVICIOS*/
/*main*/
	ul.ListaDetalleSolucion { padding-left: 25px; }
}

@media (max-width: 550px) { 
/*ABOUT US*/
/*main*/
	#ZonaOperacion { display: block; padding-right: 0; border-right: none; border-bottom: 1px solid #fff; padding-bottom: 5px; }
	#TelefonoContacto { display: block; padding-left: 0; padding-top: 15px; }

	#ListaClients li { width: 33.33%; }
}

@media (max-width: 500px) { 
/*INTERNA*/
/*main*/
	#ContentIntro,
	#ContentIntro div,
	#ContentIntro figure { display: block; width: 100%; }

	#ContentIntro figure { height: 200px; }

	#ContentInterna header { padding-bottom: 0; }	

	#ContentIntro div {  padding: 35px 25px;}
}


@media (max-width: 450px) { 
.Viewport { padding:0 15px;}

/*main*/
	a#BtnPulsar { position: absolute; bottom:auto; top:50%; left:50%; margin:-65px 0 0 -65px;}
	a#BtnPulsar div.close { top: 15px; right: 20px;}

	/*open*/
	main.open #BtnPulsar { left:auto; right:-25px; margin:0;}
	/*....*/

	#Preguntas h1 { font-size:1.2rem;}
	.fila > div { height:40px;}
	.fila a { padding:5px 15px;}
	.fila h2 {font-size: 0.8rem;}

/*INTERNAS*/
/*main*/
	ul#MapaRaiz li { width: 100%; display: block;}	
	ul#MapaSolutions ul { width: 100%;  display: block;}

/*SOLUTIONS*/
/*main*/
	#NavSolution li	{ width: 100% !important; }
	#NavSolution a { font-size: 1rem !important; }

/*DETALLE SOLUTIONS*/
/*main*/
	#IntroSolution p { font-size: 1.2rem; }
	.SolutionTxt a { width: 100%; display: block; margin-bottom: 10px;}
	#AccesoInterna a { display: block; width: 200px; margin:0 auto 10px auto; }
	a[title="Read more"] { display: none !important; }

/*ABOUT US*/
/*main*/
	#ListaDirectiva figure { display: block; width: 100%; background-color: #ACD15F; }
	#ListaDirectiva img { width: 100px; display: inline-block; vertical-align: middle; }
	#ListaDirectiva figcaption { display: inline-block; vertical-align: middle; width: calc(100% - 100px); }
	#ListaDirectiva figcaption br { display: none; }
	#ListaDirectiva p.Bio { display: block; width: 100%; padding-top: 15px; padding-left: 0; }

	#ListaDirectiva .SeparadorArcoiris { display: none; }

	#ListaClients { padding:0; }
	#ListaClients li { width: 50%; }

	.DestacadoGris { margin-bottom: 5px; }

/*CONTACT US*/
/*main*/
#FormContacto { padding-left: 20px; padding-right: 20px; }
}

@media (max-height: 500px) {
/*header*/
	a#BtnPulsar { right: 35%; bottom: 35%;}
	.fila > div { height: 70px; }
	.fila h2 { font-size: 1rem }

/*footer*/
footer.General { position:relative; bottom:auto; padding:15px; left:0; text-align: center; background-color:#000;}	
}

@media (max-width: 780px) and (max-height: 500px) {

#Home { height: auto; }

/*main*/
#Home main { padding-top:120px;}
	#Preguntas { position:relative; display:block; top:auto; right:auto; width:100%; height:auto;}
		#Preguntas section { width:100%;}
		#Preguntas header { position:relative; z-index:0; top:auto; left:auto; margin:0 auto;}
		.fila > div { display: block; width:100%; height:50px;}
		.fila a { width:100%; margin:0; left:0; padding:5px 30px;
				  -webkit-transform: none;
				  transform: none; }
				 
		#q3, #q4 {width:100%; margin:0;}
		
		#q0 a {}
		#q1 a {-webkit-animation-delay: 0.15s; animation-delay: 0.15s;}
		#q2 a {-webkit-animation-delay: 0.3s; animation-delay: 0.3s;}
		#q3 a {-webkit-animation-delay: 0.45s; animation-delay: 0.45s;}
		#q4 a {-webkit-animation-delay: 0.6s; animation-delay: 0.6s;}
		#q5 a {-webkit-animation-delay: 0.75s; animation-delay: 0.75s;}
		#q6 a {-webkit-animation-delay: 0.9s;  animation-delay: 0.9s;}
		#q7 a {-webkit-animation-delay: 1.05s; animation-delay: 1.05s;}
}
}




/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*ANIMACIONES///////////////////////////////////////////////////////////////////////////////////////////////*/
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@-webkit-keyframes fade {
   0% { opacity:0.5;
   		-webkit-transform:scale(0);}  		
	
	100% { opacity:1;
			-webkit-transform:scale(1);}
}

@keyframes fade {
    0% { opacity:0.5;
		transform:scale(0);}
		
	100% { opacity:1;
			transform:scale(1);}
}


@-webkit-keyframes blink {
   0% { opacity:0; 
		-webkit-transform:scale(0);}  
		
	100% { opacity:1;
	 	-webkit-transform:scale(0.7);}
}

@keyframes blink {
    0% { opacity:0; 
		transform:scale(0);}  
		
	100% { opacity:1;
		transform:scale(0.7);}
}

/*Frases animadas.................................................*/
@keyframes t1 {
	/*transicion de 1% 0 0.3s*/
	0% { opacity:0; visibility:hidden; transform: translate(-20px, -50%);}	
	1% { opacity:1; visibility:visible;	transform: translate(0, -50%);}
	/*---------*/
	19% { opacity:1; visibility:visible; transform: translate(0, -50%);}
	20% { opacity:0; visibility:hidden;	transform: translate(-20px, -50%);}
	/*---------*/
	
	100% { opacity:0; visibility:hidden; transform: translate(-20px, -50%);}
}

@keyframes t2 {
	0% { opacity:0; visibility:hidden;transform: translate(-20px, -50%);}
	/*---------*/
	20% { opacity:0; visibility:hidden;	transform: translate(-20px, -50%);}
	21% { opacity:1; visibility: visible; transform: translate(0, -50%);}
	/*---------*/
	39% { opacity:1; visibility: visible; transform: translate(0, -50%);}
	40% { opacity:0; visibility:hidden;	transform: translate(-20px, -50%);}
	
	100% { opacity:0; visibility:hidden; transform: translate(-20px, -50%);}
}

@keyframes t3 {
	0% { opacity:0; visibility:hidden;  transform: translate(-20px, -50%);}	
	/*---------*/
	40% { opacity:0; visibility:hidden; transform: translate(-20px, -50%);}
	41% { opacity:1; visibility: visible; transform: translate(0, -50%);}
	/*---------*/
	59% { opacity:1; visibility: visible; transform: translate(0, -50%);}
	60% { opacity:0; visibility:hidden; transform: translate(-20px, -50%);}
	100% { opacity:0; visibility:hidden; transform: translate(-20px, -50%);}
}

@keyframes t4 {
	0% { opacity:0; visibility:hidden;  transform: translate(-20px, -50%);}	
	/*---------*/
	60% { opacity:0;  visibility:hidden; transform: translate(-20px, -50%);}
	61% { opacity:1; visibility:visible; transform: translate(0, -50%);}
	/*---------*/
	79% { opacity:1; visibility:visible; transform: translate(0, -50%);}
	80% { opacity:0; visibility:hidden; transform: translate(0, -50%);}
	100% { opacity:0; visibility:hidden; transform: translate(0, -50%);}
}

@keyframes t5 {
	0% { opacity:0; visibility:hidden;  transform: translate(-20px, -50%);}	
	/*---------*/
	79% { opacity:0;  visibility:hidden; transform: translate(-20px, -50%);}
	80% { opacity:1; visibility:visible; transform: translate(0, -50%);}
	/*---------*/
	99% { opacity:1; visibility:visible; transform: translate(0, -50%);}
	100% { opacity:0;  visibility:hidden; transform: translate(-20px, -50%);}
}

/*WEBKIT*/
@-webkit-keyframes t1 {
	0% { opacity:0; visibility:hidden; -webkit-transform: translate(-20px, -50%);}	
	1% { opacity:1; visibility:visible;	-webkit-transform: translate(0, -50%);}
	/*---------*/
	19% { opacity:1; visibility:visible; -webkit-transform: translate(0, -50%);}
	20% { opacity:0; visibility:hidden;	-webkit-transform: translate(-20px, -50%);}
	/*---------*/	
	100% { opacity:0; visibility:hidden; -webkit-transform: translate(-20px, -50%);}
}

@-webkit-keyframes t2 {
	0% { opacity:0; visibility:hidden; -webkit-transform: translate(-20px, -50%);}
	/*---------*/
	20% { opacity:0; visibility:hidden;	-webkit-transform: translate(-20px, -50%);}
	21% { opacity:1; visibility: visible; -webkit-transform: translate(0, -50%);}
	/*---------*/
	49% { opacity:1; visibility: visible; -webkit-transform: translate(0, -50%);}
	50% { opacity:0; visibility:hidden;	-webkit-transform: translate(-20px, -50%);}
	100% { opacity:0; visibility:hidden; -webkit-transform: translate(-20px, -50%);}
}

@-webkit-keyframes t3 {
	0% { opacity:0; visibility:hidden;  -webkit-transform: translate(-20px, -50%);}	
	/*---------*/
	50% { opacity:0; visibility:hidden; -webkit-transform: translate(-20px, -50%);}
	51% { opacity:1; visibility: visible; -webkit-transform: translate(0, -50%);}
	/*---------*/
	74% { opacity:1; visibility: visible; -webkit-transform: translate(0, -50%);}
	75% { opacity:0; visibility:hidden; -webkit-transform: translate(-20px, -50%);}
	100% { opacity:0; visibility:hidden; -webkit-transform: translate(-20px, -50%);}
}

@-webkit-keyframes t4 {
	0% { opacity:0; visibility:hidden;  -webkit-transform: translate(-20px, -50%);}	
	/*---------*/
	75% { opacity:0;  visibility:hidden; -webkit-transform: translate(-20px, -50%);}
	76% { opacity:1; visibility:visible; -webkit-transform: translate(0, -50%);}
	/*---------*/
	99% { opacity:1; visibility:visible; -webkit-transform: translate(0, -50%);}
	100% { opacity:0;  visibility:hidden; -webkit-transform: translate(-20px, -50%);}
}

@-webkit-keyframes t5 {
	0% { opacity:0; visibility:hidden;  -webkit-transform: translate(-20px, -50%);}	
	/*---------*/
	60% { opacity:0;  visibility:hidden; -webkit-transform: translate(-20px, -50%);}
	61% { opacity:1; visibility:visible; -webkit-transform: translate(0, -50%);}
	/*---------*/
	99% { opacity:1; visibility:visible; -webkit-transform: translate(0, -50%);}
	100% { opacity:0;  visibility:hidden; -webkit-transform: translate(-20px, -50%);}
}


