/* Medium Layout: 1280px. */
@media only screen and (min-width: 992px) and (max-width: 1200px) {

}

/* Tablet Layout: 768px. */
@media only screen and (min-width: 768px) and (max-width: 991px) {

}

/* Mobile Layout: 320px. */
@media only screen and (max-width: 767px) {
  .onlymobile{display: block;}
  .onlydesktop{display: none;}
  .logo{text-align: center;}
  .navmolie{display: none; position: fixed; z-index: 999; opacity: 1;
    width: 100%; top: 0; left:0; background: #fff;
    animation-name: menushow;
    animation-duration: 1s;
    -webkit-box-shadow: 0px 1px 5px 0px rgba(117,117,117,1);
    -moz-box-shadow: 0px 1px 5px 0px rgba(117,117,117,1);
    box-shadow: 0px 1px 5px 0px rgba(117,117,117,1);
  }
  
  .btnmenu, .btnsearch{font-size: 20px;}
  .navmolie ul{list-style-type: none; margin: 0; padding: 10px 0 30px 0; float: left; width: 100%;}
  .navmolie ul li{float: left; width: 100%; border-bottom: 1px #f2f2f2 solid; padding: 8px 0;}
  .navmolie ul li a{color: #313131; float: left; width: 100%;}
  .navmolie ul li:last-child{border:0;}
  .navmolie .fas{float: right;}
  .navmolie ul ul{display: none; padding: 10px 20px; }
  h1.title{text-align: center;}
  .showsearch{ padding: 20px 0 10px 0;
    position: fixed; display: none; z-index: 999;
    animation-name: boxsearch;
    animation-duration: 1s;
    width: 100%; float: left; top: 0%; left:0;background: #fff;
    -webkit-box-shadow: 0px 1px 5px 0px rgba(117,117,117,1);
    -moz-box-shadow: 0px 1px 5px 0px rgba(117,117,117,1);
    box-shadow: 0px 1px 5px 0px rgba(117,117,117,1);
  }
  .title-hot{
    flex: 0 0 15%;
    max-width: 15%;
  }
  .marqueehot{flex: 0 0 68%;max-width: 68%;}
  .button-hot{flex: 0 0 17%;max-width: 17%; }

  .menulist ul{display: none;}
  .menulist ul li a{float: left; width: 100%; margin: 0; border-bottom:1px #606060 solid;}
  .btnshowcat{background: #313131; color: #fff; width: 100%; float: left; padding: 5px;}
  .btnshowcat i{float: right;}
  .wrapper{display: inline;}
  .wrapper .item{margin-top: 30px;}
}

/* Wide Mobile Layout: 480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {

}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes boxsearch {
  from {opacity: 0; right: -500px;}
  to {opacity: 1; right:0;}
}

/* Standard syntax */
@keyframes boxsearch {
  from {opacity: 0; right: -500px;}
  to {opacity: 1; right:0;}
}


/* Safari 4.0 - 8.0 */
@-webkit-keyframes menushow {
  from {opacity: 0; left: -500px;}
  to {opacity: 1; left:0;}
}

/* Standard syntax */
@keyframes menushow {
  from {opacity: 0; left: -500px;}
  to {opacity: 1; left:0;}
}