@import url("https://fonts.googleapis.com/css2?family=Oswald&display=swap");

.box {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100vh;
	margin: 0;
	padding: 0;
	flex-direction: column;
	font-size: 17px;
}

.box a span {
	font-family: "Oswald", sans-serif;
	display: flex;
	width: 95%;
	text-align: right;
	margin-left: auto;
	margin-right: auto;
	height: 6vh;
}
.box a span i {
	margin-top: auto;
	margin-right: auto;
	margin-left: 0;
	margin-bottom: auto;
}
.box a span b {
	margin-top: auto;
	margin-right: 0;
	margin-left: auto;
	margin-bottom: auto;
}
.box a {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	color: #00186b;
	text-decoration: none;
	text-align: center;
}
.box em {
	border-radius: 50vh;
	background-color: rgba(216, 225, 231, 1);
	box-shadow: 0px 0px 30px 10px rgba(216, 225, 231, 1);
}

.box a img {
	height: 50vh;
	cursor: pointer;
}

.box a h1 {
	font-family: "Oswald", sans-serif;
	margin: 0;
	padding: 0px;
	font-size: 40px;
	font-weight: 800;

	background: rgba(76, 76, 76, 1);
	background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%);
	background: -webkit-gradient(
		left top,
		left bottom,
		color-stop(0%, #4c4c4c),
		color-stop(12%, #595959),
		color-stop(25%, #666666),
		color-stop(39%, #474747),
		color-stop(50%, #2c2c2c),
		color-stop(51%, #000000),
		color-stop(60%, #111111),
		color-stop(76%, #2b2b2b),
		color-stop(91%, #1c1c1c),
		color-stop(100%, #131313)
	);
	background: -webkit-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%);
	background: -o-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%);
	background: -ms-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%);
	background: linear-gradient(to bottom, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4c4c4c', endColorstr='#131313', GradientType=0);

	background-clip: border-box;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.box a:hover h1 {
	background: #226a87;
	background: -moz-linear-gradient(top, #226a87 0%, #0e6281 50%, #0c485a 51%, #226a87 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, #226a87), color-stop(50%, #0e6281), color-stop(51%, #0c485a), color-stop(100%, #226a87));
	background: -webkit-linear-gradient(top, #226a87 0%, #0e6281 50%, #0c485a 51%, #226a87 100%);
	background: -o-linear-gradient(top, #226a87 0%, #0e6281 50%, #0c485a 51%, #226a87 100%);
	background: -ms-linear-gradient(top, #226a87 0%, #0e6281 50%, #0c485a 51%, #226a87 100%);
	background: linear-gradient(to bottom, #226a87 0%, #0e6281 50%, #0c485a 51%, #226a87 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#226a87', endColorstr='#226a87', GradientType=0);

	background-clip: border-box;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.box a:hover span {
	text-shadow: 1px 1px 3px #3c9cd7;
}
.box a:hover em {
	box-shadow: 0px 0px 30px 10px white;
	background-color: white;
}

body {
	margin: 0px;
	padding: 0px;

	background: #fefefe;
	background: -moz-linear-gradient(top, #fefefe 0%, #dbdbdb 43%, #c2c2c2 47%, #fefefe 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, #fefefe), color-stop(43%, #dbdbdb), color-stop(47%, #c2c2c2), color-stop(100%, #fefefe));
	background: -webkit-linear-gradient(top, #fefefe 0%, #dbdbdb 43%, #c2c2c2 47%, #fefefe 100%);
	background: -o-linear-gradient(top, #fefefe 0%, #dbdbdb 43%, #c2c2c2 47%, #fefefe 100%);
	background: -ms-linear-gradient(top, #fefefe 0%, #dbdbdb 43%, #c2c2c2 47%, #fefefe 100%);
	background: linear-gradient(to bottom, #fefefe 0%, #dbdbdb 43%, #c2c2c2 47%, #fefefe 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fefefe', endColorstr='#fefefe', GradientType=0);
}
.switch_off {
	height: 0;
	overflow: hidden;
	-prefix-animation: slide 1s ease 3.5s forwards;
}

@-prefix-keyframes slide {
	from {
		height: 0;
	}
	to {
		height: 300px;
	}
}
