/* Header and Footer CSS */
/***
HEADER
***/

/* Sticky Animation on Scroll up desktop */
@media only screen and (min-width: 992px) {
	header#site-header {
		transition: all .3s ease-in-out;
	}
	header#site-header.unstuck {
		opacity: 0;
		position: sticky;
		top: -200px;
		z-index: 1020;
	}
	header#site-header.sticky-lg-top {
		box-shadow: 0px 6px 12px -3px rgba(0,0,0,0.05);
	}
}

/* Top Navigation */
#desktop-top-nav a {
	transition: all .1s ease-in;
}
#desktop-top-nav button {
	border-width: 0;
}
#desktop-top-nav .border-right,
#desktop-top-nav .border-left {
	border-color: #8B5265 !important;
}
#desktop-top-nav a:not(.dropdown-item):hover,
#desktop-top-nav a.dropdown-toggle.show,
#desktop-top-nav button:hover,
#desktop-top-nav button:active,
#desktop-top-nav button:focus {
	color: var(--yellow);
	font-style: italic;
	border-width: 0;
}

/* Main Header */
#main-header.navbar .navbar-brand {
	max-width: 220px;
}
#main-header.navbar .navbar-brand img {
	max-width: 100%;
	min-width: 100px;
	height: auto;
}
#main-header .btn-outline-primary:not(:disabled):not(.disabled).active, 
#main-header .btn-outline-primary:not(:disabled):not(.disabled):active, 
#main-header .show>.btn-outline-primary.dropdown-toggle {
	background-color: var(--light-red);
	color: var(--primary);
	border-color: var(--primary);
}
#main-header .header-search-button {
	width: 3rem;
	height: 3rem;
}
.my-hartnell-dropdown {
	background-image: url(/_resources/img/my-hartnell-panther.svg);
	background-repeat: no-repeat;
    background-position: top left;
    padding-left: 2.5rem;
}

/* Main Navigation */
.navbar-nav.main-navigation li > a {
	color: var(--secondary);
	font-weight: 500;
}
.navbar-nav.main-navigation .dropdown-menu a.list-group-item {
	border-color: var(--gray-400);
	padding: .75rem;
}
.main-navigation a.mega-menu-link-desc,
.main-navigation a.mega-menu-link-desc-dark {
	transition: all .2s ease-in-out;
}
.main-navigation a.mega-menu-link-desc:hover {
	background-color: var(--gray-200);
	text-decoration: none;
}
.main-navigation a.mega-menu-link-desc-dark:hover {
	background-color: var(--secondary);
	text-decoration: none;
}

@media only screen and (min-width: 992px) {
	.navbar-nav.main-navigation li.nav-item.dropdown {
		position: unset;
	}
	.navbar-nav.main-navigation li a.dropdown-toggle {
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: .875rem;
		padding-top: 2rem;
		padding-bottom: 2rem;
		padding-left: .25rem;
		padding-right: .25rem;
	}
	.navbar-nav.main-navigation li a.dropdown-toggle:after {
		content: '\f107';
		font: var(--fa-font-sharp-regular);
		font-size: 75%;
		display: inline-block;
    	text-rendering: auto;
    		-webkit-font-smoothing: antialiased;
		color: var(--faded-dark-red);
		border: none;
		transition: all .1s ease-in;
		opacity:0;
	}
	body.font-awesome-loaded .navbar-nav.main-navigation li a.dropdown-toggle:after {
		opacity: 1;
	}
	.navbar-nav.main-navigation li a.dropdown-toggle[aria-expanded="true"]:after {
		transform: rotate(180deg);
	}
	#main-header.navbar .navbar-nav.main-navigation .dropdown-menu {
		left: 0;
		right:0;
		min-width: 100%;
	}
	#main-header.navbar .navbar-nav.main-navigation .dropdown-menu * {
		overflow: hidden;
	}
}
@media only screen and (min-width: 1150px) {
	.navbar-nav.main-navigation li a.dropdown-toggle {
		font-size: 1rem;
		padding-left: .5rem;
		padding-right: .5rem;
	}
}
@media only screen and (min-width: 1310px) {
	.navbar-nav.main-navigation li a.dropdown-toggle {
		font-size: 1.125rem;
	}
}
@media only screen and (min-width: 1380px) {
	.navbar-nav.main-navigation li a.dropdown-toggle {
		font-size: 1.25rem;
	}
}


/* Mobile Navigation */
#mobile-nav .main-navigation .nav-item {
	margin-bottom: 0.375rem;
}
#mobile-nav .main-navigation .nav-item > a {
	background-color: var(--white);
	padding: .75rem 1.5rem .75rem .75rem;
	border: 1px solid var(--gray-300);
	border-radius: 1rem;
	position: relative;
	transition: all .1s ease-in-out;
}
#mobile-nav .main-navigation .nav-item a.dropdown-toggle:after {
	border: none;
	content: '\f107';
	font: var(--fa-font-sharp-regular);
	font-size: 1rem;
	line-height: 1;
	display: inline-block;
	text-rendering: auto;
		-webkit-font-smoothing: antialiased;
	position: absolute;
	right: .75rem;
	top: 50%;
	margin-top: -.5rem;
	transition: all .2s ease-in-out;
}
#mobile-nav .main-navigation .nav-item > a.show {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}
#mobile-nav .main-navigation .nav-item > a.show:after {
	transform: rotate(180deg);
}
#mobile-nav .navbar-nav .dropdown-menu {
	box-shadow: none;
}
#mobile-nav a.mobile-quicklinks-toggle:hover ,
#mobile-nav a.mobile-quicklinks-toggle:active,
#mobile-nav a.mobile-quicklinks-toggle:focus {
	text-decoration: none;
	opacity: .8;
}
#mobile-nav .mobile-quicklinks-toggle span.fa-sharp {
	transition: all .1s ease-in-out;
}
#mobile-nav .mobile-quicklinks-toggle[aria-expanded="true"] span.fa-sharp {
	transform: rotate(45deg);
}
#mobile-nav .navbar-nav.main-navigation .curved-bottom {
	border-radius: 0 !important;
}

/* Search Modal */
#searchForm button.btn {
	width: 3rem;
	height: 3rem;
}

/* Subnavigation */
.subnavigation {
	border-top: 1px solid var(--gray-400);
	position: relative;
}
.subnavigation .subnavigation-brand {
	border-top: 4px solid var(--warning);
	width: 100%;
	max-width: 175px;
	line-height: 1.1;
}
.subnavigation a.subnavigation-brand {
	color: var(--gray-900);
	font-family: "Inter Tight", sans-serif;
	font-weight: 600;
	font-size: .825rem;
	transition: all .2s ease-in-out;
}
.subnavigation a.subnavigation-brand:hover {
	background-color: var(--light-red);
	color: var(--secondary);
	text-decoration: none;
}
.subnavigation .subnavigation-menu {
	margin-left: 1rem;
	position: absolute;
	right:0;
	top: 100%;
	z-index: 99;
	overflow: hidden;
	width: 20rem;
	max-width: 90%;
}
.subnavigation .subnavigation-menu ul {
	margin:0;
	padding:0;
}
.subnavigation .subnavigation-menu ul > li {
	list-style: none;
	margin: 0;
	padding:0;
	border-bottom: 1px solid var(--faded-red);
	display: block;
	font-size: .875rem;
}
.subnavigation .subnavigation-menu ul > li:last-child {
	border-bottom-width: 0;
}
.subnavigation .subnavigation-menu ul li ul {
	visibility: hidden;
	max-height:0;
	overflow: hidden;
	transition: all .2s ease-in-out;
}
.subnavigation .subnavigation-menu ul li.subnavigation-toggle.opened ul {
	max-height: 999px;
	visibility: visible;
}
.subnavigation .subnavigation-menu ul li ul li {
	border-bottom-width: 0;
}
.subnavigation .subnavigation-menu ul > li a {
	padding: .75rem 2rem .75rem 1rem;
	display: block;
	position: relative;
}
.subnavigation .subnavigation-menu ul > li a:after {
	content: '\f105';
    font: var(--fa-font-sharp-regular);
	position: absolute;
	right: .75rem;
	top: 50%;
	margin-top: -0.5rem;
}
.subnavigation .subnavigation-menu ul > li a:hover {
	background-color: var(--light-red);
	text-decoration: none;
}
.subnavigation .subnavigation-menu ul > li.subnavigation-toggle a:after {
	transform: rotate(90deg);
	transition: all .2s ease-in-out;
}
.subnavigation .subnavigation-menu ul li ul li a {
	padding-left: 1.5rem;
}
.subnavigation .subnavigation-menu ul > li.subnavigation-toggle.opened > a,
.subnavigation .subnavigation-menu a.active,
.subnavigation li.subnavigation-toggle.active > a {
	font-weight: 700;
}
.subnavigation .subnavigation-menu ul > li:not(.subnavigation-toggle) a.active {
	padding-left: 2rem;
	padding-right: .75rem;
}
.subnavigation .subnavigation-menu ul > li:not(.subnavigation-toggle) a.active:after {
	left: .75rem;
	right: auto;
}
.subnavigation .subnavigation-menu ul > li.subnavigation-toggle.opened > a:after {
	transform: rotate(270deg);
}
.subnavigation .subnavigation-menu ul > li.subnavigation-toggle.opened ul li a:after,
.subnavigation .subnavigation-menu ul > li.subnavigation-toggle ul li a:after {
	transform: rotate(0deg);
}
@media only screen and (min-width: 992px) {
	#subnavigation {
		transition: all .3s ease-in-out;
	}
	#subnavigation.sticky-lg-top {
		box-shadow: 0px 6px 12px -3px rgba(0,0,0,0.05);
	}
	.subnavigation a.subnavigation-brand {
		font-size: 1.125rem;	
	}
	.subnavigation .subnavigation-menu {
		width: 100%;
		position: relative;
		top: auto;
		right: auto;
		max-width: 100%;
		border-radius: 0 !important;
		box-shadow: none !important;
		overflow: visible;
	}
	.subnavigation .subnavigation-menu ul > li {
		margin: 0 1rem 0 0;
		font-size: .875rem;
		border-width: 0 !important;
	}
	.subnavigation .subnavigation-menu ul {
		display: flex;
		justify-content:start;
		align-items: center;
		margin:0;
		padding:0;
	}
	.subnavigation .subnavigation-menu ul > li a {
		display: inline-block;
		padding:0;
		cursor: pointer;
	}
	.subnavigation .subnavigation-menu ul > li a:hover {
		background: transparent;
		color: var(--secondary);
	}
	.subnavigation .subnavigation-menu ul > li a:after {
		display: none;
	}
	.subnavigation .subnavigation-menu ul > li.subnavigation-toggle {
		position: relative;
	}
	.subnavigation .subnavigation-menu ul > li.subnavigation-toggle > a {
		padding-right: 2rem;
	}
	.subnavigation .subnavigation-menu ul > li.subnavigation-toggle > a:after {
		display: block;
	}
	.subnavigation .subnavigation-menu ul li ul {
		position: absolute;
		z-index: 99;
		top: calc(100% + .5rem);
		display: block;
		background-color: var(--white);
		border-radius: 1.125rem;
		box-shadow: 0 1rem 3rem rgba(28,28,28,.175);
		min-width: 15rem;
		transition: all .1s ease-in;
	}
	.subnavigation .subnavigation-menu ul > li:not(.subnavigation-toggle) a.active,
	.subnavigation .subnavigation-menu ul > li:not(.subnavigation-toggle) a {
		padding: .75rem 1rem;
	}
}

/* Footer */
footer#footer {
	overflow: hidden;
	position: relative;
}
footer#footer a:not(.btn, .arrow-link) {
	text-decoration: underline;
}
footer#footer.curved-top:before,
body.footer-top-white footer#footer.curved-top:before {
	background-color: #fff;
}
body.footer-top-secondary footer#footer.curved-top:before {
	background-color: var(--secondary);
}
body.footer-top-primary footer#footer.curved-top:before {
	background-color: var(--primary);
}
body.footer-top-secondary footer#footer.curved-top:before {
	background-color: var(--secondary);
}
body.footer-top-warning footer#footer.curved-top:before {
	background-color: var(--warning);
}
body.footer-top-gold footer#footer.curved-top:before {
	background-color: var(--gold);
}
body.footer-top-black footer#footer.curved-top:before {
	background-color: var(--gray-900);
}
body.footer-top-light-red footer#footer.curved-top:before {
	background-color: var(--light-red);
}
body.footer-top-faded-red footer#footer.curved-top:before {
	background-color: var(--faded-red);
}
body.footer-top-light-gray footer#footer.curved-top:before {
	background-color: var(--gray-100);
}
footer#footer .navbar-expand.footer-social-icons a {
	color: var(--white);
	transition: all .2s ease-in-out;
	font-size: 1.85rem;
}
footer#footer .navbar-expand.footer-social-icons a:hover {
	color: var(--warning);
}
footer#footer .navbar-expand.footer-social-icons .navbar-nav {
	justify-content: center;
}
footer#footer {
	background: var(--primary);
}
@media only screen and (min-width: 992px) {
	footer#footer {
		background: linear-gradient(to right,  #ffcc21 0%,#ffcc21 50%,#860038 50%,#860038 100%);
	}
	footer#footer .navbar-expand.footer-social-icons .navbar-nav {
		justify-content: left;
	}
	
}
@media only screen and (min-width: 1200px) {
	footer#footer:after {
		content: '';
		position: absolute;
		right:0;
		bottom:0;
		z-index: 0;
		width: 350px;
		height: 327.47px;
		background-position: center center;
		background-size: cover;
		background-image: url(/_resources/img/panther-footer.png);
		background-repeat: no-repeat;
		opacity: .2;
		filter: contrast(200%);
	}
}