@import url('fonts.css');



body 
{
	background-color: black;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	margin: 0;
	background: url('../res/image/bgNebula.jpg') repeat center center;		
	
	font-family: 'Lab Grotesque', sans-serif;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.9);
	
	line-height: 1.3;
}


h1 {
    
    font-weight: 700; 
}



p
{
	
    font-weight: 300; 
	letter-spacing: normal;
	font-size:1.1rem;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.9);
}
a 
{
	color: #6ab7ff;
	text-decoration: none;
	font-weight: 500;
	position: relative;
	transition: color 0.3s ease;
	word-break: break-word;
	background-image: linear-gradient(to right, rgba(106, 183, 255, 0.25), rgba(106, 183, 255, 0.15));
	background-repeat: no-repeat;
	background-size: 0% 100%;
	background-position: 0 0;
	transition: color 0.3s ease, background-size 0.3s ease;
}

a::after 
{
	content: "";
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 100%;
	height: 1px;
	background-color: #6ab7ff;
	opacity: 0.3;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.3s ease, opacity 0.2s ease 0.1s;
}

a:hover 
{
	color: #a4d6ff;
	background-size: 100% 100%;
}

a:hover::after 
{
	transform: scaleX(1);
	opacity: 0.6;
}

a:focus 
{
	outline: none;
	box-shadow: 0 0 0 2px rgba(106, 183, 255, 0.05);
	border-radius: 0px;
}


sup 
{
	font-size: 0.6em;
	vertical-align: super;
}

.rightblk
{
	text-align:right;
	display: block;
}