@charset "UTF-8";
@import 'font-awesome.min.css';
@import url(https://fonts.googleapis.com/css?family=Oswald:400,700,300);

/* CSS Document */
body{font-family: 'ABook'; color:#333; padding-top:0px}
	
	
	a.ancla{ padding-top:129px; float:left; width:100%}
	
	#topnav,#topnav ul,#topnav .logo,#topnav .logo img{
	  transition: all 0.1s;
	  -moz-transition: all 0.1s; /* Firefox 4 */
	  -webkit-transition: all 0.1s; /* Safari and Chrome */
	  -o-transition: all 0.1s; /* Opera */
	}
	
	#topnav .datos{ width:100%; background:#1b1b1b; position:absolute; left:0px; top:-35px; z-index:98; display:none}
	#topnav .datos span{color:#fff; font-size:13px; padding-top:10px; padding-bottom:10px; float:right; margin-right:5%}
	#topnav .datos span i{ font-size:11px; margin-right:5px; margin-left:5px}
																			
	#topnav{width:100%; float:left; z-index:9999999; height:50px; position:relative; background:#fff; top:0px}
		#topnav .insider{ position:absolute; height:auto; width:95%; right:5%; z-index:100}
								
								
			.logo{ float:left; height:auto; z-index:99; width:100%; height:auto; 
			 max-width:1215px; position:relative; }
				/*.logo img{margin:10%; width:45%; float:left}*/	
				.logo img.bgtriangles{width:100%; float:left; min-height:78px}
				.logo img.imglogo{position:absolute; left:10.5%; height:56%; top:4%}
				
				.cover{ width:100%; position:absolute; bottom:0px; z-index:99; left:0px}
				.nocover{width:100%; float:left}
				
				.over{ width:42%; position:absolute; bottom:7%; z-index:99; right:3%; max-width:478px}
				.covergrayed{ width:100%; background:rgba(91, 96, 106, 0.2); height:100%; position:absolute; left:0px; top:0px; z-index:99}
					.parallax .covergrayed{ width:100%; background:rgba(91, 96, 106, 0.7)}
			p.menu{ float:right; width:28px; margin:30px; cursor:pointer; width:0px; margin:0px; position:relative}	
			p.menu img{ width:100%}
			.close{ position:absolute; left:0px; top:0px; display:none}
				.close.active{ display:block}	
									
			ul.mainmenu{float:right; margin:0px; height:50px; list-style-type:none; 
			 width:auto; margin-top:0px; margin-right:0px}
			 
			 ul.submenu{background:#fff; padding-top:10px; padding-bottom:10px; margin-top:1px;border-bottom:1px solid #D1D1D1; width:100%; text-align:right; margin-left:0px; margin-right:0px}

				
				ul.mainmenu li{ float:left; width:auto; height:100%}
					 ul.submenu li{ float:left}
					ul.submenu li:first-child{ }
					
					ul.mainmenu li{height:auto;  line-height:20px; font-family: 'Oswald'; 
					text-decoration:none; font-size:12px; font-weight:normal; float:left;
					color:#666666; margin-left:5px; margin-right:5px;  margin-top:11px; border-radius:3px; position:relative}
						ul.mainmenu li > span{padding:4px 8px; float:left}
						
					ul.mainmenu li > a{ 
					text-decoration:none; float:left;
					color:#666666; padding:4px 8px; border-radius:3px; font-size:11px
					}	
						
						ul.mainmenu li > ul{display:none; position:absolute; left:-20px; top:30px; width:130px; background:#fff;
						padding:15px; border-radius:0px 0px 2px 2px}
							ul.mainmenu li > ul.active{ display:block}
							ul.mainmenu li > ul > li{ width:100%; float:left; padding:0px; margin:0px; margin-top:5px; margin-bottom:5px;
							border-top:1px solid #ccc; padding-top:10px}
								ul.mainmenu li > ul > li a, ul.mainmenu li > ul > li > span{ padding:0px; margin:0px}
									ul.mainmenu li > ul > li > span{color:#999}
								ul.mainmenu li > ul > li > ul{float:left; padding:0px; margin:0px; margin-left:0px; position:relative; top:0px; left:0px; color:#666}
									ul.mainmenu li > ul > li > ul > li{ float:left; margin:0px; padding:0px; margin-top:5px; margin-bottom:5px; 
									padding-top:10px; width:91%; background:url(../img/bullet.png) left 17px no-repeat; padding-left:10px}
						
					ul.mainmenu li:last-child a{ margin-right:0px!important}																						
					ul.mainmenu li > a.selected,ul.mainmenu li > a.selected:hover,ul.mainmenu li > span:hover, span.active{
						cursor:pointer;
						color:#000!important; background:#FEC209; 
						box-shadow:inset 0px 1px 0px rgba(255,255,255,0.4),inset 0px -1px 0px rgba(255,255,255,0.2),
						0px -1px 0px #CA9B05,0px 1px 1px rgba(0,0,0,0.7),0px 1px 1px rgba(0,0,0,0.2)
					}
						
						ul.mainmenu li > ul > li > span{ margin-bottom:5px; margin-top:5px}
						ul.mainmenu li > ul > li > span:hover{ background:none; box-shadow:0px 0px 0px rgba(0,0,0,0); color:#999!important; cursor:auto}
						
					
					ul.mainmenu li a:hover{
						color:#000!important
					}	
				.interiorwmargin a{-webkit-appearance:none;
  background:#FEC108;
  border:0 none;
  border-radius:3px;
  color:#333333;
  cursor:pointer;
  float:left;
  font-family:ADemi;
  margin-top:0;
  padding:15px;
  text-transform:uppercase; text-decoration:none; margin-top:20px}
  				.interiorwmargin .cr a{ float:right}	
				.interiorwmargin .cl a{ float:left}
						
			#hiddenmenu.active{display:block}
			#hiddenmenu{float:left; margin:0px; height:auto!important; list-style-type:none; 
			 width:100%!important; background:#1b1b1b; border-top:1px solid rgba(0,0,0,0.3); padding-top:0px; padding-bottom:0px; display:none; margin:0px!Important;
			 width:111%!important; margin-left:-2.5%!important}
				
				#hiddenmenu li{ float:left; width:100%!important;  height:auto!important;  border-bottom:1px solid rgba(0,0,0,0.3)}
					
					#hiddenmenu li { height:100%;  line-height:35px; font-family: 'Oswald'; 
					text-decoration:none; font-size:20px; font-weight:normal; float:left;
					color:#666; padding-left:10%; padding-right:10%; width:80%; text-align:left;
					padding-top:15px; padding-bottom:15px;
					}	
					
					#hiddenmenu li > a{ 
					text-decoration:none; float:left;
					color:#fff; text-align:left;
					
					}	
					
					
						#hiddenmenu li > ul{float:left; list-style-type:none; display:block; border-top:0px none; width:100%}
							#hiddenmenu li > ul > li{float:left; border-bottom:0px none}
								#hiddenmenu li > ul > li > a{ float:left}
																											
					#hiddenmenu li.active > a,#hiddenmenu li.open > a,#hiddenmenu li.active > a:hover{
						color:#FFC63E
					}
					#hiddenmenu li a:hover{
						color:#FFC63E	
					}
										
																
	.bar{width:100%; float:left; background:#fff url(../img/bgbeige.jpg) top left repeat-x; height:auto; position:relative; z-index:99999}
	.centro{ max-width:1000px; margin:0 auto; position:relative; z-index:9999}		
		.centro2{ max-width:100%}									
		.centro h1{text-align:center; width:100%; float:left; font-size:35px; font-family:Oswald; margin-top:0px; font-weight:normal; margin-bottom:5px;
		background:url("../img/bgwhite.png") bottom center no-repeat; padding-bottom:15px}
			h1.title{ margin-top:0px; margin-bottom:0px}
			.centro h1 span{ background:#fff; padding-left:15px; padding-right:15px}
		
		
	.bulletcontainer{width:98%; margin-left:1%; float:left; 
	z-index:9999999; position:relative}	
		.interior .bulletcontainer{ margin-top:65px}
		.lineL{position:absolute; left:0px; background:#fff; width:10px; height:215px; z-index:99}	
		.lineR{position:absolute; right:0px; background:#fff; width:10px; height:215px; z-index:99}	
		.wrapper{width:100%; float:left}	
							
		a.bullet{float:left; margin-top:2%; margin-bottom:2%; width:31.33%; 
		 height:auto;color:#333; margin-left:1%; margin-right:1%;transition: all 0.1s;}
			a.bullet i{width:100%; float:left; text-align:center!important; margin-top:0px; overflow:hidden;
			position:relative
			}
				a.bullet i img{ /*height:87px;*/ width:180%; display:inline}
			
			
					
				/*a.bullet:hover,a.bullet.selected{background-color:#ADA49A; background-position:right center; cursor:pointer}
				a.bullet:hover h4,a.bullet:hover p,a.bullet.selected h4,a.bullet.selected p{color:#fff}*/
			a.bullet span{ float:left; width:90%; margin-left:5%; background:#fff; margin-top:-30px;text-align:center; position:relative}
				a.bullet span strong{ background:#fff; width:100%;box-shadow:0px 0px 5px rgba(0,0,0,0.4); height:60px; position:absolute; left:0px; top:0px; z-index:-1}
				a.bullet h4{ font-weight:normal; font-size:11px; float:left; width:90%; padding-bottom:10px; padding-top:20px;
				text-transform:uppercase; font-family:ABook; color:#ccc; margin-left:5%}
				a.bullet span h4 b{ font-family:Oswald; font-weight:normal; font-size:22px; color:#333}
				a.bullet p{ font-size:11px; margin-top:5px; float:left; padding:13px; padding-top:15px; background:url(../img/bggray.jpg) center top no-repeat;
				width:calc(100% - 26px); text-align:center}	
				a.bullet p b{ font-weight:normal; font-family:ADemi}
				
			a.bullet i b{ width:100%; height:100%; position:absolute; left:0px; top:0px;
			  transition: all 0.1s;
			  -moz-transition: all 0.1s; /* Firefox 4 */
			  -webkit-transition: all 0.1s; /* Safari and Chrome */
			  -o-transition: all 0.1s;
			  box-shadow:inset 0px 0px 10px rgba(0,0,0,0); box-shadow:inset 0px 0px 10px rgba(0,0,0,1)}
			a.bullet:hover i b{box-shadow:inset 0px 0px 10px rgba(0,0,0,1); background:rgba(0,0,0,0.2)}	
			
			.slick-prev{width:70px; height:32px; background:url(../img/arrows.png) left top no-repeat; position:absolute; left:-75px; top:85px; cursor:pointer; text-indent:-99999px}
			.slick-next{width:70px; height:32px; background:url(../img/arrows.png) -113px top no-repeat; position:absolute; right:-75px; top:85px; cursor:pointer; text-indent:-99999px}

			.bulletin{padding-left:10px; float:left; background:url(../img/bulletin.png) left 3px no-repeat}
	
		/* The Nivo Slider styles */
		.sliderContainer{
			width:100%; height:auto; background:#333; position:relative; overflow:hidden
		}
		.bgred{ background-size:cover; position:absolute;  z-index:999; width:36%; height:auto; left:10%; bottom:20%}
			.bgred p{  color:#fff; width:100%; position:absolute; left:0px; bottom:0px; text-shadow:0px 1px 1px #000,0px 0px 10px rgba(0,0,0,0.3)}
				.bgred p b{font-family:Oswald; font-weight:normal; font-size:24px; 
				background:url(../img/bgblack.png) left bottom no-repeat; padding-bottom:12px; margin-bottom:10px; float:left; width:100%}
				.bgred p b strong{ color:#fff; font-weight:normal}
				.bgred p span{font-size:17px}
		.slider{width:100%; float:left; height:auto}
			.slider img{}

	/*fin de slider*/

			
	.grey{width:100%; float:left; background:#F0F0F0; height:auto; margin-bottom:0px}
		.greyinsider{max-width:1000px; margin:0 auto}
			.grey h1{ text-align:center; width:100%; float:left; font-size:45px; font-family:Oswald; margin-top:28px; font-weight:normal}
			.clientes{width:90%; margin-left:5%; float:left}
				.clientes img{float:left; width:80%; margin-left:10%;filter: grayscale(100%); -webkit-filter: grayscale(100%);}
				
	.parallax{width:100%; float:left; background:url(../img/bgwater.jpg); height:auto; margin-bottom:0px;
	background-position:top center;
    background-attachment:fixed;background-size: cover; position:relative}
		.parallaxinsider{max-width:880px; margin:0 auto; position:relative; z-index:100; text-align:center; }
			.parallaxinsider span{color:#fff;text-shadow:0px 1px 1px #000; font-size:16px; line-height:25px; margin-left:10%; margin-right:10%; 
			width:80%; float:left; margin-top:50px; margin-bottom:150px}
			.parallaxinsider span b{color:#FEC108; font-weight:normal}
	
	.white{width:100%; float:left; background:#fff; height:auto; margin-bottom:40px; margin-top:12px}
		.white2{border-top:1px solid #D1D1D1; padding-top:10px;background:url("../img/bg.jpg") 50% 1px no-repeat}
		.whiteinsider{max-width:1000px; margin:0 auto}
			.white h1{ text-align:center; width:100%; float:left; font-size:45px; font-family:Oswald; margin-top:28px; font-weight:normal; margin-bottom:15px}
	
	
	.contenido{
			width:100%; float:left; height:auto; position:relative; margin-top:0px; border-bottom:1px solid rgba(0,0,0,0.2); margin-bottom:30px
	}				
		.bgredinterior{ background:#4E4E4E; width:100%; height:auto; float:left; border-top:1px solid rgba(0,0,0,0.1)}
			.interior{width:90%; margin:5%; margin-top:5%; margin-bottom:0%; float:left}
			.bgredinterior h2{color:#fff; float:right; text-align:center; font-size:14px;
			width:100%; margin-bottom:2%}
			.bgredinterior h1{color:#fff; float:right; text-align:center; font-size:60px; width:100%; font-weight:normal; font-family:ADemi; line-height:60px;
			margin-top:7%;background:url(../img/bgblack.png) center bottom no-repeat; padding-bottom:5px; margin-bottom:12px}
			img.triangle{float:left; width:100%}
		.contenidointerior{width:70%; margin:15%; margin-top:3%; margin-bottom:5%; float:left}
			.contenidor{ width:90%; margin:0px; padding:5%;border-bottom:1px solid rgba(0,0,0,0.2); padding-bottom:40px}
			.contenidointerior .insider{max-width:1000px; margin:0 auto; height:auto}			
				.interiorwmargin{ width:95%; margin-left:2.5%; margin-right:2.5%; float:left}
				.columna{width:46%; margin-right:2%; margin-left:2%; float:left; position:relative}
					.columna p{ font-size:14px; line-height:18px; float:left}
						.columna p.left{ text-align:left}
						.columna p.right{ text-align:right; float:right}
						.columna p b{ font-family:Oswald; font-size:25px; width:100%; float:left; margin-bottom:15px; line-height:25px}
						.columna p strong{ font-family:Oswald; font-size:15px; font-weight:normal}
					.columna img{ width:100%; position:relative; z-index:1; padding-top:10px; padding-bottom:10px}
					.columna span{ position:absolute; left:22.5%; top:0%; right:22.5%; bottom:0%; width:55%; height:100%; background:#f0f0f0; border-radius:100%; z-index:0}
					
			.noline{ border-bottom:0px none; padding-bottom:0px}
			.sliderservicios{width:100%; float:left; margin-bottom:0%; margin-top:17%}
				.sliderservicios span{width:100%;float:left;position:relative; z-index:99}					
					.sliderservicios span a{float:left; width:100%; position:relative; z-index:99}
						.sliderservicios img{ width:100%}
		.contenidointerior p.textos{-webkit-column-count:2; -webkit-column-gap:100px; width:100%; text-align:justify; font-size:14px;float:left; padding-top:20px}
			.contenidointerior p.textos b{font-family:ADemi; font-weight:normal; font-size:18px; margin-bottom:5px; float:left; width:100%}
			.contenidointerior p.textos strong{font-family:ADemi; font-weight:normal; }
	/*contacto*/
	
	.formulario{width:60%; float:left}
		 .formulario form{width:95%; float:right; margin-left:2.5%; margin-right:2.5%}
		 .formulario form input.texto,textarea{border:1px solid #CCCCCC; width:95%; float:left; height:35px; border-radius:2px; margin-bottom:15px; padding:2%; font-size:15px}
				textarea{ height:120px}
		 .formulario form input.submit{background:#FEC108; float:left; padding:15px; border-radius:3px; font-family:ADemi; border:0px none; 
			text-transform:uppercase; color:#333; margin-top:0px;  cursor:pointer;-webkit-appearance: none}
		 .formulario form p{ font-size:15px; margin-top:10px; float:left}
		 .formulario form p a{color:#DC2474; text-decoration:none}
	.details{width:35%; float:left; margin-left:2.5%; margin-right:2.5%; line-height:24px; font-size:14px}
		.details a{color:#333; text-decoration:none}
		.details b{ font-family:ADemi; font-weight:normal; float:left; width:100%; margin-bottom:5px; font-size:16px}
	.mapa{width:100%; height:480px; z-index:0;  float:left; position:relative; margin-top:20px}
	.contacto{ margin-bottom:0px}
	/*fin de contacto*/
		
/*footer*/	
	.beforefooter{ width:100%; background:#EEE9E3; float:left}	
	.pt25{ padding-top:45px;border-top:1px solid #999}
		.beforefooter .insider{max-width:1000px; margin:0 auto; height:auto}
		.row{width:90%; margin-left:5%; margin-right:5%; margin-bottom:45px; float:left}
		.column{ width:30%; margin-right:5%; float:left;}
		.megacolumn{ width:40%}
		.small{ margin-right:0%; width:20%}
			.column img{width:100%; max-width:296px; float:left; margin-top:20px}
			.column h1{font-family:Oswald; font-size:22px; float:left}
			.column span{color:#333333; font-size:14px; line-height:17px; margin-top:10px; float:left; width:100%}
									
			.column span b,.column span b a{ font-weight:normal; font-family:ADemi; font-size:14px; text-decoration:none; color:#333333; line-height:20px}
			
			.column p{color:#333333; font-size:12px; float:left; margin-top:5px}
			
			.column ul{float:left; list-style-type:none; width:100%; margin-top:5px}
				.column ul li{float:left; width:100%; margin-top:5px}
					.column ul li a{color:#333333; font-size:14px; line-height:17px; text-decoration:none; background:url(../img/bullet.png) center left no-repeat; padding-left:15px}
					.column ul li a:hover{color:#000}
	.footer{width:100%; float:left; background:#464646}
		  .footer .insider{max-width:1000px; margin:0 auto; height:60px}											
				.footer .insider p{color:#999; font-size:13px; width:auto; text-align:left; float:left; margin-left:28px; line-height:60px}
					.footer .insider p a{text-decoration:none; color:#999; font-size:13px}
						.footer .insider p b{color:#fff; font-weight:normal}
						.footer .insider p a:hover b{ text-decoration:underline}
				.footer .insider a{color:#F2F2F2; font-size:18px; line-height:60px; text-decoration:none; float:right; margin-left:10px; margin-right:10px}
				.footer .insider a.arkanmedia{float:none}
				.footer .insider a:hover{color:#FEC007}
	
	.pica{ width:calc(50% - 50px); float:left; margin-left:50px; margin-right:50px; margin-top:50px}
		.pica.first{ margin-left:0px}
		.pica.last{ margin-right:0px}


@media only screen and (min-width: 1024px) {
	#hiddenmenu{ display:none!important}
}
@media only screen and (min-width: 1260px) {
/*.logo{width:550px; height:435px}*/
.close{display:none!important}
}
@media only screen and (min-width: 1430px) {
/*.logo{width:580px; height:459px}*/
.close{display:none!important}
}
@media only screen and (min-width: 767px) and (max-width: 999px) {
#topnav{background:#fff}
#topnav .datos{  background:#FFC63E}
#topnav .datos span{color:#000}
/*.logo{ background:none; width:auto; height:50px; overflow:hidden}
.logo img{margin:0px; height:63px; width:auto; margin-left:20px; margin-top:-10px}*/
/*#topnav ul li a{color:#fff}*/
a.bullet{width:31.33%}
a.first,a.second{ margin-bottom:0px}
.close{display:none!important}
/*.bgred{  width:490px; height:100%; background-size:none; background-position:top left}
.bgred p{ width:60%; position:absolute; left:7%; bottom:10%}
*/
.bgred{  width:46%}
ul.mainmenu li a.selected,ul.mainmenu li a.selected:hover,ul.mainmenu li a:hover{
	/*color:#FFC63E!important*/
}
.column{width:47.5%!important; margin-right:0%}
.megacolumn{width:47.5%!important; margin-right:5%}
.small{ display:none}
}

@media only screen and (max-width: 1024px) {
#topnav ul { display:none}
p.menu{ width:28px; margin:14px}
}
/* Entre 768 y 640 */
@media only screen and (max-width: 767px) {
#topnav{background:#fff}
#topnav .datos{  background:#FFC63E}
#topnav .datos span{color:#000}
/*.logo{ background:none; width:auto; height:50px; overflow:hidden}
.logo img{margin:0px; height:63px; width:auto; margin-left:20px; margin-top:-10px}*/

/*.bgred{  width:490px; height:100%; background-size:none; background-position:top left}
.bgred p{ width:60%; position:absolute; left:7%; bottom:10%}
*/
.formulario form input.submit{width:100%}
.formulario,.details{width:100%; margin:0px;margin-bottom:15%}
.details{ text-align:center}
ul.mainmenu li a.selected,ul.mainmenu li a.selected:hover{
	color:#FFC63E!important
}
.column{width:100%!important; margin-right:0%}
.megacolumn{ margin-bottom:45px; border-bottom:1px solid rgba(0,0,0,0.2); padding-bottom:45px}
.small{ display:none}
.column img{ float:right}
.column span{ text-align:justify}
.column b,.column p{ float:right; text-align:right}
.parallaxinsider span{ margin-bottom:100px}
.columna{width:100%; margin-right:0%; margin-left:0%; float:left; position:relative}
.columna p{ margin-bottom:30px; margin-top:30px; text-align:center!important}
}

@media only screen and (min-width: 640px) and (max-width: 767px) {
	.bgred p span{ display:none}
	a.bullet{width:48%}
	a.bullet.third{width:98%; margin:1% 1%}
	a.first,a.second{ margin-bottom:0px}
	.contenidointerior p.textos{-webkit-column-count:1; -webkit-column-gap:0px; margin-bottom:10%; padding-top:10%}
	.pica{ width:100%; margin:0px; margin-bottom:50px}
		.pica.last{ margin-bottom:10px}
	.sliderservicios{margin-top:0%}
}
@media only screen and (min-width: 480px) and (max-width: 640px) {
	a.bullet{width:90%; margin:6% 5%}
	a.first,a.second{ margin-bottom:0px}
	/*.bgred{  width:100%; background-position:top left}*/
	.bgred p span{ display:none}
	.contenidointerior p.textos{-webkit-column-count:1; -webkit-column-gap:0px; margin-bottom:10%; padding-top:10%}
		.pica{ width:100%; margin:0px; margin-bottom:50px}
		.pica.last{ margin-bottom:10px}
	
	.bgredinterior h1{ font-size:45px; line-height:40px}
	.sliderservicios{margin-top:0%}
}
@media only screen and (min-width: 320px) and (max-width: 480px){
	a.bullet{width:90%; margin:6% 5%}
	a.first,a.second,a.third{ margin-bottom:0px}
	/*.bgred{  width:100%; background-position:top left}*/
	.bgred p span{ display:none}
	/*.bgred p b{width:60%}*/
	.contenidointerior p.textos{-webkit-column-count:1; -webkit-column-gap:0px; margin-bottom:10%; padding-top:10%}
		.pica{ width:100%; margin:0px; margin-bottom:50px}
		.pica.last{ margin-bottom:10px}
	.bgredinterior h1{ font-size:40px; line-height:35px}
	.sliderservicios{margin-top:0%}
}
@media only screen and (max-width: 320px){
	a.bullet{width:92%; margin:4% 4%!important}
	a.first,a.second,a.third{ margin-bottom:0px}
	/*.bgred{  width:100%; background-position:top left}*/
	.bgred p span{ display:none}
	/*.bgred p b{width:60%}*/
	.contenidointerior p.textos{-webkit-column-count:1; -webkit-column-gap:0px; margin-bottom:10%; padding-top:10%}
		.pica{ width:100%; margin:0px; margin-bottom:50px}
		.pica.last{ margin-bottom:10px}
	.bgredinterior h1{ font-size:40px; line-height:35px}
	.sliderservicios{margin-top:0%}
}