.slideout-menu{position: fixed;left: 0;top: 0;bottom: 0;right: 0;z-index: 0;width: 256px;overflow: hidden;overflow-y: auto;-webkit-overflow-scrolling: touch;}
.slideout-panel{position:relative;z-index: 1;background: #FFF;}
.slideout-open, .slideout-open body, .slideout-open .slideout-panel{overflow: hidden;}

#menu{background: #FFF;position: absolute;top: 0;left: -86%;transition:0.3s left;width: 100%;height: 100vh;z-index: 203;max-width: 86%;overflow-y: auto;overflow-x: hidden;}
.showMenu #menu{left: 0;}

.close-menu{display: none;position: absolute;top: 0px;left: -86%;transition:0.3s left;width: 44px;height: 48px;background: url(../../sysimages/icon-close-white.png?1) no-repeat center center/26px;z-index: 250;}
.showMenu .close-menu{display: block;left: 86%;}

.mb-holder{position: relative;}
.menu-mobile{overflow-x: hidden;position: relative;}
.menu-mobile ul li a{position: relative;display: block;padding: 8px 20px 8px 8px;}
.menu-mobile ul li.hasSub > a::after{content: '';position: absolute;top: calc(50% - 9px);right: 4px;width: 13px;height: 13px;background: url(../../sysimages/icon-menu-mobile.png) no-repeat left top/13px;}
.menu-mobile ul li.hasSub.featured a::after{background: url(../../sysimages/icon-menu-mobile-featured.png) no-repeat left top/13px;}
.menu-mobile ul.main-menu{list-style: none;margin: 0;background: #FFF;display: table;width: 100%;width: 86.2%;box-shadow: 0 1px 0 #333333; position: fixed;z-index: 2;}
.menu-mobile ul.main-menu li{display: table-cell;vertical-align: middle;border-right: 1px solid #333;}
.menu-mobile ul.main-menu li:last-child{border-right: 0;}
.menu-mobile ul.main-menu li.active{background-color: #333;}
.menu-mobile ul.main-menu li a{text-align: center;padding: 18px 0px; width: 100%;}
.menu-mobile .main-link{border-bottom: 1px solid #ECECEC;border-bottom-style: solid;margin-bottom: 4px;}
.menu-mobile .main-link a{padding: 19px 20px 19px 8px;}
.menu-mobile .main-link a::after{content: '';position: absolute;top: calc(50% - 2px);right: 8px;width: 4px;height: 4px;background-color: #333;border-radius: 10px;}
.menu-mobile ul.sub-mobile.sub li.return{display: table;width: 100%;min-height: 53px;margin-bottom: 14px;border-bottom: 1px solid #ECECEC;}
.menu-mobile ul.sub-mobile.sub li.return a{display: table-cell;vertical-align: middle;padding-left: 44px;}
.menu-mobile ul.sub-mobile.sub li.return a::before{content: '';position: absolute;top: calc(50% - 9px);left: 13px;width: 18px;height: 18px;background: url(../../sysimages/icon-arrow-menu02.png?1) left top/18px no-repeat;}

.menu-mobile ul.sub-mobile.sub li.return a span{display: block;}
.menu-mobile ul.sub-mobile.sub li.return + ul{padding-left: 12px;padding-right: 12px;}

.menu-mobile .wrapper-sub-mobile-inst{padding-top: 49px;width: 100%;transform: translateX(0%);-webkit-transform: translateX(0%);-ms-transform: translateX(0%);-webkit-transition: -webkit-transform .2s;-moz-transition: -moz-transform .2s;transition: transform .2s;}
.menu-mobile .sub-mobile{display: none;}
.menu-mobile .sub-mobile.visible{position: absolute;top: 48px;left: 100%;width: 100%;height: 100%;max-height: calc(100% - 48px);background: #FFF;z-index: 2;padding: 0;}

.menu-mobile .wrapper-sub-mobile-inst ul{padding-left: 12px;padding-right: 12px;}

.menu-mobile ul.menu-inst{padding: 18px 0;margin-top: 21px;border-top: 1px solid #ECECEC;background-color: #f7f7f7;}
.menu-mobile ul.menu-inst li{width: 100%;float: left;}
.menu-mobile ul.menu-inst li a{position: relative;padding: 8px 12px 8px 45px;}
.menu-mobile ul.menu-inst li a::before{content: '';position: absolute;top: calc(50% - 2px);left: 20px;width: 17px;height: 17px;margin-top: -7px;}
.menu-mobile ul.menu-inst li.user{float: left;width: 60%;}
.menu-mobile ul.menu-inst li.logout{float: right;width: 40%;text-align: right;}
.menu-mobile ul.menu-inst li.lang a{background-repeat: no-repeat;background-position: 21px center;}
.menu-mobile ul.menu-inst li.user a::before{background: url(../../sysimages/user.png?1) no-repeat left bottom;background-size: 17px;}
.menu-mobile ul.menu-inst li.wish a::before{background: url(../../sysimages/wish.png?1) no-repeat left bottom;background-size: 17px;}
.menu-mobile ul.menu-inst .country-drop{display: none;width: 100%;margin-top: 5px;padding: 15px 15px 60px 15px;background: rgba(255,255,255,0.8);}
.menu-mobile ul.menu-inst .country-drop .form-field{margin-bottom: 10px;}
.menu-mobile ul.menu-inst .country-drop .form-field label > span{padding-bottom: 4px;}
.menu-mobile ul.menu-inst .country-drop .form-field .select{background-repeat: no-repeat;background-position: 7px center;}
.menu-mobile ul.menu-inst .country-drop select#country-mobile{padding-left: 30px;}
.menu-mobile ul.menu-inst .country-drop button{width: 100%;padding-top: 8px;padding-bottom: 8px;}

.menu-mobile ul.main-menu li a::after, .menu-mobile ul.sub-mobile.sub li.return a::after, .menu-mobile ul.menu-inst li a::after{display: none;}

/* ---- ICONS RETINA ---- */
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1),only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
	.close-menu{background: url(../../sysimages/icon-close-white@3x.png?2) no-repeat center center/26px;}
	.menu-mobile ul li.hasSub > a::after{background: url(../../sysimages/icon-menu-mobile@3x.png?2) no-repeat left top/13px;}
	.menu-mobile ul li.hasSub.featured a::after{background: url(../../sysimages/icon-menu-mobile-featured@3x.png?2) no-repeat left top/13px;}
	.menu-mobile ul.sub-mobile.sub li.return a::before{background: url(../../sysimages/icon-arrow-menu02@3x.png?2) left top/18px no-repeat;}
	.menu-mobile ul.menu-inst li.user a::before{background: url(../../sysimages/user@3x.png?2) no-repeat left bottom;background-size: 17px;}
	.menu-mobile ul.menu-inst li.wish a::before{background: url(../../sysimages/wish@3x.png?2) no-repeat left bottom;background-size: 17px;}
}
/* ---- ICONS RETINA ---- */

@media screen and (min-width: 767px) {
	#menu{display: none !important;}
	#containerSite{transform: none !important;}
	.slideout-open{overflow: auto !important;}
}

/* iPad */
/*@media screen and (min-device-width: 768px) and (max-device-width: 1024px), screen and (min-width: 1024px) and (max-height: 1366px) and (-webkit-min-device-pixel-ratio: 1.5) {*/
	body.tablet.showMenu #menu{display: block !important;background-color: #f7f7f7;position: fixed;}
	body.tablet.showMenu .close-menu{left: 464px;top: 7px;background-size: 42px;position: fixed;}
	body.tablet.showMenu #containerSite::before{z-index: 200;}
	body.tablet #menu,
	body.tablet .menu-mobile ul.main-menu{width: 450px;}
	body.tablet .menu-mobile ul.main-menu li a{padding: 26px 0 25px;}
	body.tablet .menu-mobile .wrapper-sub-mobile{padding-bottom: 18px;background: #FFF;}
	body.tablet .menu-mobile ul.menu-inst{margin-top: 0;}
	body.tablet .menu-mobile .wrapper-sub-mobile-inst{padding-top: 65px;height: 100vh;}
	body.tablet .menu-mobile .main-link a{border: 0;outline: 0;}
	body.tablet .menu-mobile .main-link a::after{right: 14px !important;top: 23px;border-radius: 8px;border: 0;outline: 0;}
	body.tablet .menu-mobile ul li > a::after{zoom: 1.4;right: 9px;top: calc(50% - 7px);}
	body.tablet .menu-mobile ul.sub-mobile.sub li.return a::before{zoom: 1.4;left: 8px;}
	body.tablet .menu-mobile ul.menu-inst li a{padding: 15px 12px 15px 49px;}
	body.tablet .menu-mobile ul.menu-inst li a::before{zoom: 1.6;left: 10px;}
	body.tablet .menu-mobile .sub-mobile.visible{top: 65px;height: calc(100% - 66px);}
	body.tablet .menu-mobile ul.sub-mobile.sub li.return a{padding: 19px 20px 19px 44px;}
	body.tablet .menu-mobile ul.menu-inst .country-drop select{height: 38px;}
	body.tablet .menu-mobile ul.menu-inst .country-drop select#country-mobile{}
	body.tablet .menu-mobile ul.menu-inst .country-drop button{height: 46px;padding-top: 12px;padding-bottom: 12px;font-size: 13px;}
/*}*/

@media screen and (max-width: 768px){
	#containerSite{-webkit-box-shadow: 0 0 5px 0 rgb(102,102,102);-moz-box-shadow: 0 0 5px 0 rgb(102,102,102);box-shadow: 0 0 5px 0 rgb(102,102,102);}
	.menu-mobile .wrapper-sub-mobile-inst {zoom: 1.08;}
	.menu-mobile ul li a {font-size: 1.3em}
	.menu-mobile ul.menu-inst li a, .menu-mobile ul.main-menu li a {font-size: 1em;}
}

@media screen and (device-aspect-ratio: 40/71) {
	.menu-mobile .wrapper-sub-mobile-inst {zoom: 1;}
	.menu-mobile ul.menu-inst li a, .menu-mobile ul.main-menu li a {font-size: 0.9em}
}