@charset "utf-8";
/* CSS Document */

html, body {
background-color: black;
padding: 0;
margin:0;
height: 100%;
}

@font-face {
	font-family: 'Bombard';
	src: url('../images/BOMBARD_.ttf') format('truetype');
	src: url('../images/BOMBARD_.otf') format('opentype');
}

/* Section */

#home {
  background-color: black;
  background-image:url(../images/empire-main2023.jpg);
  background-repeat:no-repeat;
  background-size: cover;
  margin:0;
  }

#team {
  background-color: black;
}

#partners {
  background-color: black;
}

#community {
  background-color: black;
}

#news {
  background-color: black;
}

#about {
  background-color: black;
}

/* Main */

.main {
min-height: 100%;
padding-top:70px;

}

.submain {
	margin:auto;
width:1320px;
height: auto;
font-size: 20px;
	font-family: Calibri, 'Bombard' ;
	font-weight: bold;
	color:#FFF;

}

.team2 {
min-height: 100%;
padding-top:70px;

}

#wrapper {
	height: 100%;
	margin-top: 49px;
}


/* Secton 1 - Home */

#commcontentmain {
	margin-left:100px;
	width: 700px;
	min-height: 100px;
	margin-top: 5px;
	
}

#logo1 {
	/*background-color:#363;*/
	margin: auto;
	width: 445px;
	height: auto;
	margin-top:20%;
}

#commcontent2 {
	margin:auto;
	width: 700px;
	min-height: 100px;
	/*margin-top: 50px;*/
	margin-top: 10%;
	
}

#discordmain {
	/*background-color:#363;*/
	margin-left: 5px;
	width: 245px;
	height: auto;
	/*margin-top:220px;*/
	margin-top: 10%;
}


/* Section 2 - Team */


#teamwrapper {
	/*background-color:#C00;*/
	margin:auto;
	/*width: 900px;*/
	width: 60%;
	height: 100%;
	margin-top:20px;
	overflow:auto;
	padding-bottom:50px;
}

.teamcol {
	/*background-color:#3C3;*/
	float:left;
	/*width: 250px;*/
	width: 33%;
	height: 100%;
	/*margin-left:36px;*/
	
}

.teamcollogo {
	float: left;
	width: 100%;
	height: 100px;
}

.teamcoltext {
	float: left;
	width: 100%;
	height: auto;
	color: #fff;
	font-size: 16px;
	text-align:center;
	font-family:Calibri;
	line-height:80%;
}

.teamcoltext a {
	color: #fff;
	font-size: 18px;
	text-decoration:none;
	
}

.teamcoltext a:hover {
	color: #CCC;
	font-size: 18px;
	text-decoration: none;
	
}


.teamcoltext p.a {
	color: #f24e5d;
	text-align:inherit;
	font-family:inherit;
}

.b {
	color: #F00;
	font-size:10px;
	}
	
.c {
	color: #e27f7f;
	font-size:10px;
	}
	
.d {
	color: #FC0;
	font-size:10px;
	}
	
.e {
	color: #bdca8a;
	font-size:10px;
	}
	
.f {
	color: #390;
	}


/* Section - Community */



#commwrapper {
	/*background-color:#C00;*/
	margin:auto;
	/*width: 900px;*/
	height: 100%;
	margin-top:20px;
	overflow:auto;
	padding-bottom:50px
}

#commheader {
	margin:auto;
	width: 900px;
	height: 100px;
}

#commcontent {
	margin:auto;
	width: 900px;
	min-height: 100px;
	margin-top: 50px;
	
}

.commstats {
	/*background-color:blue;*/
	width:33%;
	height:200px;
	float:left;
	margin-left:2px;
	color: #fff;
	text-align:center;
	font-family:Calibri;
}

.stats {
	width:100%;
	color: white;
	text-align: center;
	font-family:Calibri;
	font-size:60px;
	font-weight:bold;
	float:left;
}

.statstype {
	width:100%;
	color: white;
	text-align: center;
	font-family:Calibri;
	font-size:60px;
	float:left;
	font-weight: lighter;
	font-style:italic;
}

.statscomment {
	width:100%;
	color: white;
	text-align: center;
	font-family:Calibri;
	font-size:14px;
	float:left;

}

.commstatsmain {
	/*background-color:blue;*/
	width:33%;
	height:200px;
	float:left;
	margin-left:2px;
	color: #fff;
	text-align:center;
	font-family:Calibri;
}

.statsmain {
	width:100%;
	color: white;
	text-align: center;
	font-family:Calibri;
	font-size:50px;
	font-weight:bold;
	float:left;
}

.statstypemain {
	width:100%;
	color: white;
	text-align: center;
	font-family:Calibri;
	font-size:30px;
	float:left;
	font-weight: lighter;
	font-style:italic;
}

.statscommentmain {
	width:100%;
	color: white;
	text-align: center;
	font-family:Calibri;
	font-size:14px;
	float:left;

}


#communitygames {
	width:100%;
	float:left;
	margin-top:50px;
}

.piczoom {
  /*padding: 50px;*/
  /*background-color: green;*/
  transition: transform .2s; /* Animation */
  width: 345px;
  height: 345px;
  margin: 0 auto;
  float: left;
}

.piczoom:hover {
  transform: scale(1.2); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.piczoom2 {
  /*padding: 50px;*/
  /*background-color: green;*/
  transition: transform .2s; /* Animation */
  width: 170px;
  height: 170px;
  margin: 0 auto;
  float: left;
  margin-left: 5px;
  margin-bottom:5px;
}

.piczoom2:hover {
  transform: scale(1.2); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}


/* Streamer section */




#streamerwrapper {
	/*background-color:#C00; */
	margin:auto;
	/*width: 900px;*/
	width: 60%;
	margin-top: 20px;
	height: 100%;
	overflow:auto;
	padding-bottom:50px;
}

.streamerbox {
	/*background-color:blue;*/
	width:250px;
	height:auto;
	float:left;
	margin-left:20px;
	background-color:#FFF;
	color: #000;
	text-align:center;
	font-family:Calibri;
	margin-top:20px;
}

.streamerpic {
	width: 250px;
	height: 300px;
	background-color:blue;
	
}

.streamername {
	width: 100%;
	height: auto;
	font-weight:bold;
	margin-top: 2px;
	
}

.streamertype {
	width: 100%;
	height: auto;
	margin-top: 2px;
	
}

.streamersocial {
	width: 100%;
	height: auto;
	margin-top: 5px;
	
}


/* About section */

#aboutwrapper {
	/*background-color:#C00;*/
	margin:auto;
	/*width: 900px;*/
	width: 60%;
	height: 100%;
	margin-top: 50px;
}


#aboutsidetext {
	float: left;
	/*width: 300px;*/
	width: 33%;
	height: auto;
	color: #fff;
	font-size: 40px;
	text-align:center;
	font-family:Calibri;
	/*line-height:80%;*/
}

#abouttext {
	float: left;
	/*width: 600px;*/
	width: 66%;
	height: auto;
	color: #fff;
	font-size: 16px;
	font-family:Calibri;
	/*line-height:80%;*/
}

#abouttext p {
	color: #f24e5d;
	font-size: 20px;
	font-weight:bold;
	/*line-height:80%;*/
}

/* Nav */ 

#nav {
	width: 100%;
	/*height: 70px;*/
	float: left;
	/*background-color: #1a1919;*/
	background-color:#FFF;
	position:fixed;
	top: 0;
	z-index:1;
	overflow:hidden;
	/* #2e2b2b */
}

#midnav {
	/*width: 380px;*/
	width: 70%;
	height:70px;
	float:left;
	/*background-color: #390;*/
	text-align:center;
	line-height:70px;
	font-size: 20px;
	font-family: 'Bombard', Calibri;
	font-weight: 100;
		
}

#midnav a {
	/*color:#cac9c9;*/
	color:#000;
	text-decoration:none;
	margin-left: 20px;
}

#midnav a:hover {
	/*color:#f3f3f3;*/
	color:#f24e5d;
	text-decoration:none;
	margin-left: 20px;
}

#midnav2 {
	/*width: 380px;*/
	width: 70%;
	height:70px;
	margin:left;
	/*background-color: #390;*/
	text-align:center;
	line-height:70px;
	font-size: 20px;
	font-family: 'Bombard', Calibri;
	font-weight: 100;
		
}

#midnav2 a {
	/*color:#cac9c9;*/
	color:#000;
	text-decoration:none;
	margin-left: 20px;
}

#midnav2 a:hover {
	/*color:#f3f3f3;*/
	color:#f24e5d;
	text-decoration:none;
	margin-left: 20px;
}


#navlogo {
	/*width:70px;*/
	width:15%;
	height: 70px;
	float: left;
	text-align:center;
	/*margin-left: 100px;*/
}

#navsoc {
	/*width:220px;*/
	width:15%;
	height: 40px;
	float: left;
	vertical-align: baseline;
	text-align:center;
	/*margin-right: 80px;*/
	margin-top:15px;
	overflow:hidden;
}


/* Footer */

#footer {
	width: 100%;
	height: auto;
	float: left;
	background-color:#1a1919;
	overflow:hidden;
}

#midfooter {
	width: 300PX;
	height:150px;
	margin:auto;
	/*background-color: #390;*/
	text-align:center;
	/*line-height:50px;*/
	font-size: 10px;
	font-family: Calibri, 'Bombard' ;
	font-weight: 100;
	color:#FFF;
	
}

#midfooter a {
	color:#FFF;
	text-decoration:none;
	font-family: Calibri, 'Bombard' ;
}
#midfooter a:hover {
	color:#FFF;
	text-decoration:none;
	font-family: Calibri, 'Bombard' ;
}


/* Preset page */

.presentCol {
	width:320px;
height: auto;
float: left;
margin-left: 10px;
}

/* For Parallax picture effect */

.parallax {
  /* The image used */
  /*background-image: url(../images/join-button.png);*/
  background-color:#000;

  /* Full height */
  height: 667px; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  /* background-size: cover; */
}

/* Turn off parallax scrolling for tablets and phones. Increase the pixels if needed */
@media only screen and (max-device-width: 1366px) {
  .parallax {
    background-attachment: scroll;
  }
}

@media only screen and (max-width: 620px) {
  /* For mobile phones: */
  #midnav, #midnav2, #navlogo, {
    width: 100%;
  }
  
  #navsoc, #aboutsidetext {
	  display:none;
  }
  
}