.menu-shadow-layer {background: rgba(0, 0, 0, 0.4); bottom: 0; display: none; left: 0; position: fixed; right: 0; top: 0; z-index: 997;}
.mobile-menu a.menu {text-decoration: none;}

@media (min-width: 1025px) {
    .header-menu .mobile-menu > ul {display: none;}
}
@media (max-width: 1024px) {
    .mobile-buttons {display: inline-block; margin: 0 0 0 110px; position: relative; text-align: right; z-index: 2;}
    .mobile-buttons > span > a {box-sizing: border-box; display: inline-block; color: #2ca5ca; font-size: 2em; height: 50px; line-height: 0; padding: .5em; text-align: center;}
    .mobile-buttons > span > a:hover {text-decoration: none;}
    .mobile-buttons > span > a span {font-size: .6em; font-weight: 500; margin-left: .6em; text-transform: capitalize; vertical-align: middle;}
    .mobile-buttons > span > a i {vertical-align: middle;}
    .mobile-buttons > span > a b {font-size: .5em; font-weight: 500; line-height: 1em; vertical-align: middle;}
    .mobile-buttons > span > a b:before {content: "(";}
    .mobile-buttons > span > a b:after {content: ")";}
    .mobile-buttons > span.search-link > a {float: left;}
    .mobile-buttons .cartDropDown:before,
    .mobile-buttons .cartDropDown:after {right: 4em;}


    .header-menu-wrapper {position: relative;}
    /*.header-menu {left: 0; position: absolute; text-align: left; top: 0; width: 480px;}*/

    /*.top-menu-toggle button,
    .top-menu-toggle button:hover {background: none; border: 0; color: #2ca5ca; font-size: 2em; height: auto; padding: .6em 0;}
    .top-menu-toggle span {color: #2ca5ca; cursor: pointer; font-size: 1.2em; vertical-align: middle;}*/
    .top-menu-toggle button {font-size: 2.5em;}
    .top-menu-toggle,
    .sbasket {text-align: center;}
    .top-menu-toggle span,
    .sbasket > span {display: none; color: #e7e0d4; font: 700 11px "OpenSans", Arial, Helvetica, sans-serif;}
    .header-menu #left-angle {font-size: 1em; left: 0; margin: -2em 0 0; padding: 0; position: absolute; top: 50%;}
    .header-menu #left-angle a {color: #fff; font-size: 3em; padding: 0.5em;}
    .header-menu #left-angle a:hover {background: none;}
    .header-menu > ul {display: none;}
    .header-menu ul {background: #fff; padding: 0;}
    .header-menu ul li {display: block;}

    .mobile-menu.visible-desktop {width: 0;}
    .mobile-menu {background: #fff; bottom: 0; left: 0; overflow: auto; position: fixed; top: 0; width: 480px; z-index: 999; display: none;}
    .mobile-menu > ul > li {border-bottom: 1px solid #d9d9d9; padding: 0 38px;}
    .mobile-menu > ul > li > a {color: #121212; display: inline-block; font-size: 18px; font-weight: 700; padding: 14px 0; text-transform: uppercase; width: 100%;}
    .mobile-menu > ul > li > a:hover {background: none;}
    .mobile-menu > ul > li > ul {background: #fff; border: 0; left: auto; margin-left: 0; padding: 0 0 2em; position: relative; top: auto;}
    .mobile-menu > ul > li > ul > li {display: block; padding: 0;}
    .mobile-menu > ul > li > ul > li > a.menu {color: #121212; display: block; font-size: 14px; font-weight: 500; padding: 0 0 1em; text-decoration: none;}
    .mobile-menu > ul > li > ul > li ul {background: #fff; border: 0; left: auto; margin: 0; padding: 0 0 1em 1em; position: relative; top: auto;}
    .mobile-menu > ul > li > ul > li ul > li {display: block; padding: 0;}
    .mobile-menu > ul > li > ul > li ul > li > a.menu {color: #121212; display: block; font-size: 13px; font-weight: 300; padding: 0 0 1em; text-decoration: none;}
    .mobile-menu a.menu span.title {display: inline-block; vertical-align: middle; width: 98%;}
    .mobile-menu a.menu span.angle {display: inline-block; font-size: 1.2em; vertical-align: middle; width: 0%;}
    .mobile-menu a.menu span.angle .fa {line-height: 0.9;}
    .mobile-menu .menu-direct-link .fa-angle-down:before {content: "\f106";}

    .mobile-menu-top {}
    .mobile-menu-top > span {display: inline-block; font-size: 12px; padding: 20px 30px; text-transform: uppercase;}
    .mobile-menu-top > .close-mobile-menu {color: #d9d9d9; cursor: pointer; float: right; font-size: 20px; font-weight: 200; line-height: 1.6em; margin: 12px 18px 0 0; padding: 0; text-align: center; width: 1.6em;}
    .mobile-menu-top > div {background: #f5f5f5; border: 1px solid #d2d2d2; border-width: 1px 0; padding: 12px 22px 12px 30px;}
    .mobile-menu-top > div form {background: #fff; border: 1px solid #eaeaea; padding: 12px 12px 12px 26px;}
    .mobile-menu-top > div form input[type="text"] {border: 0; padding: 0; width: 80%;}
    .mobile-menu-top > div form button {background: #fff; border: 0; color: #999; float: right; font-size: 18px; height: 1em; padding: 0;}
    .mobile-menu-bottom {padding: 14px 38px;}
    .mobile-menu-bottom > span {display: block; margin: 14px 0;}
    .mobile-menu-bottom > span a {font-size: 14px; font-weight: 400;}
    /*.mobile-menu-bottom > span a.lgn:after {content: " / Sign up";}*/
    .mobile-menu-bottom > span.login a {font-weight: 700;}
    .mobile-menu-bottom > span.login .del:before {content: " / ";}
}
@media (max-width: 768px) {
  /*.top-menu-toggle button {box-sizing: border-box; width: 20%;}*/
    
    .top-menu-toggle span,
    .sbasket > span {display: block;}

	.mobile-buttons {float: right; margin: 0; position: relative; width: 80%; z-index: 888;}
	.mobile-buttons > span > a {float: left; padding: 0.5em 0; width: 25%;}
	.mobile-buttons > span > a span {display: none;}
	.mobile-buttons > span > a b {font-size: 0.6em; font-weight: 400; line-height: 1em;}
	.mobile-buttons > span > a b:before,
	.mobile-buttons > span > a b:after {content: "";}
}
@media (max-width: 600px) {
    .header-menu {width: 100%;}
    .mobile-menu {width: 90%;}
    .header-logo {margin: 0 23%;}
}