/* Nav - CSS */
#nav {
	display: grid;

	grid-row: 1;
	grid-column: 1;
	z-index: 5;

	align-self: start;

	grid-template-columns: auto;

	padding: 24px 0;

	border-bottom: solid 2px rgb(255, 255, 255);
	margin-top: 16px;
}

@media (max-width: 992px) {
	#nav {
		/*background-color: #EE1D23;*/
	}
}

.desktop-logo {
	display: none !important;
}

.mobile-logo {
	display: grid !important;
}

@media (min-width: 768px) {
	#nav {
		grid-row: 1;
		margin-top: 16px;
	}
}

@media (min-width: 992px) {
	.desktop-logo {
		grid-row: 1;
		display: grid !important;
	}

	.mobile-logo {
		display: none !important;
	}
	#nav {
		grid-row: 1;
	}
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#nav-inner {
	display: grid;
}

@media (min-width: 768px) {
	#nav {
		grid-template-columns: auto 768px auto;
	}

	#nav-inner {
		grid-column: 2;
	}
}

@media (min-width: 992px) {
	#nav {
		grid-template-columns: auto 992px auto;
	}
}

@media (min-width: 1200px) {
	#nav {
		grid-template-columns: auto 1200px auto;
	}
}

/* - */

#nav-inner {
	align-content: center;
}

@media (min-width: 992px) {
	#nav-inner {
		grid-template-columns: max-content auto max-content;
	}
}

#logo-container {
	display: grid;
	align-self: center;
	justify-self: center;
}

#logo {
	max-height: 150px;
	justify-self: center;
}

@media (max-width: 768px) {
	#logo {
		justify-self: center;
		max-width: 320px;
	}
}

#nav-links {
	display: none;
	grid-gap: 16px;
}

.show-nav {
	display: grid !important;
}

@media (min-width: 992px) {
	#nav-links {
		display: grid;
		grid-column: 2;
		align-self: center;
	}
}

#nav-links a {
	text-decoration: none;
	color: #ffffff;
	text-transform: uppercase;
}

@media (min-width: 992px) {
	#nav-links a {
		grid-row: 1;
		font-size: 20px;
		padding-bottom: 4px;
		transition: border ease 0.5s;
	}

	.active-link {
		/*
		color: #EE1D23!important;
		border-bottom: solid 2px #EE1D23!important;
		*/

		color: #ee1d23 !important;
		/*border-bottom: solid 2px #EE1D23!important;*/
	}

	#nav-links a:hover {
		/*border-bottom: solid 2px #EE1D23!important;*/
	}
}

/* - */

@media (min-width: 768px) {
	.page-link {
		grid-row: 1;
	}
}

/* - */

@media (min-width: 768px) {
	.dropdown-outer {
		grid-row: 1;
		align-content: center;
	}
}
.dropdown-outer:hover .dropdown-container {
	display: grid !important;
}

.dropdown-container p,
.dropdown-container a {
	color: black !important;
}

.dropdown-container {
	display: grid;
	background-color: #ccc;
	padding: 16px;
	grid-gap: 8px;
}

@media (min-width: 768px) {
	.dropdown-container {
		display: none;
		position: absolute;
		z-index: 9;
		background-color: #af104d;
		padding: 16px;
		grid-gap: 8px;
		margin-top: 30px;
	}
}

@media (min-width: 992px) {
	.dropdown-container {
		display: none;
		position: absolute;
		z-index: 4;
		background-color: #fff;
		padding: 16px;
		grid-gap: 8px;
		margin-top: 60px;
	}
}

@media (min-width: 1200px) {
	.dropdown-container {
		margin-top: 0px;
	}
}

.page-linkdrop p {
	color: black !important;
}

/* - */

.menu_toggle {
	justify-self: center;
	margin: 32px;
	font-size: 24px;
}

.burger-container {
	display: grid;
	margin-top: 24px;
	background-color: #ee1d23;
}

@media (min-width: 992px) {
	.burger-container {
		display: none !important;
	}
}

.burger-icon {
	justify-self: center;
	margin: 8px;
	color: #fff;
	font-size: 24px;
}

.page-link {
	display: grid;
	justify-content: center;
	width: 100%;
	align-self: center;
}

#nav-links {
	grid-gap: 16px;
	margin: 24px 0 8px;
}
