@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

.inter-<uniquifier> {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
/* =================================== */
/*	Basic Style 
/* =================================== */
html, body {margin: 0; padding: 0; height: 100%;}
body {background-color: #3a3a3a; font-family: "inter", sans-serif; line-height: 1.5;	font-size: 16px; color: #050505; overflow-x: hidden;}

ol, ul { margin: 0;padding: 0;list-style: none;}

figure, p { margin: 0;}

a {color: #fff;-webkit-transition: all .3s ease-in 0s; -moz-transition: all .3s ease-in 0s; -ms-transition: all .3s ease-in 0s;-o-transition: all .3s ease-in 0s;transition: all .3s ease-in 0s;}

iframe { border: 0;}

a, a:focus, a:hover {text-decoration: none;outline: 0;}

/*a:focus, a:hover {color: inherit; opacity:.7}*/

h1, h2, h3, h4, h5, h6 {font-weight: normal;	margin: 0;}

.clear:before, .clear:after { content: " ";   display: table;}
.clear:after {clear: both;}
.clear { clear: both;}

section, footer, header, main  {  margin: 0 auto;  position: relative; max-width: 1440px;overflow: hidden;}
@media only screen and (max-width: 767.99px) {
	.sec-sub-title p { font-size: 14px;}
}

img { max-width: 100%; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; height:auto}

.texto {font-size: 1rem; line-height:1.5;color: #121212;}
.image { position: relative; overflow: hidden;}
.image:hover img {  transform: scale(1.08,1.08);}

.sec-title h2 {color: #121212;font-size: 28px;font-weight: 800;text-transform: uppercase;font-family: 'inter', sans-serif;}

.sec-sub-title {	margin: 35px auto;}

.sec-sub-title p {font-weight: 600;	line-height: 24px;	font-size: 18px;	color: #5b646e;}

.mb50 {	margin-bottom: 50px;}
.text-gris {color: #EFEFEE;}
/* ---------------------------------------------
   Pre-loader Style
--------------------------------------------- */
#preloader {
  background-color: #fff;
  position: fixed;
  inset: 0;                /* top:0; right:0; bottom:0; left:0 simplificado */
  z-index: 1100;
  display: flex;
  justify-content: center;
  align-items: center;

  /* estado visible por defecto */
  opacity: 1;
  visibility: visible;
	transition: opacity 1s ease, visibility 1s step-end;
}

/* cuando el JS lo oculta */
#preloader.is-hidden {
  opacity: 0;
  visibility: hidden;
}

/* garantía extra: una vez removido el DOM */
body.preloader-gone #preloader {
  display: none !important;
}

/* loader original */
.loader {
  width: 200px;
  height: 125px;
  background: url("../images/preloader.svg") no-repeat center center;
  background-size: contain;
  animation: pulseOpacity 1.2s infinite ease-in-out;
}

/* animación de pulso */
@keyframes pulseOpacity {
  0% { opacity: 1; }
  50% { opacity: 0.4; }
  100% { opacity: 1; }
}
@media only screen and (max-width: 575.99px) {	
	.loader {
  width: 290px;
  height: 117px;}
}

/* 
---------------------------------------------
Header Style
--------------------------------------------- 
*/
.cont_logo img {width: 205px;}
.header-area {position: fixed; display:block; background: #fff; top: 0; left: 0; right: 0; z-index: 100; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.06);  -webkit-transition: all .5s ease 0s; -moz-transition: all .5s ease 0s; -o-transition: all .5s ease 0s;
  transition: all .5s ease 0s;width: 100vw;}
.header-area .main-nav { background: #EFEFEE; display: flex; align-items: center;padding: 30px;font-family: 'Inter', sans-serif;}
.header-area .main-nav ul.nav { border-radius: 0px 0px 25px 25px; flex-basis: 100%; margin-right: 0px; justify-content: right; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s; position: relative; z-index: 999;}
.header-area .main-nav .nav li:last-child { padding-right: 0px;}
.header-area .main-nav .nav li { padding-left: 5px; padding-right: 5px;}
.header-area .main-nav .nav li a {display: block; padding-left: 20px; padding-right: 20px; border-radius: 0px; font-weight: 400; font-size: 17px; text-transform: capitalize; color: #050505; -webkit-transition: all 0.4s ease 0s; -moz-transition: all 0.4s ease 0s; -o-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; border: transparent;}
.header-area .main-nav .nav li:hover a { color:#A22D10 }
.header-area .main-nav .nav li a.active {  color: #A22D10;  opacity: 1;}
.header-area .main-nav .menu-trigger { cursor: pointer; position: absolute; top: 35px; width: 32px; height: 32px;  text-indent: -9999em; z-index: 9999; right: 34px; display: none;background: transparent; border: none;}

.header-area .main-nav .menu-trigger span, .header-area .main-nav .menu-trigger span:before, .header-area .main-nav .menu-trigger span:after { -moz-transition: all 0.4s; -o-transition: all 0.4s; -webkit-transition: all 0.4s; transition: all 0.4s; background-color: #050505; display: block; position: absolute; width: 30px; height: 2px; left: 0}
.header-area .main-nav .menu-trigger span:before, .header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s; -o-transition: all 0.4s; -webkit-transition: all 0.4s; transition: all 0.4s; background-color: #050505; display: block; position: absolute; width: 30px; height: 2px; left: 0; width: 100%}
.header-area .main-nav .menu-trigger span:before, .header-area .main-nav .menu-trigger span:after { content: "";}
.header-area .main-nav .menu-trigger span { top: 16px;}
.header-area .main-nav .menu-trigger span:before { -moz-transform-origin: 33% 100%; -ms-transform-origin: 33% 100%;
  -webkit-transform-origin: 33% 100%; transform-origin: 33% 100%; top: -10px; z-index: 10;}
.header-area .main-nav .menu-trigger span:after { -moz-transform-origin: 33% 0; -ms-transform-origin: 33% 0;  -webkit-transform-origin: 33% 0; transform-origin: 33% 0; top: 10px;}

.header-area .main-nav .menu-trigger.active span, .header-area .main-nav .menu-trigger.active span:before, .header-area .main-nav .menu-trigger.active span:after {background-color: transparent; width: 100%;}
.header-area .main-nav .menu-trigger.active span:before { -moz-transform: translateY(6px) translateX(1px) rotate(45deg);
  -ms-transform: translateY(6px) translateX(1px) rotate(45deg); -webkit-transform: translateY(6px) translateX(1px) rotate(45deg); transform: translateY(6px) translateX(1px) rotate(45deg); background-color: #050505;}
.header-area .main-nav .menu-trigger.active span:after { -moz-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -ms-transform: translateY(-6px) translateX(1px) rotate(-45deg); -webkit-transform: translateY(-6px) translateX(1px) rotate(-45deg); transform: translateY(-6px) translateX(1px) rotate(-45deg); background-color: #050505;}

.visible{display:inline-block !important;}


.header-area .main-nav .nav li.desk:hover a {  color: #050505;}
.header-area .main-nav .nav li.desk:hover a li:hover a {  color: #A22D10;}



@media (min-width:768px) {
	#nav-list {flex-grow: inherit;}
	.mobile { display:none}
}

/* mobile */
@media (max-width: 767.99px) {
	.desk { display:none}
	.header-area .container { max-width:100%!important}
  .header-area .main-nav .nav li a { padding-left: 5px; padding-right: 5px;}
  .header-area .main-nav .nav li a {line-height: 30px;font-weight: 400;color: #050505;}
  .header-area .main-nav .nav li {border-top: 1px solid #A22D10;  height: 50px;}
  .header-area .main-nav .nav { height: auto;  flex-basis: 100%;}

/*  .header-area.header-sticky .nav li a:hover, .header-area.header-sticky .nav li a.active { color: #A22D10!important;opacity: 1; }*/
  .header-area .menu-trigger { display: block !important; }
  .header-area .main-nav { overflow: hidden; }
  .header-area .main-nav .nav { width: 100%; -webkit-transition: all 0s ease 0s;-moz-transition: all 0s ease 0s;
    -o-transition: all 0s ease 0s;transition: all 0s ease 0s;margin-left: 0px;}
  .header-area .nav {margin-top: 13px !important;  }  
  .header-area .main-nav .nav li {width: 100%;padding-left: 0px !important;padding-right: 0px !important;}
 
}


/*====	ELEMENTOS ======*/

.section-title h2 { margin-bottom: 0.3em}
.overlay {background-color: rgba(14,180,147,.9);text-align: center;position: absolute;left: 0;top: 0;width: 100%;height: 100%;	color: #fff;	opacity: 0;	filter: alpha(opacity=0);	-webkit-transition: all 450ms ease-out 0s; -moz-transition: all 450ms ease-out 0s; -o-transition: all 450ms ease-out 0s;transition: all 450ms ease-out 0s;-webkit-transform: rotateY(180deg) scale(0.5,0.5); -moz-transform: rotateY(180deg) scale(0.5,0.5);-ms-transform: rotateY(180deg) scale(0.5,0.5);		 -o-transform: rotateY(180deg) scale(0.5,0.5);	transform: rotateY(180deg) scale(0.5,0.5);}

/*botones*/
.boton { border-radius: 60px; padding: 10px 18px; text-align: center; display:inline-block; font-weight:400;  cursor:pointer; -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;}
  .boton_contacto { color: #050505; background-color: transparent;  font-size:16px; cursor:pointer;  border: 1px solid rgba(5,5,5,.25);font-family: 'Inter', sans-serif;}
  .vermas { color: #EFEFEE; background-color: transparent;  font-size:18px; cursor:pointer;  border: 1px solid #EFEFEE;}
  .vermas2 { color: #202020; background-color: transparent;  font-size:18px; cursor:pointer;  border: 1px solid #BFBFBF;}
	
  .inv1 { color: #F3F3F3; background-color: #A22D10;  font-size:18px; cursor:pointer;  border: 1px solid #A22D10;}	
  .inv2 { color: #424242; background-color: transparent;  font-size:18px; cursor:pointer;  border: 1px solid #464646;}
  .boton_b {color:#fff; background-color: transparent;  font-size:16px; cursor:pointer;  border: 1px solid rgba(255,255,255,.25) }
  a.opfull:hover {  opacity:1}
 /* .boton.inv1:hover { color: #424242; background-color: transparent;  border: 1px solid #464646;}*/
  .boton.vermas:hover/*,  .boton.inv2:hover*/ { color:#EFEFEE; background-color:#202020; border-color:#202020}
  .boton:hover { color:#fff;background-color:#202020; border-color:#202020}
  .boton:focus { color:#fff; background-color:#A22D10; border-color:#A22D10}
  .boton_b:hover { color:#fff;  border: 1px solid #fff !important;}
 
 
.cont_iframe { padding: 15px;background: #f6f6f6;}
.cont_iframe img {width: 100%!important}

.sol-thumb { width: 100%; position: relative;box-shadow: rgba(0, 0, 0, 0.30) 0px 3px 10px;border-radius: 6px;}
.sol-thumb img {border-radius: 6px;}
.sol-thumb .overlay {	background-color: rgba(0,0,0,.65);display: flex;flex-direction: column;justify-content: center;  align-items: center;border-radius: 6px;}
.sol-thumb:hover .overlay {	cursor: pointer;opacity: 1;filter: alpha(opacity=100);	
	-webkit-transform: rotateY(0deg) scale(1,1);
	   -moz-transform: rotateY(0deg) scale(1,1);
		-ms-transform: rotateY(0deg) scale(1,1);
		 -o-transform: rotateY(0deg) scale(1,1);
		    transform: rotateY(0deg) scale(1,1);
}
.sol-thumb h4 {color: #121212; font-size: 18px; font-weight: 600; line-height: 1.5;}

.sol-thumb:hover h4 {  color: #fff; padding:10px}

.cont_iframe .item {  position: relative;}

.cont_iframe .item div.cont img {  max-width: 450px;}
.cont_iframe .item div.cont { padding: 20px; margin: 0 auto; text-align: center;}
.cont_iframe .owl-nav {position: absolute; top: 50%; transform: translateY(-15px); width: 100%;}
.cont_iframe .owl-nav .owl-prev , .cont_iframe .owl-nav .owl-next  { position:absolute}
.cont_iframe .owl-nav .owl-prev  { left: -15px;}
.cont_iframe .owl-nav .owl-next  { right: -15px;}
.cont_iframe .owl-nav .owl-prev i,
.cont_iframe .owl-nav .owl-next i { width: 30px; height: 25px;line-height: 1; font-size: 24px; display: inline-block;
  color: #fff; opacity: 1; transition: all .3s;}

.cont_iframe .owl-dots { display:none}

.cont_iframe .owl-nav .owl-prev i:hover, .cont_iframe .owl-nav .owl-next i:hover { opacity: 0.7;}

/* imagen headers*/

.head_img {width: 100%;	background-size: cover!important;	background-position: center center!important;background-repeat: no-repeat!important;	}

.head_img {height: 100vh;max-height: 745px;}

.head_caption {position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);  text-align: center;  width: 100%;}

.head_caption h1 {text-shadow: #3e3d3d 3px 0px 1px; font-size:5rem}

@media (min-width: 768px) and (max-width: 1341.98px) {
  .head_img { height: 550px;}
	.head_caption h1 { font-size:3.5rem}
}
@media (max-width: 1199.99px) {
	.sol-thumb h4 { font-size: 16px;}
}
@media only screen and (max-width: 767.99px){

	.head_img {max-height: 300px;} 
	.head_caption h1 { font-size:2.5rem}
	.mob-gap {gap: 1rem !important;}
} 

@media (min-width: 576px) {
	.tumbis { justify-content: center;}
	.tumbis .col-sm-6 { margin-bottom:.85rem}
}
@media (max-width: 575.99px) {
	.tumbis { flex-directon: column;gap: 1.5rem !important; }
	.tumbis .col-sm-6 { width:296px; margin:0 auto .85rem auto }
	.gap-4 {gap: 1rem !important;}
}




/*=====	Proyectos ========*/
#proyectos {padding-top: 85px;padding-bottom: 0;}
.proyectos { background: rgba(255,255,255, 0.56) 0% 0% url(../images/proyectos.jpg); background-blend-mode: overlay;}

.bajada { background: #000; color:#FFF; padding: 1.8em 0; font-weight: 600; line-height: 1.28; text-align: center; font-size:18px}
.proy_title { padding-top:70px}
.fila_proyectos { flex-direction:row; gap:0.5rem}
.fila_proyectos .p_article {margin-bottom: 3rem;}
.fila_proyectos .single-portfolio {background: #F4BD14;}
@media (min-width:1200px){	
	.fila_proyectos .p_article {width:32%}
	.fila_proyectos .single-portfolio .portfolio-title { min-height:52px }
	.fila_proyectos .portfolio-text { min-height:96px }
}
@media only screen and (min-width: 576px) and (max-width: 1199.98px){	
	.fila_proyectos .p_article {width:49%}  
}

@media only screen and (max-width: 767.99px) {
	.proy_title { padding-top:40px}
}
@media only screen and (max-width: 575.98px) {
	.fila_proyectos {flex-direction:column;gap: 0;align-items: center }
	.portfolio-title { font-size: 18px;  }    
} 
/*=====	Cursos =======*/
#cursos {padding-top: 85px;padding-bottom: 0;}
.cursos { background: rgba(11,11,12, 0.56) 0% 0% url(../images/cursos.jpg); background-blend-mode: multiply;}
.single-portfolio .portfolio-text button i {  margin-left: 35px;}
.fila_cursos { flex-direction:row; gap:3rem}
.single-portfolio { box-shadow: 0px 3px 20px #0000005c; border-radius: 8px; padding: 20px;justify-content: space-between;text-align:center}
.portfolio-title {color: #0B0C0C;  font-size: 20px;  line-height: 1.3;  margin-top: 1rem;  }
.single-portfolio .portfolio-image {cursor: zoom-in; position: relative; overflow: hidden; border-radius: 8px;}
.single-portfolio .portfolio-image img {width: 100%; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
.single-portfolio .portfolio-image:hover img { transform: scale(1.08,1.08);}
.portfolio-text button {  width: 100%;border-radius: 8px;}
@media (min-width:1200px){
		.fila_cursos .single-portfolio .portfolio-title { min-height:52px }
}
@media only screen and (max-width: 767px){
	.fila_cursos {flex-direction:column;}
	.portfolio-title { font-size: 18px;  }    
} 
/*=======	Servicios =====*/
#servicios {padding-top: 85px;padding-bottom: 0;}
.servicios { background: rgba(11,11,12, 0.56) 0% 0% url(../images/servicios.jpg); background-blend-mode: multiply;}
/* ul chekys  */
.chekys {  list-style-type: none;  padding: 0;  margin: 0 0 0 38px;}
.chekys li {  list-style-image: url('../images/check.svg');  margin-bottom: 25px;}
.chekys li span {  vertical-align: top;  padding-left: 5px; display:inline-block}
/* ul lista_bullets  */
.lista_bullets {  list-style-type: none;  padding: 0;  margin: 0 0 0 15px;}
.lista_bullets li {  list-style-image: url('../images/arrow_w.svg');  margin-bottom: 15px;}
.lista_bullets li span {  vertical-align: top;  padding-left: 5px;line-height: 1.2; display:inline-block}
/* Estilo para el menú flotante */
/* Contenedor del menú flotante */
#floatingMenu { position: fixed; top: 50%; left: 20px; transform: translateY(-50%); z-index:50  }
/* Estilos generales de la lista */
#floatingMenu ul { list-style: none;  margin: 0;  padding: 0; }
/* Elemento principal (bullet) */
#floatingMenu > ul > li { position: relative; cursor: pointer; font-size: 24px;  }
/* Submenú oculto inicialmente */
#submenu {display: none; position: absolute; top: -20px; left: 20px; padding: 10px; z-index:50     }
.bigger { width:180px} 
#floatingMenu .submenu {background-color: rgba(0, 0, 0, 0.7); padding: 10px; border-radius: 6px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);    }
/* Estilo para los elementos del submenú */
#floatingMenu .submenu li { margin: 5px 0; font-size: 18px; }
#floatingMenu .submenu li a { text-decoration: none;color: #fff;}
#floatingMenu .submenu li a:hover { opacity:1; color:#e8c838}
#floatingMenu i.diparador { color:#e8c838}



/*===	testimonial ===*/
#testimonial { background: #F4BD14;}
#testimonial .sec-sub-title { margin: 35px auto 55px auto;}
/*.single-testimonial { background-color: #fff; padding: 30px; -webkit-box-shadow: 0 0px 20px 0 rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0px 20px 0 rgba(0, 0, 0, 0.1);  box-shadow: 0 0px 20px 0 rgba(0, 0, 0, 0.1);border-radius: 50%;}*/
.testimonial-active .single-testimonial {padding: 0 10px;}
.testimonial-active .single-testimonial:last-child { padding-right: 0px;}

@media (min-width:1200px){
		.single-testimonial .testimonial-content .text { min-height:98px }
}
@media (min-width:992px) and (max-width: 1199.98px){
		.single-testimonial .testimonial-content .text { min-height:122px }
	
}