Rút gọn Tabs của Flatsome với Mobile dạng sổ xuống

Mình sẽ dùng đoạn code sau :

//Css
.producttabs button.icon{
    font-size:13px!important;
    display:block;
    margin-right: 0;
    font-size: 1.2em;
    float: right;
}
.producttabs .nav li{
    display:none;
}
.producttabs .nav.reshow li{
    float: none;
    display: block;
    text-align: right;
    width: 100%;
}
.producttabs h4{
    float: unset;
    width: 100%;
}
.producttabs ul{
    float: unset;
    width: 50%!important;
    margin-left: 50%;
     position: absolute;
    z-index: 100;
    right: 0;
}
.producttabs .nav-tabs>li>a{
    width: 100%;
    text-align: right;
}
.icon{
        position:absolute;
        top:0;
        right:0;
    }

// JS
<script>
jQuery(document).ready(function($) {
    jQuery('.producttabs h4').after('<button class="icon"><i class="icon-menu"></i></button>');
jQuery('button').click(function(){
jQuery(this).next('ul').toggleClass("reshow");
});
jQuery(document).click(function(e) {
  var target = e.target;
  if (!jQuery(target).is('.icon') && !jQuery(target).parents().is('.icon')) {
   jQuery('.producttabs .nav').removeClass('reshow');
  }
});
jQuery('.producttabs .nav li a').click(function(){
jQuery('.producttabs .nav').removeClass('reshow');
});
});
</script>