@media all 
{
	:root {
		--white: 255, 255, 255;
		--main-color: 0, 55, 100;
		--warning-red: 132, 32, 41;
	}

	html {
		font-size: 16px;
	}

	body, html {
		width: 100vw;
		height: 100vh;
		background: none !important;
	}

	div#footer {
		width: 100vw;
		padding: 10px 5px;
		background-color: rgb(var(--main-color));
		border-top: 1px solid rgb(var(--white));

		z-index: 1000;
	}

	div#container {
		height: calc(100vh - 25px);
		background-color: rgb(var(--main-color));
	}

	#logo {
		width: 50vw !important;
		margin-left: 0 !important;
		background-position: center !important;
	}

	#login {
		width: 50vw !important;
		margin-left: 0 !important;
	}

	p#info {
		margin-left: calc(25vw - 265px) !important;
	}

	p#info:after {
		content: "";
		display: table;
		clear: both;
	}

	#server-info {
		position: fixed;
		top: 0;
		right: 0;

		width: 50vw;
		height: 100vh;
		background-image: url('bgr.jpg');
	}

	#server-info-content {
		width: 100%;
		height: 100%;
		background-color: rgb(var(--main-color), .5);
	}

	#server-info-text {
		text-align: left;
		padding-left: 5vw;
		color: rgb(var(--white));
		padding-top: calc(40vh - 30px);
	}

	#server-info-text .red {
		color: rgb(var(--warning-red));
	}

	#server-info-text .title {
		font-size: 2rem;
		margin-bottom: 20px;
	}

	#server-info-text .text {
		font-size: 1rem;
		line-height: 1.6666rem;
	}

	#server-info-text .links {
		list-style: none;
		padding: 0;
	}

	#server-info-text .links li {
		margin: 0;
	}

	#server-info-text .links a {
		font-size: 1rem;
		text-decoration: none;
		line-height: 1.6666rem;
		color: rgb(var(--white));
	}

	#server-info-text .links a:before {
		content: ">";
		margin-right: 5px;
	}

	#server-info-text .links a:hover {
		color: rgba(var(--white), .5);
	}

}