#menubg {position: fixed; z-index: 10; top:0; bottom: 0; right: 0; left: 0; width:100%; height: 0; -webkit-transition: background .6s ease 0s, visibility 0s ease .6s, height 0s ease .6s; transition: background .6s ease 0s, visibility 0s ease .6s, height 0s ease .6s}
html.showmenu #menubg {background:rgba(0,0,0,0.5); visibility: visible; height:100%; -webkit-transition: background .6s ease 0s, visibility 0s ease 0s, height 0s ease 0s; transition: background .6s ease 0s, visibility 0s ease 0s, height 0s ease 0s;}

#mainmenu {position: fixed; top:0; bottom:0; left: -100%; background:#fff; width:100%; max-width: 480px; height:100%; z-index: 11; -webkit-transition: all 1s; transition: all 1s; overflow: hidden; display: -webkit-box; display:-moz-box; display:-webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 0; margin: 0; box-sizing: border-box; -moz-box-shadow: 0px 0px 100px rgba(0, 0, 0, .75); -webkit-box-shadow: 0px 0px 100px rgba(0, 0, 0, .75); box-shadow: 0px 0px 100px rgba(0, 0, 0, .75); -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); -webkit-transition-delay: 0.25s; transition-delay: 0.25s; }
html.showmenu #mainmenu {left: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all 1s; transition: all 1s;}

#mainmenu button.closemenu {display: block; position: absolute; top:15px; right: 30px; color:#333; background:none; border: none; width:30px;height:30px; text-align: center; line-height: 30px; font-size: 18px;}
#mainmenu > div {height:100%; width: 100%; padding: 50px 30px 30px 30px; position: relative;}
#mainmenu > div ul {position: relative; margin: 0px; background:#fff;}
#mainmenu > div ul > li {position: relative; border-bottom: 1px solid #D5D3E1;}
#mainmenu > div ul > li > a {text-transform: none; padding: 16px 0; font-weight: 400;line-height:1.4em; color:#444; display: block;position: relative; text-decoration: none;}
#mainmenu > div ul > li > a i {font-size: 14px; position: absolute; right: 10px; top:50%; margin-top:-7px; width:14px; height:14px; text-align: center; color:#444; line-height: 1;}

#mainmenu .submenu {position: fixed; left: -100%; top:50px; bottom:0; background:#fff;width:100%; max-width:480px; height:100%; padding: 0; z-index:201; -webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s;}
#mainmenu .submenu.subopen {left: 0; -webkit-transform: translate3d(0px, 0, 0); transform:translate3d(0px, 0, 0);}

#mainmenu .submenu a.mp-back {padding-left: 30px; color:#444;text-transform: uppercase; font-weight: 600;}
#mainmenu .submenu a.mp-back:hover {text-decoration: none;}
.submenu a.mp-back i {position: absolute; left:0;}

#mainmenu .submenu ul {position: relative; padding: 0 30px;}
#mainmenu .submenu ul li a {display: block; position: relative; text-transform: none; text-decoration: none;}
#mainmenu .submenu ul li.nothing {display: block; position: relative; padding:16px 0;  font-weight: 400;}
#mainmenu .submenu ul li a:hover {background:none;}
#mainmenu .submenu ul li a.active {background-color:transparent; color:#3763A4;}

html.webapp #mainmenu > div > ul > li.mobileapplink {display: none;}

html.showsearch #menubg {background:rgba(0,0,0,0.5); visibility: visible; height:100%; -webkit-transition: background .6s ease 0s, visibility 0s ease 0s, height 0s ease 0s; transition: background .6s ease 0s, visibility 0s ease 0s, height 0s ease 0s; z-index: 5;}
#searchmenu {position: fixed; z-index: 6; width:100%; height: 90px; top:-100%; left: 0; right: 0; margin: 0; -webkit-transition: all .3s cubic-bezier(0.55, 0, 0.1, 1); transition: all .3s cubic-bezier(0.55, 0, 0.1, 1); visibility: hidden; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); box-shadow: 0 1px 2px 0 rgba(0,0,0,.06),0 1px 3px 0 rgba(0,0,0,.1); background:#f4F4EF;}
html.showsearch #searchmenu {top:45px; visibility: visible; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
#searchmenu > div {position: relative; width: 100%; height:100%; padding: 0 0; background:none; display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex; -ms-flex-direction: column; flex-direction: column; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items:center; -webkit-box-pack: center; -ms-flex-pack:center; justify-content: center;}
#searchmenu > div form {position: relative; width:90%;}
#searchmenu > div form button {position: absolute; left: 0;font-size: 1.25rem;z-index: 1; background: #0074D9; border: 0 none; padding: 0; -webkit-appearance: none; appearance: none;color:#fff; line-height: 50px; width:50px; text-align: center; border-radius: 6px 0px 0px 6px;}
#searchmenu > div form button i {position: relative; line-height: 1;}

#searchmenu > div form input {position: relative; width:100%; height: 50px;border-color: #e7e7e7; border-width:1px; border-radius: 6px; padding-left: 3.75rem; color:#515151; font-size: 1.15rem; font-family: 'Source Sans Pro', sans-serif; flex: 1 1 auto; box-shadow: 0 1px 2px rgba(0,0,0,.15); flex: 1 1 auto;}
#searchmenu > div form ::-webkit-input-placeholder {color:#515151; opacity: .75; font-family: 'Source Sans Pro', sans-serif;}
#searchmenu > div form input:focus {border-color:#0074D9; box-shadow: inset 0 1px 2px transparent,0 .375rem .625rem -0.3125rem rgba(0, 116, 217,.15);}