@import url('https://fonts.googleapis.com/css?family=Prompt:300,400,500,600,700,800,900&display=swap');

*
{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Prompt';	
}
body
{
	background: white;
	min-height: 80vh;
	overflow-x: hidden;
}
header
{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 80px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	transition: 0.6s;
	padding: 20px 40px;
	z-index: 100000;
}
header.sticky
{
	padding: 5px 100px;
	background: #fff;	
}
header .logo
{
	position: relative;
	font-weight: 700;
	color: #fff;
	text-decoration: none;
	font-size: 1.5em;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	transition: 0.6s;
}

header ul
{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 30px;
}
header ul li
{	
	list-style: none;
	position: relative;
}
header ul li ul
{
	position: absolute;		
	background: #000;
	display: none;
	left: 0;
}
header ul li:hover ul
{
	display: block;
}
header ul li ul li
{
	display: block;
	width: 100px;	
	font-size: 0.9em;	

}
header ul li.sub-menu:before
{
	position: absolute;
	line-height: 50px;					
}
header ul li.sub-menu i
{
	color: #fff;
}
header ul li a
{
	position: relative;		
	text-decoration: none;
	font-size: 1em;
	color: #fff;
	letter-spacing: 0.2em;	
	transition: 0.6s;	
	text-transform: uppercase;
}
header ul li a::before
{
	content: '';
	position: absolute;
	bottom: -2px;
	width: 100%;
	height: 2px;
	background: #fff;
	transform: scaleX(0);
	transition: 0.5s ease-in-out;
	transform-origin: right;
}
header ul li a:hover::before
{
	transform: scaleX(1);
	transform-origin: left;
}
header.sticky .logo,
header.sticky ul li a
{
	color: #000;	
}
header.sticky ul li a::before
{
	content: '';
	background: #000;
	width: 100%;
}
header.sticky ul li ul
{
	position: absolute;			
	background: #fff;
	display: none;
}
header.sticky ul li:hover ul
{
	display: block;
}
header.sticky ul li ul li
{
	display: block;
	width: 100%;
}	
header.sticky ul li.sub-menu i
{
	color: #000;
}
/*.banner
{
	position: relative;
	width: 100%;
	height: 80vh;			
}*/
.group
{
	display: flex;
	align-items: center;
}
/*section
{
	position: relative;
	width: 100%;
	height: 100vh;
	padding: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}
section::before
{
	content: '';
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 100px;
	background: linear-gradient(to top,#1c0522,transparent);
	z-index: 1000;
}
section img
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none;
}
section img#moon
{
	mix-blend-mode: screen;
}
section img#mountains_front
{
	z-index: 10;
}*/
/* Turn off parallax scrolling for tablets and phones. Increase the pixels if needed */
@media only screen and (max-device-width: 1366px) {
	section
	{
    background-attachment: scroll;
  }
}
#text
{
	position: absolute;
	right: -350px;
	color: #fff;
	white-space: nowrap;
	font-size: 7.5vw;	
	z-index: 9;

}
#btn
{
	text-decoration: none;
	display: inline-block;
	padding: 8px 30px;
	border-radius: 40px;
	background: #fff;
	color: #2b1055;
	font-size: 1.5em;
	z-index: 9;
	transform: translateY(100px);
}
.sec
{
	position: relative;
	padding: 100px;
	/*background: #1c0522;*/
	background: white;
}
.sec h2
{
	font-size: 22px;
	margin-bottom: 10px;
	color: black;
}
.sec p
{
	font-size: 1em;	
	color: black;
}

#service p
{
	font-size: 1em;	
	color: #fff;
}
.menuToggle
{
	position: relative;
	display: none;
}
@media(max-width: 800px)
{
	/*.menuToggle
	{
		position: absolute;
		display: block;
		font-size: 2em;
		cursor: pointer;
		transform: translateX(30px);
		z-index: 10;
	}*/
	header .navigation
	{
		position: absolute;
		opacity: 0;
		visibility: hidden;
		left: 100%;
	}
	header.open.sticky .navigation,
	header.sticky.open .navigation	
	{
		top: 80px;
		opacity: 1;
		visibility: visible;
		left: 0;
		display: flex;
		flex-direction: column;
		background: #fff;
		width: 100%;
		height: calc(100vh - 80px);
		padding: 40px;
		border-top: 1px solid rgba(0, 0, 0, 0.05);
	}	
	header.open .navigation
	{
		top: 80px;
		opacity: 1;
		visibility: visible;
		left: 0;
		display: flex;
		flex-direction: column;		
		background: #000;
		width: 100%;
		height: calc(100vh - 80px);
		padding: 40px;
		border-top: 1px solid rgba(0, 0, 0, 0.05);
	}
	header.open.sticky .navigation li a,
	header.sticky.open .navigation li a,	
	{
		font-size: 1.25em;
	}
	header #menu
	{
		position: absolute;
		top: 0;
		right: 0;
		width: 60px;
		height: 60px;
		background: #9051ff;
		cursor: pointer;
		display: flex;
		justify-content: center;	
		align-items: center;
	}
	header #menu::before
	{
		content: '';
		position: absolute;
		width: 28px;
		height: 2px;
		background: #fff;
		transform: translateY(-5px);
		transition: 0.2s;
	}
	header #menu::after
	{
		content: '';
		position: absolute;
		width: 28px;
		height: 2px;
		background: #fff;
		transform: translateY(5px);
		transition: 0.2s;
	}
	header ul li:hover ul
	{
		position: relative;
	}
}

