#loading-screen .divider{
	margin:auto 0.2vw;
	color:#79b8ff;
}

.loading-warning{
	position:fixed;
	bottom: 7px;
	left  : 5vw;
	width :30vw;
	text-align:center;
	font-size:0.6vw;
	font-style:italic;
	color:rgba(255, 255, 255, 0.75);
}

#loading-queue{
	position:fixed;
	bottom : calc( 8px + 0.9vw );
	left   :  5vw;
	width  : 30vw;
	font-size:0.6vw;
	text-align:center;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	color:#bcdbff;
}

#loading-objects{
	color:#fff;
}

#loading-objects .divider{
	margin:auto 0.2vw;
}

#loading-bar{
	position:fixed;
	bottom:0;
	left:0;
	right:0;
	width:100vw;
	text-align:left;
	background:#0d2642;
	overflow:hidden;
}

#loading-progress{
	background:#59a7ff;
	height:5px;
	width:0%;
}

#loading-screen{
	background:#000;
	background-position:center;
}

#loading-screen .content{
	width : 30vw;
	height:100vh;
	position:fixed;
	top : 0;
	left: 5vw;
	background:rgba(28, 28, 28, 0.75);
	color:#fff;
	padding:9vw 5vw 5vw;
	border-left :1px solid rgba(0,0,0,0.25);
	border-right:1px solid rgba(0,0,0,0.25);
	z-index:2;
}

#loading-screen .content img.logo{
	height:2.5vw;
	position:absolute;
	top : 0.3vw;
	left:-3.5vw;
}

#loading-screen .content > .title{
	font-size:1.2vw;
	background:rgba(0,0,0,0.25);
	position:absolute;
	width:100%;
	padding:1.5vw;
	top:2.5vw;
	left:0;
	border-top   :1px solid rgba(0,0,0,0.25);
	border-bottom:1px solid rgba(0,0,0,0.25);
}

#loading-screen .content > .title span{
	width:15%;
	display:inline-block;
}

#loading-screen .content > .title hr{
	position:absolute;
	top   : 3.75vw;
	left  : 0;
	right : 0;
	width :10vw;
	margin:0 auto;
	border-color:rgba(255,255,255,0.25);
}

#loading-screen .content .caption{
	position  :relative;
	text-align:left;
	margin-top:0.5vw;
}

#loading-screen .content .caption .title{
	font-size:2vw;
	font-weight:700;
	display:block;
}

#loading-screen .content .caption .sub-title{
	font-size  :0.85vw;
	font-weight:300;
	color:rgba(255,255,255,0.8);
}

#loading-screen .content .caption .description{
	font-size:0.8vw;
	color:rgba(255,255,255,0.6);
}

#loading-screen .content .caption .description .paragraph{
	margin-top:1.75vw;
}

#loading-screen .tip{
	position:fixed;
	width :22vw;
	height: 4.5vw;
	bottom:calc(7px + 4vw);
	left  : 9vw;
	text-align:left;
	padding:0.5vw 1vw;
	background:rgb(0, 11, 23, 0.3);
	color:#fff;
	border:1px solid rgba(0,0,0,0.25);
}

#loading-screen .tip .title{
	font-size:0.8vw;
	color:#8fb1d8;
}

#loading-screen .tip .description{
	font-size:0.75vw;
	color:rgba(255,255,255,0.8);
}

#loading-screen #loading-objects-container{
	overflow:hidden;
	width :12vw;
	height: 1vw;
	display:inline-block;
	vertical-align:bottom;
	position:relative;
	background:#26609e;
	border:1px solid rgba(255,255,255,0.25);
}

#loading-screen #loading-objects-container .blue-fade{
	position:absolute;
	width :100%;
	height:100%;
	top :0;
	left:0;

	background: -webkit-linear-gradient( 90deg, rgba(38, 96, 158, 0.0) 50%, rgba(38, 96, 158, 1.0) 100% );
	background:    -moz-linear-gradient( 90deg, rgba(38, 96, 158, 0.0) 50%, rgba(38, 96, 158, 1.0) 100% );
	background:      -o-linear-gradient( 90deg, rgba(38, 96, 158, 0.0) 50%, rgba(38, 96, 158, 1.0) 100% );
	background:         linear-gradient( 90deg, rgba(38, 96, 158, 0.0) 50%, rgba(38, 96, 158, 1.0) 100% );
}

#loading-screen #loading-objects{
	width:100%;
	display:inline-block;
	padding:0 0.2vw;
	position:absolute;
	top :0;
	left:0;
	text-align:left;
}

@media only screen and (max-width : 800px) {
	#loading-screen .content{
		width:320px;
		max-width:calc( 100% - 50px );
		left:25px;
		padding:70px 45px 0;
	}

	#loading-screen .content > .title{
		font-size:14px;
		padding:15px 10px;
		top:20px;
	}

	#loading-screen .content > .title hr{
		top:40px;
		width:100px;
	}

	#loading-screen .content img.logo{
		height:27px;
		top :   5px;
		left: -32px;
	}

	#loading-screen .content .caption{
		margin-top:20px;
	}

	#loading-screen .content .caption .title{
		font-size:24px;
	}

	#loading-screen .content .caption .sub-title{
		font-size:10px;
	}

	#loading-screen .content .caption .description{
		font-size:10px;
	}

	#loading-screen .content .caption .description .paragraph{
		margin-top:20px;
	}

	#loading-screen .tip{
		display:none;
	}

	#loading-queue{
		width:320px;
		max-width:calc( 100% - 50px );
		left:25px;
		bottom:21px;
		font-size:9px;
	}

	#loading-screen #loading-objects-container{
		width:140px;
		height:14px;
	}

	#loading-screen #loading-objects{
		padding:0 4px;
		font-size:8px;
	}

	#loading-screen .divider{
		margin:auto 3px;
	}

	.loading-warning{
		width:320px;
		max-width:calc( 100% - 50px );
		left:25px;
		bottom:8px;
		font-size:8px;
	}
}

@media only screen and ( min-aspect-ratio : 14/5 ){
	#loading-screen .content .caption .description{
		display:none;
	}
}

@media only screen and ( min-aspect-ratio : 22/5 ){
	#loading-screen .tip{
		display:none;
	}
}

@media only screen and ( min-aspect-ratio : 29/5 ){
	#loading-screen .content img.logo,
	#loading-screen .content .caption .title,
	#loading-screen .content .caption .sub-title{
		display:none;
	}
}
