/*
	Theme Name:			Skelementor
	Description:		Ultra-minimal theme designed specifically for Elementor Page Builder and to be as lightweight as possible.
	Theme URI:			https://mousebuilt.com.au/skelementor-theme/
	Author:				Mousebuilt (Konker)
	Author URI:			https://mousebuilt.com.au/
	Version:			1.1.4
	Requires at least:	4.9
	Requires PHP:		7.0
	Tested up to:		5.7.1
	License:			GNU General Public License v3 or later.
	License URI:		https://www.gnu.org/licenses/gpl-3.0.html
	Tags:				custom-logo, one-column, two-columns, translation-ready
	Text Domain: 		skelementor
*/

/*! minimal reset based on simplified normalise.css | github.com/necolas/normalize.css */
html {
	line-height: 1.15
}

h1 {
	font-size: 2em;
	margin: .67em 0
}

b,
strong {
	font-weight: bolder
}

pre,
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em
}

small {
	font-size: 80%
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}

sub {
	bottom: -0.25em
}

sup {
	top: -0.5em
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0
}

button,
input {
	overflow: visible
}

fieldset {
	padding: .35em .75em .625em
}

progress {
	vertical-align: baseline
}

textarea {
	overflow: auto
}

template,
[hidden] {
	display: none
}

#copyright {
	opacity: .7;
	font-size: small;
	font-family: sans-serif;
	text-align: right;
	margin: .5rem
}

.alignright {
	float: right
}

.alignleft {
	float: left
}

.aligncenter {
	text-align: center
}

.bypostauthor {}

.gallery-caption {}

.screen-reader-text {}

.sticky {}

.wp-caption {}

.wp-caption-text {}

.gallery-item {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	margin: 0 0 1.5em;
	padding: 0 1em 0 0;
	width: 50%
}

.gallery-columns-1 .gallery-item {
	width: 100%
}


.gallery-columns-2 .gallery-item {
	max-width: 50%
}

.gallery-item a {
	display: inline-block;
	max-width: 100%
}

.gallery-item a img {
	display: block;
	backface-visibility: hidden
}

.gallery-item a:hover img,
.gallery-item a:focus img {
	opacity: 0.6
}

.gallery-caption {
	display: block;
	margin-bottom: 0
}

.FS_img_cont:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: #0000006c;
}

.info_wrapper {
	color: #fff;
}

#logo img {
	max-width: 180px;
	height: auto !important;
	margin-top: 8px;
}

#site-header {
	width: 100%;
	padding: 0 10%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999;
	display: flex;
	transition: all 0.3s ease;
	justify-content: space-between;
	align-items: center;
}

#menu-toggle {
	display: none;
}

.menu-principal {
	list-style: none;
	display: flex;
	gap: 30px;
}

.menu-principal a {
	color: #fff;
	font-size: 16px;
	text-transform: uppercase;
	text-decoration: none;
	font-weight: 600;
}

.site-header.scrolled .menu-principal a {
	color: #000;

}

.FS_slider {
	height: 100vh;
	overflow: hidden;
	position: relative;
}


@media (max-width: 1024px) {
	.menu-principal a {
		color: #8C52FF;
		padding: 15px 0;
		display: block;
		border-bottom: 1px solid #8C52FF;
	}
}








/* Most of these styles could be removed but are for the demo to look better */

#Home_slider {
	position: relative;
	z-index: 1;
}


.full-screen {
	display: block;
	width: 100%;
	height: 100vh;
	overflow: hidden;
}

#intro {
	display: flex;
	justify-content: center;
	color: var(--color-just-black);
	height: 15vh;
	z-index: 999;
	background-color: #fff;
	position: relative;
	align-items: center;
}

#masthead {
	position: fixed;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	z-index: 9999;
}

#masthead a {
	padding: 1rem 2rem;
}


#panels #panels-container {
	height: 100vh;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	padding: 0;
	overflow: hidden;
	background-color: #ddd;
}

#panels #panels-container .panel {
	color: var(--color-just-black);
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	display: flex;
	text-align: left;
	align-items: center;
	justify-content: center;
	border-right: 5px solid #D7FA54;
	border-left: 5px solid #004cff;
	background-color: #000;
}



#panels #panels-container .panel img {
	max-width: 100%;
	height: auto;
	display: block;
}

#panels #panels-container .panel .panels-navigation {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}

#panels #panels-container .panel .anchor-panel,
#panels #panels-container .panel .nav-panel {
	text-transform: uppercase;
	margin-right: 2rem;
}

#panels #panels-container .panels-navigation {
	position: absolute;
	width: 100%;
	bottom: 2rem;
	right: 2rem;
}

.nav-panel.mext a {
	color: #D7FA54;
}

.nav-panel.prev a {
	color: #004cff;
}


a {
	color: var(--color-just-black)
}

.servicio_cont {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 40%;
	gap: 20px;
}

.step-description {
	display: flex;
	flex-direction: column;
	gap: 10px;
	color: #fff;
	font-size: 18px;
}

#cta {
	width: 100%;
}

.cta_cont {
	display: flex;
	background-size: cover;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	height: 50vh;
	position: relative;
	flex-direction: column;
}

.cta_cont::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #000000b8;
	top: 0;
	left: 0;
	z-index: 1;
}

.cta_cont img {
	opacity: 0;
}

.cta_txt {
	color: #fff;
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	padding: 0 10px;
}

.cta_txt h2 {
	margin-bottom: 10px;
	font-size: 35px;
}

.cta_txt .container-cta {
	margin-top: 10px;
}











/****efecto boton*******/

:root {
	--negro: #000;
	--blanco: #fff;
	--azul-feeling: #004CFF;
}

.container-cta {
	display: flex;
	justify-content: start;
	align-items: center;
	position: relative;
	z-index: 99;
}

#boton-cta {
	display: flex;
	position: relative;
	padding: 0px 14px;
	align-items: center;
	justify-content: center;
	gap: 1em;
	overflow: hidden;
	border-radius: 3px;
	font-size: 22px;
	background: var(--azul-feeling);
	color: var(--blanco) !important;
	text-decoration: none;
	height: 43px;
	line-height: 1.1em;
	width: fit-content;
	/* Ajusta el ancho del elemento al contenido que contiene*/
	font-weight: 300;
	pointer-events: auto;
	/* Hacer que el elemento responda a eventos del puntero del mouse según su comportamiento predeterminado. */

	box-shadow: 0 6px 10px #0000000a, 0 2px 4px #0000000a;
	transition: background cubic-bezier(.35, 0, 0, 1) .2s;
	/* Transición suave para el cambio de color de fondo del elemento, utilizando una función de curva de Bézier para controlar la velocidad de la transición */
	will-change: transform;
	/*  Indica al navegador que se espera que el elemento cambie su propiedad de transformación en el futuro */
	flex-direction: initial !important;
}

/*  Regla que se aplica cuando el dispositivo tiene una capacidad de detección de hover  */

#boton-cta:hover {
	color: var(--negro) !important;
	background: #fff;
	transition: background cubic-bezier(.35, 0, 0, 1) .5s .3s
		/* Transición suave para la propiedad background con una duración de 0.5 segundos y un retraso inicial de 0.3 segundos. */
}

#boton-cta:hover #boton-cta-text {
	transform: translate3d(-1.5em, 0, 0)
		/*Transformación al elemento, desplazándolo horizontalmente en el eje X hacia la izquierda en 1.5 veces el tamaño de la fuente actual.*/
}

#boton-cta:hover #boton-cta-bullet {
	transform: translate3d(4em, 0, 0) scale(100);
	/*Desplaza un elemento hacia la derecha y lo escala en tamaño 32 veces en todas las dimensiones.*/
	background: #D7FA54;
}

#boton-cta:hover #boton-cta-flecha {
	transform: translateZ(0)
}

#boton-cta:hover #boton-cta-flecha svg {
	color: var(--blanco)
}


#boton-cta-bullet {
	display: inline-block;
	position: relative;
	width: .5em;
	height: .5em;
	background: #fff;
	border-radius: 100px;
	z-index: 1;
	transition: background cubic-bezier(.35, 0, 0, 1) .5s, transform cubic-bezier(.35, 0, 0, 1) .4s;
	top: auto;
	left: auto;
}

#boton-cta-text {
	position: relative;
	z-index: 1;
	transition: color cubic-bezier(.35, 0, 0, 1) .5s, transform cubic-bezier(.35, 0, 0, 1) .4s;
	width: auto;
	height: auto;
	left: auto;
	top: auto;
	background-image: none;
}

#boton-cta-flecha {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	right: 1em;
	height: 1.2em;
	width: 1.2em;
	color: var(--azul-feeling);
	border-radius: 100%;
	transform: translate3d(3em, 0, 0);
	transition: transform cubic-bezier(.4, 0, 0, 1) .4s;
	z-index: 1;
}

#boton-cta-flecha svg {
	width: 100%;
	height: 100%;
	transition: color .5s;
}


.FS_block_T_1 h1 {
	line-height: 1em;
	margin-bottom: 5px;
}

.FS_block_T_2 h2 {
	font-size: 18px;
	margin-top: 10px;
	margin-bottom: 10px;
	font-weight: 300;
}

.item_cont {
	position: relative;
	height: 100%;
}

.owl-carousel .owl-item {
	position: relative;
	height: 100%;
}


#intro h2 {
	font-size: 35px;
	padding: 0 15px;
}







/**** punto de corte pantalla 1366 x 641*****/
@media (min-width: 1300px) and (max-width: 1600px) and (min-height: 641px) and (max-height: 720px) {
	.info_cont {
		height: 48%;
	}


}