/*
Item: CSS3 Full Responsive Dropdown Menu
Author: https://codecanyon.net/user/JN0iZzze
Version: 1.2
*/

/*******************************************/
/***            Menu Container           ***/
/*******************************************/

.submenu_container { margin: 0px 0px 0px 0px; display: block; width: 100%; max-width: 1200px; clear: both; float: none; border-radius: 0px; background: #FFF; }
.submenu_container > ul { position: relative; list-style: none; display: block; margin: 0 auto 20px auto; padding: 0; width: auto !important; height: 0px; overflow: hidden; }
.submenu_container > ul > li { position: relative; width: 100%; height: auto !important; display: block; padding: 0; margin: 10px 0px;  }
.submenu_container > ul > li > a:link, .submenu_container > ul > li > a:visited { margin: 0; display: block; color: #222; text-decoration: none; background: #FFF; font-size: 16px; padding: 0px; font-family: "MarrSans", Arial, sans-serif; text-transform: uppercase; letter-spacing: 0px; }
.submenu_container > ul > li > a:hover { margin: 0; display: block; color: #6c737f; text-decoration:  underline; background: #FFF; font-size: 16px; padding: 10px 0px; font-family: "MarrSans", Arial, sans-serif; text-transform: uppercase; letter-spacing: 0px;}

/** On-Page Hightlight and On-Page Hovers **/
body.about .submenu_container > ul > li > a#subnav-about,
body.leadership .submenu_container > ul > li > a#subnav-leadership,
body.staff .submenu_container > ul > li > a#subnav-staff,
body.building .submenu_container > ul > li > a#subnav-building,
body.rentals .submenu_container > ul > li > a#subnav-rentals,
body.employment .submenu_container > ul > li > a#subnav-employment { color:#6c737f; background: #FFFFFF; padding: 0px; }

body.about .submenu_container > ul > li > a#subnav-about:hover,
body.leadership .submenu_container > ul > li > a#subnav-leadership:hover,
body.staff .submenu_container > ul > li > a#subnav-staff:hover,
body.building .submenu_container > ul > li > a#subnav-building:hover,
body.rentals .submenu_container > ul > li > a#subnav-rentals:hover,
body.employment .submenu_container > ul > li > a#subnav-employment:hover { color:#6c737f; background: #FFFFFF; padding: 0px 0px; }

body.support .submenu_container > ul > li > a#subnav-support,
body.membership .submenu_container > ul > li > a#subnav-membership,
body.specialevents .submenu_container > ul > li > a#subnav-specialevents,
body.junior .submenu_container > ul > li > a#subnav-junior,
body.supporters .submenu_container > ul > li > a#subnav-supporters { color:#6c737f; background: #FFFFFF; padding: 0px; }

body.support .submenu_container > ul > li > a#subnav-support:hover,
body.membership .submenu_container > ul > li > a#subnav-membership:hover,
body.specialevents .submenu_container > ul > li > a#subnav-specialevents:hover,
body.junior .submenu_container > ul > li > a#subnav-junior:hover,
body.supporters .submenu_container > ul > li > a#subnav-supporters:hover { color:#6c737f; background: #FFFFFF; padding: 10px 0px; }


body.visit .submenu_container > ul > li > a#subnav-visit,
body.accessibility .submenu_container > ul > li > a#subnav-accessibility,
body.eatstay .submenu_container > ul > li > a#subnav-eatstay,
body.todo .submenu_container > ul > li > a#subnav-todo,
body.tours .submenu_container > ul > li > a#subnav-tours,
body.transportation .submenu_container > ul > li > a#subnav-transportation { color:#6c737f; background: #FFFFFF; padding: 0px;  }

body.visit .submenu_container > ul > li > a#subnav-visit:hover,
body.accessibility .submenu_container > ul > li > a#subnav-accessibility:hover,
body.eatstay .submenu_container > ul > li > a#subnav-eatstay:hover,
body.todo .submenu_container > ul > li > a#subnav-todo:hover,
body.tours .submenu_container > ul > li > a#subnav-tours:hover,
body.transportation .submenu_container > ul > li > a#subnav-transportation:hover { color:#6c737f; background: #FFFFFF; padding: 0px 0px; }

body.tickets .submenu_container > ul > li > a#subnav-tickets,
body.subscriptions .submenu_container > ul > li > a#subnav-subscriptions,
body.gifts .submenu_container > ul > li > a#subnav-gifts,
body.discounts .submenu_container > ul > li > a#subnav-discounts,
body.groups .submenu_container > ul > li > a#subnav-groups,
body.packages .submenu_container > ul > li > a#subnav-packages,
body.faqs .submenu_container > ul > li > a#subnav-faqs { color:#6c737f; background: #FFFFFF; padding: 0px; }

body.tickets .submenu_container > ul > li > a#subnav-tickets:hover,
body.subscriptions .submenu_container > ul > li > a#subnav-subscriptions:hover,
body.gifts .submenu_container > ul > li > a#subnav-gifts:hover,
body.discounts .submenu_container > ul > li > a#subnav-discounts:hover,
body.groups .submenu_container > ul > li > a#subnav-groups:hover,
body.packages .submenu_container > ul > li > a#subnav-packages:hover,
body.faqs .submenu_container > ul > li > a#subnav-faqs:hover { color:#6c737f; background: #FFFFFF; padding: 0px 0px; }

body.civic .submenu_container > ul > li > a#subnav-civic,
body.conversations .submenu_container > ul > li > a#subnav-conversations,
body.projects .submenu_container > ul > li > a#subnav-projects,
body.fellows .submenu_container > ul > li > a#subnav-fellows { color:#6c737f; background: #FFFFFF; padding: 0px; }

body#news .submenu_container > ul > li > a#subnav-news,
body.events .submenu_container > ul > li > a#subnav-events,
body#releases .submenu_container > ul > li > a#subnav-releases,
body.press .submenu_container > ul > li > a#subnav-press,
body.media .submenu_container > ul > li > a#subnav-media, 
body#photos .submenu_container > ul > li > a#subnav-photos,
body#videos .submenu_container > ul > li > a#subnav-videos { color:#6c737f; background: #FFFFFF; padding: 0px; }

body#news .submenu_container > ul > li > a#subnav-news:hover,
body.events .submenu_container > ul > li > a#subnav-events:hover,
body#releases .submenu_container > ul > li > a#subnav-releases:hover,
body.press .submenu_container > ul > li > a#subnav-press:hover,
body.media .submenu_container > ul > li > a#subnav-media:hover, 
body#photos .submenu_container > ul > li > a#subnav-photos:hover,
body#videos .submenu_container > ul > li > a#subnav-videos:hover { color:#6c737f; background: #FFFFFF; padding: 0px 0px; }

body.people .submenu_container > ul > li > a#subnav-people,
body.faculty .submenu_container > ul > li > a#subnav-faculty,
body.former .submenu_container > ul > li > a#subnav-former,
body.staff .submenu_container > ul > li > a#subnav-staff,
body.board .submenu_container > ul > li > a#subnav-board,
body.alumni .submenu_container > ul > li > a#subnav-alumni,
body.students .submenu_container > ul > li > a#subnav-students { color:#6c737f; background: #FFFFFF; padding: 0px; }

.mobile_sub-collapser { display: block; height: 22px; padding: 0px; color: #fff; font-size: 16px; line-height: 27px; font-family: "MarrSans", Arial, sans-serif; text-transform: uppercase; background: #FFF;}
.mobile_sub-collapser:before { content: '\2261'; display: block; float: left; margin: -1px 8px 0 0; font-size: 30px; }
#hidden_sub-menu_collapser { display: none; }
#hidden_sub-menu_collapser:checked + ul { height: auto; min-height:40px; max-height:2999px; }
.submenu_container > ul.collapsed { height: auto; min-height:40px; max-height:2999px; }


@media only screen and (min-width: 1211px)  {

header #content nav .mobile_sub-collapser { display: none; }
.mobile_sub-collapser { display: none; }
.submenu_container { margin: 20px 0px; display: block; height: 80px; width: 100%; max-width: 1200px; clear: both; float: none; border-radius: 0px; background: #fff; }
.submenu_container > ul { margin: 0; width: 100%; overflow: visible; }
.submenu_container > ul > li { position: static; float: left;  }
.submenu_container > ul > li:hover { margin: 0; color:#fff; }
.submenu_container > ul > li > a { box-shadow: none; border: none; }
.submenu_container .menu_dropdown_block { position: absolute; opacity: 0; }
.submenu_container > ul > li:hover > .menu_dropdown_block { overflow: visible; opacity: 1; margin-left: 0;  }


}

@media only screen and (min-width: 1201px) and (max-width: 1210px) {
	/* Snap to Full Width Nav */
header #content nav .mobile_sub-collapser { display: none; }
.mobile_sub-collapser { display: none; }
.submenu_container { margin: 20px 0px; display: block; height: 80px; width: 100%; max-width: 1200px; clear: both; float: none; border-radius: 0px; background: #fff; }

}

@media only screen and (min-width: 901px) and (max-width: 1200px) {
	/* LAPTOP styles go here */

header #content nav .mobile_sub-collapser { display: none; }
.mobile_sub-collapser { display: none; }
.submenu_container { margin: 20px 0px; display: block; height: 80px; width: 100%; max-width: 1200px; clear: both; float: none; border-radius: 0px; background: #fff; }
.submenu_container > ul { transition: all 100ms linear; -moz-transition: all 100ms linear; -o-transition: all 100ms linear; -webkit-transition: all 100ms linear; width: 100%;  background: none; overflow: visible; }
.submenu_container > ul > li { white-space: nowrap; position: static; float: left; background: inherit; }
.submenu_container > ul > li > a { padding: 4px 0; box-shadow: none; border: none; font-size: 16px; }
.submenu_container > ul > li:hover { margin-left: 0px; background: #FFF; }
.submenu_container > ul > li:hover > a { padding: 0px 0px; background: #FFF; text-decoration: underline; color:#6c737f;}
.submenu_container .menu_dropdown_block { position: absolute; opacity: 0; }
.submenu_container > ul > li:hover > .menu_dropdown_block { overflow: visible; opacity: 1; margin-left: 0px; }
.submenu_container > ul > li.right { float: right; }
.submenu_container .menu_dropdown_block .column { float: left; }
.submenu_container .menu_dropdown_block .column.bordered {  border: none; }
ul.menu_submenu_block { min-width: 175px; }
ul.menu_submenu_block > li { }
ul.menu_submenu_block > li > .menu_submenu_block { position: absolute; top: 0; height: auto; min-width: 175px; left: 100%; box-shadow: 1px 1px 3px rgba(0,0,0,0.2), inset 1px 0 0 rgba(0,0,0,0.1); background: #fff; }
.submenu_container .menu_dropdown_block > ul.menu_submenu_block > li > ul.menu_submenu_block { margin-left: 0; }
ul.menu_submenu_block > li > .menu_submenu_block a { padding-left: 20px !important; }
ul.menu_submenu_block.right-align li a { text-align: right; }
ul.menu_submenu_block.right-align li.has-dropdown > a:after { content: '\2039'; right: auto; left: 10px; }
ul.menu_submenu_block.right-align li a .fa { margin-right: 0; margin-left: 6px; }
ul.menu_submenu_block.right-align > li .menu_submenu_block { left: auto; right: 100%; box-shadow: 2px 2px 0 rgba(0,0,0,0.1); }
ul.menu_submenu_block.right-align li.has-dropdown > a:after { content: '\2039'; right: auto; left: 10px; }
ul.menu_submenu_block > li.has-dropdown:hover > .menu_submenu_block { color:#fff; background: #FFF;}
.submenu_container .menu_dropdown_block.half_width { width: 70%; right: 0px; }
li.menu_submenu a:hover { color:#fff; background:#FFF; }

}

/* ---------------------------- TABLET ONLY  STYLES ------------------------ */

@media only screen and (min-width: 700px) and (max-width: 900px) {
	/* TABLET styles go here */
	
header #content nav .mobile_sub-collapser { }
.mobile_sub-collapser {  }
.submenu_container { width: 100%; padding: 0; margin: 0 auto 20px auto; }
.submenu_container > ul { transition: all 100ms linear; -moz-transition: all 100ms linear; -o-transition: all 100ms linear; -webkit-transition: all 100ms linear; width: 100%;  background: none; overflow: visible; margin: 0 auto;  }
.submenu_container > ul > li { position: static; float: left; background: inherit; }
.submenu_container > ul > li > a { padding: 4px 15px; box-shadow: none; border: none;  font-size: 14px;  }
.submenu_container > ul > li:hover { margin-left: 0px; background: #FFF; }
.submenu_container > ul > li:hover > a { padding: 0px 0px; background: #FFF; text-decoration: underline; color:#6c737f;}
.submenu_container .menu_dropdown_block { position: absolute; opacity: 0; }
.submenu_container > ul > li:hover > .menu_dropdown_block { overflow: visible; opacity: 1; margin-left: 0; }
.submenu_container > ul > li.right { float: right; }
.submenu_container .menu_dropdown_block .column { float: left; }
.submenu_container .menu_dropdown_block .column.bordered {  border: none; }
ul.menu_submenu_block { min-width: 175px; }
ul.menu_submenu_block > li { }
ul.menu_submenu_block > li > .menu_submenu_block { position: absolute; top: 0; height: auto; min-width: 175px; left: 100%; box-shadow: 1px 1px 3px rgba(0,0,0,0.2), inset 1px 0 0 rgba(0,0,0,0.1); background: #fff; }
.submenu_container .menu_dropdown_block > ul.menu_submenu_block > li > ul.menu_submenu_block { margin-left: 0; }
ul.menu_submenu_block > li > .menu_submenu_block a { padding-left: 20px !important; }
ul.menu_submenu_block.right-align li a { text-align: right; }
ul.menu_submenu_block.right-align li.has-dropdown > a:after { content: '\2039'; right: auto; left: 10px; }
ul.menu_submenu_block.right-align li a .fa { margin-right: 0; margin-left: 6px; }
ul.menu_submenu_block.right-align > li .menu_submenu_block { left: auto; right: 100%; box-shadow: 2px 2px 0 rgba(0,0,0,0.1); }
ul.menu_submenu_block.right-align li.has-dropdown > a:after { content: '\2039'; right: auto; left: 10px; }
ul.menu_submenu_block > li.has-dropdown:hover > .menu_submenu_block { color:#fff; background: #FFF;}
.submenu_container .menu_dropdown_block.half_width { width: 70%; right: 0px; }
li.menu_submenu a:hover { color:#fff; background:#FFF; }


}
/***************/

.submenu_container.topfixed { position: fixed; width: 100%; top: 0px; left: 0px; border-radius: 0; }
.submenu_container.centered > ul { float: none; margin: 0 auto; max-width: 1000px; border-radius: 0; }
.submenu_container.centered > ul { float: none; margin: 0 auto; max-width: 1000px; }

/* ---------------------------- MOBILE ONLY  STYLES ------------------------ */
 
@media screen and (max-width: 549px) {
	/*MOBILE styles go here*/
	
	#submenu { }
}