/*-- Mobile Menus --*/
.mobile-menu-button { position: fixed; z-index: 99999; width: 70px; }

body.admin-bar .mobile-menu-button { margin-top: 32px; }

@media screen and (max-width: 782px) { body.admin-bar .mobile-menu-button { margin-top: 46px; } }

.mobile-menu-wrapper, .mobile-menu-wrapper-left, .mobile-menu-wrapper-right, .mobile-menu-wrapper-fade { position: fixed; top: 0; height: 100vh; width: 100%; padding: 30px; background: #333; z-index: 9999; }

.mobile-menu-wrapper .site-branding, .mobile-menu-wrapper-left .site-branding, .mobile-menu-wrapper-right .site-branding, .mobile-menu-wrapper-fade .site-branding { background: transparent; padding: 0; }

.mobile-menu-wrapper .site-branding img, .mobile-menu-wrapper-left .site-branding img, .mobile-menu-wrapper-right .site-branding img, .mobile-menu-wrapper-fade .site-branding img { max-height: auto; max-width: auto; }

.mobile-menu-wrapper ul, .mobile-menu-wrapper-left ul, .mobile-menu-wrapper-right ul, .mobile-menu-wrapper-fade ul { margin: 0; padding: 0; list-style: none; }

.mobile-menu-wrapper ul li, .mobile-menu-wrapper-left ul li, .mobile-menu-wrapper-right ul li, .mobile-menu-wrapper-fade ul li { margin-bottom: 10px; }

.mobile-menu-wrapper ul li a, .mobile-menu-wrapper-left ul li a, .mobile-menu-wrapper-right ul li a, .mobile-menu-wrapper-fade ul li a { color: #fff; text-decoration: none; font-size: 1rem; font-weight: normal; }

.mobile-menu-wrapper ul#mobile-menu > li, .mobile-menu-wrapper-left ul#mobile-menu > li, .mobile-menu-wrapper-right ul#mobile-menu > li, .mobile-menu-wrapper-fade ul#mobile-menu > li { width: 100%; }

.mobile-menu-wrapper ul#mobile-menu > li.menu-item-has-children, .mobile-menu-wrapper-left ul#mobile-menu > li.menu-item-has-children, .mobile-menu-wrapper-right ul#mobile-menu > li.menu-item-has-children, .mobile-menu-wrapper-fade ul#mobile-menu > li.menu-item-has-children { margin-bottom: 0; position: relative; }

.mobile-menu-wrapper ul#mobile-menu > li.menu-item-has-children:before, .mobile-menu-wrapper-left ul#mobile-menu > li.menu-item-has-children:before, .mobile-menu-wrapper-right ul#mobile-menu > li.menu-item-has-children:before, .mobile-menu-wrapper-fade ul#mobile-menu > li.menu-item-has-children:before { display: inline-block; height: 1em; width: 1em; content: ' '; background-image: url(down.png); background-position: center center; background-repeat: no-repeat; position: absolute; right: 10%; top: 0.5em; transition: 300ms; cursor: pointer; }

.mobile-menu-wrapper ul#mobile-menu > li.menu-item-has-children li:last-child, .mobile-menu-wrapper-left ul#mobile-menu > li.menu-item-has-children li:last-child, .mobile-menu-wrapper-right ul#mobile-menu > li.menu-item-has-children li:last-child, .mobile-menu-wrapper-fade ul#mobile-menu > li.menu-item-has-children li:last-child { margin-bottom: 0; }

.mobile-menu-wrapper ul#mobile-menu > li.menu-item-has-children > a, .mobile-menu-wrapper-left ul#mobile-menu > li.menu-item-has-children > a, .mobile-menu-wrapper-right ul#mobile-menu > li.menu-item-has-children > a, .mobile-menu-wrapper-fade ul#mobile-menu > li.menu-item-has-children > a { margin-bottom: 10px; }

.mobile-menu-wrapper ul#mobile-menu > li a, .mobile-menu-wrapper-left ul#mobile-menu > li a, .mobile-menu-wrapper-right ul#mobile-menu > li a, .mobile-menu-wrapper-fade ul#mobile-menu > li a { width: 60%; display: inline-block; }

.mobile-menu-wrapper ul#mobile-menu > li > ul.sub-menu, .mobile-menu-wrapper-left ul#mobile-menu > li > ul.sub-menu, .mobile-menu-wrapper-right ul#mobile-menu > li > ul.sub-menu, .mobile-menu-wrapper-fade ul#mobile-menu > li > ul.sub-menu { padding: 10px 0; background-color: transparent; display: none; margin-bottom: 10px; }

.mobile-menu-wrapper ul#mobile-menu > li > ul.sub-menu > li, .mobile-menu-wrapper-left ul#mobile-menu > li > ul.sub-menu > li, .mobile-menu-wrapper-right ul#mobile-menu > li > ul.sub-menu > li, .mobile-menu-wrapper-fade ul#mobile-menu > li > ul.sub-menu > li { width: 100%; }

.mobile-menu-wrapper ul#mobile-menu > li > ul.sub-menu > li a, .mobile-menu-wrapper-left ul#mobile-menu > li > ul.sub-menu > li a, .mobile-menu-wrapper-right ul#mobile-menu > li > ul.sub-menu > li a, .mobile-menu-wrapper-fade ul#mobile-menu > li > ul.sub-menu > li a { font-size: 1.25rem !important; }

.mobile-menu-wrapper ul#mobile-menu > li.open:before, .mobile-menu-wrapper-left ul#mobile-menu > li.open:before, .mobile-menu-wrapper-right ul#mobile-menu > li.open:before, .mobile-menu-wrapper-fade ul#mobile-menu > li.open:before { transform: rotate(180deg); }

.mobile-menu-wrapper ul#mobile-social-menu li a, .mobile-menu-wrapper-left ul#mobile-social-menu li a, .mobile-menu-wrapper-right ul#mobile-social-menu li a, .mobile-menu-wrapper-fade ul#mobile-social-menu li a { font-size: 1rem; }

.mobile-menu-wrapper-left { transition: 0.3s !important; left: calc(-1 * 100%); }

.mobile-menu-wrapper-right { transition: 0.3s !important; right: calc(-1 * 100%); }

.mobile-menu-wrapper-fade { left: 0px; display: none; }

ul#mobile-menu { margin-bottom: 10px; margin-top: 10px; text-transform: none; }

ul#mobile-social-menu li { display: inline-block; margin: 10px; }

ul#mobile-social-menu li:first-child { margin-left: 0; }

ul#mobile-social-menu li:last-child { margin-right: 0; }

ul#mobile-social-menu li a { color: blue; }

body.mobile-menu-active nav.mobile-menu-wrapper-left { left: 0; }

body.mobile-menu-active nav.mobile-menu-wrapper-right { right: 0; }
