.nav .container .hform {
  position: absolute;
  top: 100px;
  right: 0;
  overflow: hidden;
  z-index: 20;
  height: 0;
  transition: all .3s;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
}

.nav .container .hform form {
  display: flex;
}

.nav .container .hform #keywords {
  border: #c0c0c0 1px solid;
  border-right: none;
  border-radius: 4px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  padding: 5px 10px;
  height: 22px;
  line-height: 22px;
  display: inline-block;
}

.nav .container .hform button {
  border-radius: 4px;
  border: none;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  padding: 5px 10px;
  background-color: #c0c0c0;
  color: #fff;
  height: 34px;
  display: inline-block;
}

.nav .container .search_btn {
  background: url(../img/search.png) no-repeat center center;
  width: 20px;
  height: 20px;
  margin-left: 10px;
}    

.mobile-nav-search-wrapper{
  float: right;margin-right: 15px;height: 66px;display: flex;align-items: center;
}
#mobile-search-btn{
  background-color: transparent;
  border: none;
  margin-bottom: 10px;
  width: 16px;
  height: 16px;
  background-image: url(../img/search.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
   /* no-repeat contain center center; */
}
#mobile-search-btn.ontrue{      
  background-image: url(../img/icon-close.png);
}

.mobile-search-form-wrapper{
  height: 50px;background-color: white;border-top: solid 1px #eee;display: none;
}
.mobile-search-form-wrapper.active{
  display: block;
}
.mobile-search-form{
  display: flex;align-items: center;height: 100%;
}
.mobile-search-form input{
  flex: 1; border: none;height: 100%;box-sizing: border-box;padding-left: 20px;
}
.mobile-search-form button{
  width: 60px;height: 100%;border: none;
}

@media screen and (max-width:1210px){
  .nav .container .search_btn {
    display: none;
  }
}