/*******************************************************
 * Copyright (C) 2020 Nicolas Proske (AKA pume)
 * Twitter: https://twitter.com/einpume
 *
 * This file is part of "PORTAL!".
 *
 * "PORTAL!" can not be distributed without
 * the express permission of Nicolas Proske (AKA pume)
 *
 * This copyright notice may not be removed or changed.
 *******************************************************/

@import url(https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800&display=swap);body,html{font-size:16px;margin:0;padding:0;width:100%}body{background-image:url('../img/bg-wool-white.jpg');background-repeat:repeat;background-position:50%;background-size:auto}*{font-family:-apple-system, BlinkMacSystemFont, Montserrat, Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";box-sizing:border-box}.content{width:65%;margin:0 auto;text-align:center;min-height:100vh}@media screen and (max-width: 1350px){.content{width:80%}}@media screen and (max-width: 1000px){.content{width:95%}}hr{width:100px;border:3px solid #000;margin:50px auto}.header{margin:25px;text-transform:uppercase}.top-bar{max-width:72%;margin:45px auto;text-transform:uppercase}.top-bar .left{float:left}.top-bar .right{float:right}.top-bar i{color:#3e3e3e;margin-right:35px}@media screen and (max-width: 450px){.top-bar{text-align:center}.top-bar .left{float:none;display:inline-block;margin:15px 0}.top-bar .right{float:none;display:inline-block;margin:5px 0}.top-bar i{margin:0 25px}}.inner-switch{text-align:right;font-size:14px}.inner-switch:hover{cursor:pointer}.header img{margin-top:50px;width:300px;animation:floating-vertical 4s ease-in-out infinite}.header h1{font-weight:700;font-size:xx-large;margin:30px 0 10px}@keyframes floating-vertical{0%{-webkit-transform:translateY(0);transform:translateY(0)}50%{-webkit-transform:translate3d(0, -10px, 0);transform:translate3d(0, -10px, 0)}100%{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}.items{display:flex;justify-content:space-around;margin:75px 0}@media screen and (max-width: 900px){.items{display:block;margin:0 auto}}.item img{transition:transform 0.15s ease-in-out;width:190px}.item img:hover{transform:scale(1.05)}.item p{text-transform:uppercase;font-size:20px;font-weight:600}.server-info{margin-bottom:50px}.server-info i{font-size:16px}.portal-button{display:inline-block;margin:10px 0;padding:10px 16px;border:2px solid #000;border-radius:5px;font-weight:500;text-transform:uppercase;text-decoration:none;color:#000;text-shadow:0 0 10px rgba(0, 0, 0, .8)}.portal-button:hover{box-shadow:0 0 20px 0 rgba(157, 157, 157, .5);border-image:linear-gradient(to right, #000 0, #000 100%) 1;border-width:2px}.portal-bg{color:#fff;background-color:#9b59b6;background-image:url('../img/portal.gif')}.lava-bg{color:#fff;background-color:#ca3d07;background-image:url('../img/lava.gif')}.end-bg{color:#fff;background-color:#000;background-image:url('../img/end.gif')}#footer{background-color:rgba(0, 0, 0, .4);text-align:center;font-size:12px;padding:20px 0}#footer p{opacity:0.8;color:#fff;margin:5px 0;font-weight:600}#footer a{color:#fff;text-decoration:none}.dark{background-image:url('../img/bg-wool-dark.jpg')}.dark hr{border:3px solid #fff}.dark *{color:#fff !important}


	@font-face { 
		font-family: "Minecraft Regular"; 
		src: url("fonts/minecraft_font.eot?") format("eot"), 
			url("fonts/minecraft_font.woff") format("woff"), 
			url("fonts/minecraft_font.ttf") format("truetype"), 
			url("fonts/minecraft_font.svg#Minecraft") format("svg"); 
		font-weight: normal; 
		font-style: normal; 
	}
	
	
	/* The Modal */
	/* The Modal (background) */
	.modal {
	  display: none; /* Hidden by default */
	  position: fixed; /* Stay in place */
	  z-index: 1; /* Sit on top */
	  left: 0;
	  top: 0;
	  width: 100%; /* Full width */
	  height: 100%; /* Full height */
	  overflow: auto; /* Enable scroll if needed */
	  background-color: rgb(0,0,0); /* Fallback color */
	  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
	  -webkit-animation-name: fadeIn; /* Fade in the background */
	  -webkit-animation-duration: 0.4s;
	  animation-name: fadeIn;
	  animation-duration: 0.4s
	}

	/* The Modal (background) */
	.modal {
	  display: none; /* Hidden by default */
	  position: fixed; /* Stay in place */
	  z-index: 1; /* Sit on top */
	  padding-top: 100px; /* Location of the box */
	  left: 0;
	  top: 0;
	  width: 100%; /* Full width */
	  height: 100%; /* Full height */
	  overflow: auto; /* Enable scroll if needed */
	  background-color: rgb(0,0,0); /* Fallback color */
	  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
	}

	/* Modal Content */
	.modal-content {
	  background-color: #fefefe;
	  margin: auto;
	  padding: 20px;
	  border: 1px solid #888;
	  width: 80%;
	}

	/* The Close Button */
	.close {
	  color: #aaaaaa;
	  float: right;
	  font-size: 28px;
	  font-weight: bold;
	}

	.close:hover,
	.close:focus {
	  color: #000;
	  text-decoration: none;
	  cursor: pointer;
	}

	 /* Modal Header */
	.modal-header {
	  padding: 2px 16px;
	  background-image:url('../img/normal_redstone.png');
	  background-repeat:repeat;
	  background-position:50%;
	  background-size:auto;
	  /*background-color: #5cb85c;*/
	  color: white;
	}

	/* Modal Body */
	.modal-body {padding: 2px 16px;}

	/* Modal Footer */
	.modal-footer {
	  padding: 2px 16px;
	  background-image:url('../img/normal_redstone.png');
	  background-repeat:repeat;
	  background-position:50%;
	  background-size:auto;
	  /* background-color: #5cb85c; */
	  color: white;
	}

	/* Modal Content */
	.modal-content {
	  position: relative;
	  background-color: #fefefe;
	  margin: auto;
	  padding: 0;
	  border: 1px solid #888;
	  width: 80%;
	  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
	  animation-name: animatetop;
	  animation-duration: 0.4s
	}

	/* Add Animation */
	@keyframes animatetop {
	  from {top: -300px; opacity: 0}
	  to {top: 0; opacity: 1}
	}