@charset "utf-8";
@media screen and (max-width: 1024px) {
	
}
@media screen and (max-width: 768px) {
	.rightside li.product:first-child{ width: 100%; padding:15px 10%; box-sizing: border-box; }
	.rightside li.product:first-child a.img{ height: 280px }
	.cart{ top: 2% }
	.giacty{ font-size: 18px }
	.search input{ width: 80% }
	.search .submit{ width: 20% }
	.box li.product a.img{ height: 180px }
	.homeleft li:first-child{ display: none; }
	.hotline-popup{ bottom: 3%; top: unset; }
	#MobileMenu{ display: block;
    z-index: 111;
    color: #fff;
    padding: 8px 5px;
    box-sizing: border-box;
    cursor: pointer; background: #6a2366 } 
    .search1 .left p{    display: flex;
    margin-top: 6px;
    flex-direction: column;
    justify-content: space-between;
    flex-wrap: wrap;
}
.box li.product .soluong{ float: none; display: block; margin: 0 auto; margin-bottom: 10px }
.search1 .left p input{ width: 100%!important; margin: 0!important;  }
.khungsearch {
    display: none;
    width: 70%;
    position: fixed;
    left: 0;
    top: 50px;
    max-height: 100vh;
    z-index: 999999999;
    background: #fff;
    padding: 20px;
    box-sizing: border-box;
}
.search1 .left .khoanggia{ background: none; color: #000 }
.clicksearch{ display: block;
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 9999999999; }
    .search1 .right li{ width: 100%; margin-bottom: 2% }
.clicksearch img{ max-width: 80px; }
.search1 .left{ width: 100%; }
.search1 .right{ width: 100%; margin-top: 10px }
.topsearch .search1 select{ width: 100%; margin: 1% 0; }
.search1 .right .doi{ width: 100%; }
.topsearch .search1 span.submit{ width: 100%; margin-top: 10px; }
    .linemenutren{ display: none; }
    .logohome{ width: 100%; text-align: center; }
    .search{ width: 100%; margin: 0; margin-top: 15px }
    .logohome img{ max-width: 50% }
    #MobileMenu img{max-width:24px;}
	#menutop{ z-index: 5555; font-size: 120%; display: none;}
	#menutop ul{ display: block; background: #333}
	#menutop ul>li{margin:0;}
	#menutop ul a{padding:10px; color:#fff; padding: 2px 10px}
	#menutop ul li{ position:relative; float:none; width: 100%; padding: 5px 0;border-bottom:0.5px solid #fff}
	#menutop ul ul{ position:relative; background:#333; padding:0; width:100%; left: 0}
	#menutop ul ul li{ width: 100%; display: none}
	#menutop ul ul a { padding-top:3px !important; padding-bottom:3px !important; color:#fff;}
	#menutop ul ul ul li { position: relative; top:100%; left:0; display: none; padding-left: 5%; width: 95% }
	#menutop ul ul li:hover > ul{ display: none }
	#menutop ul ul ul{ position: relative; top:0; left:0;}
	#menutop ul > li > span{ display: inline-block; position: absolute; top:8px; right: 10px; width: 60px; height: 30px; background: url(../images/down-arrow.png) center center no-repeat; background-size:16px; text-indent: -9999px; cursor: pointer; border-radius: 5px }
	#menutop ul > li:hover > span{ background: url(../images/down-arrow.png) center center no-repeat; background-size:16px}
	.gridmenu{height: auto; line-height: 14px; text-align: center; letter-spacing: -1px; margin-bottom: 10px; padding:0}
	.gridmenu a.logox{width: 100%; text-align: center; float: none} .gridmenu a.logox img{max-height: 40px}
	.gridmenu a.item{ margin:5px 1px; padding:2px 3px; font-size: 12px; line-height: 18px}
	[padleftright='px100']{padding-left:20px !important;padding-right:20px !important;}

	div.grid[value='col66'] .gridcol, div.grid[value='col48'] .gridcol, div.grid[value='col84'] .gridcol, div.grid[value='col444'] .gridcol, div.grid[value='col336'] .gridcol, div.grid[value='col363'] .gridcol, div.grid[value='col633'] .gridcol{ width: 100% !important }
	div.grid[value][space] .gridcol{ width: 100%  !important}
	div.grid[value='col3333'] .gridcol, div.grid[value='col3333'][space] .gridcol{ width:48% !important }
	div.grid[value='col5'] .gridcol, div.grid[value='col5'][space] .gridcol{ width:48% !important }
	div.grid[value='col3333'][space] .gridcol, div.grid[value='col5'][space] .gridcol{ width: 48%  !important}
	[padleft]{padding-left: 20px !important} [padright]{padding-right: 20px !important} [padtop]{padding-top: 20px !important} [padbottom]{padding-bottom: 20px !important} [padleftright]{padding-left: 20px !important; padding-right: 20px !important} [padtopbottom]{padding-top: 20px !important; padding-bottom: 20px !important} [padall]{padding: 20px !important} 
	[marleft]{padding-left: 20px !important} [marright]{padding-right: 20px !important} [martop]{padding-top: 20px !important} [marbottom]{padding-bottom: 20px !important} [marleftright]{padding-left: 20px !important; padding-right: 20px !important} [martopbottom]{padding-top: 20px !important; padding-bottom: 20px !important} [marall]{padding: 20px !important} 

	ul[column] li{width: 100% !important}
	ol[column] li{width: 100% !important}
	.giacty{ display: block; text-align: center; }
	.giaban{ display: block; text-align: center; }
	.maxlead{width:100%; height: 60px; bottom:0 !important; border-radius: 0}
	.maxlead a{float:left; width: 20%}
	.maxlead a.hotline img{width: 52px; margin-top: -15px}
	.flashsale { margin-bottom: 15px }
	.leftside, .rightside{width: 100%; float: none; margin:0; padding:0}
	.nomobile{display: none}
	.flashsale h3{ width: 100%; margin: 10px 0; font-size: 18px }
	.flashsale .giacty{ display: block; text-align: center; }
	.flashsale .giaban{ display: block; text-align: center; }
	.firstcat span.mobileMenu{display: block}
	.flashsale a.img{ height: 200px }
	.homeright{ display: none; }
	.homeleft{ width: 100% }
	.itemnews{ width: 100%; margin: 1% 0 }
	.footer .info{ width: 100% !important }
	.footer .vecty{width: 100%; margin-top: 10px}
	.footer .hotro{width: 100%; margin-top: 10px}
	.footer .page{width: 100%; margin-top: 10px}
	.box li.product{width: 48%}
	.titlehome ul li{display: none}
	.cgallery, .cinfo{width: 100%!important; margin:0; padding:0; float: none}
	.boxnews li{width: 92%}
	.footer{background-size: cover}
	.footer .contact, .footer .info{width: 100%; margin:0 padding:0; margin-bottom: 20px}
	.copyright{margin-bottom: 60px}
	.copyright #nav_up{top:10px; right: 20px}
	.linemenu .logohome{ width: 100% }
	.linemenu .khungmn{ width: 100%; margin-top: 20px }
	.linemenu .left{display: none}
	.linemenu .right{width: 100%; text-align: left}
	.camket ul li{ width: 100%; margin: 2% 0 }
	.linemenu ul{text-align: left}
	.linemenu ul li{margin-left: 0; margin-right: 5px}
	.linemenu .email{display: none}
	.content, .rightcol{width: 100%; float: none; margin:0; padding:0; margin-bottom: 20px}
	ul.groupnews li{width: 100%; float: none; margin:0; padding:0; margin-bottom: 20px}
	ul.groupnews li h3, ul.groupnews li p.des{height: auto}
	.content img{max-width: 100%; height: auto !important}
}

