@media screen and (max-width: 800px) {
  body > .container {
    flex-direction: column !important;
    align-items: center !important;
  }
  body > .container .container_item:last-child {
    margin: 25px 0;
  }

  body #form_search .container{
    flex-direction: column !important;
    align-items: center !important;

  }

  #body_right {
    width:98%;
    position: relative;
    top: 0;
    /* display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items:baseline;
    font-size: 12px; */
  }
  /* #body_right .item {
    width:42% !important;
  }
  #body_right .detail_sub{
    margin-left:0 !important;
    margin-right:0 !important;
  } */
  #body_left {
    width:98%;
  }
  #body_left .up {
    display: flex;
    flex-direction: column;
  }
  #body_left .up_item_bottom {
    display: flex;
    flex-direction: column;
    text-align: center;
  }
  #body_left .up_item_bottom .item_sort {
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
  }
  #body_left .up_item_bottom .item_page {
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
    margin-top:20px;
  }
  #body_left .product_list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    margin-top:20px;
  }
  #body_left .product_list .product {
    width:99%;
  }
   
.product_body{
  display: flex;
  flex-direction: column;
}
.product_body_left{
  display: flex;
  flex-direction: column;
}
.product_body_left_top {
  display: flex;
  flex-direction: column;
  text-align: center;
}
.product_body_left_top h1 {
font-size: 18px;
}
.product_body_left_top .idp {
font-size: 15px;
text-align: center;
}
.product_body_left_bottom{
  display: flex;
  flex-direction: column;
  text-align: center;
}
.product_body_left_bottom_right .title{
width:45px !important;
}
.product_tabs h3{
  font-size: 15px;
}
.product_other{
  justify-content: start !important;
}
.product_other .bdy .body{
  display: flex;
  flex-direction: column;
  text-align: center;
  height:auto !important;
}
.product_other .bdy .body .item{
min-width:auto !important;
max-width:96% !important;
margin:10px 0 !important;
padding:0 !important;
display: flex !important;
flex-direction: column !important;
}
.product_other .bdy .body .product .image{
width:100% !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
}
.product_other .bdy .body .product .image img{
width:100% !important;
max-height: auto !important;
}
.product_other .arrow_right{
  display: none !important;
}
.product_other .arrow_left{
  display: none !important;
}
.product_other .head{
  position: sticky;
  top:55px;
  right:0;
  z-index:999999;
}
#con_tag{
  width:100% !important;
  overflow: hidden !important;
  display: flex;
  flex-direction: row;
}
.product_tag{
  width:100% !important;
  overflow-x: scroll !important;
}
.product_tag .title{
min-width:fit-content !important;
}
.product_tag .item{
min-width:fit-content !important;
}
#head{
  display: none !important;
}
#menu_mobile{
  display: flex !important;
  flex-direction: row;
  background-color: white;
  z-index:9999999;
  position: sticky;
  top:0px;
  right:0;
padding:20px 0 10px 0;
justify-content: space-between;
}
#menu_mobile i{
padding:0 8px;
}
#menu_mobile .menu_icon{
  padding-right:10px;
  position: relative;
}
#menu_mobile .menu_list{
  position: absolute;
  top:35px;
  right:5px;
  background-color: white;
  display: none;
  flex-direction: column;
  justify-content: space-around;
  font-size:14px;
}
#menu_mobile .menu_list .menu_item{
width:55vb;
}
#menu_mobile .menu_list .menu_item a{
width:100% !important;
display: block;
}
#navbar_icons{
  display: none !important;
}
.menu_icon:hover{
color:#b8860b;
cursor: pointer;
}
.light{
  width:75% !important;
}
.light_basket_title{
  width:78% !important;
}
.basket_item {
  margin-top:45px!important;
}
.light_favorit_title{
  width:78% !important;
}
.favorit_item{
  margin-top:60px!important;
}
.basket_light_bottom {
  width:78% !important;
}
.checkout .body{
  display: flex;
  flex-direction: column;
}
.checkout .body .body_right{
width:72% !important;
}
.checkout .body .body_right .row{
flex-wrap: wrap !important;
}
.checkout .body .body_left{
  margin-left:0 !important;
  overflow-x: scroll !important;
  position: relative !important;
  margin-bottom:50px !important;
  padding-bottom:50px !important;
}
.scroll_dark{
position: absolute;
top:0;
bottom:0;
right:0;
left:0;
margin:0 auto;
width:100%;
height:100%;
background-color: black;
opacity: 0.3;
color:white;
text-align: center;
display: flex;
align-items: center;
justify-content: center;

}
.checkout .body .body_left .body{
  min-width:200% !important;
}
.path {
  width: 20px;
  height: 20px;
  position: absolute;
  background: rgba(149, 147, 241, 0.5);
  border-radius: 40px;
  top: 28px;
  left: 78px;
  visibility: hidden;
}
.hand-icon {
  position: relative;
  background-image: url('../../public/images/hand.png');
  background-repeat: no-repeat;
  background-position: center;
  width: 100px;
  height: 100px;
  transform-origin: 52% 62%;
}
@keyframes swipe-hand {
  25% { transform: translate(-20px) rotate(-30deg); }
  50% { transform: translate(20px) rotate(15deg); }
  100% { transform: translate(0px) rotate(0); }
}
.admin_body {
  display: flex;
  flex-direction: column;
  width:98% !important;
  padding:0 !important;
}
.admin_body .right .nav{
display: none;
font-size: 12px;
width:54% !important;
}
.admin_body .right{
position: sticky !important;
top:55px;
right:0;
left:0;
margin:10px auto;
background-color: white;
width:100% !important;
display: flex;
flex-direction: row;
justify-content: center;
}
.admin_body .right .title{
border:none !important;
width:50% !important;
display: flex;
flex-direction: column;
justify-content: center;
}
.admin_body .left{
width:100% !important;
}
.admin_body .left .body{
width:100% !important;
padding:0 !important;
}
.admin_body .left .dashboard{
flex-wrap: wrap;
justify-content: space-around;
}
.admin_body .left .dashboard .item{
width:46% !important;
font-size: 12px;
}
.admin_body .left .body .user section{
width:100% !important;
padding:0 !important;
overflow-x: scroll !important;
position: relative;
}
.admin_body .left .body .user section table{
width:200% !important;
}
#tbl_address_user{
  width:100% !important;
}
#tbl_profile_user{
  width:100% !important;
}
.body_viewinvoice{
  display: flex;
  flex-direction: column;
}
.body_viewinvoice .body{
width:100% !important;
}
.body_viewinvoice .body .item{
display: flex;
flex-direction: column;
}
.body_viewinvoice .body .item .subitem{
display: flex;
flex-direction: column;
margin:5px 0;
}
.body_viewinvoice .body .item .subitem .body{
overflow-x: scroll;
}
.body_viewinvoice .title{
position: sticky;
top:50px;
right:0;
background-color: white;
z-index:999;
}
.body_viewinvoice .body .item .subitem .title{
position: none !important;
z-index: 1 !important;
}
.body_viewinvoice .navar{
width:90% !important;
display: flex;
flex-direction: column !important;
}
.body_viewinvoice .navar .item{
margin:5px 0;
}
#banner_index{
  width:100% !important;
}
#banner_index img{
  height:22vh !important;
}
.container.collection{
  display: flex;
  flex-direction: column !important;
}
.container.collection .col{
width:100% !important;
}

.container .col_title{
  font-size: 15px !important;
}

#slider_product_new{
  width:100% !important;
  scale: 0.5;
  margin-top:-150px !important;
}
#slider_product_new > div{
    width:145% !important;
}
#slider_product_new > div > div{
width: 150% !important;
}
#slider_product_sale{
  width:100% !important;
  scale: 0.5;
  margin-top:-150px !important;
  margin-bottom:-180px !important;
}
#slider_product_sale > div{
    width:145% !important;
}
#slider_product_sale > div > div{
width: 150% !important;
}
.slide_two{
  margin-top:-150px !important;
}
#footer{
  display: flex;
  flex-direction: column;
  height: auto !important;
}
#footer .item_footer{
  display: flex;
  flex-direction: column;
  height: auto !important;
}
#footer .item_footer:last-child .item span{
font-size: 11.5px !important;
}

#tablo .header .item img{
  width:100%;
}
#tablo .banner_bottom{
  padding:10px 0;
}
#tablo {
  margin-bottom:25px;
}
#myCanvas{
  width:92% !important;
}
#tablo .body .item{
  width:99%;
}
#tablo .body.calc .item{
  width:99%;
}
#tablo .body .item .bdy .row{
  width:42%;
}
#tablo .body.calc .item .bdy.calc .row{
  width:42%;
}
#tablo .body.calc .item .bdy.calc .row .bottom{
  height:50px;
  text-align: center;
}
#tablo .body.calc .item .bdy.calc .row input {
  width: 80%;
  text-align: center;
  font-size: 25px;
}

#tablo .body .item .bdy .row .top{
  font-size:13px;
}
#tablo .body .item:last-child .bdy .row{
  width:42%;
}
#tablo .header{
  position: sticky;
  top:0;
  z-index:11;
}
#tablo .body .item .title{
  position: sticky;
  top:86px;
  z-index: 10;
}
#articles .main .body{
  display: flex;
  flex-direction: column;
}
#articles .header img{
  height:80px;
}
#articles .main .body .left{
  margin-right:0;
  width:100%;
}
#articles .main .body .left .item{
  flex-direction: column;
}
#articles .main .body .left .item .bdy{
  width:100%;
}
#articles .main .body .left .item .bdy .title{
  text-align: center;
}
#articles .main .body .left .item_info .pic{
  width:100%;
}
#articles .main .body .left .item .bdy .details .right{
  width:58%;
  text-align: right;
}
#articles .main .body .left .item .bdy .details .left{
  width:40%;
}
.collection .col:last-child img{
height:46vh !important;
}
.collection .col:last-child a i{
right:29% !important;
}
#whatsapp i{
  font-size:65px;
}
#articles .main .body .left .item .pic{
  width:100% !important;
}
#articles .main .body .left .item .bdy .desc h1{
  font-size:15px !important;
}
#articles .main .body .left .item .bdy .desc h2{
  font-size:15px !important;
}
#articles .main .body .left .item .bdy .desc{
  line-height: 25px !important;
}
   .whymatisa{
  width: 80% !important;
  flex-direction: column !important;
}

.boxcat{
  flex-direction: column;
  border:none;
  width:80%;
  text-align: center;
}
.boxcat .item{
  width: 50%;
  margin:20px auto;
}
#push-box {
width:80%;
}
#icon_chat {
  bottom: 80px;
  width: 60px;
}
.main_coverage{
  flex-direction: column !important;
}
.main_coverage .right{
  margin-left:0 !important;
}
.main_coverage .left .top h1{
  font-size: 25px !important;
}
.main_coverage .left .bottom .item{
  width: 43% !important;
}
.main_coverage .left .bottom .bdy .pic{
  width: 100% !important;
}
.main_coverage .left .bottom .bdy p{
  padding-right: 0 !important;
}
.main_coverage .left .top{
  text-align: center !important;
}
#tablo .content .item{
  width: 97% !important;
}
#tablo .content .item.faq .title h3{
  font-size: 15px !important;
}
#tablo .content .item .bdy .form_price .row span{
  min-width: 25% !important;
  text-align: center !important;
}
#tablo .content .item .bdy .form_price .row span:first-child{
  min-width: 93% !important;
  border-radius: 10px !important;
}
#tablo .content .item .bdy .form_price .row {
justify-content: center !important;
}
#tablo .content .item .bdy .form_price .row input[type="text"]{
  text-align: center !important;
}
#msg_banner{
  max-width: 90% !important;
}





}



@media screen and (min-width: 500px) and (max-width: 800px) {

#body_right{
  display: flex;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: space-around !important;
}
#body_right .item{
  width:40% !important;
  align-self: first baseline !important;
}
#body_right .item:first-child{
  width:55% !important;
}
#body_right .item .detail div{
  margin:5px 0 !important;
}
#body_right .item .detail .price_btn{
  margin-top:15px !important;
}
#banner_index img{
  height:30vh !important
}
.container.collection .col{
  width:75% !important;
}
.container.collection .col img{
  height:45vh !important;
}
#footer .item_footer{
width:85% !important;
}
#footer .item_footer .item img.logo{
width:75% !important;
}




}