* {
	margin: 0;
	padding: 0;
}
@font-face {
  font-family: 'icomoon';
  src: url('icomoon.ttf?mrs7x8') format('truetype');
}
body {
	background-color: #121620;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-height: 100vh;
}
h1 {
	top: -10px;
	color: #e4ecfa;
	opacity: 0;
	position: relative;
	transition: all .4s ease;
}
.slogan {
	margin: 25px 0px;
	min-width: 300px;
	width: 30%;
	overflow: hidden;
	position: relative;
}
.slogan > p {
	top: -10px;
	opacity: 0;
	position: relative;
	color: #6c7486;
	text-align: center;
	padding: 5px;
	transition: all .4s ease;
}
.slogan > span {
	position: relative;
	font-family: 'icomoon';
	margin: 20px 0px;
	width: 100%;
	color: #3f4656;
	box-sizing: border-box;
	border-top: 1px solid #242836;
	display: block;
	transition: all .4s ease;
}
.slogan > span:first-child {
	left: -100%;
	opacity: 0;
}
.slogan > span:first-child::after {
	content: "\e977";
	top: 7px;
	left: 0px;
	position: absolute;
}
.slogan > span:last-child {
	right: -100%;
	bottom: 0;
}
.slogan > span:last-child::before {
	content: "\e978";
	right: 0px;
	bottom: 8px;
	position: absolute;

}
.links > a {
	color: #99a3ba;
	font-size: 14px;
	padding-bottom: 5px;
	border-bottom: 1px dotted #6C7486;
	text-decoration: none;
	display: inline-block;
	top: -10px;
	opacity: 0;
	position: relative;
	transition: all .4s ease;
}
.links > a:not(:first-child) {
	margin-left: 15px;
}
.links > a:hover {
	color: #E4ECFA;
	border-bottom: 1px solid #99A3BA;
}
.location {
	margin-top: 25px;
}
.location > span {
	color: #6c7486;
	position: relative;
	font-size: 13px;
	display: inline-block;
	transition: all .4s ease;
}
.location > span:first-child {
	left: -20px;
	opacity: 0;
}
.location > span:last-child {
	right: -20px;
	opacity: 0;
}
.location > span:first-child::after {
	content: "\e902";
	font-family: 'icomoon';
}
.navigator {
	margin-top: 15px;
	color: #bbb;
	font-size: 14px;
	position: relative;
	opacity: 0;
	transition: all .4s ease;
}