/**
 * @copyright MarLab
 * @author MarLab (edoardo@marlab.mx)
 * @version 1.0.0 (Noviembre 2022)
 * @since 1.0.0
 */

/*Importación de otros estilos*/
@import "reset.css";
@import "menu.css";
@import "portada.css";
@import "nosotros.css";
@import "portafolio.css";
@import "servicios.css";
@import "clientes.css";
@import "contacto.css";
@import "footer.css";
@import "filosofia.css";

@import "efecto.css";
@import "navegacion.css";

/*Librerias para el carrusel*/
@import "owl.carousel.min.css";
@import "owl.theme.default.css";

/*Tipografías*/
@import url('https://fonts.googleapis.com/css2?family=Noticia+Text:ital,wght@0,400;0,700;1,400;1,700&family=Syne:wght@400;600;700&display=swap');

@font-face{
	font-family: "Monument Extended";
	font-weight: 800;
	src: url("fonts/MonumentExtended-Ultrabold.otf");
}

/*Página*/
html,body{
    background-color: #000000;
	width: 100%;
	height: 100%;
	color: #EAEAEA;
	font-family: 'Syne', sans-serif;
	font-weight: 400;
	font-size: 1.2vw;
	line-height: 1.5vw;
}

h1{
	font-family: 'Monument Extended', sans-serif;
	font-weight: 800;
	font-size: 1.8vw;
}

h2{
	font-family: 'Noticia Text', sans-serif;
	font-style: italic;
	font-weight: 700;
	font-size: 1.5vw;
}

h3{
	font-family: 'Syne', sans-serif;
	font-weight: 700;
	font-size: 1.5vw;
}

.logo__estatico img{
	position: fixed;
	bottom: 40vh;
	left: 2vw;
	width: auto;
	height: 20vh;
	object-fit: contain;
}

canvas{
  	display:block;
  	vertical-align:bottom;
}

#particles-js{
	z-index: 0;
	position: absolute;
	width: 100%;
	height: 120%;
	background-color: transparent;
	background-image: url('');
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

#particle{
	background-color: transparent;
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index: -10; 
}


/*Estilo para media pantalla
______________________________*/
@media only screen and (max-width: 1024px){
	html,body{
		font-size: 2.4vw;
		line-height: 3vw;
	}

	h1{
		font-size: 4vw;
		font-size: 4.5vw;
	}
	
	h2{
		font-size: 2.5vw;
	}

	h3{
		font-size: 3vw;
	}

	.logo__estatico{
		display: none;
	}
}

/*Estilo para móviles
______________________________*/
@media only screen and (max-device-width: 465px) and (max-aspect-ratio: 13/9){
	html,body{
		font-size: 3.9vw;
		line-height: 4.9vw;
	}

	h1{
		font-size: 5.5vw;
		line-height: 6.5vw;
	}
	
	h2{
		font-size: 4vw;
		line-height: 5vw;
	}
	
	h3{
		font-size: 4.5vw;
		line-height: 5.5vw;
	}
}