@media all and (min-width: 320px) and (max-width: 1200px) {
    .container {
        width:auto;
        padding: 0px 15px;
    }
}
@media all and (min-width: 320px) and (max-width: 768px) {
    .footer .left-footer, .footer .right-footer {
      float: none;
    }
    .footer {
      text-align: center;
    }
    .footer ul li {
      display: inline-block;
      float: none;
    }
    .header .logo {
      float: none;
    }
    .header .right-header {
      float: none;
      margin-top: 10px;
    }
    .search-top {
      width: auto;
    }
    .toggle-menu {
      display: block;
      padding: 7px 15px;
      display: inline-block;
      position: absolute;
      top: 0px;
      right: 0px;
      font-size: 20px;
    }
    .menu {
      position: fixed;
      top: 0px;
      left: 0px;
      width: 300px;
      height: 100%;
      z-index: 100;
      overflow: scroll;
      display: none;
    }
    .menu .bg-menu-mobile {
      content: ' ';
      position: fixed;
      top: 0px;
      left: 0px;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0.7);
    }
    .menu .container {
      padding: 0px;
      z-index: 100;
    }
    .menu ul li {
      float: none;
    }
    .menu ul ul li {
      width: auto;
    }
}

@media all and (min-width: 768px) and (max-width: 1200px) {
    
}