A Pen by Chase Harrison on CodePen.
Created
February 28, 2019 12:08
-
-
Save ChaseH88/146359b6330d2fc6c7c5afbd38c8d0b8 to your computer and use it in GitHub Desktop.
Menu Animation Script
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <nav id="mMenuCMS" class="mm-menu, cms-responsive-menu mm-menu mm-vertical mm-ismenu mm-current mm-opened"> | |
| <ul class="mm-list mm-panel mm-opened mm-current" id="mm-m0-p0"> | |
| <li class="mm-selected mm-opened"><a href="#">Home</a></li> | |
| <li><a class="mm-subopen" href="#mm-m0-p1"><span class="offScreen">Expand menu item Office</span></a><a href="/cms/One.aspx?portalId=974062&pageId=974070">Office</a> | |
| <ul class="mm-list mm-panel" id="mm-m0-p1"> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974072">About Our Doctor</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974073">Our Staff</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974074">Office Policies</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974075">Financial</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974076">Map & Directions</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974078">Appointment Request</a></li> | |
| </ul> | |
| </li> | |
| <li><a class="mm-subopen" href="#mm-m0-p2"><span class="offScreen">Expand menu item Patient</span></a><a href="/cms/One.aspx?portalId=974062&pageId=974079">Patient</a> | |
| <ul class="mm-list mm-panel" id="mm-m0-p2"> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974080">First Visit</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974081">FAQ</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974082">Patient Forms</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974085">Common Problems</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974086">Emergencies</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974087">Oral Hygiene</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974088">Foods to Avoid</a></li> | |
| </ul> | |
| </li> | |
| <li><a class="mm-subopen" href="#mm-m0-p3"><span class="offScreen">Expand menu item Treatment</span></a><a href="/cms/One.aspx?portalId=974062&pageId=974089">Treatment</a> | |
| <ul class="mm-list mm-panel" id="mm-m0-p3"> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974090">Early Treatment</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974091">Adolescent Treatment</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974092">Adult Treatment</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974093">Types of Braces</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974094">Retention</a></li> | |
| </ul> | |
| </li> | |
| <li><a class="mm-subopen" href="#mm-m0-p4"><span class="offScreen">Expand menu item Miscellaneous</span></a><a href="/cms/One.aspx?portalId=974062&pageId=974095">Miscellaneous</a> | |
| <ul class="mm-list mm-panel" id="mm-m0-p4"> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974096">Related Links</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974097">Glossary</a></li> | |
| </ul> | |
| </li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974098">Contact Us</a></li> | |
| <li><a href="/cms/One.aspx?portalId=974062&pageId=974099">Thank You</a></li> | |
| <div class="mobilePublishLink"> | |
| <ul></ul> | |
| </div> | |
| </ul> | |
| </nav> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $(window).load(function() { | |
| var delayClassTime = 100; | |
| $("a.mobileMenu").bind("click", function() { | |
| if (!$(this).hasClass("open") && $("#mMenuCMS > ul > li.mm-opened")) { | |
| $("#mMenuCMS > ul > li.mm-opened ul li").each(function() { | |
| $(this).addClass("visible"); | |
| }); | |
| } | |
| if (!$(this).hasClass("open")) { | |
| $(this).addClass("open"); | |
| $("#mm-blocker").addClass("openMenu"); | |
| $("#mMenuCMS > ul > li:first-child").addClass("visible"); | |
| $.parentLoop = setInterval(function() { | |
| $("#mMenuCMS > ul > li:not(.visible):first").each(function() { | |
| $(this).addClass("visible"); | |
| }); | |
| }, delayClassTime); | |
| } | |
| }); | |
| $("#mm-blocker").bind("click contextmenu", function() { | |
| if ($("a.mobileMenu").hasClass("open")) { | |
| $("a.mobileMenu").removeClass("open"); | |
| $(this).removeClass("openMenu"); | |
| clearInterval($.parentLoop); | |
| $("#mMenuCMS > ul > li").removeClass("visible"); | |
| } | |
| }); | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| html.mm-opened .mm-page, | |
| html.mm-opened #mm-blocker, | |
| html.mm-opened .mm-fixed-top, | |
| html.mm-opened .mm-fixed-bottom, | |
| html.mm-opened .mm-menu.mm-horizontal>.mm-panel { | |
| -webkit-transition: none .4s ease; | |
| -moz-transition: none .4s ease; | |
| -ms-transition: none .4s ease; | |
| -o-transition: none .4s ease; | |
| transition: none .4s ease; | |
| -webkit-transition-property: top, right, bottom, left, border; | |
| -moz-transition-property: top, right, bottom, left, border; | |
| -ms-transition-property: top, right, bottom, left, border; | |
| -o-transition-property: top, right, bottom, left, border; | |
| transition-property: top, right, bottom, left, border | |
| } | |
| html.mm-opened .mm-page, | |
| html.mm-opened #mm-blocker { | |
| left: 0%; | |
| top: 0; | |
| margin: 0; | |
| border: 0 solid rgba(0, 0, 0, 0) | |
| } | |
| html.mm-opened.mm-opening .mm-page, | |
| html.mm-opened.mm-opening #mm-blocker { | |
| border: 0 solid rgba(100, 100, 100, 0) | |
| } | |
| .mm-menu .mm-hidden { | |
| display: none | |
| } | |
| .mm-fixed-top, | |
| .mm-fixed-bottom { | |
| position: fixed; | |
| left: 0 | |
| } | |
| .mm-fixed-top { | |
| top: 0 | |
| } | |
| .mm-fixed-bottom { | |
| bottom: 0 | |
| } | |
| html.mm-opened .mm-page, | |
| .mm-menu>.mm-panel { | |
| -webkit-box-sizing: border-box; | |
| -moz-box-sizing: border-box; | |
| -ms-box-sizing: border-box; | |
| -o-box-sizing: border-box; | |
| box-sizing: border-box | |
| } | |
| html.mm-opened, | |
| html.mm-opened body { | |
| width: 100%; | |
| height: 100%; | |
| overflow: hidden; | |
| position: relative | |
| } | |
| html.mm-opened .mm-page { | |
| height: 100%; | |
| overflow: hidden; | |
| position: absolute | |
| } | |
| html.mm-background .mm-page { | |
| background: inherit | |
| } | |
| #mm-blocker { | |
| background: #fff; | |
| opacity: 0; | |
| display: none; | |
| width: 100%; | |
| height: 100%; | |
| position: absolute; | |
| z-index: 9999 | |
| } | |
| html.mm-opened #mm-blocker, | |
| html.mm-blocking #mm-blocker { | |
| display: block | |
| } | |
| .mm-menu.mm-current { | |
| display: block | |
| } | |
| .mm-menu { | |
| background: inherit; | |
| display: none; | |
| overflow: hidden; | |
| height: 100%; | |
| padding: 0; | |
| position: absolute; | |
| left: 0; | |
| top: 0; | |
| z-index: 0 | |
| } | |
| .mm-menu>.mm-panel { | |
| background: inherit; | |
| -webkit-overflow-scrolling: touch; | |
| overflow: scroll; | |
| overflow-x: hidden; | |
| overflow-y: auto; | |
| width: 100%; | |
| height: 100%; | |
| padding: 20px; | |
| position: absolute; | |
| top: 0; | |
| left: 100%; | |
| z-index: 0 | |
| } | |
| .mm-menu>.mm-panel.mm-opened { | |
| left: 0% | |
| } | |
| .mm-menu>.mm-panel.mm-subopened { | |
| left: -40% | |
| } | |
| .mm-menu>.mm-panel.mm-highest { | |
| z-index: 1 | |
| } | |
| .mm-menu>.mm-panel.mm-hidden { | |
| display: block; | |
| visibility: hidden | |
| } | |
| .mm-menu .mm-list { | |
| padding: 20px 0 | |
| } | |
| .mm-menu>.mm-list { | |
| padding: 20px 0 40px 0 | |
| } | |
| .mm-panel>.mm-list { | |
| margin-left: -20px; | |
| margin-right: -20px | |
| } | |
| .mm-panel>.mm-list:first-child { | |
| padding-top: 0 | |
| } | |
| .mm-list, | |
| .mm-list>li { | |
| list-style: none; | |
| display: block; | |
| padding: 0; | |
| margin: 0 | |
| } | |
| .mm-list { | |
| font: inherit; | |
| font-size: 14px | |
| } | |
| .mm-list a, | |
| .mm-list a:hover { | |
| text-decoration: none | |
| } | |
| .mm-list>li { | |
| position: relative | |
| } | |
| .mm-list>li>a, | |
| .mm-list>li>span { | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| color: inherit; | |
| line-height: 20px; | |
| display: block; | |
| padding: 10px 10px 10px 20px; | |
| margin: 0 | |
| } | |
| .mm-list>li:not(.mm-subtitle):not(.mm-label):not(.mm-noresults)::after { | |
| content: ''; | |
| border-bottom-width: 1px; | |
| border-bottom-style: solid; | |
| display: block; | |
| width: 100%; | |
| position: absolute; | |
| bottom: 0; | |
| left: 0 | |
| } | |
| .mm-list>li:not(.mm-subtitle):not(.mm-label):not(.mm-noresults):after { | |
| width: auto; | |
| margin-left: 20px; | |
| position: relative; | |
| left: auto | |
| } | |
| .mm-list a.mm-subopen { | |
| width: 40px; | |
| height: 100%; | |
| padding: 0; | |
| position: absolute; | |
| right: 0; | |
| top: 0; | |
| z-index: 2 | |
| } | |
| .mm-list a.mm-subopen::before { | |
| content: ''; | |
| border-left-width: 1px; | |
| border-left-style: solid; | |
| display: block; | |
| height: 100%; | |
| position: absolute; | |
| left: 0; | |
| top: 0 | |
| } | |
| .mm-list a.mm-subopen.mm-fullsubopen { | |
| width: 100% | |
| } | |
| .mm-list a.mm-subopen.mm-fullsubopen:before { | |
| border-left: none | |
| } | |
| .mm-list a.mm-subopen+a, | |
| .mm-list a.mm-subopen+span { | |
| padding-right: 5px; | |
| margin-right: 40px | |
| } | |
| .mm-list>li.mm-selected>a.mm-subopen { | |
| background: transparent | |
| } | |
| .mm-list>li.mm-selected>a.mm-fullsubopen+a, | |
| .mm-list>li.mm-selected>a.mm-fullsubopen+span { | |
| padding-right: 45px; | |
| margin-right: 0 | |
| } | |
| .mm-list a.mm-subclose { | |
| text-indent: 20px; | |
| padding-top: 30px; | |
| margin-top: -20px | |
| } | |
| .mm-list>li.mm-label { | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| font-size: 10px; | |
| text-transform: uppercase; | |
| text-indent: 20px; | |
| line-height: 25px; | |
| padding-right: 5px | |
| } | |
| .mm-list>li.mm-spacer { | |
| padding-top: 40px | |
| } | |
| .mm-list>li.mm-spacer.mm-label { | |
| padding-top: 25px | |
| } | |
| .mm-list a.mm-subopen:after, | |
| .mm-list a.mm-subclose:before { | |
| content: ''; | |
| border: 2px solid transparent; | |
| display: block; | |
| width: 7px; | |
| height: 7px; | |
| margin-bottom: -5px; | |
| position: absolute; | |
| bottom: 50%; | |
| -webkit-transform: rotate(-45deg); | |
| -moz-transform: rotate(-45deg); | |
| -ms-transform: rotate(-45deg); | |
| -o-transform: rotate(-45deg); | |
| transform: rotate(-45deg) | |
| } | |
| .mm-list a.mm-subopen:after { | |
| border-top: none; | |
| border-left: none; | |
| right: 18px | |
| } | |
| .mm-list a.mm-subclose:before { | |
| border-right: none; | |
| border-bottom: none; | |
| margin-bottom: -15px; | |
| left: 22px | |
| } | |
| .mm-menu.mm-vertical .mm-list .mm-panel { | |
| display: none; | |
| padding: 10px 0 10px 10px | |
| } | |
| .mm-menu.mm-vertical .mm-list .mm-panel li:last-child:after { | |
| border-color: transparent | |
| } | |
| .mm-menu.mm-vertical .mm-list li.mm-opened>.mm-panel { | |
| display: block | |
| } | |
| .mm-menu.mm-vertical .mm-list>li.mm-opened>a.mm-subopen { | |
| height: 40px | |
| } | |
| .mm-menu.mm-vertical .mm-list>li.mm-opened>a.mm-subopen:after { | |
| -webkit-transform: rotate(45deg); | |
| -moz-transform: rotate(45deg); | |
| -ms-transform: rotate(45deg); | |
| -o-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| top: 16px; | |
| right: 16px | |
| } | |
| html.mm-opened .mm-page { | |
| box-shadow: 0 0 20px rgba(0, 0, 0, .5) | |
| } | |
| .mm-ismenu { | |
| background: #333 | |
| } | |
| .mm-menu { | |
| color: rgba(255, 255, 255, .6) | |
| } | |
| .mm-menu .mm-list>li:after { | |
| border-color: rgba(0, 0, 0, .15) | |
| } | |
| .mm-menu .mm-list>li>a.mm-subclose { | |
| background: rgba(0, 0, 0, .1); | |
| color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu .mm-list>li>a.mm-subopen:after, | |
| .mm-menu .mm-list>li>a.mm-subclose:before { | |
| border-color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu .mm-list>li>a.mm-subopen:before { | |
| border-color: rgba(0, 0, 0, .15) | |
| } | |
| .mm-menu .mm-list>li.mm-selected>a:not(.mm-subopen), | |
| .mm-menu .mm-list>li.mm-selected>span { | |
| background: rgba(0, 0, 0, .1) | |
| } | |
| .mm-menu .mm-list>li.mm-label { | |
| background: rgba(255, 255, 255, .05) | |
| } | |
| .mm-menu.mm-vertical .mm-list li.mm-opened>a.mm-subopen, | |
| .mm-menu.mm-vertical .mm-list li.mm-opened>ul { | |
| background: rgba(255, 255, 255, .05) | |
| } | |
| html.mm-opened.mm-opening .mm-page, | |
| html.mm-opened.mm-opening #mm-blocker, | |
| html.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-opened.mm-opening .mm-fixed-bottom { | |
| left: 80% | |
| } | |
| .mm-menu { | |
| width: 80% | |
| } | |
| @media all and (max-width:175px) { | |
| .mm-menu { | |
| width: 140px | |
| } | |
| html.mm-opened.mm-opening .mm-page, | |
| html.mm-opened.mm-opening #mm-blocker, | |
| html.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-opened.mm-opening .mm-fixed-bottom { | |
| left: 140px | |
| } | |
| } | |
| @media all and (min-width:550px) { | |
| .mm-menu { | |
| width: 440px | |
| } | |
| html.mm-opened.mm-opening .mm-page, | |
| html.mm-opened.mm-opening #mm-blocker, | |
| html.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-opened.mm-opening .mm-fixed-bottom { | |
| left: 440px | |
| } | |
| } | |
| html.mm-nooverflowscrolling.mm-opened { | |
| height: auto; | |
| overflow: auto; | |
| overflow-x: hidden; | |
| overflow-y: scroll | |
| } | |
| html.mm-nooverflowscrolling.mm-opened body { | |
| overflow: auto | |
| } | |
| html.mm-nooverflowscrolling.mm-opened .mm-page { | |
| min-height: 1000px; | |
| position: fixed | |
| } | |
| html.mm-nooverflowscrolling.mm-opened .mm-menu { | |
| height: auto; | |
| min-height: 1000px; | |
| overflow: auto; | |
| overflow-x: hidden; | |
| position: relative; | |
| left: auto; | |
| top: auto | |
| } | |
| html.mm-nooverflowscrolling.mm-opened>.mm-panel { | |
| position: relative; | |
| height: auto; | |
| display: none; | |
| left: 0 | |
| } | |
| html.mm-nooverflowscrolling.mm-opened>.mm-panel.mm-current { | |
| display: block | |
| } | |
| em.mm-counter { | |
| font: inherit; | |
| font-size: 14px; | |
| font-style: normal; | |
| text-indent: 0; | |
| line-height: 20px; | |
| display: block; | |
| margin-top: -10px; | |
| position: absolute; | |
| right: 40px; | |
| top: 50% | |
| } | |
| em.mm-counter+a.mm-subopen { | |
| padding-left: 40px | |
| } | |
| em.mm-counter+a.mm-subopen+a, | |
| em.mm-counter+a.mm-subopen+span { | |
| margin-right: 80px | |
| } | |
| em.mm-counter+a.mm-fullsubopen { | |
| padding-left: 0 | |
| } | |
| .mm-vertical em.mm-counter { | |
| top: 12px; | |
| margin-top: 0 | |
| } | |
| .mm-nosubresults>em.mm-counter { | |
| display: none | |
| } | |
| .mm-menu em.mm-counter { | |
| color: rgba(255, 255, 255, .3) | |
| } | |
| html.mm-opened.mm-dragging .mm-menu, | |
| html.mm-opened.mm-dragging .mm-page, | |
| html.mm-opened.mm-dragging #mm-blocker { | |
| -webkit-transition-duration: 0s; | |
| -moz-transition-duration: 0s; | |
| -ms-transition-duration: 0s; | |
| -o-transition-duration: 0s; | |
| transition-duration: 0s | |
| } | |
| .mm-header { | |
| -webkit-box-sizing: border-box; | |
| -moz-box-sizing: border-box; | |
| -ms-box-sizing: border-box; | |
| -o-box-sizing: border-box; | |
| box-sizing: border-box; | |
| background: inherit; | |
| border-bottom: 1px solid transparent; | |
| text-align: center; | |
| line-height: 20px; | |
| width: 100%; | |
| height: 60px; | |
| padding: 30px 40px 0 40px; | |
| position: absolute; | |
| z-index: 2; | |
| top: 0; | |
| left: 0 | |
| } | |
| .mm-header .mm-title { | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| display: inline-block; | |
| width: 100%; | |
| position: relative; | |
| z-index: 1 | |
| } | |
| .mm-header .mm-prev, | |
| .mm-header .mm-next { | |
| -webkit-box-sizing: border-box; | |
| -moz-box-sizing: border-box; | |
| -ms-box-sizing: border-box; | |
| -o-box-sizing: border-box; | |
| box-sizing: border-box; | |
| text-decoration: none; | |
| display: block; | |
| width: 40px; | |
| height: 100%; | |
| position: absolute; | |
| bottom: 0 | |
| } | |
| .mm-header .mm-prev:before, | |
| .mm-header .mm-next:before { | |
| content: ''; | |
| border: 2px solid transparent; | |
| display: block; | |
| width: 7px; | |
| height: 7px; | |
| margin-bottom: -5px; | |
| position: absolute; | |
| bottom: 50%; | |
| -webkit-transform: rotate(-45deg); | |
| -moz-transform: rotate(-45deg); | |
| -ms-transform: rotate(-45deg); | |
| -o-transform: rotate(-45deg); | |
| transform: rotate(-45deg); | |
| margin-bottom: -15px | |
| } | |
| .mm-header .mm-prev { | |
| left: 0 | |
| } | |
| .mm-header .mm-prev:before { | |
| border-right: none; | |
| border-bottom: none; | |
| left: 22px | |
| } | |
| .mm-header .mm-next { | |
| right: 0 | |
| } | |
| .mm-header .mm-next:before { | |
| border-top: none; | |
| border-left: none; | |
| right: 18px | |
| } | |
| .mm-menu.mm-hassearch .mm-header { | |
| height: 50px; | |
| padding-top: 20px; | |
| top: 50px | |
| } | |
| .mm-menu.mm-hassearch .mm-header .mm-prev:before, | |
| .mm-menu.mm-hassearch .mm-header .mm-mext:before { | |
| margin-bottom: -10px | |
| } | |
| .mm-menu.mm-hasheader li.mm-subtitle { | |
| display: none | |
| } | |
| .mm-menu.mm-hasheader .mm-panel { | |
| padding-top: 80px | |
| } | |
| .mm-menu.mm-hasheader.mm-hassearch>.mm-panel { | |
| padding-top: 120px | |
| } | |
| .mm-menu.mm-hasheader.mm-ismenu>.mm-panel { | |
| padding-top: 60px | |
| } | |
| .mm-menu.mm-hasheader.mm-ismenu.mm-hassearch>.mm-panel { | |
| padding-top: 100px | |
| } | |
| .mm-menu .mm-header { | |
| border-color: rgba(0, 0, 0, .15); | |
| color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu .mm-header a:before { | |
| border-color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu.mm-fixedlabels .mm-list { | |
| background: inherit | |
| } | |
| .mm-menu.mm-fixedlabels .mm-list>li.mm-label { | |
| background: inherit !important; | |
| opacity: .97; | |
| height: 25px; | |
| overflow: visible; | |
| position: relative; | |
| z-index: 1 | |
| } | |
| .mm-menu.mm-fixedlabels .mm-list>li.mm-label>div { | |
| background: inherit; | |
| width: 100%; | |
| position: absolute; | |
| left: 0 | |
| } | |
| .mm-menu.mm-fixedlabels .mm-list>li.mm-label>div>div { | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden | |
| } | |
| .mm-menu.mm-fixedlabels .mm-list>li.mm-label.mm-spacer>div>div { | |
| padding-top: 25px | |
| } | |
| .mm-list>li.mm-label>span { | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| padding: 0 | |
| } | |
| .mm-list>li.mm-label.mm-opened a.mm-subopen:after { | |
| -webkit-transform: rotate(45deg); | |
| -moz-transform: rotate(45deg); | |
| -ms-transform: rotate(45deg); | |
| -o-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| right: 17px | |
| } | |
| .mm-list>li.mm-collapsed { | |
| display: none | |
| } | |
| .mm-menu .mm-list li.mm-label>div>div { | |
| background: rgba(255, 255, 255, .05) | |
| } | |
| .mm-search, | |
| .mm-search input { | |
| -webkit-box-sizing: border-box; | |
| -moz-box-sizing: border-box; | |
| -ms-box-sizing: border-box; | |
| -o-box-sizing: border-box; | |
| box-sizing: border-box | |
| } | |
| .mm-search { | |
| background: inherit; | |
| width: 100%; | |
| height: 50px; | |
| padding: 10px; | |
| position: relative; | |
| top: 0; | |
| z-index: 2 | |
| } | |
| .mm-search input { | |
| border: none; | |
| border-radius: 15px; | |
| font: inherit; | |
| font-size: 14px; | |
| line-height: 30px; | |
| outline: none; | |
| display: block; | |
| width: 100%; | |
| height: 30px; | |
| margin: 0; | |
| padding: 0 10px | |
| } | |
| .mm-menu li.mm-nosubresults>a.mm-subopen { | |
| display: none | |
| } | |
| .mm-menu li.mm-nosubresults>a.mm-subopen+a, | |
| .mm-menu li.mm-nosubresults>a.mm-subopen+span { | |
| padding-right: 10px | |
| } | |
| .mm-menu li.mm-noresults { | |
| text-align: center; | |
| font-size: 21px; | |
| display: none; | |
| padding-top: 80px | |
| } | |
| .mm-menu li.mm-noresults:after { | |
| border: none | |
| } | |
| .mm-menu.mm-noresults li.mm-noresults { | |
| display: block | |
| } | |
| .mm-menu.mm-hassearch>.mm-panel { | |
| padding-top: 60px | |
| } | |
| .mm-menu .mm-search input { | |
| background: rgba(255, 255, 255, .3); | |
| color: rgba(255, 255, 255, .6) | |
| } | |
| .mm-menu li.mm-noresults { | |
| color: rgba(255, 255, 255, .3) | |
| } | |
| html.mm-slide .mm-menu { | |
| -webkit-transition: -webkit-transform .4s ease; | |
| -moz-transition: -moz-transform .4s ease; | |
| -o-transition: -o-transform .4s ease; | |
| transition: transform .4s ease | |
| } | |
| html.mm-slide.mm-opened .mm-menu { | |
| -webkit-transform: translateX(-40%); | |
| -moz-transform: translateX(-40%); | |
| -ms-transform: translateX(-40%); | |
| -o-transform: translateX(-40%); | |
| transform: translateX(-40%) | |
| } | |
| html.mm-slide.mm-opening .mm-menu { | |
| -webkit-transform: translateX(0%); | |
| -moz-transform: translateX(0%); | |
| -ms-transform: translateX(0%); | |
| -o-transform: translateX(0%); | |
| transform: translateX(0%) | |
| } | |
| html.mm-slide.mm-right.mm-opened .mm-menu { | |
| -webkit-transform: translateX(40%); | |
| -moz-transform: translateX(40%); | |
| -ms-transform: translateX(40%); | |
| -o-transform: translateX(40%); | |
| transform: translateX(40%) | |
| } | |
| html.mm-slide.mm-right.mm-opening .mm-menu { | |
| -webkit-transform: translateX(0%); | |
| -moz-transform: translateX(0%); | |
| -ms-transform: translateX(0%); | |
| -o-transform: translateX(0%); | |
| transform: translateX(0%) | |
| } | |
| html.mm-slide.mm-top.mm-opened .mm-menu { | |
| -webkit-transform: translateY(-40%); | |
| -moz-transform: translateY(-40%); | |
| -ms-transform: translateY(-40%); | |
| -o-transform: translateY(-40%); | |
| transform: translateY(-40%) | |
| } | |
| html.mm-slide.mm-top.mm-opening .mm-menu { | |
| -webkit-transform: translateY(0%); | |
| -moz-transform: translateY(0%); | |
| -ms-transform: translateY(0%); | |
| -o-transform: translateY(0%); | |
| transform: translateY(0%) | |
| } | |
| html.mm-slide.mm-bottom.mm-opened .mm-menu { | |
| -webkit-transform: translateY(40%); | |
| -moz-transform: translateY(40%); | |
| -ms-transform: translateY(40%); | |
| -o-transform: translateY(40%); | |
| transform: translateY(40%) | |
| } | |
| html.mm-slide.mm-bottom.mm-opening .mm-menu { | |
| -webkit-transform: translateY(0%); | |
| -moz-transform: translateY(0%); | |
| -ms-transform: translateY(0%); | |
| -o-transform: translateY(0%); | |
| transform: translateY(0%) | |
| } | |
| html.mm-zoom-menu .mm-menu { | |
| -webkit-transition: -webkit-transform .4s ease; | |
| -moz-transition: -moz-transform .4s ease; | |
| -o-transition: -o-transform .4s ease; | |
| transition: transform .4s ease | |
| } | |
| html.mm-zoom-menu.mm-opened .mm-menu { | |
| -webkit-transform: scale(.7, .7) translateX(-40%); | |
| -moz-transform: scale(.7, .7) translateX(-40%); | |
| -ms-transform: scale(.7, .7) translateX(-40%); | |
| -o-transform: scale(.7, .7) translateX(-40%); | |
| transform: scale(.7, .7) translateX(-40%); | |
| -webkit-transform-origin: left center; | |
| -moz-transform-origin: left center; | |
| -ms-transform-origin: left center; | |
| -o-transform-origin: left center; | |
| transform-origin: left center | |
| } | |
| html.mm-zoom-menu.mm-opening .mm-menu { | |
| -webkit-transform: scale(1, 1) translateX(0%); | |
| -moz-transform: scale(1, 1) translateX(0%); | |
| -ms-transform: scale(1, 1) translateX(0%); | |
| -o-transform: scale(1, 1) translateX(0%); | |
| transform: scale(1, 1) translateX(0%) | |
| } | |
| html.mm-zoom-menu.mm-right.mm-opened .mm-menu { | |
| -webkit-transform: scale(.7, .7) translateX(40%); | |
| -moz-transform: scale(.7, .7) translateX(40%); | |
| -ms-transform: scale(.7, .7) translateX(40%); | |
| -o-transform: scale(.7, .7) translateX(40%); | |
| transform: scale(.7, .7) translateX(40%); | |
| -webkit-transform-origin: right center; | |
| -moz-transform-origin: right center; | |
| -ms-transform-origin: right center; | |
| -o-transform-origin: right center; | |
| transform-origin: right center | |
| } | |
| html.mm-zoom-menu.mm-right.mm-opening .mm-menu { | |
| -webkit-transform: scale(1, 1) translateX(0%); | |
| -moz-transform: scale(1, 1) translateX(0%); | |
| -ms-transform: scale(1, 1) translateX(0%); | |
| -o-transform: scale(1, 1) translateX(0%); | |
| transform: scale(1, 1) translateX(0%) | |
| } | |
| html.mm-zoom-menu.mm-top.mm-opened .mm-menu { | |
| -webkit-transform: scale(.7, .7) translateY(-40%); | |
| -moz-transform: scale(.7, .7) translateY(-40%); | |
| -ms-transform: scale(.7, .7) translateY(-40%); | |
| -o-transform: scale(.7, .7) translateY(-40%); | |
| transform: scale(.7, .7) translateY(-40%); | |
| -webkit-transform-origin: center top; | |
| -moz-transform-origin: center top; | |
| -ms-transform-origin: center top; | |
| -o-transform-origin: center top; | |
| transform-origin: center top | |
| } | |
| html.mm-zoom-menu.mm-top.mm-opening .mm-menu { | |
| -webkit-transform: scale(1, 1) translateY(0%); | |
| -moz-transform: scale(1, 1) translateY(0%); | |
| -ms-transform: scale(1, 1) translateY(0%); | |
| -o-transform: scale(1, 1) translateY(0%); | |
| transform: scale(1, 1) translateY(0%) | |
| } | |
| html.mm-zoom-menu.mm-bottom.mm-opened .mm-menu { | |
| -webkit-transform: scale(.7, .7) translateY(40%); | |
| -moz-transform: scale(.7, .7) translateY(40%); | |
| -ms-transform: scale(.7, .7) translateY(40%); | |
| -o-transform: scale(.7, .7) translateY(40%); | |
| transform: scale(.7, .7) translateY(40%); | |
| -webkit-transform-origin: center bottom; | |
| -moz-transform-origin: center bottom; | |
| -ms-transform-origin: center bottom; | |
| -o-transform-origin: center bottom; | |
| transform-origin: center bottom | |
| } | |
| html.mm-zoom-menu.mm-bottom.mm-opening .mm-menu { | |
| -webkit-transform: scale(1, 1) translateY(0%); | |
| -moz-transform: scale(1, 1) translateY(0%); | |
| -ms-transform: scale(1, 1) translateY(0%); | |
| -o-transform: scale(1, 1) translateY(0%); | |
| transform: scale(1, 1) translateY(0%) | |
| } | |
| html.mm-zoom-page.mm-opened .mm-page { | |
| -webkit-transform: scale(1, 1); | |
| -moz-transform: scale(1, 1); | |
| -ms-transform: scale(1, 1); | |
| -o-transform: scale(1, 1); | |
| transform: scale(1, 1); | |
| -webkit-transform-origin: left center; | |
| -moz-transform-origin: left center; | |
| -ms-transform-origin: left center; | |
| -o-transform-origin: left center; | |
| transform-origin: left center | |
| } | |
| html.mm-zoom-page.mm-opening .mm-page { | |
| -webkit-transform: scale(1.5, 1.5); | |
| -moz-transform: scale(1.5, 1.5); | |
| -ms-transform: scale(1.5, 1.5); | |
| -o-transform: scale(1.5, 1.5); | |
| transform: scale(1.5, 1.5) | |
| } | |
| html.mm-zoom-page.mm-right.mm-opened .mm-page { | |
| -webkit-transform-origin: right center; | |
| -moz-transform-origin: right center; | |
| -ms-transform-origin: right center; | |
| -o-transform-origin: right center; | |
| transform-origin: right center | |
| } | |
| html.mm-zoom-page.mm-top.mm-opened .mm-page { | |
| -webkit-transform-origin: center top; | |
| -moz-transform-origin: center top; | |
| -ms-transform-origin: center top; | |
| -o-transform-origin: center top; | |
| transform-origin: center top | |
| } | |
| html.mm-zoom-page.mm-bottom.mm-opened .mm-page { | |
| -webkit-transform-origin: center bottom; | |
| -moz-transform-origin: center bottom; | |
| -ms-transform-origin: center bottom; | |
| -o-transform-origin: center bottom; | |
| transform-origin: center bottom | |
| } | |
| html.mm-zoom-panels .mm-panel { | |
| -webkit-transform: scale(1.5, 1.5); | |
| -moz-transform: scale(1.5, 1.5); | |
| -ms-transform: scale(1.5, 1.5); | |
| -o-transform: scale(1.5, 1.5); | |
| transform: scale(1.5, 1.5); | |
| -webkit-transform-origin: left center; | |
| -moz-transform-origin: left center; | |
| -ms-transform-origin: left center; | |
| -o-transform-origin: left center; | |
| transform-origin: left center | |
| } | |
| html.mm-zoom-panels .mm-panel.mm-opened { | |
| -webkit-transform: scale(1, 1); | |
| -moz-transform: scale(1, 1); | |
| -ms-transform: scale(1, 1); | |
| -o-transform: scale(1, 1); | |
| transform: scale(1, 1) | |
| } | |
| html.mm-zoom-panels .mm-panel.mm-opened.mm-subopened { | |
| -webkit-transform: scale(.7, .7); | |
| -moz-transform: scale(.7, .7); | |
| -ms-transform: scale(.7, .7); | |
| -o-transform: scale(.7, .7); | |
| transform: scale(.7, .7) | |
| } | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top, | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| left: 100% | |
| } | |
| .mm-menu.mm-fullscreen { | |
| width: 100% | |
| } | |
| @media all and (max-width:140px) { | |
| .mm-menu.mm-fullscreen { | |
| width: 140px | |
| } | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top, | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| left: 140px | |
| } | |
| } | |
| @media all and (min-width:10000px) { | |
| .mm-menu.mm-fullscreen { | |
| width: 10000px | |
| } | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top, | |
| html.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| left: 10000px | |
| } | |
| } | |
| .mm-menu.mm-top.mm-fullscreen { | |
| height: 100% | |
| } | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top { | |
| top: 100% | |
| } | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| bottom: -100% | |
| } | |
| @media all and (max-height:140px) { | |
| .mm-menu.mm-top.mm-fullscreen { | |
| height: 140px | |
| } | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top { | |
| top: 140px | |
| } | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| bottom: -140px | |
| } | |
| } | |
| @media all and (min-height:10000px) { | |
| .mm-menu.mm-top.mm-fullscreen { | |
| height: 10000px | |
| } | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top { | |
| top: 10000px | |
| } | |
| html.mm-top.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| bottom: -10000px | |
| } | |
| } | |
| .mm-menu.mm-right.mm-fullscreen { | |
| width: 100% | |
| } | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| right: 100% | |
| } | |
| @media all and (max-width:140px) { | |
| .mm-menu.mm-right.mm-fullscreen { | |
| width: 140px | |
| } | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| right: 140px | |
| } | |
| } | |
| @media all and (min-width:10000px) { | |
| .mm-menu.mm-right.mm-fullscreen { | |
| width: 10000px | |
| } | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top, | |
| html.mm-right.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| right: 10000px | |
| } | |
| } | |
| .mm-menu.mm-bottom.mm-fullscreen { | |
| height: 100% | |
| } | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| bottom: 100% | |
| } | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top { | |
| top: -100% | |
| } | |
| @media all and (max-height:140px) { | |
| .mm-menu.mm-bottom.mm-fullscreen { | |
| height: 140px | |
| } | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| bottom: 140px | |
| } | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top { | |
| top: -140px | |
| } | |
| } | |
| @media all and (min-height:10000px) { | |
| .mm-menu.mm-bottom.mm-fullscreen { | |
| height: 10000px | |
| } | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-page, | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen #mm-blocker, | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-fixed-bottom { | |
| bottom: 10000px | |
| } | |
| html.mm-bottom.mm-opened.mm-opening.mm-fullscreen .mm-fixed-top { | |
| top: -10000px | |
| } | |
| } | |
| .mm-menu.mm-fullscreen.mm-front, | |
| .mm-menu.mm-fullscreen.mm-next { | |
| left: -100% | |
| } | |
| @media all and (max-width:140px) { | |
| .mm-menu.mm-fullscreen.mm-front, | |
| .mm-menu.mm-fullscreen.mm-next { | |
| left: -140px | |
| } | |
| } | |
| @media all and (min-width:10000px) { | |
| .mm-menu.mm-fullscreen.mm-front, | |
| .mm-menu.mm-fullscreen.mm-next { | |
| left: -10000px | |
| } | |
| } | |
| .mm-menu.mm-top.mm-fullscreen.mm-front, | |
| .mm-menu.mm-top.mm-fullscreen.mm-next { | |
| top: -100% | |
| } | |
| @media all and (max-height:140px) { | |
| .mm-menu.mm-top.mm-fullscreen.mm-front, | |
| .mm-menu.mm-top.mm-fullscreen.mm-next { | |
| top: -140px | |
| } | |
| } | |
| @media all and (min-height:10000px) { | |
| .mm-menu.mm-top.mm-fullscreen.mm-front, | |
| .mm-menu.mm-top.mm-fullscreen.mm-next { | |
| top: -10000px | |
| } | |
| } | |
| .mm-menu.mm-right.mm-fullscreen.mm-front, | |
| .mm-menu.mm-right.mm-fullscreen.mm-next { | |
| right: -100% | |
| } | |
| @media all and (max-width:140px) { | |
| .mm-menu.mm-right.mm-fullscreen.mm-front, | |
| .mm-menu.mm-right.mm-fullscreen.mm-next { | |
| right: -140px | |
| } | |
| } | |
| @media all and (min-width:10000px) { | |
| .mm-menu.mm-right.mm-fullscreen.mm-front, | |
| .mm-menu.mm-right.mm-fullscreen.mm-next { | |
| right: -10000px | |
| } | |
| } | |
| .mm-menu.mm-bottom.mm-fullscreen.mm-front, | |
| .mm-menu.mm-bottom.mm-fullscreen.mm-next { | |
| bottom: -100% | |
| } | |
| @media all and (max-height:140px) { | |
| .mm-menu.mm-bottom.mm-fullscreen.mm-front, | |
| .mm-menu.mm-bottom.mm-fullscreen.mm-next { | |
| bottom: -140px | |
| } | |
| } | |
| @media all and (min-height:10000px) { | |
| .mm-menu.mm-bottom.mm-fullscreen.mm-front, | |
| .mm-menu.mm-bottom.mm-fullscreen.mm-next { | |
| bottom: -10000px | |
| } | |
| } | |
| html.mm-opened.mm-front .mm-fixed-top, | |
| html.mm-opened.mm-front .mm-fixed-bottom, | |
| html.mm-opened.mm-opening.mm-front .mm-fixed-top, | |
| html.mm-opened.mm-opening.mm-front .mm-fixed-bottom { | |
| left: 0; | |
| right: auto | |
| } | |
| html.mm-opened.mm-front .mm-fixed-top, | |
| html.mm-opened.mm-opening.mm-front .mm-fixed-top { | |
| top: 0 | |
| } | |
| html.mm-opened.mm-front .mm-fixed-bottom, | |
| html.mm-opened.mm-opening.mm-front .mm-fixed-bottom { | |
| bottom: 0 | |
| } | |
| html.mm-opened.mm-fullscreen .mm-page { | |
| box-shadow: none !important | |
| } | |
| .mm-menu.mm-top { | |
| width: 100% | |
| } | |
| html.mm-top.mm-opened .mm-page, | |
| html.mm-top.mm-opened #mm-blocker { | |
| top: 0% | |
| } | |
| html.mm-top.mm-opened.mm-opening .mm-page, | |
| html.mm-top.mm-opened.mm-opening #mm-blocker, | |
| html.mm-top.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-top.mm-opened.mm-opening .mm-fixed-bottom { | |
| left: 0 | |
| } | |
| .mm-menu.mm-right { | |
| left: auto; | |
| right: 0 | |
| } | |
| html.mm-right.mm-opened .mm-page, | |
| html.mm-right.mm-opened #mm-blocker, | |
| html.mm-right.mm-opened .mm-fixed-top, | |
| html.mm-right.mm-opened .mm-fixed-bottom { | |
| left: auto; | |
| right: 0% | |
| } | |
| html.mm-right.mm-opened.mm-opening .mm-page, | |
| html.mm-right.mm-opened.mm-opening #mm-blocker, | |
| html.mm-right.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-right.mm-opened.mm-opening .mm-fixed-bottom { | |
| left: auto | |
| } | |
| .mm-menu.mm-bottom { | |
| width: 100%; | |
| top: auto; | |
| bottom: 0 | |
| } | |
| html.mm-bottom.mm-opened .mm-page, | |
| html.mm-bottom.mm-opened #mm-blocker { | |
| bottom: 0%; | |
| top: auto | |
| } | |
| html.mm-bottom.mm-opened.mm-opening .mm-page, | |
| html.mm-bottom.mm-opened.mm-opening #mm-blocker, | |
| html.mm-bottom.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-bottom.mm-opened.mm-opening .mm-fixed-bottom { | |
| top: auto; | |
| left: 0 | |
| } | |
| .mm-menu.mm-top { | |
| height: 80% | |
| } | |
| html.mm-top.mm-opened.mm-opening .mm-page, | |
| html.mm-top.mm-opened.mm-opening #mm-blocker, | |
| html.mm-top.mm-opened.mm-opening .mm-fixed-top { | |
| top: 80% | |
| } | |
| html.mm-top.mm-opened.mm-opening .mm-fixed-bottom { | |
| bottom: -80% | |
| } | |
| @media all and (max-height:175px) { | |
| .mm-menu.mm-top { | |
| height: 140px | |
| } | |
| html.mm-top.mm-opened.mm-opening .mm-page, | |
| html.mm-top.mm-opened.mm-opening #mm-blocker, | |
| html.mm-top.mm-opened.mm-opening .mm-fixed-top { | |
| top: 140px | |
| } | |
| html.mm-top.mm-opened.mm-opening .mm-fixed-bottom { | |
| bottom: -140px | |
| } | |
| } | |
| @media all and (min-height:1100px) { | |
| .mm-menu.mm-top { | |
| height: 880px | |
| } | |
| html.mm-top.mm-opened.mm-opening .mm-page, | |
| html.mm-top.mm-opened.mm-opening #mm-blocker, | |
| html.mm-top.mm-opened.mm-opening .mm-fixed-top { | |
| top: 880px | |
| } | |
| html.mm-top.mm-opened.mm-opening .mm-fixed-bottom { | |
| bottom: -880px | |
| } | |
| } | |
| .mm-menu.mm-right { | |
| width: 80% | |
| } | |
| html.mm-right.mm-opened.mm-opening .mm-page, | |
| html.mm-right.mm-opened.mm-opening #mm-blocker, | |
| html.mm-right.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-right.mm-opened.mm-opening .mm-fixed-bottom { | |
| right: 80% | |
| } | |
| @media all and (max-width:175px) { | |
| .mm-menu.mm-right { | |
| width: 140px | |
| } | |
| html.mm-right.mm-opened.mm-opening .mm-page, | |
| html.mm-right.mm-opened.mm-opening #mm-blocker, | |
| html.mm-right.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-right.mm-opened.mm-opening .mm-fixed-bottom { | |
| right: 140px | |
| } | |
| } | |
| @media all and (min-width:550px) { | |
| .mm-menu.mm-right { | |
| width: 440px | |
| } | |
| html.mm-right.mm-opened.mm-opening .mm-page, | |
| html.mm-right.mm-opened.mm-opening #mm-blocker, | |
| html.mm-right.mm-opened.mm-opening .mm-fixed-top, | |
| html.mm-right.mm-opened.mm-opening .mm-fixed-bottom { | |
| right: 440px | |
| } | |
| } | |
| .mm-menu.mm-bottom { | |
| height: 80% | |
| } | |
| html.mm-bottom.mm-opened.mm-opening .mm-page, | |
| html.mm-bottom.mm-opened.mm-opening #mm-blocker, | |
| html.mm-bottom.mm-opened.mm-opening .mm-fixed-bottom { | |
| bottom: 80% | |
| } | |
| html.mm-bottom.mm-opened.mm-opening .mm-fixed-top { | |
| top: -80% | |
| } | |
| @media all and (max-height:175px) { | |
| .mm-menu.mm-bottom { | |
| height: 140px | |
| } | |
| html.mm-bottom.mm-opened.mm-opening .mm-page, | |
| html.mm-bottom.mm-opened.mm-opening #mm-blocker, | |
| html.mm-bottom.mm-opened.mm-opening .mm-fixed-bottom { | |
| bottom: 140px | |
| } | |
| html.mm-bottom.mm-opened.mm-opening .mm-fixed-top { | |
| top: -140px | |
| } | |
| } | |
| @media all and (min-height:1100px) { | |
| .mm-menu.mm-bottom { | |
| height: 880px | |
| } | |
| html.mm-bottom.mm-opened.mm-opening .mm-page, | |
| html.mm-bottom.mm-opened.mm-opening #mm-blocker, | |
| html.mm-bottom.mm-opened.mm-opening .mm-fixed-bottom { | |
| bottom: 880px | |
| } | |
| html.mm-bottom.mm-opened.mm-opening .mm-fixed-top { | |
| top: -880px | |
| } | |
| } | |
| html.mm-front.mm-opened .mm-page { | |
| top: 0 !important; | |
| right: 0 !important; | |
| bottom: 0 !important; | |
| left: 0 !important | |
| } | |
| .mm-menu.mm-front, | |
| .mm-menu.mm-next { | |
| -webkit-transition: none .4s ease; | |
| -moz-transition: none .4s ease; | |
| -ms-transition: none .4s ease; | |
| -o-transition: none .4s ease; | |
| transition: none .4s ease; | |
| -webkit-transition-property: top, right, bottom, left, -webkit-transform; | |
| -moz-transition-property: top, right, bottom, left, -moz-transform; | |
| -ms-transition-property: top, right, bottom, left, -o-transform; | |
| -o-transition-property: top, right, bottom, left, -o-transform; | |
| transition-property: top, right, bottom, left, transform | |
| } | |
| html.mm-front .mm-page, | |
| html.mm-front #mm-blocker { | |
| z-index: 0 | |
| } | |
| .mm-menu.mm-front { | |
| z-index: 1; | |
| box-shadow: 0 0 15px rgba(0, 0, 0, .5) | |
| } | |
| html.mm-opened.mm-next .mm-page { | |
| box-shadow: none | |
| } | |
| html.mm-opening .mm-menu.mm-front, | |
| html.mm-opening .mm-menu.mm-next { | |
| left: 0% | |
| } | |
| .mm-menu.mm-top.mm-front, | |
| .mm-menu.mm-top.mm-next { | |
| left: 0 | |
| } | |
| html.mm-opening .mm-menu.mm-top.mm-front, | |
| html.mm-opening .mm-menu.mm-top.mm-next { | |
| left: 0; | |
| top: 0% | |
| } | |
| .mm-menu.mm-right.mm-front, | |
| .mm-menu.mm-right.mm-next { | |
| left: auto | |
| } | |
| html.mm-opening .mm-menu.mm-right.mm-front, | |
| html.mm-opening .mm-menu.mm-right.mm-next { | |
| left: auto; | |
| right: 0% | |
| } | |
| .mm-menu.mm-bottom.mm-front, | |
| .mm-menu.mm-bottom.mm-next { | |
| top: auto; | |
| left: 0 | |
| } | |
| html.mm-opening .mm-menu.mm-bottom.mm-front, | |
| html.mm-opening .mm-menu.mm-bottom.mm-next { | |
| left: 0; | |
| bottom: 0% | |
| } | |
| .mm-menu.mm-front, | |
| .mm-menu.mm-next { | |
| left: -80% | |
| } | |
| @media all and (max-width:175px) { | |
| .mm-menu.mm-front, | |
| .mm-menu.mm-next { | |
| left: -140px | |
| } | |
| } | |
| @media all and (min-width:550px) { | |
| .mm-menu.mm-front, | |
| .mm-menu.mm-next { | |
| left: -440px | |
| } | |
| } | |
| .mm-menu.mm-top.mm-front, | |
| .mm-menu.mm-top.mm-next { | |
| top: -80% | |
| } | |
| @media all and (max-height:175px) { | |
| .mm-menu.mm-top.mm-front, | |
| .mm-menu.mm-top.mm-next { | |
| top: -140px | |
| } | |
| } | |
| @media all and (min-height:1100px) { | |
| .mm-menu.mm-top.mm-front, | |
| .mm-menu.mm-top.mm-next { | |
| top: -880px | |
| } | |
| } | |
| .mm-menu.mm-right.mm-front, | |
| .mm-menu.mm-right.mm-next { | |
| right: -80% | |
| } | |
| @media all and (max-width:175px) { | |
| .mm-menu.mm-right.mm-front, | |
| .mm-menu.mm-right.mm-next { | |
| right: -140px | |
| } | |
| } | |
| @media all and (min-width:550px) { | |
| .mm-menu.mm-right.mm-front, | |
| .mm-menu.mm-right.mm-next { | |
| right: -440px | |
| } | |
| } | |
| .mm-menu.mm-bottom.mm-front, | |
| .mm-menu.mm-bottom.mm-next { | |
| bottom: -80% | |
| } | |
| @media all and (max-height:175px) { | |
| .mm-menu.mm-bottom.mm-front, | |
| .mm-menu.mm-bottom.mm-next { | |
| bottom: -140px | |
| } | |
| } | |
| @media all and (min-height:1100px) { | |
| .mm-menu.mm-bottom.mm-front, | |
| .mm-menu.mm-bottom.mm-next { | |
| bottom: -880px | |
| } | |
| } | |
| html.mm-opened.mm-front .mm-fixed-top, | |
| html.mm-opened.mm-front .mm-fixed-bottom, | |
| html.mm-opened.mm-opening.mm-front .mm-fixed-top, | |
| html.mm-opened.mm-opening.mm-front .mm-fixed-bottom { | |
| left: 0; | |
| right: auto | |
| } | |
| html.mm-opened.mm-front .mm-fixed-top, | |
| html.mm-opened.mm-opening.mm-front .mm-fixed-top { | |
| top: 0 | |
| } | |
| html.mm-opened.mm-front .mm-fixed-bottom, | |
| html.mm-opened.mm-opening.mm-front .mm-fixed-bottom { | |
| bottom: 0 | |
| } | |
| html.mm-opened.mm-light .mm-page { | |
| box-shadow: 0 0 10px rgba(0, 0, 0, .3) | |
| } | |
| .mm-ismenu.mm-light { | |
| background: #f3f3f3 | |
| } | |
| .mm-menu.mm-light { | |
| color: rgba(0, 0, 0, .6) | |
| } | |
| .mm-menu.mm-light .mm-list>li:after { | |
| border-color: rgba(0, 0, 0, .1) | |
| } | |
| .mm-menu.mm-light .mm-list>li>a.mm-subclose { | |
| background: rgba(255, 255, 255, .6); | |
| color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-light .mm-list>li>a.mm-subopen:after, | |
| .mm-menu.mm-light .mm-list>li>a.mm-subclose:before { | |
| border-color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-light .mm-list>li>a.mm-subopen:before { | |
| border-color: rgba(0, 0, 0, .1) | |
| } | |
| .mm-menu.mm-light .mm-list>li.mm-selected>a:not(.mm-subopen), | |
| .mm-menu.mm-light .mm-list>li.mm-selected>span { | |
| background: rgba(255, 255, 255, .6) | |
| } | |
| .mm-menu.mm-light .mm-list>li.mm-label { | |
| background: rgba(0, 0, 0, .03) | |
| } | |
| .mm-menu.mm-light.mm-vertical .mm-list li.mm-opened>a.mm-subopen, | |
| .mm-menu.mm-light.mm-vertical .mm-list li.mm-opened>ul { | |
| background: rgba(0, 0, 0, .03) | |
| } | |
| .mm-menu.mm-light .mm-search input { | |
| background: rgba(0, 0, 0, .1); | |
| color: rgba(0, 0, 0, .6) | |
| } | |
| .mm-menu.mm-light li.mm-noresults { | |
| color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-light em.mm-counter { | |
| color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-light .mm-list li.mm-label>div>div { | |
| background: rgba(0, 0, 0, .03) | |
| } | |
| .mm-menu.mm-light .mm-header { | |
| border-color: rgba(0, 0, 0, .1); | |
| color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-light .mm-header a:before { | |
| border-color: rgba(0, 0, 0, .3) | |
| } | |
| html.mm-opened.mm-white .mm-page { | |
| box-shadow: 0 0 10px rgba(0, 0, 0, .3) | |
| } | |
| .mm-ismenu.mm-white { | |
| background: #fff | |
| } | |
| .mm-menu.mm-white { | |
| color: rgba(0, 0, 0, .6) | |
| } | |
| .mm-menu.mm-white .mm-list>li:after { | |
| border-color: rgba(0, 0, 0, .1) | |
| } | |
| .mm-menu.mm-white .mm-list>li>a.mm-subclose { | |
| background: rgba(0, 0, 0, .08); | |
| color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-white .mm-list>li>a.mm-subopen:after, | |
| .mm-menu.mm-white .mm-list>li>a.mm-subclose:before { | |
| border-color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-white .mm-list>li>a.mm-subopen:before { | |
| border-color: rgba(0, 0, 0, .1) | |
| } | |
| .mm-menu.mm-white .mm-list>li.mm-selected>a:not(.mm-subopen), | |
| .mm-menu.mm-white .mm-list>li.mm-selected>span { | |
| background: rgba(0, 0, 0, .08) | |
| } | |
| .mm-menu.mm-white .mm-list>li.mm-label { | |
| background: rgba(0, 0, 0, .03) | |
| } | |
| .mm-menu.mm-white.mm-vertical .mm-list li.mm-opened>a.mm-subopen, | |
| .mm-menu.mm-white.mm-vertical .mm-list li.mm-opened>ul { | |
| background: rgba(0, 0, 0, .03) | |
| } | |
| .mm-menu.mm-white .mm-search input { | |
| background: rgba(0, 0, 0, .1); | |
| color: rgba(0, 0, 0, .6) | |
| } | |
| .mm-menu.mm-white li.mm-noresults { | |
| color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-white em.mm-counter { | |
| color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-white .mm-list li.mm-label>div>div { | |
| background: rgba(0, 0, 0, .03) | |
| } | |
| .mm-menu.mm-white .mm-header { | |
| border-color: rgba(0, 0, 0, .1); | |
| color: rgba(0, 0, 0, .3) | |
| } | |
| .mm-menu.mm-white .mm-header a:before { | |
| border-color: rgba(0, 0, 0, .3) | |
| } | |
| html.mm-opened.mm-black .mm-page { | |
| box-shadow: none | |
| } | |
| .mm-ismenu.mm-black { | |
| background: #000 | |
| } | |
| .mm-menu.mm-black { | |
| color: rgba(255, 255, 255, .6) | |
| } | |
| .mm-menu.mm-black .mm-list>li:after { | |
| border-color: rgba(255, 255, 255, .2) | |
| } | |
| .mm-menu.mm-black .mm-list>li>a.mm-subclose { | |
| background: rgba(255, 255, 255, .25); | |
| color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu.mm-black .mm-list>li>a.mm-subopen:after, | |
| .mm-menu.mm-black .mm-list>li>a.mm-subclose:before { | |
| border-color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu.mm-black .mm-list>li>a.mm-subopen:before { | |
| border-color: rgba(255, 255, 255, .2) | |
| } | |
| .mm-menu.mm-black .mm-list>li.mm-selected>a:not(.mm-subopen), | |
| .mm-menu.mm-black .mm-list>li.mm-selected>span { | |
| background: rgba(255, 255, 255, .25) | |
| } | |
| .mm-menu.mm-black .mm-list>li.mm-label { | |
| background: rgba(255, 255, 255, .15) | |
| } | |
| .mm-menu.mm-black.mm-vertical .mm-list li.mm-opened>a.mm-subopen, | |
| .mm-menu.mm-black.mm-vertical .mm-list li.mm-opened>ul { | |
| background: rgba(255, 255, 255, .15) | |
| } | |
| .mm-menu.mm-black .mm-search input { | |
| background: rgba(255, 255, 255, .3); | |
| color: rgba(255, 255, 255, .6) | |
| } | |
| .mm-menu.mm-black li.mm-noresults { | |
| color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu.mm-black em.mm-counter { | |
| color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu.mm-black .mm-list li.mm-label>div>div { | |
| background: rgba(255, 255, 255, .15) | |
| } | |
| .mm-menu.mm-black .mm-header { | |
| border-color: rgba(255, 255, 255, .2); | |
| color: rgba(255, 255, 255, .3) | |
| } | |
| .mm-menu.mm-black .mm-header a:before { | |
| border-color: rgba(255, 255, 255, .3) | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment