Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using it's URL and the proper URL extention.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <main id="main"><div class="button is-has-no-parent is-has-menu is-menu-items-length-8 is-close" aria-pressed="false"><div class="button-container"><button aria-labelledby="button-label-uid-497536" class="button-button skin-main_menu" data-title="Menu"></button><span id="button-label-uid-497536" aria-hidden="true" class="button-title">Menu</span></div><ul></ul></div></main>
<a href="http://www.orilivni.com/2014/01/pie-and-awesome-menus/" class="ext-link">for more information</a>
              
            
!

CSS

              
                .ext-link {
  position: absolute;
  top: 10px;
  left: 10px;
  color: #777;
  
}

/*!
 * Btns.js
 * http://www.orilivni.com
 * @author: Ori Livni
 * @version: 0.0.1
 * @last build: 2014-01-05 UPC:18:40
 * (c) All right reserved. 2014. BSD licensed.
 */

/*! normalize.css v2.1.3 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a{background:0 0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}::-moz-selection{background:silver;color:#fff;text-shadow:none}::selection{background:silver;color:#fff;text-shadow:none}html{font:16px / 1.5 Helvetica,"Open Sans",Arial,sans-serif;font:100% / 1.5 Helvetica,"Open Sans",Arial,sans-serif}body{background-color:#eee}@media screen and (min-width:480px) and (min-height:480px){body{background-color:#fff}}.main{top:0;left:0;width:100%;height:100%;min-height:320px;margin:0 auto;position:absolute;-webkit-transition-property:opacity;transition-property:opacity;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-delay:.2s;transition-delay:.2s}@media screen and (min-width:480px) and (min-height:480px){.main{background-image:-webkit-linear-gradient(#ddd,#fff);background-image:linear-gradient(#ddd,#fff)}}.is-main-invisible .main{opacity:0}.button-state-hidden,.button.is-submenu-open>.button-menu>.button-menu-item>.button.is-close{display:none!important;visibility:hidden!important}.button-state-invisible,.button.is-close>.button-menu,.button.is-submenu-open>.button-container{opacity:0;visibility:hidden!important}.button{left:50%;top:50%;position:absolute;background-color:transparent;font-family:Roboto,Helvetica,Arial,sans-serif;font-size:.8rem;color:#555}.button-container{position:absolute;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:10}.button.is-submenu-open>.button-container{z-index:-10}.button-button,.button-title,.button.is-open.is-has-menu>.button-container>.button-button::after{-webkit-transition-property:-webkit-transform;transition-property:transform;-webkit-transition-duration:166ms;transition-duration:166ms;-webkit-transition-delay:48ms;transition-delay:48ms}.button-button{width:50px;height:50px;display:block;position:relative;-moz-box-sizing:border-box;box-sizing:border-box;background-color:silver;background-image:none;background-position:center center;background-size:60px 60px;background-repeat:no-repeat;box-shadow:0 1px 0 0 #777;border:0;border-radius:50%;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance:none;-moz-appearance:none;appearance:none;-ms-touch-action:none}@media screen and (min-width:480px) and (min-height:480px){.button-button{width:60px;height:60px}}.button-button:focus{outline:0;box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px silver}.no-touch-fix .button-button:hover{-webkit-transform:scale(2);transform:scale(2)}.button.is-open.is-has-menu>.button-container>.button-button::after{display:block;position:absolute;content:"";left:50%;top:50%;width:60px;height:60px;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background-image:url(http://uploads.orilivni.com/btns/images/icon-close.png);background-size:60px 60px}.no-touch-fix .button.is-open.is-has-menu>.button-container>.button-button:hover::after{-webkit-transform:translate(-50%,-50%) scale(0.5);transform:translate(-50%,-50%) scale(0.5)}.button-button.skin-main_menu{background-image:url(http://uploads.orilivni.com/btns/images/icon-menu.png);background-color:#492;box-shadow:0 1px 0 0 #1f460f}.button-button.skin-main_menu:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #492}.button-button.skin-menu{background-image:url(http://uploads.orilivni.com/btns/images/icon-menu.png);background-color:#f62;box-shadow:0 1px 0 0 #bb3a00}.button-button.skin-menu:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #f62}.button-button.skin-hacker_news{background-image:url(http://uploads.orilivni.com/btns/images/icon-hacker_news.png);background-color:#f62;box-shadow:0 1px 0 0 #bb3a00}.button-button.skin-hacker_news:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #f62}.button-button.skin-www{background-image:url(http://uploads.orilivni.com/btns/images/icon-www.png);background-color:#0097e0;box-shadow:0 1px 0 0 #00527a}.button-button.skin-www:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #0097e0}.button-button.skin-blog{background-image:url(http://uploads.orilivni.com/btns/images/icon-blog.png);background-color:#0097e0;box-shadow:0 1px 0 0 #00527a}.button-button.skin-blog:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #0097e0}.button-button.skin-twitter{background-image:url(http://uploads.orilivni.com/btns/images/icon-twitter.png);background-color:#2aa9e0;box-shadow:0 1px 0 0 #156a8f}.button-button.skin-twitter:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #2aa9e0}.button-button.skin-html5rocks{background-image:url(http://uploads.orilivni.com/btns/images/icon-html5rocks.png);background-color:#05a;box-shadow:0 1px 0 0 #024}.button-button.skin-html5rocks:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #05a}.button-button.skin-fontef{background-image:url(http://uploads.orilivni.com/btns/images/icon-fontef.png);background-color:#111;box-shadow:0 1px 0 0 #000}.button-button.skin-fontef:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #111}.button-button.skin-processing{background-image:url(http://uploads.orilivni.com/btns/images/icon-processing.png);background-color:#024;box-shadow:0 1px 0 0 #000}.button-button.skin-processing:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #024}.button-button.skin-nyan_cat{background-image:url(http://uploads.orilivni.com/btns/images/icon-nyan.png);background-color:#1d4374;box-shadow:0 1px 0 0 #091422}.button-button.skin-nyan_cat:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #1d4374}.button-button.skin-disaster_artist{background-image:url(http://uploads.orilivni.com/btns/images/icon-disaster_artist.png);background-color:#eb4638;box-shadow:0 1px 0 0 #ac1d11}.button-button.skin-disaster_artist:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #eb4638}.button-button.skin-streets_of_rage{background-image:url(http://uploads.orilivni.com/btns/images/icon-streets_of_rage.png);background-color:#131131;box-shadow:0 1px 0 0 #000}.button-button.skin-streets_of_rage:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #131131}.button-button.skin-alert{background-image:url(http://uploads.orilivni.com/btns/images/icon-alert.png);background-color:#f62;box-shadow:0 1px 0 0 #bb3a00}.button-button.skin-alert:focus{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 0 4px #f62}.button.is-open.is-has-menu>.button-container>.button-button.skin-main_menu,.button.is-open.is-has-menu>.button-container>.button-button.skin-menu{background-image:none}.button-title{width:150%;margin:0 -25%;padding:.75em 0 0;position:absolute;display:block;font-size:100%;line-height:1;text-align:center}.no-touch-fix .button-button:hover+.button-title{-webkit-transform:translateY(25px) translateY(0.75em);transform:translateY(25px) translateY(0.75em)}.button-menu{left:0;top:0;padding:0;margin:0;position:absolute;list-style:none;-webkit-transition:.4s;transition:.4s}.button-menu-item{padding:0;margin:0;position:relative;-webkit-transition:.4s;transition:.4s}.button.is-open>.button-menu>.button-menu-item:nth-child(1){-webkit-transform:rotate(45deg) translateX(-115px) rotate(-45deg);transform:rotate(45deg) translateX(-115px) rotate(-45deg)}@media screen and (min-width:480px) and (min-height:480px){.button.is-open>.button-menu>.button-menu-item:nth-child(1){-webkit-transform:rotate(45deg) translateX(-160px) rotate(-45deg);transform:rotate(45deg) translateX(-160px) rotate(-45deg)}}.button.is-open>.button-menu>.button-menu-item:nth-child(2){-webkit-transform:rotate(90deg) translateX(-115px) rotate(-90deg);transform:rotate(90deg) translateX(-115px) rotate(-90deg)}@media screen and (min-width:480px) and (min-height:480px){.button.is-open>.button-menu>.button-menu-item:nth-child(2){-webkit-transform:rotate(90deg) translateX(-160px) rotate(-90deg);transform:rotate(90deg) translateX(-160px) rotate(-90deg)}}.button.is-open>.button-menu>.button-menu-item:nth-child(3){-webkit-transform:rotate(135deg) translateX(-115px) rotate(-135deg);transform:rotate(135deg) translateX(-115px) rotate(-135deg)}@media screen and (min-width:480px) and (min-height:480px){.button.is-open>.button-menu>.button-menu-item:nth-child(3){-webkit-transform:rotate(135deg) translateX(-160px) rotate(-135deg);transform:rotate(135deg) translateX(-160px) rotate(-135deg)}}.button.is-open>.button-menu>.button-menu-item:nth-child(4){-webkit-transform:rotate(180deg) translateX(-115px) rotate(-180deg);transform:rotate(180deg) translateX(-115px) rotate(-180deg)}@media screen and (min-width:480px) and (min-height:480px){.button.is-open>.button-menu>.button-menu-item:nth-child(4){-webkit-transform:rotate(180deg) translateX(-160px) rotate(-180deg);transform:rotate(180deg) translateX(-160px) rotate(-180deg)}}.button.is-open>.button-menu>.button-menu-item:nth-child(5){-webkit-transform:rotate(225deg) translateX(-115px) rotate(-225deg);transform:rotate(225deg) translateX(-115px) rotate(-225deg)}@media screen and (min-width:480px) and (min-height:480px){.button.is-open>.button-menu>.button-menu-item:nth-child(5){-webkit-transform:rotate(225deg) translateX(-160px) rotate(-225deg);transform:rotate(225deg) translateX(-160px) rotate(-225deg)}}.button.is-open>.button-menu>.button-menu-item:nth-child(6){-webkit-transform:rotate(270deg) translateX(-115px) rotate(-270deg);transform:rotate(270deg) translateX(-115px) rotate(-270deg)}@media screen and (min-width:480px) and (min-height:480px){.button.is-open>.button-menu>.button-menu-item:nth-child(6){-webkit-transform:rotate(270deg) translateX(-160px) rotate(-270deg);transform:rotate(270deg) translateX(-160px) rotate(-270deg)}}.button.is-open>.button-menu>.button-menu-item:nth-child(7){-webkit-transform:rotate(315deg) translateX(-115px) rotate(-315deg);transform:rotate(315deg) translateX(-115px) rotate(-315deg)}@media screen and (min-width:480px) and (min-height:480px){.button.is-open>.button-menu>.button-menu-item:nth-child(7){-webkit-transform:rotate(315deg) translateX(-160px) rotate(-315deg);transform:rotate(315deg) translateX(-160px) rotate(-315deg)}}.button.is-open>.button-menu>.button-menu-item:nth-child(8){-webkit-transform:rotate(360deg) translateX(-115px) rotate(-360deg);transform:rotate(360deg) translateX(-115px) rotate(-360deg)}@media screen and (min-width:480px) and (min-height:480px){.button.is-open>.button-menu>.button-menu-item:nth-child(8){-webkit-transform:rotate(360deg) translateX(-160px) rotate(-360deg);transform:rotate(360deg) translateX(-160px) rotate(-360deg)}}.button.is-submenu-open.is-open>.button-menu>.button-menu-item{-webkit-transform:rotate(360deg);transform:rotate(360deg)}.no-touch-fix .button-menu-item:hover{z-index:10}
              
            
!

JS

              
                document.querySelector('#main').innerHTML = '';

/*!
 * Btns.js
 * http://www.orilivni.com
 * @author: Ori Livni
 * @version: 0.0.1
 * @last build: 2014-01-05 UPC:20:11
 * (c) All right reserved. 2014. BSD licensed.
 */
function FastClick(layer){"use strict";var oldOnClick,self=this;if(this.trackingClick=!1,this.trackingClickStart=0,this.targetElement=null,this.touchStartX=0,this.touchStartY=0,this.lastTouchIdentifier=0,this.touchBoundary=10,this.layer=layer,!layer||!layer.nodeType)throw new TypeError("Layer must be a document node");this.onClick=function(){return FastClick.prototype.onClick.apply(self,arguments)},this.onMouse=function(){return FastClick.prototype.onMouse.apply(self,arguments)},this.onTouchStart=function(){return FastClick.prototype.onTouchStart.apply(self,arguments)},this.onTouchMove=function(){return FastClick.prototype.onTouchMove.apply(self,arguments)},this.onTouchEnd=function(){return FastClick.prototype.onTouchEnd.apply(self,arguments)},this.onTouchCancel=function(){return FastClick.prototype.onTouchCancel.apply(self,arguments)},FastClick.notNeeded(layer)||(this.deviceIsAndroid&&(layer.addEventListener("mouseover",this.onMouse,!0),layer.addEventListener("mousedown",this.onMouse,!0),layer.addEventListener("mouseup",this.onMouse,!0)),layer.addEventListener("click",this.onClick,!0),layer.addEventListener("touchstart",this.onTouchStart,!1),layer.addEventListener("touchmove",this.onTouchMove,!1),layer.addEventListener("touchend",this.onTouchEnd,!1),layer.addEventListener("touchcancel",this.onTouchCancel,!1),Event.prototype.stopImmediatePropagation||(layer.removeEventListener=function(type,callback,capture){var rmv=Node.prototype.removeEventListener;"click"===type?rmv.call(layer,type,callback.hijacked||callback,capture):rmv.call(layer,type,callback,capture)},layer.addEventListener=function(type,callback,capture){var adv=Node.prototype.addEventListener;"click"===type?adv.call(layer,type,callback.hijacked||(callback.hijacked=function(event){event.propagationStopped||callback(event)}),capture):adv.call(layer,type,callback,capture)}),"function"==typeof layer.onclick&&(oldOnClick=layer.onclick,layer.addEventListener("click",function(event){oldOnClick(event)},!1),layer.onclick=null))}window.Modernizr=function(window,document,undefined){function setCss(str){mStyle.cssText=str}function setCssAll(str1,str2){return setCss(prefixes.join(str1+";")+(str2||""))}function is(obj,type){return typeof obj===type}function contains(str,substr){return!!~(""+str).indexOf(substr)}function testProps(props,prefixed){for(var i in props){var prop=props[i];if(!contains(prop,"-")&&mStyle[prop]!==undefined)return"pfx"==prefixed?prop:!0}return!1}function testDOMProps(props,obj,elem){for(var i in props){var item=obj[props[i]];if(item!==undefined)return elem===!1?props[i]:is(item,"function")?item.bind(elem||obj):item}return!1}function testPropsAll(prop,prefixed,elem){var ucProp=prop.charAt(0).toUpperCase()+prop.slice(1),props=(prop+" "+cssomPrefixes.join(ucProp+" ")+ucProp).split(" ");return is(prefixed,"string")||is(prefixed,"undefined")?testProps(props,prefixed):(props=(prop+" "+domPrefixes.join(ucProp+" ")+ucProp).split(" "),testDOMProps(props,prefixed,elem))}function webforms(){Modernizr.input=function(props){for(var i=0,len=props.length;len>i;i++)attrs[props[i]]=!!(props[i]in inputElem);return attrs.list&&(attrs.list=!(!document.createElement("datalist")||!window.HTMLDataListElement)),attrs}("autocomplete autofocus list placeholder max min multiple pattern required step".split(" ")),Modernizr.inputtypes=function(props){for(var bool,inputElemType,defaultView,i=0,len=props.length;len>i;i++)inputElem.setAttribute("type",inputElemType=props[i]),bool="text"!==inputElem.type,bool&&(inputElem.value=smile,inputElem.style.cssText="position:absolute;visibility:hidden;",/^range$/.test(inputElemType)&&inputElem.style.WebkitAppearance!==undefined?(docElement.appendChild(inputElem),defaultView=document.defaultView,bool=defaultView.getComputedStyle&&"textfield"!==defaultView.getComputedStyle(inputElem,null).WebkitAppearance&&0!==inputElem.offsetHeight,docElement.removeChild(inputElem)):/^(search|tel)$/.test(inputElemType)||(bool=/^(url|email)$/.test(inputElemType)?inputElem.checkValidity&&inputElem.checkValidity()===!1:inputElem.value!=smile)),inputs[props[i]]=!!bool;return inputs}("search tel url email datetime date month week time datetime-local number range color".split(" "))}var featureName,hasOwnProp,version="2.7.1",Modernizr={},enableClasses=!0,docElement=document.documentElement,mod="modernizr",modElem=document.createElement(mod),mStyle=modElem.style,inputElem=document.createElement("input"),smile=":)",toString={}.toString,prefixes=" -webkit- -moz- -o- -ms- ".split(" "),omPrefixes="Webkit Moz O ms",cssomPrefixes=omPrefixes.split(" "),domPrefixes=omPrefixes.toLowerCase().split(" "),ns={svg:"http://www.w3.org/2000/svg"},tests={},inputs={},attrs={},classes=[],slice=classes.slice,injectElementWithStyles=function(rule,callback,nodes,testnames){var style,ret,node,docOverflow,div=document.createElement("div"),body=document.body,fakeBody=body||document.createElement("body");if(parseInt(nodes,10))for(;nodes--;)node=document.createElement("div"),node.id=testnames?testnames[nodes]:mod+(nodes+1),div.appendChild(node);return style=["&#173;",'<style id="s',mod,'">',rule,"</style>"].join(""),div.id=mod,(body?div:fakeBody).innerHTML+=style,fakeBody.appendChild(div),body||(fakeBody.style.background="",fakeBody.style.overflow="hidden",docOverflow=docElement.style.overflow,docElement.style.overflow="hidden",docElement.appendChild(fakeBody)),ret=callback(div,rule),body?div.parentNode.removeChild(div):(fakeBody.parentNode.removeChild(fakeBody),docElement.style.overflow=docOverflow),!!ret},testMediaQuery=function(mq){var matchMedia=window.matchMedia||window.msMatchMedia;if(matchMedia)return matchMedia(mq).matches;var bool;return injectElementWithStyles("@media "+mq+" { #"+mod+" { position: absolute; } }",function(node){bool="absolute"==(window.getComputedStyle?getComputedStyle(node,null):node.currentStyle).position}),bool},isEventSupported=function(){function isEventSupported(eventName,element){element=element||document.createElement(TAGNAMES[eventName]||"div"),eventName="on"+eventName;var isSupported=eventName in element;return isSupported||(element.setAttribute||(element=document.createElement("div")),element.setAttribute&&element.removeAttribute&&(element.setAttribute(eventName,""),isSupported=is(element[eventName],"function"),is(element[eventName],"undefined")||(element[eventName]=undefined),element.removeAttribute(eventName))),element=null,isSupported}var TAGNAMES={select:"input",change:"input",submit:"form",reset:"form",error:"img",load:"img",abort:"img"};return isEventSupported}(),_hasOwnProperty={}.hasOwnProperty;hasOwnProp=is(_hasOwnProperty,"undefined")||is(_hasOwnProperty.call,"undefined")?function(object,property){return property in object&&is(object.constructor.prototype[property],"undefined")}:function(object,property){return _hasOwnProperty.call(object,property)},Function.prototype.bind||(Function.prototype.bind=function(that){var target=this;if("function"!=typeof target)throw new TypeError;var args=slice.call(arguments,1),bound=function(){if(this instanceof bound){var F=function(){};F.prototype=target.prototype;var self=new F,result=target.apply(self,args.concat(slice.call(arguments)));return Object(result)===result?result:self}return target.apply(that,args.concat(slice.call(arguments)))};return bound}),tests.flexbox=function(){return testPropsAll("flexWrap")},tests.flexboxlegacy=function(){return testPropsAll("boxDirection")},tests.canvas=function(){var elem=document.createElement("canvas");return!(!elem.getContext||!elem.getContext("2d"))},tests.canvastext=function(){return!(!Modernizr.canvas||!is(document.createElement("canvas").getContext("2d").fillText,"function"))},tests.webgl=function(){return!!window.WebGLRenderingContext},tests.touch=function(){var bool;return"ontouchstart"in window||window.DocumentTouch&&document instanceof DocumentTouch?bool=!0:injectElementWithStyles(["@media (",prefixes.join("touch-enabled),("),mod,")","{#modernizr{top:9px;position:absolute}}"].join(""),function(node){bool=9===node.offsetTop}),bool},tests.geolocation=function(){return"geolocation"in navigator},tests.postmessage=function(){return!!window.postMessage},tests.websqldatabase=function(){return!!window.openDatabase},tests.indexedDB=function(){return!!testPropsAll("indexedDB",window)},tests.hashchange=function(){return isEventSupported("hashchange",window)&&(document.documentMode===undefined||document.documentMode>7)},tests.history=function(){return!(!window.history||!history.pushState)},tests.draganddrop=function(){var div=document.createElement("div");return"draggable"in div||"ondragstart"in div&&"ondrop"in div},tests.websockets=function(){return"WebSocket"in window||"MozWebSocket"in window},tests.rgba=function(){return setCss("background-color:rgba(150,255,150,.5)"),contains(mStyle.backgroundColor,"rgba")},tests.hsla=function(){return setCss("background-color:hsla(120,40%,100%,.5)"),contains(mStyle.backgroundColor,"rgba")||contains(mStyle.backgroundColor,"hsla")},tests.multiplebgs=function(){return setCss("background:url(https://),url(https://),red url(https://)"),/(url\s*\(.*?){3}/.test(mStyle.background)},tests.backgroundsize=function(){return testPropsAll("backgroundSize")},tests.borderimage=function(){return testPropsAll("borderImage")},tests.borderradius=function(){return testPropsAll("borderRadius")},tests.boxshadow=function(){return testPropsAll("boxShadow")},tests.textshadow=function(){return""===document.createElement("div").style.textShadow},tests.opacity=function(){return setCssAll("opacity:.55"),/^0.55$/.test(mStyle.opacity)},tests.cssanimations=function(){return testPropsAll("animationName")},tests.csscolumns=function(){return testPropsAll("columnCount")},tests.cssgradients=function(){var str1="background-image:",str2="gradient(linear,left top,right bottom,from(#9f9),to(white));",str3="linear-gradient(left top,#9f9, white);";return setCss((str1+"-webkit- ".split(" ").join(str2+str1)+prefixes.join(str3+str1)).slice(0,-str1.length)),contains(mStyle.backgroundImage,"gradient")},tests.cssreflections=function(){return testPropsAll("boxReflect")},tests.csstransforms=function(){return!!testPropsAll("transform")},tests.csstransforms3d=function(){var ret=!!testPropsAll("perspective");return ret&&"webkitPerspective"in docElement.style&&injectElementWithStyles("@media (transform-3d),(-webkit-transform-3d){#modernizr{left:9px;position:absolute;height:3px;}}",function(node){ret=9===node.offsetLeft&&3===node.offsetHeight}),ret},tests.csstransitions=function(){return testPropsAll("transition")},tests.fontface=function(){var bool;return injectElementWithStyles('@font-face {font-family:"font";src:url("https://")}',function(node,rule){var style=document.getElementById("smodernizr"),sheet=style.sheet||style.styleSheet,cssText=sheet?sheet.cssRules&&sheet.cssRules[0]?sheet.cssRules[0].cssText:sheet.cssText||"":"";bool=/src/i.test(cssText)&&0===cssText.indexOf(rule.split(" ")[0])}),bool},tests.generatedcontent=function(){var bool;return injectElementWithStyles(["#",mod,"{font:0/0 a}#",mod,':after{content:"',smile,'";visibility:hidden;font:3px/1 a}'].join(""),function(node){bool=node.offsetHeight>=3}),bool},tests.video=function(){var elem=document.createElement("video"),bool=!1;try{(bool=!!elem.canPlayType)&&(bool=new Boolean(bool),bool.ogg=elem.canPlayType('video/ogg; codecs="theora"').replace(/^no$/,""),bool.h264=elem.canPlayType('video/mp4; codecs="avc1.42E01E"').replace(/^no$/,""),bool.webm=elem.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/^no$/,""))}catch(e){}return bool},tests.audio=function(){var elem=document.createElement("audio"),bool=!1;try{(bool=!!elem.canPlayType)&&(bool=new Boolean(bool),bool.ogg=elem.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,""),bool.mp3=elem.canPlayType("audio/mpeg;").replace(/^no$/,""),bool.wav=elem.canPlayType('audio/wav; codecs="1"').replace(/^no$/,""),bool.m4a=(elem.canPlayType("audio/x-m4a;")||elem.canPlayType("audio/aac;")).replace(/^no$/,""))}catch(e){}return bool},tests.localstorage=function(){try{return localStorage.setItem(mod,mod),localStorage.removeItem(mod),!0}catch(e){return!1}},tests.sessionstorage=function(){try{return sessionStorage.setItem(mod,mod),sessionStorage.removeItem(mod),!0}catch(e){return!1}},tests.webworkers=function(){return!!window.Worker},tests.applicationcache=function(){return!!window.applicationCache},tests.svg=function(){return!!document.createElementNS&&!!document.createElementNS(ns.svg,"svg").createSVGRect},tests.inlinesvg=function(){var div=document.createElement("div");return div.innerHTML="<svg/>",(div.firstChild&&div.firstChild.namespaceURI)==ns.svg},tests.smil=function(){return!!document.createElementNS&&/SVGAnimate/.test(toString.call(document.createElementNS(ns.svg,"animate")))},tests.svgclippaths=function(){return!!document.createElementNS&&/SVGClipPath/.test(toString.call(document.createElementNS(ns.svg,"clipPath")))};for(var feature in tests)hasOwnProp(tests,feature)&&(featureName=feature.toLowerCase(),Modernizr[featureName]=tests[feature](),classes.push((Modernizr[featureName]?"":"no-")+featureName));return Modernizr.input||webforms(),Modernizr.addTest=function(feature,test){if("object"==typeof feature)for(var key in feature)hasOwnProp(feature,key)&&Modernizr.addTest(key,feature[key]);else{if(feature=feature.toLowerCase(),Modernizr[feature]!==undefined)return Modernizr;test="function"==typeof test?test():test,"undefined"!=typeof enableClasses&&enableClasses&&(docElement.className+=" "+(test?"":"no-")+feature),Modernizr[feature]=test}return Modernizr},setCss(""),modElem=inputElem=null,function(window,document){function addStyleSheet(ownerDocument,cssText){var p=ownerDocument.createElement("p"),parent=ownerDocument.getElementsByTagName("head")[0]||ownerDocument.documentElement;return p.innerHTML="x<style>"+cssText+"</style>",parent.insertBefore(p.lastChild,parent.firstChild)}function getElements(){var elements=html5.elements;return"string"==typeof elements?elements.split(" "):elements}function getExpandoData(ownerDocument){var data=expandoData[ownerDocument[expando]];return data||(data={},expanID++,ownerDocument[expando]=expanID,expandoData[expanID]=data),data}function createElement(nodeName,ownerDocument,data){if(ownerDocument||(ownerDocument=document),supportsUnknownElements)return ownerDocument.createElement(nodeName);data||(data=getExpandoData(ownerDocument));var node;return node=data.cache[nodeName]?data.cache[nodeName].cloneNode():saveClones.test(nodeName)?(data.cache[nodeName]=data.createElem(nodeName)).cloneNode():data.createElem(nodeName),!node.canHaveChildren||reSkip.test(nodeName)||node.tagUrn?node:data.frag.appendChild(node)}function createDocumentFragment(ownerDocument,data){if(ownerDocument||(ownerDocument=document),supportsUnknownElements)return ownerDocument.createDocumentFragment();data=data||getExpandoData(ownerDocument);for(var clone=data.frag.cloneNode(),i=0,elems=getElements(),l=elems.length;l>i;i++)clone.createElement(elems[i]);return clone}function shivMethods(ownerDocument,data){data.cache||(data.cache={},data.createElem=ownerDocument.createElement,data.createFrag=ownerDocument.createDocumentFragment,data.frag=data.createFrag()),ownerDocument.createElement=function(nodeName){return html5.shivMethods?createElement(nodeName,ownerDocument,data):data.createElem(nodeName)},ownerDocument.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+getElements().join().replace(/[\w\-]+/g,function(nodeName){return data.createElem(nodeName),data.frag.createElement(nodeName),'c("'+nodeName+'")'})+");return n}")(html5,data.frag)}function shivDocument(ownerDocument){ownerDocument||(ownerDocument=document);var data=getExpandoData(ownerDocument);return!html5.shivCSS||supportsHtml5Styles||data.hasCSS||(data.hasCSS=!!addStyleSheet(ownerDocument,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")),supportsUnknownElements||shivMethods(ownerDocument,data),ownerDocument}var supportsHtml5Styles,supportsUnknownElements,version="3.7.0",options=window.html5||{},reSkip=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,saveClones=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,expando="_html5shiv",expanID=0,expandoData={};!function(){try{var a=document.createElement("a");a.innerHTML="<xyz></xyz>",supportsHtml5Styles="hidden"in a,supportsUnknownElements=1==a.childNodes.length||function(){document.createElement("a");var frag=document.createDocumentFragment();return"undefined"==typeof frag.cloneNode||"undefined"==typeof frag.createDocumentFragment||"undefined"==typeof frag.createElement}()}catch(e){supportsHtml5Styles=!0,supportsUnknownElements=!0}}();var html5={elements:options.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:version,shivCSS:options.shivCSS!==!1,supportsUnknownElements:supportsUnknownElements,shivMethods:options.shivMethods!==!1,type:"default",shivDocument:shivDocument,createElement:createElement,createDocumentFragment:createDocumentFragment};window.html5=html5,shivDocument(document)}(this,document),Modernizr._version=version,Modernizr._prefixes=prefixes,Modernizr._domPrefixes=domPrefixes,Modernizr._cssomPrefixes=cssomPrefixes,Modernizr.mq=testMediaQuery,Modernizr.hasEvent=isEventSupported,Modernizr.testProp=function(prop){return testProps([prop])},Modernizr.testAllProps=testPropsAll,Modernizr.testStyles=injectElementWithStyles,Modernizr.prefixed=function(prop,obj,elem){return obj?testPropsAll(prop,obj,elem):testPropsAll(prop,"pfx")},docElement.className=docElement.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(enableClasses?" js "+classes.join(" "):""),Modernizr}(this,this.document),FastClick.prototype.deviceIsAndroid=navigator.userAgent.indexOf("Android")>0,FastClick.prototype.deviceIsIOS=/iP(ad|hone|od)/.test(navigator.userAgent),FastClick.prototype.deviceIsIOS4=FastClick.prototype.deviceIsIOS&&/OS 4_\d(_\d)?/.test(navigator.userAgent),FastClick.prototype.deviceIsIOSWithBadTarget=FastClick.prototype.deviceIsIOS&&/OS ([6-9]|\d{2})_\d/.test(navigator.userAgent),FastClick.prototype.needsClick=function(target){"use strict";switch(target.nodeName.toLowerCase()){case"button":case"select":case"textarea":if(target.disabled)return!0;break;case"input":if(this.deviceIsIOS&&"file"===target.type||target.disabled)return!0;break;case"label":case"video":return!0}return/\bneedsclick\b/.test(target.className)},FastClick.prototype.needsFocus=function(target){"use strict";switch(target.nodeName.toLowerCase()){case"textarea":case"select":return!0;case"input":switch(target.type){case"button":case"checkbox":case"file":case"image":case"radio":case"submit":return!1}return!target.disabled&&!target.readOnly;default:return/\bneedsfocus\b/.test(target.className)}},FastClick.prototype.sendClick=function(targetElement,event){"use strict";var clickEvent,touch;document.activeElement&&document.activeElement!==targetElement&&document.activeElement.blur(),touch=event.changedTouches[0],clickEvent=document.createEvent("MouseEvents"),clickEvent.initMouseEvent("click",!0,!0,window,1,touch.screenX,touch.screenY,touch.clientX,touch.clientY,!1,!1,!1,!1,0,null),clickEvent.forwardedTouchEvent=!0,targetElement.dispatchEvent(clickEvent)},FastClick.prototype.focus=function(targetElement){"use strict";var length;this.deviceIsIOS&&targetElement.setSelectionRange?(length=targetElement.value.length,targetElement.setSelectionRange(length,length)):targetElement.focus()},FastClick.prototype.updateScrollParent=function(targetElement){"use strict";var scrollParent,parentElement;if(scrollParent=targetElement.fastClickScrollParent,!scrollParent||!scrollParent.contains(targetElement)){parentElement=targetElement;do{if(parentElement.scrollHeight>parentElement.offsetHeight){scrollParent=parentElement,targetElement.fastClickScrollParent=parentElement;break}parentElement=parentElement.parentElement}while(parentElement)}scrollParent&&(scrollParent.fastClickLastScrollTop=scrollParent.scrollTop)},FastClick.prototype.getTargetElementFromEventTarget=function(eventTarget){"use strict";return eventTarget.nodeType===Node.TEXT_NODE?eventTarget.parentNode:eventTarget},FastClick.prototype.onTouchStart=function(event){"use strict";var targetElement,touch,selection;if(event.targetTouches.length>1)return!0;if(targetElement=this.getTargetElementFromEventTarget(event.target),touch=event.targetTouches[0],this.deviceIsIOS){if(selection=window.getSelection(),selection.rangeCount&&!selection.isCollapsed)return!0;if(!this.deviceIsIOS4){if(touch.identifier===this.lastTouchIdentifier)return event.preventDefault(),!1;this.lastTouchIdentifier=touch.identifier,this.updateScrollParent(targetElement)}}return this.trackingClick=!0,this.trackingClickStart=event.timeStamp,this.targetElement=targetElement,this.touchStartX=touch.pageX,this.touchStartY=touch.pageY,event.timeStamp-this.lastClickTime<200&&event.preventDefault(),!0},FastClick.prototype.touchHasMoved=function(event){"use strict";var touch=event.changedTouches[0],boundary=this.touchBoundary;return Math.abs(touch.pageX-this.touchStartX)>boundary||Math.abs(touch.pageY-this.touchStartY)>boundary?!0:!1},FastClick.prototype.onTouchMove=function(event){"use strict";return this.trackingClick?((this.targetElement!==this.getTargetElementFromEventTarget(event.target)||this.touchHasMoved(event))&&(this.trackingClick=!1,this.targetElement=null),!0):!0},FastClick.prototype.findControl=function(labelElement){"use strict";return void 0!==labelElement.control?labelElement.control:labelElement.htmlFor?document.getElementById(labelElement.htmlFor):labelElement.querySelector("button, input:not([type=hidden]), keygen, meter, output, progress, select, textarea")},FastClick.prototype.onTouchEnd=function(event){"use strict";var forElement,trackingClickStart,targetTagName,scrollParent,touch,targetElement=this.targetElement;if(!this.trackingClick)return!0;if(event.timeStamp-this.lastClickTime<200)return this.cancelNextClick=!0,!0;if(this.lastClickTime=event.timeStamp,trackingClickStart=this.trackingClickStart,this.trackingClick=!1,this.trackingClickStart=0,this.deviceIsIOSWithBadTarget&&(touch=event.changedTouches[0],targetElement=document.elementFromPoint(touch.pageX-window.pageXOffset,touch.pageY-window.pageYOffset)||targetElement,targetElement.fastClickScrollParent=this.targetElement.fastClickScrollParent),targetTagName=targetElement.tagName.toLowerCase(),"label"===targetTagName){if(forElement=this.findControl(targetElement)){if(this.focus(targetElement),this.deviceIsAndroid)return!1;targetElement=forElement}}else if(this.needsFocus(targetElement))return event.timeStamp-trackingClickStart>100||this.deviceIsIOS&&window.top!==window&&"input"===targetTagName?(this.targetElement=null,!1):(this.focus(targetElement),this.deviceIsIOS4&&"select"===targetTagName||(this.targetElement=null,event.preventDefault()),!1);return this.deviceIsIOS&&!this.deviceIsIOS4&&(scrollParent=targetElement.fastClickScrollParent,scrollParent&&scrollParent.fastClickLastScrollTop!==scrollParent.scrollTop)?!0:(this.needsClick(targetElement)||(event.preventDefault(),this.sendClick(targetElement,event)),!1)},FastClick.prototype.onTouchCancel=function(){"use strict";this.trackingClick=!1,this.targetElement=null},FastClick.prototype.onMouse=function(event){"use strict";return this.targetElement?event.forwardedTouchEvent?!0:event.cancelable?!this.needsClick(this.targetElement)||this.cancelNextClick?(event.stopImmediatePropagation?event.stopImmediatePropagation():event.propagationStopped=!0,event.stopPropagation(),event.preventDefault(),!1):!0:!0:!0},FastClick.prototype.onClick=function(event){"use strict";var permitted;return this.trackingClick?(this.targetElement=null,this.trackingClick=!1,!0):"submit"===event.target.type&&0===event.detail?!0:(permitted=this.onMouse(event),permitted||(this.targetElement=null),permitted)},FastClick.prototype.destroy=function(){"use strict";var layer=this.layer;this.deviceIsAndroid&&(layer.removeEventListener("mouseover",this.onMouse,!0),layer.removeEventListener("mousedown",this.onMouse,!0),layer.removeEventListener("mouseup",this.onMouse,!0)),layer.removeEventListener("click",this.onClick,!0),layer.removeEventListener("touchstart",this.onTouchStart,!1),layer.removeEventListener("touchmove",this.onTouchMove,!1),layer.removeEventListener("touchend",this.onTouchEnd,!1),layer.removeEventListener("touchcancel",this.onTouchCancel,!1)},FastClick.notNeeded=function(layer){"use strict";var metaViewport;if("undefined"==typeof window.ontouchstart)return!0;if(/Chrome\/[0-9]+/.test(navigator.userAgent)){if(!FastClick.prototype.deviceIsAndroid)return!0;if(metaViewport=document.querySelector("meta[name=viewport]"),metaViewport&&-1!==metaViewport.content.indexOf("user-scalable=no"))return!0}return"none"===layer.style.msTouchAction?!0:!1},FastClick.attach=function(layer){"use strict";return new FastClick(layer)},"undefined"!=typeof define&&define.amd?define(function(){"use strict";return FastClick}):"undefined"!=typeof module&&module.exports?(module.exports=FastClick.attach,module.exports.FastClick=FastClick):window.FastClick=FastClick,function(root,window,document,undefined){"use strict";function renderPaint(renderList){return function(){for(var v,len=renderList.length;len--;)v=renderList.shift(),v.el[v.fn].apply(v.el,v.args)}}function privatePrefix(str){return"_"+str}function createElement(props,data){var i,el,attr,matchProp;if(!("tag"in props))throw"ERROR - createElement() - missing `tag` key in `props`";data=data||{},el=document.createElement(props.tag);for(i in props.attr)attr=""+props.attr[i],/^{{.+}}$/.test(props.attr[i])&&(matchProp=props.attr[i].match(/^{{(:?.+)}}$/)[1],matchProp in data&&(attr=data[matchProp])),el.setAttribute(i,attr);return el}function createElementsTo(self,dom,data,parent){dom.forEach(function(v){var el=createElement(v,data);"name"in v&&"object"==typeof self&&(self[privatePrefix(v.name)]=el),parent!==undefined&&parent.appendChild(el),"children"in v&&Array.isArray(v.children)&&createElementsTo(self,v.children,data,el)})}function surroundElement(el,props){var surroundEl=createElement(props);return surroundEl.appendChild(el),surroundEl}function skinSelector(self,fnName,c,selector){if("string"!=typeof c&&!Array.isArray(c))throw"ERROR - skinSelector() - selector expected to be `undefined` or `string` or `array`";if(c=Array.prototype.slice.call([c]),selector===undefined)selector=ELELMENTS.button;else if("string"==typeof selector){if(!(selector in ELELMENTS))throw"ERROR - skinSelector() - unknown selector";selector=ELELMENTS[selector]}selector=privatePrefix(selector),c.forEach(function(v){selector in self&&self[selector].classList[fnName](v)})}function setParent(self,child){self._children.push(child),child._parent=self,child.get().classList.remove(IS_HAS_NO_PARENT_CLASS),self.get().classList.add(IS_HAS_MENU_CLASS)}function setMenuChildrenLengthClass(self){var elementsToStyle=[self.get(),self.get("menu")];1===self._children.length?(elementsToStyle.forEach(function(v){v.classList.add(IS_MENU_ITEMS_LEN+self._children.length)}),self.get("menu").setAttribute("role","menu")):self._children.length>1&&elementsToStyle.forEach(function(v){v.classList.remove(IS_MENU_ITEMS_LEN+(self._children.length-1)),v.classList.add(IS_MENU_ITEMS_LEN+self._children.length)})}function onclick(self,e){e.stopPropagation(),self.get().classList.contains(IS_HAS_MENU_CLASS)&&(self.toggle(),render.render())}var IS_IE=function(){var isIE=!1;return[/\bMSIE\b/,/\bTrident\b/,/\bIE\b/,/\bIEMobile\b/].some(function(v){return v.test(navigator.userAgent)?isIE=!0:void 0}),isIE}(),USE_REQUESTANIMATIONFRAME=!IS_IE&&("requestAnimationFrame"in window||"webkitRequestAnimationFrame"in window),BUTTON_CLASS="button",BUTTON_CONTAINER_CLASS="button-container",BUTTON_BUTTON_CLASS="button-button",BUTTON_TITLE_CLASS="button-title",LABELLEDBY_ID_PREFIX="button-label-uid-",IS_HAS_MENU_CLASS="is-has-menu",IS_MENU_ITEMS_LEN="is-menu-items-length-",MENU_CLASS="button-menu",SUM_MENU_CLASS="button-menu-item",IS_HAS_NO_PARENT_CLASS="is-has-no-parent",ELELMENTS={container:"el","button container":"elContainer",button:"elButton",title:"elButtonTitle",menu:"elMenu"},DOM=[{name:ELELMENTS.container,tag:"div",attr:{"class":[BUTTON_CLASS,IS_HAS_NO_PARENT_CLASS].join(" ")},children:[{name:ELELMENTS["button container"],tag:"div",attr:{"class":BUTTON_CONTAINER_CLASS},children:[{name:ELELMENTS.button,tag:"button",attr:{"aria-labelledby":"{{uid}}","class":BUTTON_BUTTON_CLASS}},{name:ELELMENTS.title,tag:"span",attr:{id:"{{uid}}","aria-hidden":"true","class":BUTTON_TITLE_CLASS}}]},{name:ELELMENTS.menu,tag:"ul",attr:{"aria-labelledby":"{{uid}}","class":MENU_CLASS}}]}],DOM_MENU_ITEM={tag:"li",attr:{role:"menuitem","class":SUM_MENU_CLASS}},requestAnimationFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||function(){}}().bind(window),render={_renderList:[],append:function(el,fn,args){return this._renderList.push({el:el,fn:fn,args:Array.isArray(args)?args:[args]}),this},render:function(){var renderFn=renderPaint(this._renderList);return console.log(USE_REQUESTANIMATIONFRAME),USE_REQUESTANIMATIONFRAME?requestAnimationFrame(renderFn):renderFn(),this}},Btn=function(title){return this._children=[],this._events=[],this._uid=999999*Math.random()|0,createElementsTo(this,DOM,{uid:LABELLEDBY_ID_PREFIX+this._uid}),this.title(title).close().on("click",onclick.bind(null,this)),render.render(),this};Btn.prototype.title=function(title){return 0===arguments.length?this._elButtonTitle.textContent:("string"==typeof title&&(this._elButton.setAttribute("data-title",title),this._elButtonTitle.textContent=title),this)},Btn.prototype.addClass=function(c,selector){return skinSelector(this,"add",c,selector),this},Btn.prototype.removeClass=function(c,selector){return skinSelector(this,"remove",c,selector),this},Btn.prototype.toggleClass=function(c,selector){return skinSelector(this,"toggle",c,selector),this},Btn.prototype.get=function(selector){if(selector===undefined)return this._el;if(selector in ELELMENTS)return this[privatePrefix(ELELMENTS[selector])];throw"ERROR - Btn.prototype.get() - selector - unknown property"},Btn.prototype.append=function(child){if(!(child instanceof Btn))throw"ERROR - Btn.prototype.append() - child expected to be instance of Btn";return setParent(this,child),setMenuChildrenLengthClass(this),this._elMenu.appendChild(surroundElement(child._el,DOM_MENU_ITEM)),this},Btn.prototype.appendTo=function(selector){var el;if(selector instanceof Btn)return el.append(this);if(selector instanceof Node?el=selector:"string"==typeof selector&&(el=document.querySelector(selector)),el===undefined)throw"ERROR - Btn.prototype.append() - selcetor isn't from expected type or not found";return el.appendChild(this.get()),this},Btn.prototype.close=function(){return this._children.forEach(function(child){child.get().classList.contains("is-open")&&child.close()}),render.append(this._el.classList,"add","is-close"),render.append(this._el.classList,"remove","is-open"),render.append(this._el,"setAttribute",["aria-pressed",!1]),this._parent&&(render.append(this._parent._el.classList,"remove","is-submenu-open"),render.append(this._parent._elMenu.classList,"remove","is-submenu-open")),this},Btn.prototype.open=function(){return render.append(this._el.classList,"remove","is-close"),render.append(this._el.classList,"add","is-open"),render.append(this._el,"setAttribute",["aria-pressed",!0]),this._parent&&(render.append(this._parent._el.classList,"add","is-submenu-open"),render.append(this._parent._elMenu.classList,"add","is-submenu-open")),this},Btn.prototype.toggle=function(){var state=this._el.classList.contains("is-open");return state?this.close():this.open()},Btn.prototype.on=function(event,fn,capture){if("string"!=typeof event)throw"ERROR - Btn.prototype.on - event expected to be string";
if("function"!=typeof fn)throw"ERROR - Btn.prototype.on - fn expected to be function";return"boolean"!=typeof capture&&(capture=!1),this._events.push({event:event,fn:fn,capture:capture}),this._elButton.addEventListener(event,fn,capture),this},Btn.prototype.off=function(){var EVENT_INDEX=0,FN_INDEX=1,CAPTURE_INDEX=2,self=this,args=arguments,event=EVENT_INDEX.toString()in args,fn=FN_INDEX.toString()in args,capture=CAPTURE_INDEX.toString()in args;if(event&&"string"!=typeof args[EVENT_INDEX])throw"ERROR - Btn.prototype.off() - event expected to be string";if(fn&&"function"!=typeof args[FN_INDEX])throw"ERROR - Btn.prototype.off() - fn expected to be function";if(capture&&"boolean"!=typeof args[CAPTURE_INDEX])throw"ERROR - Btn.prototype.off() - capture expected to be boolean";return this._events=this._events.filter(function(v){return event&&v.event!==args[EVENT_INDEX]||fn&&v.fn!==args[FN_INDEX]||capture&&v.capture!==args[CAPTURE_INDEX]?!0:self._elButton.removeEventListener(v.event,v.fn,v.capture)}),this},root.Btn=Btn}(this,window,document),function(window,document,Btn,FastClick){"use strict";function alertEvent(title){return function(){window.alert(title)}}function linkEvent(link){return function(){window.location.href=link}}function removeIsMainInvisble(){document.documentElement.classList.remove("is-main-invisible")}function onload(){document.documentElement.classList.contains("touch-fix")&&FastClick.attach(document.body),new Btn("Menu").addClass("skin-main_menu").append(new Btn("Portfolio").addClass("skin-www").on("click",linkEvent("http://www.orisomething.com/"))).append(new Btn("orilivni.com").addClass("skin-blog").on("click",linkEvent("http://www.orilivni.com/"))).append(new Btn("Ori's Twitter").addClass("skin-twitter").on("click",linkEvent("https://twitter.com/oriSomething"))).append(new Btn("Sub Menu").addClass("skin-menu").append(new Btn("Disaster Artist").addClass("skin-disaster_artist").on("click",linkEvent("http://www.thedisasterartistbook.com/"))).append(new Btn("Nyan Cat").addClass("skin-nyan_cat").on("click",linkEvent("https://www.youtube.com/watch?v=QH2-TGUlwu4"))).append(new Btn("Streets of Rage").addClass("skin-streets_of_rage").on("click",linkEvent("https://vimeo.com/80984057"))).append(new Btn("Sub Sub Menu").addClass("skin-menu").append(new Btn("Alert: 1!").addClass("skin-alert").on("click",alertEvent("Annoying alert 1!"))).append(new Btn("Alert: 2!").addClass("skin-alert").on("click",alertEvent("Annoying alert 2!"))))).append(new Btn("Hacker News").addClass("skin-hacker_news").on("click",linkEvent("https://news.ycombinator.com/"))).append(new Btn("Fontef").addClass("skin-fontef").on("click",linkEvent("http://www.fontef.com/"))).append(new Btn("Processing").addClass("skin-processing").on("click",linkEvent("http://www.processing.org/"))).append(new Btn("HTML5 Rocks!").addClass("skin-html5rocks").on("click",linkEvent("https://www.html5rocks.com/en/"))).appendTo("#main"),"requestAnimationFrame"in window?window.requestAnimationFrame(removeIsMainInvisble):"webkitRequestAnimationFrame"in window?window.webkitRequestAnimationFrame(removeIsMainInvisble):window.setTimeout(removeIsMainInvisble,0)}!function(){document.documentElement.className+=/(like Mac OS X)|(Android)/i.test(window.navigator.userAgent)?" touch-fix":" no-touch-fix",document.documentElement.className+=" is-main-invisible",document.addEventListener("DOMContentLoaded",onload,!1)}()}(window,document,Btn,FastClick);
              
            
!
999px

Console