/* ----------- iPad 1, 2, Mini and Air ----------- */
 
/* Portrait and Landscape */
.h-box { 
    height: 88px !important; 
}

.w_count, .c_count {  
    z-index: 999;
}

@media only screen
and (min-width: 1600px) {
	.h-menu__item.ymenu {
		margin-right: 40px; 
	}
	.h-menu__item.mnuicon.us {
		margin-left: 40px; 
	}
}
@media only screen
and (min-width: 1200px) {
	.h-menu__item.ymenu {
		margin-right: 30px; 
	} 
	.h-menu__item.mnuicon.us {
		margin-left: 30px; 
	}
}

@media only screen
and (min-width: 1141px) {
	.h-menu__item.ymenu {
		margin-right: 25px; 
	} 
	.h-menu__item.mnuicon.us {
		margin-left: 25px; 
	}
}

@media only screen
and (max-width: 1140px){
	.w_count, .c_count { 
	    /*right: 2px; */
	}
 	.ymenu.d-lg-none,
 	.mnuicon.us.d-lg-none{display: none !important;}
 	.h-menu__item.icon_menu{
 		display: inline-flex !important; 
 		opacity: 1; 
 		margin-right: 0px;
    	margin-left: 30px;
	}
 	.h-box .icon-menu {
	    position: relative;
	    z-index: 101;
	    width: 24px;
	    height: 24px;
	    cursor: pointer;
	    display: flex;
	    flex-direction: column;
	    justify-content: center;
	    align-items: flex-end;
	}
 	/*.h-menu__item.mnuicon {
		margin-right: unset; 
	}*/
	.h-box .icon-menu>span:nth-child(1) {
    	width: 18px;
    	margin-bottom: 5px;
	} 
	.h-box .icon-menu>span {
	    width: 22px;
	    height: 2px;
	    background-color: var(--white);
	    border-radius: 4px;
	    -moz-transition: all .3s ease;
	    -o-transition: all .3s ease;
	    -webkit-transition: all .3s ease;
	    transition: all .3s ease;
	}

	body.open-menu-bar .navmenu-accordion {
	    display: flex;
	    flex-direction: column;
	}

	.navmenu-accordion {
	    position: fixed;
	    left: 0;
	    top: 82px;
	    background: var(--white);
	    width: 100%;
	    height: calc(100vh - 60px);
	    padding-bottom: 50px;
	    z-index: 999 !important;
	} 

	body.open-menu-bar .h-menu__item .ic-search {
	    background: var(--dark);
	}

	body.open-menu-bar .h-menu__item svg.cls-1{fill:var(--dark) !important; background: var(--dark);}

	body.open-menu-bar .h-box.gradient {
	    background: #fcfcfc !important; 
	    z-index: 999;
	}
	body.open-menu-bar .h-logo img.h-logo-2 {
	    display: block;
	}
	body.open-menu-bar .h-logo img.h-logo-1 {
	    display: none;
	}
	body.open-menu-bar .icon-menu.open >span,
	body.open-menu-bar .h-box .icon-menu>span {
	    
	    background-color: var(--dark); 
	}
	.h-box .icon-menu.open>span:nth-child(1) {
	    width: 22px;
	    margin-bottom: 0;
	    -webkit-transform: rotate(45deg) translate(1px, 2px);
	    -moz-transform: rotate(45deg) translate(1px, 2px);
	    -ms-transform: rotate(45deg) translate(1px, 2px);
	    -o-transform: rotate(45deg) translate(1px, 2px);
	    transform: rotate(45deg) translate(1px, 2px);
	}

	.h-box .icon-menu.open>span:nth-child(2) {
	    margin-bottom: 0;
	    -webkit-transform: rotate(-45deg) translate(-1px, -1px);
	    -moz-transform: rotate(-45deg) translate(-1px, -1px);
	    -ms-transform: rotate(-45deg) translate(-1px, -1px);
	    -o-transform: rotate(-45deg) translate(-1px, -1px);
	    transform: rotate(-45deg) translate(-1px, -1px);
	}
	body.open-menu-bar .navmenu-accordion .list-social {
	    margin-top: auto; 
	    margin-bottom: 98px;
	}


	/*.msticky{position: fixed !important; width: 360px !important; max-width: 370px !important; margin:0 auto !important; top: 37px !important; margin-left:auto; right: auto; left: auto ;}
*/
	.login-wrapped.active,
	.login-wrapped.mrcenter, .login-wrapped.active.mrcenter {margin:0 auto !important; width: 360px !important; max-width: 370px !important;  left: 6%; right: 6%;}

	.login-wrapped.active{ display:block; margin:0 auto !important; top: 50px !important;  width: 360px !important; max-width: 370px !important; left: 6%; right: 6%;} 

	.login-form {max-height: 95%; overflow-x: hidden; overflow-y: auto; } 
} 

@media only screen 
and (max-width: 1024px)
and (-webkit-min-device-pixel-ratio: 1) {
	.h-box.gradient {
    background: linear-gradient(180deg, #1d1f21 0%, #1d1f21 58%, rgba(29, 31, 33, 0) 100%) !important;
	}
	.h-box.gradient.normal {
	    background: #222 !important;
	}
	.h-box { 
	    height: 88px !important; 
	}
	.w_count, .c_count { 
	    top: 18px; 
	}

	.banner__product {
	    /* height: 100vh; */
	    height: 100% !important;
	    background-position: center center; 
	    position: relative;
	    padding-bottom: 20px;
	    padding-top: 65%;
	    background-size: auto 100%;
	}
 
}

@media only screen and (max-width: 960px){

	.banner__product {
	    height: 100vh;
	    background-position: 40% center;
	}
	
	.w_count, .c_count {
	    right: 2px;
	}
	.h-menu__item.icon_menu{ 
    	margin-left: 20px;
	} 
} 

@media only screen 
and (max-width: 768px)
and (-webkit-min-device-pixel-ratio: 1) {
	.h-box { 
	    height: 72px !important; 
	}
	.h-box.gradient {
	    background: none ;
	}

	.w_count, .c_count { 
	    top: 14px; 
	    /*right: -7px;*/
	}
	.h-menu__item.icon_menu{ 
    	margin-left: 15px;
	}
	.h-menu__item.mcheck_order,
	.h-menu__item.wishlist_count,
	.h-menu__item.cart_count,
	.h-menu__item.mnuicon {
		margin-right: unset;  
	} 

	.login-wrapped.active,
	.login-wrapped.mrcenter, .login-wrapped.active.mrcenter {margin:0 auto !important; width: 320px !important; max-width: 340px !important;  left: 6%; right: 6%;}

	.login-wrapped.active{ display:block; margin:0 auto !important; top: 50px !important;  width: 320px !important; max-width: 340px !important; left: 6%; right: 6%;} 

	.login-form {max-height: 90%; overflow-x: hidden; overflow-y: auto; } 
	#btn-add-to-cart {
	    margin-right: 10px !important;
	}
}

@media only screen 
and (max-width: 540px)
and (-webkit-min-device-pixel-ratio: 1) {
	.h-box { 
	    height: 62px !important; 
	}
	.w_count, .c_count { 
	    top: 10px; 
	}
	.h-menu__item.icon_menu{ 
    	margin-left: 10px;
	}

	.h-menu__item.mcheck_order,
	.h-menu__item.wishlist_count,
	.h-menu__item.cart_count,
	.h-menu__item.mnuicon {
		margin-right: unset; 
	} 

	.h-menu__item.mnuicon{padding: 0 10px;}
	.login-wrapped.mrcenter, .login-wrapped.active.mrcenter {margin:0 auto !important; width: 320px !important; max-width: 320px !important;  left: 6%; right: 6%;}

	.login-wrapped.active{ display:block; margin:0 auto !important; top: 36px !important;  width: 320px !important; max-width: 320px !important; left: 6%; right: 6%;}
}


@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (-webkit-min-device-pixel-ratio: 1) {
 
}
 
/* Portrait */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 1) {
 
}
 
/* Landscape */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 1) {
 
}
 
/* ----------- iPad 3, 4 and Pro 9.7" ----------- */
 
/* Portrait and Landscape */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* Portrait */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* Landscape */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* ----------- iPad Pro 10.5" ----------- */
 
/* Portrait and Landscape */
@media only screen
and (min-device-width: 834px)
and (max-device-width: 1112px)
and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 834px)
and (max-device-width: 834px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 1112px)
and (max-device-width: 1112px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* ----------- iPad Pro 12.9" ----------- */
 
/* Portrait and Landscape */
@media only screen
and (min-device-width: 1024px)
and (max-device-width: 1366px)
and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 1024px)
and (max-device-width: 1024px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen
and (min-device-width: 1366px)
and (max-device-width: 1366px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 2) {
 
}