header {
	background-color: #111;
	background-image: linear-gradient(to bottom, rgb(0,0,0), rgb(30,30,30));
	padding: 0px;
	margin: 0px;
	color: #fff;
	font-family: 'Open Sans Condensed', sans-serif;
}

a, a:hover, a:active, a:focus {
	color: inherit;
}

.intro-message > h2 {
    text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
}

.header-container {
	max-width: 1100px;
	margin: auto;
	display: flex;
}

.header-container > ul {
	display: flex;
	list-style-type: none;
	margin: 10px;
	font-size: 1.5em;
}

.header-container > ul > li {
	padding: 0.3em 0.6em;
}

@media (max-width: 768px) {
	.header-container {
		display: none;
	}
}

.btn-header {
	padding: 0.3em 0.6em;
	background-image: none;
	border: 0px;
	border-radius: 10px;
	margin: 0px;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 2em;
}

.btn-header:hover {
	background-color: grey;
}

.btn-header:active {
	background-color: red;
}

.btn-header:focus {
	color: yellow;
}

.intro-header > .navbar {
	color: black;
	text-align: left;
}

.intro-icon {
	animation-duration: 5s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-name: spin;
}

@keyframes spin {
	100% {
		transform: rotatey(360deg);
	}
}