/** Main Nav CSS for Emory Signature Theme **/
.drop_arrow{ display: none; position: absolute; right: 0; padding: 1.75rem; top: 0; cursor: pointer;}
.drop_arrow svg{ width: 1.25rem;}
.drop_arrow_back{ display: none; position: absolute; right: 0; padding: 1.75rem; top: 0; cursor: pointer;}
.drop_arrow_back svg{ width: 1.25rem; transform: rotate(180deg);}
.drop_arrow_back svg, .drop_arrow_back svg *{ fill: #fff !important;}

#topnav{ margin: 0; padding: 0; list-style: none; width: 100%; display: flex; align-items: center; /* justify-content: space-between; */ justify-content: flex-end;}

/** level 1 items **/
#topnav > li{ /* position: relative; */ padding: 2.22rem 1.5rem;}
.standard_nav #topnav > li{ position: relative;}
#topnav li > a{ font-size: 1.05555rem; color: var(--color-base-1); text-transform: uppercase; font-weight: 800; letter-spacing: 0.1em;}
#topnav > li > a{ white-space: nowrap; }
#topnav li > a:hover{ color: var(--dark-accent);}

/** Drop Nav - standard **/
.drop_level2_wrapper{ position: absolute; left: 0; transform: translateX(-50%); top: 100%; min-width: 8.2222rem; background-color: var(--color-base-1); display: none; padding: 2rem;}
#topnav li ul{ margin: 0; padding: 0; list-style: none; }
#topnav li ul li{}
#topnav li ul li a{ font-size: 1rem; font-weight: 400; color: #fff; color: var(--color-overlay-1); letter-spacing: 0.05rem; display: block; margin: 0 0 2rem 0;}

#topnav li ul li a:hover{ color: var(--color-overlay-1);}

/** Drop Nav with CTAs - Enhanced Option **/

.nav_drop_left{ width: 24%; border-right: 3px solid var(--color-overlay-1); display: flex; flex-direction: column; /* justify-content: space-between; */ padding-right: 6%;}
.navcta_item{ text-align: left;}
.navcta_item:first-child{ margin-bottom: 2rem;}
.navcta_item .cta_title, .navcta_item .cta_title a{ color: #fff; color: var(--color-overlay-1); display: block; font-size: 1.222rem; line-height: 135%; text-transform: uppercase; font-family: 'Merriweather', serif; font-weight: 700; letter-spacing: 0.1em;}
.navcta_item .cta_title a:hover{ text-decoration: underline;}
.navcta_item .cta_text{ display: block; color: #fff; color: var(--color-overlay-1); font-size: 1.05555rem; line-height: 147%; letter-spacing: 0.01em;}

.nav_drop_subnav{ padding: 0 0 0 9%; width: 61%;}

#topnav li .drop_level2_wrapper.enhanced_drop ul{ column-count: 2;}
#topnav li .drop_level2_wrapper.enhanced_drop ul li{ display: block;}



/**** MEDIA QUERIES ****/
/* @media all and (min-width: 1650px) {
	#topnav > li{ position: relative;}
} */


@media all and (min-width: 1200px ){
	#topnav li ul li:hover a{ font-weight: 700;}
	#topnav li:hover > .drop_level2_wrapper{ display: block;}
	
	#topnav li:hover{ background-color: var(--color-base-1);}
	#topnav li:hover a{ color: #fff; color: var(--color-overlay-1);}
	
	.standard .drop_level2_wrapper{ left: 50%; overflow-x: hidden; overflow-y: auto;}
	/* .standard li:first-child > .drop_level2_wrapper{ transform: none; left: 0;} */
	.standard li:last-child > .drop_level2_wrapper{ transform: none; left: auto; right: 0;}
	
	.drop_level2_wrapper.enhanced_drop{ width: 100vw; max-width: 49.6111rem; transform: none;}
	.drop_level2_wrapper.enhanced_drop.right-align{ left: auto; right: 0; transform: none;}
	.drop_level2_wrapper.enhanced_drop.right-align.right-align-zero{ transform: none;}
}


@media all and ( max-width: 1650px ){
	
	#topnav > li{ padding: 2.22rem 1rem;}
	#topnav li > a{ font-size: 1rem;}
}

@media all and (max-width: 1450px ){
	#topnav > li{ padding: 2.22rem 0.75rem;}
}
 
@media all and (max-width: 1200px ){
	#mainnav{ background: #fff; position: fixed; right: 0; top: 122px; transform: translateX(100%); transition: all 0.3s; height: 100%; max-height: calc(100vh - 122px); overflow-y: auto; overflow-x: hidden;}
	#mainnav.open{ transform: translateX(0);}
	
	#topnav{ flex-direction: column;}
	#topnav > li{ border-bottom: 1px solid rgba(0,0,0,0.15); width: 100%; position: relative;}
	#topnav > li:last-child{ border-bottom: none;}
	
	.drop_arrow{ display: block;}
	
	.drop_level2_wrapper{ position: fixed; display: block; width: 100%; max-width: calc(100% - 4rem); transform: translateX(calc(100vw + 2rem)); top: 0; right: 0; transition: all 0.3s; left: auto; height: 100%; /* max-height: calc(100vh - 122px); overflow-y: auto; overflow-x: hidden; */ /* padding-bottom: 200px; */}
	.drop_level2_wrapper.open2{ transform: translateX(0); left: 0rem; z-index: 999;}
	
	.drop_arrow_back{ display: block; position: relative; padding: 0 2rem 2rem 0;}
	
	#mainnav{ max-height: 100%;} /* 11-16-21 */
	#topnav{ display: block;} /* 11-16-21 */
	#topnav{ max-height: calc(100vh - 122px); overflow-y: auto; overflow-x: hidden;} /* 11-16-21 */
	.drop_level2_wrapper{ overflow-y: auto; overflow-x: hidden;  max-height: calc(100vh - 122px - 4rem);} /* 11-16-21 */
	
	#topnav::after, .drop_level2_wrapper::after{ content:""; display: block; width: 100%; height: 10rem;} /* 11-16-21 */
}

@media all and (max-width: 767px ){
	.drop_level2_wrapper > .flex_wrapper{ flex-direction: column; align-items: center;}
	.nav_drop_left{ width: 100%; padding-right: 0; border-right: 0; border-bottom: 3px solid #fff; padding-bottom: 2rem; margin-bottom: 2rem;}
	#topnav li .drop_level2_wrapper.enhanced_drop ul{ column-count: 1;}
	#topnav li .drop_level2_wrapper.enhanced_drop ul li{ display: block;}
	
	.nav_drop_subnav{ width: 100%; padding: 0;}
	
	#mainnav{ top: 68px;} /* 11-16-21 */
	#topnav{ max-height: calc(100vh - 68px);  overflow-y: auto; overflow-x: hidden;} /* 11-16-21 */
	.drop_level2_wrapper{ max-height: calc(100vh - 68px - 4rem);} /* 11-16-21 */
}

/* Level 2 and 3 Mobile view styling */
.open_nav #topnav .drop_level2_wrapper_mobile ul {
    margin-left: 1.5rem;
}