.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 {display: inline-block; color: #d4d4d4; font-size: 2em; padding: .5em; text-align: center;}
    .mobile-buttons > span > a:hover {color: #fff; text-decoration: none;}
    .mobile-buttons > span > a span {display: none; 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 {display: flex; float: right; flex-direction: row-reverse; padding: 12px 0;}
    .header-menu-wrapper + .clear {display: none;}
    .header-menu {}

    .top-menu-toggle button,
    .top-menu-toggle button:hover {background: none; border: 0; color: #d4d4d4; font-size: 2em; height: auto; padding: .6em;}
    .top-menu-toggle button:hover {color: #fff;}
    .top-menu-toggle span {display: none;}
    .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: #191919; padding: 0;}
    .header-menu ul li {display: block;}

    .mobile-menu.visible-desktop {width: 0;}
    .mobile-menu {background: #2b2b2b; 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 #2b2b2b; padding: 0 38px;}
    .mobile-menu > ul > li > a {color: #d4d4d4; display: inline-block; font-size: 18px; font-weight: 300; 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: #d4d4d4; 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: #d4d4d4; 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: #191919; border: 1px solid #191919; border-width: 1px 0; padding: 12px 22px 12px 30px;}
    .mobile-menu-top > div form {background: #191919; border: 1px solid #191919; padding: 12px 12px 12px 26px;}
    .mobile-menu-top > div form input[type="text"] {background: #191919; border: 0; color: #fff; padding: 0; width: 80%;}
    .mobile-menu-top > div form button {background: #191919; border: 0; color: #d4d4d4; 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) {

	.mobile-buttons {float: right; margin: 0; position: relative; width: 80%; z-index: 888;}
	.mobile-buttons > span > a {}
	.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%;}
}