@font-face{ 
	font-family: "NeSansRegular"; 		
	src: url('fonts/NeSans_regular.ttf') format('truetype');
}
@font-face{ 
	font-family: "NeSansMedium"; 		
	src: url('fonts/NeSans_medium.ttf') format('truetype');
}
@font-face{ 
	font-family: "RobRegular"; 		
	src: url('fonts/Rob_regular.ttf') format('truetype');
}
@font-face{ 
	font-family: "ArNarrRegular"; 		
	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;}

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;}

body {   
	margin:0 auto;
	text-align:center; 
	font:normal 11px "NeSansRegular", Arial, Helvetica, sans-serif;
	background-color:#1B345A;
  } 

.clear { clear: both;}	
.breakword { text-align:justify;
			-webkit-hyphens: auto;
			-moz-hyphens: auto;
			-ms-hyphens: auto;
			-o-hyphens: auto;					     
			hyphens: auto;}

.SafeZone { width:100%; height:100%; margin:0 auto; font-size:0;}
	 .Viewport { width:95%; max-width:1230px; /*min-width:1024px;*/ height:100%; margin:0 auto;}

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*HEADER..................................................................................................................................*/ 
header { position:relative; min-width:100%; height:539px; display:inline-block; border-bottom:12px solid #CBD6E8;}
#Home header { background:url(imagenes/fondoheader.jpg) repeat-x 0 0;}
	
	
	#ContentHead { width:100%; height:100%;}
		#ContentHead .Viewport  { padding-top:42px; padding-bottom: 24px; text-align:left;}
		#Home #ContentHead .Viewport  {height:100%;  background:url(imagenes/fotoheader_canvas.jpg) no-repeat right top;}
		
		/*nocanvas*/
		.nocanvas #Home #ContentHead .Viewport { background: url(imagenes/fotoheader.jpg) no-repeat right top;}
		/*........*/
		
			#Logo {}
			#Logo a { display:block; padding-left: 14px; width: 100%;}
				#Home #Logo  { width: 360px;} 
				#Home #Logo a { cursor:default;}
				#Home #Logo a img { max-width: 100%; display: block;}
			
			header h1 { font:normal 35px "RobRegular", Arial, Helvetica, sans-serif; color:#585d64; display:block; margin-bottom: 4px; margin-left:17px;}
			header h2 { display: block; font:normal 22px "RobRegular", Arial, Helvetica, sans-serif; color:#1E2026; display:block; margin-left:17px; margin-bottom: 16px;}
			header p { width: 100%; max-width: 480px; font:normal 16px "RobRegular", Arial, Helvetica, sans-serif; color:#000; display:block; margin-left:17px;}
			header p strong {color: #092c5b;}
			
			#myCanvasContainer { width:400px; height:540px; float:right; margin:-352px 220px 0 0; font-size:25px;}
			
				#myCanvas {}
					.tctooltip { background-color:#000; color:#FFF; font:normal 15px Arial, Helvetica, sans-serif; padding:10px 20px; border-radius:300px;}
				
				#canvasIE { position:relative;  width:400px; height:540px; display:none;}
					#canvasIE div { position:absolute;}
						#Auditamos { top:202px; left:285px;}
						#Cumplimos {  top:80px; left:125px;}
						#Analizamos { top:105px; left:235px;}
						#Asesoramos { top:115px; left:8px;}
						#Vinculo { top:170px; left:125px;}
						#Apuntamos {top:223px; left:35px;}
						#Aportamos { top:297px; left:113px;}
						#Identificamos { top:263px; left:223px;}
						
				#canvasIE div p { position:absolute; z-index:9999; top:0; left:0; width:73px; height:73px; font-size:10px; font-weight:bold; text-align:center; display:block; border:3px solid #28323E; color:#28323E; background-color:#BEBFC3; border-radius:500px;
								 opacity:0;
								 -webkit-transform-origin: 50% 50%;
								 transform-origin: 50% 50%;
								 -webkit-transition: all 0.4s ease-in-out;							  
								 transition: all 0.4s ease-in-out;}
								 
				#canvasIE #Vinculo p { top:19px; left:19px;}
								 
					#canvasIE div p span { display:block;}
					
							#Auditamos span { margin-top:29px;}
							#Cumplimos span { margin-top:17px;}
							#Analizamos span { margin-top:25px;}
							#Asesoramos span { margin-top:19px;}
							#Vinculo span { margin-top:22px;}
							#Apuntamos span { margin-top:17px;}
							#Aportamos span  {margin-top:18px;}
							#Identificamos span { margin-top:25px;}
				
				/*Desktop*/
				.Desktop #canvasIE div:hover p { opacity:1;
													-webkit-transform:  scale(1.5,1.5);	
				/*........*/						transform:  scale(1.5,1.5);}
				
				
				
				
				 
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*CENTER..................................................................................................................................*/  
main { position:relative; width:100%;}
	.NavSocial { list-style:none;}
	main .NavSocial { position:fixed; z-index:9990; top:60px; right:30px;}
		.NavSocial li { position:relative; overflow:hidden; display:block; border:1px solid transparent; border-radius:100px; margin-bottom:5px;}
		.NavSocial li.BtnInstagram { border-color: #ccc;}
		.NavSocial a { width:40px; height:40px; display:block;
						 -webkit-transition:  opacity 0.3s ease-in-out;	
						transition: opacity 0.3s ease-in-out;}	
		li#BtnMobile { display:none;}
		li.BtnInstagram a { background:#ffffff url(imagenes/icono-instagram.jpg) no-repeat 50% 50%;}
		li.BtnLinkedin a { background:#007BB6 url(imagenes/icono-linkedin.jpg) no-repeat 50% 50%;}
		li.BtnFacebook a { background:#3B5999 url(imagenes/icono-facebook.jpg) no-repeat 50% 50%;}
		li.BtnTwitter a { background:#00B0ED url(imagenes/icono-twitter.jpg) no-repeat 50% 50%;} 
        li.BtnYoutube a { background:#EA3B36 url(imagenes/icono-youtube.jpg) no-repeat 50% 50%;}

		/*Desktop*/
		.Desktop .NavSocial a:hover { opacity:0.7;}
		/*.......*/	

	.nav-fav { position:fixed; z-index:9990; bottom:30px; right:30px;}
	.nav-fav a { position: relative; z-index: 200; width: 72px; height: 72px; display: block; background: url(imagenes/ic-wapp-fav.svg) no-repeat 0 0; background-size: 100% auto; border-radius: 50%; box-shadow: 0 0 4px #000;
				animation: bounce 2s ease infinite;}
	
	.halo-wapp { position: absolute; z-index: 100; width: 100%; top: 0; left: 0; aspect-ratio: 1/1; background-color:rgba(27, 215, 65, 0.4); border-radius: 50%;
				animation: halo 2s ease infinite;}
	
	#FabWapp { transition: bottom 1s ease-out;}
	
	#SeparadorMain { position:absolute; top:0; left:0; z-index:9980;  min-width:100%; height:196px; background:url(imagenes/triangulobottom.png) no-repeat 50% 0;}
		#SeparadorMain .Viewport {}
			#NavPrincipal { float:left; margin-top:10px;}
				#NavPrincipal > ul { list-style:none; margin-left:50px;}
				#NavPrincipal ul > li { display:inline-block; vertical-align:middle; margin-left:30px;}
				#NavPrincipal ul > li:first-child { margin-left:0px !important;}
				#NavPrincipal ul > li > a { display:block;  font:normal 20px "RobRegular", Arial, Helvetica, sans-serif; color:#fff; padding: 6px; letter-spacing:0px; text-shadow:0 0 5px #000;
											-webkit-transition: all 0.4s ease-in-out;							  
											transition: all 0.4s ease-in-out;
											cursor: pointer;}

				 /*submenu desktop*/
				 #NavPrincipal ul > li.submenu { position: relative;}
                 #NavPrincipal ul > li.submenu ul { position: absolute; z-index: 200; overflow: hidden; top: 100%; left: 0; text-align: left; width: 320px; max-height: 0; background-color:#353434; list-style:none;
													-webkit-transition: all 0.3s ease-in-out;
													transition: all 0.3s ease-in-out; }

                 #NavPrincipal ul > li.submenu ul li { display: block; margin-left: 0;} 
              
                 #NavPrincipal ul > li.submenu ul a { display:block; font:normal 16px "RobRegular", Arial, Helvetica, sans-serif; color:#fff; padding:10px 12px; letter-spacing:0px; text-shadow:0 0 5px #000;
														-webkit-transition: all 0.4s ease-in-out;							  
														transition: all 0.4s ease-in-out;
														cursor: pointer;}

                /*open*/ 
				#NavPrincipal ul > li.submenu.open > a {background-color: #353434; color: #fff !important;}				
                #NavPrincipal ul > li.submenu.open ul { max-height: 300px; padding-top: 8px; padding-bottom: 8px;}
                /*.....*/
				
				/*Desktop*/
				.Desktop #NavPrincipal a:not(.Select):hover { color:#1E2327; text-shadow:0 0 0 #000;}
				.Desktop #NavPrincipal ul ul a:hover { color:#a0a0a0 !important;}
				/*.......*/
				
				#NavPrincipal a.Select {color:#123275; cursor: pointer;  text-shadow:0 0 0 #000;}
				
			#ContactLines { float: right; }
				#ContactLines .Viewport {}			
					#ContactLines ul { list-style:none; padding-top:10px; margin-left:17px;}
					#ContactLines li { display:inline-block; vertical-align:middle; height:54px; color:#1E3965;}
					#ContactLines li#BtnEmail { margin-right:20px; font-size:14px; }
					#ContactLines li#BtnPhone { font-family:"NeSansMedium", Arial, Helvetica, sans-serif; font-size:14px;}
						#ContactLines li img { vertical-align:middle; width: 35px; margin-right:10px;}
						#ContactLines li#BtnEmail img { border-radius:50%; }
						#ContactLines li a { color:#fff;}
						#ContactLines li a:hover { color:#000;}
						
				#ContactLines div { position:absolute; z-index:9999; top:0; left:0;}
			
			
			#SeparadorMain p { font:normal 28px "RobRegular", Arial, Helvetica, sans-serif; color:#12243F; display:block; padding:29px 48px 0 0; float:right;}
			#SeparadorMain span { display:block;}
	
	#ContentMain { padding-top:50px;}
		#ContentMain .Viewport { background-color:#CBD6E8;}
			#Introduccion { display: flex; align-items: center;}
				#IntroductionPhoto { flex: 0 0 auto; width: 600px; align-self: stretch;}
					#Introduccion img { width: 100%; height: 100%; object-fit: cover; display:block;}
				
				#IntroducionTxt { flex: 1; padding:120px 68px 68px 68px;}				
					p#TituloIntroduccion { font-size: 24px !important; color: #1E3965 !important; display: block; margin-bottom: 8px;}
					p#SubTituloIntroduccion { font-size: 16px !important; color: #1E3965 !important;}
					
					#Introduccion span { font-weight: bold;}						
						#Introduccion p { text-align:justify; font-size:14px; color:#333333;}	
						
						ul#Ejemplos { list-style:none; display:block; text-align:left; margin-block: 24px;}	
							ul#Ejemplos li.TituloEjemplos { font-size:15px; color:#1E2226; margin-bottom: 8px; }			
							ul#Ejemplos li:not(.TituloEjemplos) { font-size:14px; display:block; padding-left: 1em; text-indent: -.7em;}
							ul#Ejemplos li:not(.TituloEjemplos):before {content: "\2022"; color:#4574B4; padding-right:5px;}
									 
			#Valores { width:100%; background:#D7D8DA url(imagenes/fondovalores.jpg) repeat-x 0 0;}
				#ContentValores { width:100%; height:100%; padding:35px 0; background:url(imagenes/separadorvalores.png) no-repeat 43% 0;}								  
					#Valores ul { list-style:none; display:inline-block; vertical-align:top; text-align:left;}	

					#Valores ul#NuestrosValores { width:45%; margin-right:5%; padding-left:100px;}								 
						#Valores li { width:50%; margin-bottom:5px; font-size:15px; color:#1E2226; display:inline-block; vertical-align:middle;}
						#Valores li:not(.TituloValor) { display:block;padding-left: 1em; text-indent: -.7em;}
						#Valores li:not(.TituloValor):before {content: "\2022"; color:#4574B4; padding-right:5px;}
						
						#Valores li.TituloValor { width:100% !important; display:block !important; color:#4574B4;  font:normal 25px "RobRegular", Arial, Helvetica, sans-serif;
												 -webkit-transition: all 0.4s ease-in-out;							  
												transition: all 0.4s ease-in-out;}
							#Valores li.TituloValor a { color:#4574B4;}

					#Valores ul#NuestroProposito { width:45%; margin-right:5%; padding-left:100px;}
						#Valores ul#NuestroProposito li { width: 80%; text-indent: 0px !important; padding-left: 0; color: #1E3965;}
						#Valores ul#NuestroProposito li:before { display: none !important; }
					
					#Valores ul#NuestrosServicios { width:50%;}
						#Valores ul#NuestrosServicios li { width:100%; display: block;}
						#Valores ul#NuestrosServicios li:not(.TituloValor) a { color: #000;}
						#Valores ul#NuestrosServicios li:not(.TituloValor) a::after { content: "+"; font-weight: bold; color: #1E3965; margin-left: 8px;}
						
						/*Desktop*/
						.Desktop #NuestrosValores li.TituloValor:hover { background-position:210px 50%;}
						.Desktop #NuestrosServicios li.TituloValor:hover { background-position:230px 50%;}
						.Desktop #Valores li.TituloValor a:hover { color:#000;}
						/*.......*/
	
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*FOOTER...................................................................................................................................*/
footer.General {width:100%; padding-top:10px; padding-bottom:35px;}
	footer.General div { display:inline-block; vertical-align:top;}
	footer.General div:first-child { width:calc(100% - 180px); text-align:left;}
		footer.General .NavSocial { display:inline-block; vertical-align:top; padding-right:15px;}
		footer.General .NavSocial li { display:inline-block; vertical-align:top; margin-right:5px;}
		footer.General .NavSocial a { width:30px; height:30px; background-size:80% auto;}
		
			footer.General p,
			footer.General a { font-size:12px; color:#9BAAC2;}
			p#Copy { display:inline-block; vertical-align:top; text-align:left;}
			p#Copy span { display:inline-block; vertical-align: middle; margin:0 5px;}
	
	footer.General div:last-child { width:180px;}
		p#CreacionUno { text-align:right;}
		
		/*Desktop*/
		.Desktop footer.General a:hover { color:#fff;}
		/*.......*/
}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*INTERNAS...................................................................................................................................*/
.Interna {}
	.Interna header { height:140px; background:url(imagenes/internas/fondoheader.jpg) repeat-x 0 0;}
	
	/*#HeaderContacto { height: 240px; background: url(imagenes/internas/header-contacto.jpg) no-repeat 0 0;}
	#HeaderContacto #ContentHead .Viewport { background: none !important;}*/
		
		.Interna #ContactLines { background:none; text-align: right;}
			.Interna #ContactLines .Viewport { position:relative;  background:url(imagenes/internas/triangulotop.png) no-repeat 100% 0;}
				.Interna #ContactLines ul { padding-right: 40px;}
			
		.Interna #ContentHead .Viewport  { padding-top:0;  background:url(imagenes/internas/fotohead.jpg) no-repeat 50% 0;}			
			.Interna #Logo { position: relative; z-index: 800; padding: 10px 0 0 40px; display: inline-block}
			.Interna #Logo img { width:221px;}
			.Interna #ContentHead h1,
			.Interna #ContentHead h2,
			.Interna #ContentHead p { display:none;}
			
			.Interna #myCanvasContainer { display:none !important;}
		
				
	.Interna main {}		
		.Interna main .NavSocial li[class] { display:none;}
		
		.Interna #ContentMain {}
			.Interna #ContentMain .Viewport { padding:80px 50px 40px 50px; background-color:#FFFFFF;}
				.HeaderContent { width: 100%; display: block; margin-bottom: 24px;}
				.HeaderContent img { max-width: 100%; display: block;}
											   
				.Col { vertical-align:top; text-align:left;}
					   
				.A { width:50%; padding-right:25px;  display:inline-block;}
				.B { width:50%; padding-left:25px; display:inline-block;}
				.AB { width:100%; display:block;}
				
					#ContentMain h1 { font:normal 28px/40px "RobRegular", Arial, Helvetica, sans-serif; color:#12243F;}
					#ContentMain h2 { font:normal 25px/50px "RobRegular", Arial, Helvetica, sans-serif; color:#12243F;}
					#ContentMain h3 { font:normal 14px "RobRegular", Arial, Helvetica, sans-serif; color:#333333;}
					.Col br { font-size:14px;}
					
					p.MainText { font-size:14px; line-height: 20px; color:#333;}
					
					ul.ListaServicios { list-style:none; }
					ul.ListaServicios li { display:block; font-size:14px; color:#333333; margin:3px 0; padding-left: 1em; text-indent: -.7em;}
					ul.ListaServicios li:before {content: "\2022"; font-size: 13px; color: #193359; padding-right:5px;}
				
					

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*CONOCERNOS...................................................................................................................................*/
#Conocenos {}
	#AreaSocios { position:relative; z-index:100; width:100%;}
		#AreaSocios ul { list-style:none; width:100%;}
		#AreaSocios li { width:50%; padding:250px 40px 20px 30px; display:inline-block; vertical-align:top;}
							 
			#AreaSocios li#SocioGabriel	{ background:url(imagenes/internas/gabrielmartinez.png) no-repeat 50% 0;}		
			#AreaSocios li#SocioGladys	{ background:url(imagenes/internas/gladysalonso.png) no-repeat 50% 0;}	
			#AreaSocios li#SocioCintia	{ background:url(imagenes/internas/cintiabarrionuevo.png) no-repeat 50% 0;}		
			#AreaSocios li#SocioMatias	{ background:url(imagenes/internas/matiassapia.png) no-repeat 50% 0;}		
				
				p.Nombre { font:normal 16px "RobRegular", Arial, Helvetica, sans-serif; color:#12243F; text-align:center;}
				p.Perfil { font-size:12px; color:#333333;}
				p.Perfil strong { display: block; text-align: center;}
	
	#AreaLinkedin { width:100%; padding:15px 40px 0 30px; margin-bottom: 16px; font-family:"ArNarrRegular", Arial, Helvetica, sans-serif;}
		p.TituloExtracto { font-size:15px; color:#333;}
		p.TextExtracto { font-size:13px; color:#333;}
		#AreaLinkedin a { display:block; font-size:13px; color:#0079B6; margin-top:10px;}
		#AreaLinkedin img,
		#AreaLinkedin strong { display:inline-block; vertical-align:middle;}
		
		#AreaLinkedin img { margin-right:5px;}
		
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*SERVICIOS...................................................................................................................................*/	
main {}
	#Servicios #ContentMain { text-align: left;}
		#Servicios h1 { display: block; margin-bottom: 16px;}
		
		p.Intro { font-size: 17px; color: #333333; display: block; margin-bottom: 20px;}	
		#Servicios .Col { margin-top:25px;}
			.ModuloServicio { width:100%; margin-bottom: 35px;}
				.ModuloServicio h2 { position: relative;display: block; width: 100%; font-family: "NeSansMedium", Arial, Helvetica, sans-serif;  font-size: 18px !important; line-height: 18px !important; margin-bottom: 10px; color: #193359; background-color: #E0E0E0; padding: 10px 15px 10px 30px;}
				.ModuloServicio h2:before { position: absolute; left: 20px; content: "\2022"; font-size: 21px; color: #193359;}

				.ModuloServicio figure {}
				.ModuloServicio img { max-width:100%; display: block;}
				
				.ModuloServicio p.MainText {margin: 20px 0;}
				
				.acordion { position: relative; overflow: hidden; width: 100%; max-height: 0; display: block;
						    -webkit-transition: max-height 0.3s ease-in-out;
							transition: max-height 0.3s ease-in-out;}
							
					.acordion p.MainText { margin-top: 0;}

					a.triggeracordion { font-weight: bold; font-size: 13px; cursor:pointer;
										display: none;}					
					a.triggeracordion:after { content:"Leer mas \02C5";}

					/*open*/
					.acordion.open { max-height: 2000px;} 

					/*open*/
					a.triggeracordion.open { margin-top: 20px;}
					a.triggeracordion.open:after { content:"Leer menos \02C4";}
					
					/*Desktop*/
					.Desktop a.triggeracordion:hover { color:#727272;}
					/*......*/
	
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*CONTACTO...................................................................................................................................*/				
#Contacto #ContentMain .Viewport { padding-top: 0 !important;}

	#Contacto .A { width:60%; margin-left:5%;}	
		#FormContacto { width:100%; text-align:right; padding:25px 0 30px 0;}
			#FormContacto div { width:50%; display:inline-block; vertical-align:top;}
			#FormContacto div#LeftForm { padding-left:20px;  padding-right:20px;}
			#FormContacto div#RightForm {}
			#FormContacto div#FullForm { padding-left:20px;  width: 100%; display: block;}
				
				#FormContacto label { width:100%; display:block; font-size:16px; color: #1B345A; text-align:left !important; margin-bottom:5px;}
				
				#FormContacto input[type="text"],
                #FormContacto textarea { width:100%; display:block; font:normal 12px Arial, Helvetica, sans-serif;  border:1px solid #CCCCCC;  padding:16px; margin-bottom: 8px; background-color:#E2E2E2;}
				
				#FormContacto textarea { height:140px; vertical-align:top; overflow: auto;}
				/*Desktop*/
                .Desktop #FormContacto input[type="text"]:hover,
                .Desktop #FormContacto textarea:hover { border-color:#000; }
                /*.......*/
                        
                #FormContacto input[type="text"]:focus,
                #FormContacto textarea:focus { outline:1px solid #094DA5;  border-color:#000;}      
				
				
			#FormContacto div#BottomForm { width:100%; text-align: left;  padding-left:20px; display:block;}                
                #FormContacto input[type="submit"] { width:fit-content; background-color:#4575B5; border:none; padding:16px; cursor:pointer; font:normal 18px "NeSansRegular", Arial, Helvetica, sans-serif; color:#ffffff;}
                
                /*Desktop*/
                .Desktop #FormContacto input[type="submit"]:hover { background-color:#000;}
                /*.......*/
	
	#Contacto .B { width:35%;}			
		ul#HojaContacto { list-style:none;}
		ul#HojaContacto li { width:100%; display:block; margin-bottom:15px; font-family:"NeSansRegular", Arial, Helvetica, sans-serif; color:#1E3965;}			
			ul#HojaContacto li#BtnEmail { font-size:16px; }
            ul#HojaContacto li#BtnPhone { font-size:20px;}
				ul#HojaContacto li img { width:40px; vertical-align:middle; margin-right:10px; }
				ul#HojaContacto li#BtnEmail img {  border-radius:50%;}
				ul#HojaContacto li a { color:#1E3965;}
				ul#HojaContacto li a:hover { color:#000;}

/*RRHH*/
#RRHH #ContentMain .Viewport { padding-top: 0 !important;}
#RRHH .A { width:60%; margin-left: 0; text-align: left;}	
#RRHH .B { width: 40%;}
#RRHH #FormContacto { margin-left: 5%;}

/*NOVEDADES*/
#ContentMain h1 { text-align: left;}
#PreNovedades { width: 100%; max-width: 800px; text-align:left;}
#LoadVideo { position: relative; overflow: hidden; width: 100%; max-width: 800px;  height: 0;  padding-bottom: 40.25%; }
#LoadVideo iframe { position: absolute; width: 100%; height: 100%; left: 0; top: 0;}

p.MainText { text-align:justify;
			-webkit-hyphens: auto;
			-moz-hyphens: auto;
			-ms-hyphens: auto;
			-o-hyphens: auto;					     
			hyphens: auto;}

/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*ANCHOS///////////////////////////////////////////////////////////////////////////////////////////////*/
/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@media (max-width: 1300px) { 
.Viewport { width:100%; padding:0 30px; max-width:none;}

main {}
	#ContactLines { background-position:40% 0; }
	#ContactLines li { display: block; text-align: right; margin-right: 0 !important;}
	
	/*nocanvas*/	
	.nocanvas #Home #ContentHead .Viewport { background: url(imagenes/fotoheader.jpg) no-repeat 500px 0;}
	.nocanvas #myCanvasContainer { position: absolute; right: calc(100% - 1145px); float: none; margin-right: 0;}	
	/*........*/
	
/*INTERNAS*/
header {}
	.Interna #Logo { position: relative; z-index: 8000; padding-left: 15px;}
	.Interna #NavPrincipal ul { margin-left: 25px;}
}


@media (max-width: 1230px) {
#IntroductionPhoto { width: 300px;}

main {}
	#Introduccion p { text-align: left;}
	#Introduccion span br { display: none;}

	#SeparadorMain { background-position: 60% 0;}		
		#ContactLines li img { width: 40px;}
	
	#Valores { margin-bottom:15px;}
		#ContentValores { background: none;}
			#Valores ul#NuestroProposito { width:50%; margin-right:0px !important;}	
			#Valores ul#NuestrosServicios { width:50%;}
			
/*INTERNAS*/
main {}
	.A, .B { width: 100%; padding-right: 0; padding-left: 0; display: block;}

/*CONOCENOS*/
	#Conocenos .Col.B { margin-top: 24px;}
	
	#AreaSocios li { width: calc(50% - 20px);}
	#AreaSocios li#SocioGabriel { background-color: #CBD6E8; margin-right: 20px;}
	#AreaSocios li#SocioGladys { background-color: #CBD6E8; margin-left: 20px;}
	#AreaSocios li#SocioCintia {background-color: #CBD6E8; margin-right: 20px; }
	#AreaSocios li#SocioMatias {background-color: #CBD6E8; margin-left: 20px; }


/*SERVICIOS*/
main {}
	#Servicios .A { display: inline-block; vertical-align: top; width: 50%; padding-right: 20px;}
	#Servicios .B { display: inline-block; vertical-align: top;  width: 50%;  padding-left: 20px;}
	
/*CONTACTO*/
main {}
	#Contacto .A { width: 65%; margin-left: 0;}
	
	#FormContacto div#LeftForm, #FormContacto div#BottomForm {padding-left: 0;}

/*RRHH*/
#RRHH #FormContacto { margin-right: 0; margin-left: 0;}
#FormContacto div#FullForm { padding-left: 0;}
}

@media (max-width: 1160px) {
header {}
	#Home #ContentHead .Viewport { background-position:400px 0;}
	#myCanvasContainer { position: absolute; right: calc(100% - 1000px); float: none; margin-right: 0;}	
	
	/*nocanvas*/
	.nocanvas #myCanvasContainer { display: none;}	
	/*........*/

	#ContactLines { display: none;}
		
main {}
	#NavPrincipal ul { margin-left: 0;}
	#SeparadorMain p { padding-right:0;}	
}

@media (max-width: 1023px) {
	#myCanvasContainer {display:none;}
	#Home #ContentHead .Viewport { background-image: url(imagenes/fotoheader.jpg);}
	
main {}	
	main .NavSocial { -webkit-transition: transform 0.3s ease-in-out;
					   transition: transform 0.3s ease-in-out;}
	
	.NavSocial { text-align:center;}
		.NavSocial li { width:40px; height:40px; display:block; margin-left:auto; margin-right:auto;}
		.NavSocial li a { width:100%; height:100%; display:block !important;}
		
		.NavSocial li#BtnMobile { display:block; width:50px; height:50px;}
		.NavSocial li#BtnMobile a { position:relative;  width:100%; height:100%; line-height:0 !important; white-space:nowrap; color:#fff; text-align:center; cursor:pointer; background-color:#000; border-radius:200px;}
		.NavSocial li#BtnMobile span { position:absolute; top:50%; left:50%;
									  -webkit-transform: translate(-49%, -50%);
									  transform: translate(-49%, -50%);}
									  
			#Barritas{ font-size:35px; line-height:0 !important;}				
			#Equis { display:none; font-size:25px; line-height:0 !important;}
		
		/*smalle*/
		.smaller main .NavSocial { -webkit-transform: translateX(200px);
									transform: translateX(200px);}
		/*.....*/	
	
	/*#ContactLines { width:100%; height:auto; padding:15px 0 0 0; min-width: auto; background-image:none;}
	#ContactLines ul { padding-top:0; display: flex; gap: 24px; flex-wrap: wrap; justify-content: center; align-items: center;}*/
	
	#NavPrincipal { position:fixed; z-index:9999; top:0; left:0; margin-top:0; width:100%; height:100%; background-color:rgba(255, 255, 255, 0.9);
					-webkit-transform-origin: bottom center;
					-webkit-transform: scaleY(0);
					-webkit-transition: -webkit-transform 0.3s ease-in-out;
					transform-origin: bottom center;
					transform: scaleY(0);
					transition:transform 0.3s ease-in-out;}
					
		#NavPrincipal > ul { position:absolute; top:50%; width:100%; text-align:center;
						  -webkit-transform: translateY(-50%);
						  transform: translateY(-50%);}
		#NavPrincipal > ul > li { display:block; margin-left:0; margin-bottom:16px; }
		#NavPrincipal > ul > li > a { text-shadow: none; color:#1E3965; font-size:2rem; display: block;}
		
		#NavPrincipal ul > li.submenu ul { position: relative; top: auto; left: auto; width: 100%; z-index: 0; margin-left: 0 !important;}
		.Interna #NavPrincipal ul { margin-left: 0 !important;}
		#NavPrincipal ul > li.submenu ul a { text-align: center;}
						
		/*menumode*/
		.menumode #NavPrincipal {-webkit-transform: scaleY(1);
								transform: scaleY(1);}
	
		.menumode #Barritas { display:none;}
		.menumode #Equis { display:block;}
		/*......*/

		#SeparadorMain { background: none;}
		#ContentMain { padding-top: 0;}
		
footer {}
	footer.General .NavSocial li { width:auto; height: auto; }
				
		
/*INTERNAS*/
main {}
	.Interna #ContentHead .Viewport  { background-position: 150% 0 !important;}
	.Interna #ContactLines { display: none;}			
	
/*CONTACTO*/
main {}
	#Contacto #ContentMain .Viewport { padding-top: 24px !important;}
	#Contacto .A, #Contacto .B { width: 100%;}
	#Contacto .Col ul#HojaContacto { margin-top: 20px}
    
/*NOVEDADES*/
#LoadVideo {  padding-bottom: 56.25%; }

/*RRHH*/
main {}
	#RRHH #ContentMain .Viewport { padding-top: 24px !important;}
	#RRHH .A, #RRHH .B { width: 100%;}
}

@media (max-width: 980px) {
main {}
	#Introduccion { display: block;}
	#Introduccion div { width:100%; display:block; text-align:center;}
	
	#IntroductionPhoto img { margin:0 auto; width: auto; height: auto; object-fit: none; max-width: 100%; display: block;}
	#IntroducionTxt { padding: 0;}
	#IntroducionTxt p { width:100%; display:block; padding-top:25px; padding-bottom:25px; padding-right:0;}
	p#TituloIntroduccion { padding-bottom: 0;}
	p#SubTituloIntroduccion { padding-top: 0;}
	ul#Ejemplos { margin-block: 0;}

	#ContentValores { padding:20px 40px;}
	#Valores ul li { width:100% !important; display:block; }
	#Valores ul#NuestrosValores { width:50%; margin-bottom:25px; padding-left:0;}
	#Valores ul#NuestrosServicios { width:50%; margin-bottom:25px;}
}

@media (max-width: 850px) {
	.Interna #ContentHead .Viewport  { background-position: calc(100% + 300px) 0 !important;}
}

@media (max-width: 800px) {
	#Valores ul { display:block;}
		#Valores ul#NuestroProposito { width:100%; max-width: none; margin-bottom: 24px; padding-left: 0; }
		#Valores ul#NuestrosServicios { width:100%;}	
}

@media (max-width: 690px) {
#Home header { height:auto; padding-bottom:24px; background: url(imagenes/fondoheader-mobile.jpg) repeat-x 0 0; background-size: 2px 100%;}
	#Home #ContentHead .Viewport {background:none;}
	#Logo { width:170px; padding-left:14px;}
	#Logo img { max-width:100%; display:block;}
	
	header h2 { padding-right:30px; }	
	
	/*nocanvas*/
	.nocanvas #Home header { padding-bottom:60px;}	
	/*........*/
	
main {}
	#ContactLines li { height:auto; text-align: center;}
	#ContactLines li img { width:25px; margin: 0 auto;}
	
	#SeparadorMain { text-align:center; width:100%;}
		#SeparadorMain p { font-size:17px; padding: 29px 0 0 0; float:none; margin:0 auto;}
		#SeparadorMain img { max-width:70%; display:block; margin:0 auto;}

	#Valores li.TituloValor { font-size:19px;}
	
footer {}
	footer.General div {display: block; width:100% !important; text-align:center !important;}
		footer.General .NavSocial {display: block; padding-right:0; margin-top:15px;}
		p#Copy { text-align:center; margin:15px 0;}
		p#CreacionUno { text-align:center;}

/*INTERNA*/
.Interna header { height:110px;}

main {}	
	.Interna main .NavSocial { top:20px;}	

	#AreaSocios li { width: 100%; display: block; margin-bottom: 24px;}
	#AreaSocios li#SocioGabriel { margin-right: 0;}
	#AreaSocios li#SocioGladys { margin-left: 0;}
	#AreaSocios li#SocioCintia { margin-right: 0;}
	#AreaSocios li#SocioMatias { margin-left: 0;}

	#AreaLinkedin { padding-bottom: 24px;}
		
}

@media (max-width: 640px) {	
main {}
	main .NavSocial {right: 15px;}

#Home #ContentHead .Viewport { padding-right: 48px;}
	header h2 br { display: none;}

	#ContentMain { padding-top: 0;}	
	#ContactLines { display: none;}	
	
/*SERVICIOS*/
main {}
	#Servicios .A, #Servicios .B  { width: 100%; padding-right: 0; padding-left: 0; display: block;}
}

@media (max-width: 590px) {
header {}
	/*nocanvas*/
	.nocanvas #Home header { padding-bottom:120px;}	
	/*........*/
	
main {}
	#ContactLines li { display:block; width:100%; margin:5px 0;}
	
	#SeparadorMain img { max-width:80%;}
	#SeparadorMain span { margin-top:5px;}

/*INTERIOR*/
.Interna #ContentHead .Viewport  { background-position: calc(100% + 450px) 0 !important;}

/*CONTACTO*/
main {}
	#Contacto #ContentMain .Viewport,
	#RRHH #ContentMain .Viewport { padding-top: 24px;}
	
	#FormContacto div { width: 100%; display: block;}
	#FormContacto div#LeftForm {padding-right: 0;}
}

@media (max-width: 520px) {
	header h2 { font-size:16px;}
	header p { font-size: 14px;}
	
main {}	
	ul#Ejemplos { padding-inline: 20px;}
}

@media (max-width: 450px) { 
.Viewport { padding:0 15px;}

#Home #Logo { width: 250px;}
	#NavPrincipal ul {  top: 70px;
						-webkit-transform: translateY(0);
						transform: translateY(0);}
			 
	#NavPrincipal > ul > li { text-align:left; padding-left:25px; padding-right: 25px;}
	#NavPrincipal ul > li.submenu ul a { text-align: left; padding-left: 8px; padding-right: 0;}
	
	header h1 { line-height:37px; width:200px;}
	
main {}
	#ContactLines li#BtnEmail {font-size: 14px;}
	#ContactLines li#BtnPhone {font-size: 16px;}
	
	#Valores li { font-size: 13px;}

footer {}
	p#Copy {text-align: center;}
	p#Copy span {display:none;}
	p#Copy a { display: block; margin:5px 0; border: 1px solid #fff; padding: 10px;}
	
/*INTERNAS*/
main {}
	.Interna #ContentMain .Viewport { padding-left: 15px; padding-right: 15px;}
	.Col h2 {font-size: 20px; }
}



p#Control { position:fixed; z-index:9999; left:0; top:0; display:block; padding:5px; font-size:20px; color:#ffffff; background-color: #000;}

/*ANIMACIONES*/
@keyframes bounce {
    70% { transform:translateY(0%); }
    80% { transform:translateY(-15%); }
    90% { transform:translateY(0%); }
    95% { transform:translateY(-7%); }
    97% { transform:translateY(0%); }
    99% { transform:translateY(-3%); }
    100% { transform:translateY(0); }
}

@keyframes halo {
	0% { transform: scale(0); opacity: 0;}
	20% { transform: scale(1.5); opacity: 1;}
	60% { transform: scale(1.5); opacity: 0;}
	100% { transform: scale(0); opacity: 0;}
}


