/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}td:not([align]),th:not([align]){text-align:left}


@font-face {
    font-family: "thaleahfat";
    src: url("../fonts/W95FA.woff2") format("woff2"),
        url("../fonts/W95FA.ttf") format("truetype");
    font-weight: 400;
  }

html, body {
    margin:0;
    padding:0;
    height:100%;
    width: 100%;
    color:#ffffff;
	font-family: "Roboto", sans-serif;
	font-weight: 400;
	font-style: normal;
    background:#0073F4;
}

body {
    overflow-x: hidden; 
    font-size:16px;
}
p {
	font-size:1.7em;
	margin-bottom:1rem;
}
.container {
    height: 100%;
    position: relative;
    min-width:320px;
    z-index:2;
}

.logo {
	display:block;
	text-align:center; 
	z-index:9999;
	position:relative;
 }


.logo img{
	display:block; 
	margin:auto; 
	width:42vw; 
}

.socials {
position:absolute;
z-index:5;
top:10px;
text-align:center;
width:100%;
}

.parallax-wrapper {
  overflow-y: hidden;
    height:80%; 
    min-width:320px;
     display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.parallax {
  background-size: 100%;
  background-position: left bottom;
  height:80%;
  background-repeat:no-repeat;
  position: absolute;
  top:0;
  width:100%;
  min-width:320px;
}

#level0 {
  background-image: url('../images/rooms.png');
    background-size: cover;
  background-position: left top;
  z-index:0;
}
/*
#level1 {
  background-image: url('../images/level-1.gif');
  z-index:1;
}
#level2 {
  background-image: url('../images/level-2.gif');
  z-index:2;
}
#level3 {
  background-image: url('../images/level-3.gif');
  z-index:3;
}*/

.content {
	/* padding:5rem; */
    border-top:5px solid #000;
	margin:auto;
    padding-top:50px;
	width:100%;
	position:relative;
	z-index:99999;
    background:#005DC1 !important;
    color: #E9EDDE !important;
}

.content > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}

.content > .showcase {
	padding:1rem 5vw;
	display:flex;
	align-items: center;
	vertical-align: middle;
	flex-wrap:wrap;
	flex-shrink:3;
	justify-content: space-evenly;
}

.content .showcase a {	
	max-width:400px;
}

.content .showcase .item {
	margin-top:20px;
}

.content .showcase .label {
	background:#006EE5;
	color:#fff;
	padding:10px;
	font-size:20px;
}

a {
    color:#fff;
}

a.social-link  {
	display:inline-block;	
	margin:20px 5px;
	
}

a.social-link svg {
	width:30px; 
	fill:#ffffff;
	position:relative;
}

a.social-link:hover svg {
	top:-3px;
 	cursor:pointer;
	fill:#E7E247;
	
}

a.button {
	display:inline-block;
	margin:auto;
	padding:13px 20px 12px;
	background:#E7E247;
	color:#1c050f;
	font-weight:bold;
	text-transform:uppercase;
	text-decoration:none;
	text-align:center;
	width:350px;
	position:relative;
	font-size:1.8em;
	margin-top:2rem;
	border-right:7px solid #1c050f;
	border-bottom:7px solid #1c050f;
}

a.button:hover {
	top:-3px;
	background:#ffffff;
	cursor:pointer;
	color:#1c050f;
}

h1, h2, h3, h4, h5 {
    font-weight:bold;
}

 h2 {
	font-size:2.3em;
}

.characters {
	margin:2rem auto;
	padding:4rem 5vw;
	font-size:14px;
	max-width:1200px;
	display: flex;
    justify-content: left;
    gap: 2rem;
    flex-wrap: wrap;
	background: #006EE5;
	border:10px solid #fff;
}

.character {
    width: 100%;    
    min-width: 200px;
	border-left:5px solid #fff;
	padding-left:20px;
}

.character.moderator {
	border-left:5px solid #F1C40F;
}

.character.developer {
	border-left:5px solid #e67e22;
}

.character.artist {
	border-left:5px solid #9B59B6;
}

.character h2 {
	margin:1rem auto 0;
}
.character img{
    width: 100%;
    max-width:340px;
	display:block;
    float:left;
    margin-right:30px;
    border:5px solid #fff;
}
.character a.button {
	display:inline-block;
	width: auto;
	margin:1rem auto;
}
 
.footer {
	text-align:center;
	display:block;
	margin:auto;
	font-size:1.2em;
	padding:2rem 5vw;
	max-width:1200px;
}
.footer span {
	font-family:'Courier New', Courier, monospace; 
	font-weight:bold;
}

ul li {
	font-size:22px;
	margin-left:10px;
	padding-left:10px;
	border-left:5px solid #fff;
	margin-bottom:10px;
}



@media (max-width: 768px) { /* Hand Held Device */

	body {
	font-size:13px;
	}
	.parallax {
		background-size: 150%;
	}
	.logo img{
		width:60vw; 
	}

	.content {
		padding:1rem;
	}
	.characters {
		gap: 1rem;
	}
	.character {
		width: 47%;
		margin-bottom: 3%;
		min-width: 200px;
	}

}


@media (max-width: 524px) { /*  Mobile */
  .parallax {
    background-size: 200%;
    }
    .logo img{
		width:80vw; 
	}
	.characters {
    	justify-content: center;
    }
	.character {
		width: 97%;
		margin-bottom: 3%;
		min-width: 200px;
	}
}



@media screen and (min-width: 3240px ) { /* 4K */

}