﻿* { margin: 0px; padding: 0px; }
body {
	font-size: 120%;
	background-color:#000000;
	background-image: url("./images/StarfieldBG.jpg") 
}
.header {
	width: 40%;
	margin: 50px auto 0px;
	color: white;
	background: #5F9EA0;
	text-align: center;
	border: 1px solid #B0C4DE;
	border-bottom: none;
	border-radius: 10px 10px 0px 0px;
	padding: 20px;
}
form, .content {
	width: 40%;
	margin: 0px auto;
	padding: 20px;
	border: 1px solid #B0C4DE;
	background: white;
	border-radius: 0px 0px 10px 10px;
}
.input-group {
	margin: 10px 0px 10px 0px;
}
.input-group label {
	display: block;
	text-align: left;
	margin: 3px;
}
.input-group input {
	height: 30px;
	width: 93%;
	padding: 5px 10px;
	font-size: 16px;
	border-radius: 5px;
	border: 1px solid gray;
}
#user_type {
	height: 40px;
	width: 98%;
	padding: 5px 10px;
	background: white;
	font-size: 16px;
	border-radius: 5px;
	border: 1px solid gray;
}
.btn {
	padding: 10px;
	font-size: 15px;
	color: white;
	background: #5F9EA0;
	border: none;
	border-radius: 5px;
}
.error {
	width: 92%; 
	margin: 0px auto; 
	padding: 10px; 
	border: 1px solid #a94442; 
	color: #a94442; 
	background: #f2dede; 
	border-radius: 5px; 
	text-align: left;
}
.success {
	color: #3c763d; 
	background: #dff0d8; 
	border: 1px solid #3c763d;
	margin-bottom: 20px;
}
.profile_info img {
	display: inline-block; 
	width: 50px; 
	height: 50px; 
	margin: 5px;
	float: left;
}
.profile_info div {
	display: inline-block; 
	margin: 5px;
}
.profile_info:after {
	content: "";
	display: block;
	clear: both;
}
@font-face{
	font-family:AndroidRegular;
	src: url("./images/UI/Android Insomnia Regular.ttf")
}

/* ----------------------------------- NAV BAR ------------------------------*/

#navbar{
	background-color: #2b2b2b;
	color: deepskyblue;
	position: fixed;
	height: 62px;
	width:100%;
	font-family: AndroidRegular;
	font-size:20px;
	border-style: groove;
	border-color: darkcyan;
	z-index:99;
}
#navbar .container{
	width:100%;
	margin-top:15px;
}
#nav-title{
	font-size: 130%;
	color: cornsilk;
	top: -12px;
}
#nav-title img{
	height: 51.4px;
	margin-left:0.5%;
}
#nav-leaderboards{
	left: -15%;
}
#nav-forums{
	left:-10%;
}
#nav-media{
	left:-10%;
}
#nav-contact{
	left:-10%;
}
#nav-appstore{
	background-color: chartreuse;
	color: black;
	width: 130px;
	left:-8%;
}
#nav_user_menu{
	position:absolute;
	right: 5px;
	top: 15px;
}
#nav-dropdown-button{
	background: none;
	border: none;
	font-size: 100%;
	top: -5px;
	color: aquamarine;
}
#navbar-dropdown{
	left: 10%;
	font-size: 90%;
	text-align: center;
	background-color: #2b2b2b;
	color: darkcyan;
	border: groove;
	top: 39px;
	border-top: none;
}
#nav-login{
	position:absolute;
	right:0%;
}
#nav-main-menu-dropdown{
	display:none;
	position: absolute;
	top: 7px;
	background-color: cadetblue;
	width: 44px;
	left: 325px;
}
#nav-main-menu-dropdown img{
	position: relative;
	left: -6px;
}
#nav-main-menu-dropdown-button{
	width:44px;
}
#navbar-main-menu-dropdown{
	text-align: center;
	position: absolute;
	left: -58px;
	background-color: #2b2b2b;
	border: groove;
	border-top: none;
	color: darkcyan;
	top: 47px;
}
/*-------------------MEDIA QUERIES --------------------------*/

@media only screen and (max-width: 1400px) {
  #navbar{
  	  font-size:16px;
  }
  #main-background{
	left:20vw;
  }
}
@media only screen and (min-width: 1400px) {
  #main-background{
	left:25vw;
  }
}
@media only screen and (max-width: 1100px) {
	#nav-main-menu-dropdown{
		display:inline;
	}
	#nav-leaderboards{
	display:none;
	}
	#nav-forums{
		display:none;
	}
	#nav-media{
		display:none;
	}
	#nav-contact{
		display:none;
	}
	#nav-appstore{
		display:none;
	}
	  #main-background{
		left:6vw;
	}
}
@media only screen and (max-width: 913px) {
	  #main-background{
		left:0;
	}
}
@media only screen and (max-width: 550px) {
	#nav_user_menu{
		position: absolute;
		right: -3px;
		top: 56px;
		background: #2b2b2b;
		border: groove;
		border-top-color: currentcolor;
		border-top-style: groove;
		border-top-width: medium;
		color: darkcyan;
		border-top: none;
		height: 55px;
	}
	#nav-login{
		position: absolute;
		right: -3px;
		top: 56px;
		background: #2b2b2b;
		border: groove;
		border-top-color: currentcolor;
		border-top-style: groove;
		border-top-width: medium;
		color: darkcyan;
		border-top: none;
		height: 55px;
	}
	#nav-login-text{
		position:relative;
		top: 15px;
	}
	#nav-dropdown-button{
		top:10px;
	}
	#navbar-dropdown{
		top:50px;
		left:14%;
	}
	#media_container{
		width:390px;
		left:36px;
	}
}
@media only screen and (max-width: 625px) {
	#home_recent_media{
			top:73%;
			left:100px;
		}
	#contact_form{
		left:20px;
	}
}
@media only screen and (min-width: 626px) {
	#home_recent_media{
		top:55%;
		left:2%;
	}
		#contact_form{
		left:25%;
	}
}
@media only screen and (min-width: 550px) {
	#media_container{
		left:5vw;
	}
}
/* ----------------------------------- UNIVERSAL BODY ------------------------------*/

#main-background{
	max-width:913px;
	max-height:514px;
	min-width: 450px;
	min-height:257px;
	position:absolute;
	top: 62px;
	z-index:-1;
}
#main-background img{
	width:100%;
	height:100%;
}

body {
	font-family:AndroidRegular;
}

/* ----------------------------------- HOME PAGE ------------------------------*/

#home_announcements{
    width: 390px;
    height: 260px;
    position: absolute;
    top: 25%;
    left: 2%;
    font-size: 200%;
    font-family: AndroidRegular;
    background-image: url("./images/UI/small%20panel03.png");
    background-size: contain;
	text-align: center;
	overflow:hidden;
}

#announcement_banner{
	text-align: left;
	position: relative;
	top: 10px;
	left: 45px;
	color: white;
}

#announcement_title a{
	color: blanchedalmond;
	position:relative;
	top: 10px;
	text-decoration: underline;
	font-size: 85%;
}

#announcement_title a:visited{
	color: blanchedalmond;
	position:relative;
	top: 10px;
	text-decoration: underline;
	font-size: 85%;
}

#announcement_text {
	color:cadetblue;
	position: relative;
	top: 10px;
	font-size:70%;
	width:85%;
	left: 20px;
	overflow:hidden;
	height: 145px;
}

#home_top_score{
	position:absolute;
	right: 1vw;
	width: 390px;
	top: 55%;
	font-family: AndroidRegular;
	background: url("./images/UI/button04_sliced.png");
	background-size: cover;
	height: 138px;
}
#home_top_score h3{
	text-align: center;
	position: relative;
	top: 15px;
	color: white;
}
#home_top_score_value{
	color:gold;
	width: 70%;
	text-align: right;
	position: relative;
	left: 84px;
	font-size: 26px;
	top: -25px;
}
#home_top_score_name{
	color:gold;
	width: 70%;
	text-align: left;
	position: relative;
	left: 40px;
	font-size: 30px;
	top: 12px;
}

#home_recent_media {
	width: 334px;
	height: 300px;
	position: absolute;
	background-image: url("./images/UI/textbox03.png");
	background-size: contain;
	background-repeat: no-repeat;
}
#home_recent_media img {
    width: 57%;
    height: 65%;
    position: relative;
    left: 18px;
    top: 17px;
}
#home_recent_media h3{
	width: 220px;
	text-align: center;
	position: relative;
	top: 18px;
	font-family: AndroidRegular;
	color: beige;
}

/* ----------------------------------- LEADERBOARDPAGE ------------------------------*/

#main_leaderboards{
	position: absolute;
	top: 15%;
	left: 24%;
	height: 70%;
	width:50%;
}

#leaderboard-banner{
	position: absolute;
	font-size: 3.5vw;
	z-index: 5;
	left: 25%;
	width: 50%;
	top: -4vw;
	color: gold;
	font-family: AndroidRegular;
	text-align:center;
}

#myCarousel{
	height:118%;
}
#main_leaderboards .container{
	width: 100%;
	height: 100%;
}

.item.active img{
	width:100%;
	height: 780px;
}

.carousel-caption h3{
	position: fixed;
	top: 0;
	left:0%;
	font-size: 3.5vw;
	text-align: center;
	width: 100%;
	font-family: AndroidRegular;
}
a.right.carousel-control{
	background-image:none;
	height:38vw;
}
a.left.carousel-control{
	background-image:none;
	height:38vw;
}
.carousel-inner{
	height:780px;
}

.leaderboard-window{
	width:92%;
	position:fixed;
	left:4%;
	top:16%;
	height: 56%;
}
.leaderboard-entry{
	border-bottom: dotted;
	font-size:1.1vw;
	margin-bottom: 0.75vw;
}

.leaderboard-name {
	float:left;
	padding-left: 10%;
}
.leaderboard-score{
	text-align: right;
	padding-right: 10%;
}
.leaderboard-entry.leaderboard-10{
	border-bottom:none;
}

/* ------------------------- MEDIA ------------------------ */

#media_container{
    width: 90%;
    position: absolute;
    top: 10%;
	text-align:center;
}
#media_title{
	text-align: center;
	color: white;
	font-size: 50px;
	font-family: AndroidRegular;
}
.media_header{
	text-align: center;
	color: white;
	font-size: 30px;
	font-family: AndroidRegular;
	margin-bottom: 20px;
	margin-top: 20px;
	border-bottom: dashed;
	border-color: rgba(255,255,255,0.25);
}
#media_container a img{
	margin-right: 10px;
	border: groove;
	border-color: cadetblue;
	margin-top: 10px;
	max-height: 390px;
	max-width: 390px;
}

/* ------------------------- CONTACT ------------------------ */

#contact_form{
	position: absolute;
	top: 20%;
	font-family: AndroidRegular;
	background: none;
	width: 50%;
	min-width:390px;
	color: white;
	font-size: 25px;
}
#contact_title{
	text-align: center;
	position: relative;
	top: -48px;
	font-size: 40px;
}
#contact_paragraph{
	color:antiquewhite;
}
#contact_form_inner{
	width: 400px;
	background: none;
	margin-top: 20px;
}
#submit_button{
	background: none;
color: gold;
margin-top: 5px;
}

/* ------------------------- HANGAR ------------------------ */

#hangar_window{
	width: 68%;
	min-width: 370px;
	position: absolute;
	top: 25%;
	left: 16%;
	font-size: 30px;
	font-family: AndroidRegular;
}

#v-pills-tab{
	font-size: 42px;
	position: relative;
	right: 16%;
}
#v-pills-tabContent{
	width: 70%;
	position: absolute;
	left: 15%;
	color: burlywood;
}
