/* Container
/*---------------------------------------------*/
.bg {
	position: absolute;
	min-height:100%;
	width: 100%;
	background-size:cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	z-index: -10;
}

.title {
	position: absolute;
	width: 50%;
	top: 50%;
	left: 50%;
	/* bring your own prefixes */
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
}
.container {
	position: relative;
	padding: 3em;
	z-index:1;
	margin-top: 100vh;
	background: #fff;
	min-height: 100vh;
	
}
.fixed {
	position: fixed; 
	top: 0; 
	height: 30px; 
	z-index: 10;
	background: #111;
	opacity: 0.95;
}
/* Header
/*---------------------------------------------*/
.bg h1 {
	color: #FFF;
	position: absolute;
	margin-top: 5vh;
	margin-left: 2em;
	max-width: 20vw;
	font-size: 1.6em;

}
header {
	color: #00000;
	opacity: 0.9;
	height: 100%;
}
header a,
footer a { 
	color: #eee; 
}
header a,
footer a,
header a:hover { 
	text-decoration: none;
}
header a:hover,
footer a:hover { 
	color: #fff;
}
header h1 { 
	font-weight: bold;
	margin: 0; 
	padding: 1ex;
	color: #fff;
	background-color: #000;
	text-align: center;
}
header h2 { 
	font-weight: bold;
	font-size: 1.5em;
	margin: 0; 
	padding: 0.5em;
	color: #fff;
	text-align: center;
}
header h3 { 
	font-size: 1.2em;
	margin: 0; 
	padding: 1em;
	color: #000 !important;
	background-color: #fff !important;
	text-align: justify;
}
header h4 { 
	font-weight: bold;
	font-size: 1.2em;
	margin: 0; 
	padding: 1em;
	color: #000 !important;
	background-color: #fff !important;
	text-align: center;
}
header h1 a {
	color: #fff;
}
header ul {
	list-style: none;
	margin: 0 0 0 0;
	padding: 0;
}
header ul li { 
	display: inline; 
	margin: 0 5px;
}
header ul a {
	font-weight: bold;
}

/* Navigation Settings */
nav {
	list-style: none;
	display: inline-block;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 30px;
	background: transparent;
	color: transparent;
}

nav p {
	color: transparent;
	background: transparent;
	position: fixed;
	dislay: inline;
	
}
nav li {
	display: inline;
	padding: 0;
}

nav li a {
	color: #fff;
	text-decoration: none;
	display: inline-block;
	padding: 0;
}

nav ul {
	text-align: right;
}



/* Footer
/*---------------------------------------------*/
footer {
	background: #111;
	color: #FFF;
	font-size: 0.8em;
	text-align: justify;
	padding: 4em 10% 4em 10%;
	margin-top: 80px;
}

/* For larger screens
/*---------------------------------------------*/
@media (min-width: 200px) {
	header {
		padding: 20px 0;
	}
}
@media (max-width: 500px) {
	.title {
		position: absolute;
		width: 90%;
		top: 300px;
		height: 500px;
	}
	.bg {
		
	}
	.bg h1 {
		display: none;
		}
	
	header h1 {
		font-size: 1.8em;
		margin-top: 50px;
		}	
	
	header h2 {
		font-size: 1.3em;
		}
	header h3 {
		font-size: 1.1em;
		min-height: 70px;
		}
	nav {
	list-style: none;
	display: inline-block;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100px;
	color: transparent;
	}

	footer {
		margin-top: 0;
		}

	nav p {
		color: transparent;
		background: transparent;
		position: fixed;
		dislay: inline;
		
	}
	nav li {
		display: inline;
		padding: 0;
	}

	nav li a {
		color: #fff;
		text-decoration: none;
		display: inline-block;
		padding: 0;
		width: 50%;
		line-height: 0.8;
	}

	nav ul {
		text-align: right;
		width: 100%;
		padding: 0;
	}
	.container {
		position: relative;
		margin-top: 600px;
		}
	.fixed {
	}


}