/* Responsive CSS */

@media only screen and (max-width : 1200px) {}
@media only screen and (max-width : 979px) {}
@media only screen and (max-width : 767px) {}
@media only screen and (max-width : 480px) {}
@media only screen and (max-width : 320px) {}

@media (max-width: 992px) {
	.navbar {}
	.nav-link {
		font-size: 14px;
	}
	.navbar-collapse {
		position: fixed;
		top: 0;
		/* top: 54px; */
		left: -300px;
		z-index: 2020;
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 15px;
		width: 300px;
		height: 100%;
		transition: all 0.3s ease;
		display: block;
		background-color: #2D3079;
	}
	.navbar-collapse.collapsing {
		/* height: auto !important; */
		margin-right: 50%;
		transition: all 0.3s ease;
		display: block;
		height: 100%;
	}
	.navbar-collapse.show {
		left: 0;
	}
	.navbar-dark .navbar-brand {
		max-width: 70%;
		margin-bottom: 1.5em;
	}
	div[class*='col'] {
		flex: 0 0 100%;
	}
	#site-header > .container-fluid > .row > div[class*="col"]:first-of-type {
		padding: 0;
	}
	h1 {
		font-size: 35px;
	}
	h2 {
		font-size: 30px;
	}
	h3 {
		font-size: 22.5px;
	}
	p {
		font-size: 15px;
	}
	.intro p:first-of-type {
		font-size: 25px;
	}
	.aqua-btn, .aqua-btn:hover {
		font-size: 15.5px;
	}
	.artifact {
		font-size: 40px;
	}
	.quote p:first-of-type {
		font-size: 20px;
	}
	.quote p:last-of-type {
		font-size: 12px;
	}
	footer > .container-fluid > .row {
		padding-top: 2em;
		padding-bottom: 2em;
	}
	footer > .container-fluid > .row > div[class*="col"]:first-of-type > .footer-content p {
		margin-bottom: 1.5em;
	}
	footer > section p {
		font-size: 12px;
	}
	.footer-menu {
		margin-bottom: 1.5em;
		flex-direction: column;
	}
	.footer-menu > li {
		border: none;
	}
	.footer-menu > li > a {
		font-size: 12px;
	}
}