html, body {

	background-color: #161C24;
	color: #d1d3d4;

}

h1, h2, h3, h4, h5, .overlay, .nameoverly, .navbar-nav a, .topheader, .fancy {

	font-family: Tienne, Times, serif;
}

h1, h2, h3, h4, h5 {

	color: #d1d3d4;
	
}

a {

	color: #d1d3d4;
}

a:hover {

	color: #D42829;

}

.card-body h1, .card-body h2 {

		color: black;

}

.underline {

	border-bottom: 1px solid #FFF;
}

.headerlogo {

	position: absolute; 
	top: 0; 
	left: 40px; 
	z-index: 10000; 
	max-height: 150px;
}

.overlay {


	position: absolute;
	top: 20px;
	left: 0;
	padding: 5px 15px;
	background-color: rgba(255, 255, 255, 0.4);
	font-size: 20px;
	color: #000;
}

.nameoverlay {

	position: absolute;
	bottom: 20px;
	right: 0;
	padding: 5px 8px;
	background-color: rgba(255, 255, 255, 0.4);
	font-size: 16px;
	

}

.nameoverlay a {

	color: #000;
}

.btntoggle:hover {

	color: red;
	text-decoration: none;
}

.btntoggle {

	color: #d1d3d4;

}

.btntoggle.active {

	color: red;

}

@media only screen and (max-width: 400px) {

	.navbar-brand img {

		max-width: 200px;
	}
}

@media only screen and (max-width: 768px) {

	.headerlogo {

		position: absolute; 
		top: 0; 
		left: 30px; 
		z-index: 10000; 
		max-height: 70px;
	}

	.navbar-brand img {

		max-width: 300px;
	}

	.overlay {

		font-size: 30px;
	}
}

@media only screen and (min-width:768px) {

	.headerlogo {

		position: absolute; 
		top: 0; 
		left: 30px; 
		z-index: 10000; 
		max-height: 100px;
	}

	.overlay {

		font-size: 50px;
	}

}

@media  only screen and (min-width:992px) {

	.headerlogo {

		position: absolute; 
		top: 0; 
		left: 40px; 
		z-index: 10000; 
		max-height: 120px;
	}

	.overlay {

		font-size: 50px;
	}
}

@media only screen and (min-width:1200px) {
	
	.headerlogo {

		position: absolute; 
		top: 0; 
		left: 40px; 
		z-index: 10000; 
		max-height: 150px;
	}
}

img {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}