diff --git a/css/items.css b/css/items.css
index 61f54ad..6535941 100644
--- a/css/items.css
+++ b/css/items.css
@@ -61,22 +61,23 @@
 }
 
 .reorder-filter {
-    height: 75%;
+    height: 2ch;
     cursor: pointer;
 }
 
 input.filter-input {
     width: 27ch!important;
+    max-width: 90%;
     display: inline-block;
 }
 
 .asc-icon {
     opacity: 0.25;
-    width: 1rem;
+    width: 1.75ch;
 }
 .desc-icon {
     opacity: 0.25;
-    width: 1rem;
+    width: 1.75ch;
     transform: rotate(180deg);
 }
 img.asc-sel {
@@ -90,4 +91,11 @@ input.min-max-input {
 
 #filter-container > div > div > * {
     margin: 0 2px;
+}
+
+/* item display */
+@media (min-width: 576px) and (max-width: 991px) {
+    div.col-sm-6 {
+        width: 100%;
+    }
 }
\ No newline at end of file
diff --git a/items/index.html b/items/index.html
index 69d1b2d..6503497 100644
--- a/items/index.html
+++ b/items/index.html
@@ -77,7 +77,7 @@
         </div>
         <div class = "container py-5 vh-100 mx-0 mx-lg-auto scaled-font">
             <div class = "row">
-                <div class = "row">
+                <div class = "row" style = "margin-top: 3ch;">
                     <div class = "col text-end">
                         <a href = "../items_adv/">Advanced Item Search</a>
                     </div>
@@ -151,6 +151,7 @@
             </div>
         </div>
         <script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@10.2.6/dist/autoComplete.min.js"></script>
+        <script type="text/javascript" src="../js/drag_drop_touch.js"></script>
         <script type="text/javascript" src="../js/utils.js"></script>
         <script type="text/javascript" src="../js/build_utils.js"></script>
         <script type="text/javascript" src="../js/icons.js"></script>
diff --git a/js/drag_drop_touch.js b/js/drag_drop_touch.js
new file mode 100644
index 0000000..4cf6cb7
--- /dev/null
+++ b/js/drag_drop_touch.js
@@ -0,0 +1,8 @@
+/*
+	DragDropTouch by Bernardo Castilho
+	https://github.com/Bernardo-Castilho/dragdroptouch
+	MIT License
+
+	Note: it only works on a real phone for some reason, it doesn't work on desktop browser simulations of phones for some reason.
+*/
+var DragDropTouch;!function(t){"use strict";var e=function(){function t(){this._dropEffect="move",this._effectAllowed="all",this._data={}}return Object.defineProperty(t.prototype,"dropEffect",{get:function(){return this._dropEffect},set:function(t){this._dropEffect=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"effectAllowed",{get:function(){return this._effectAllowed},set:function(t){this._effectAllowed=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"types",{get:function(){return Object.keys(this._data)},enumerable:!0,configurable:!0}),t.prototype.clearData=function(t){null!=t?delete this._data[t.toLowerCase()]:this._data={}},t.prototype.getData=function(t){return this._data[t.toLowerCase()]||""},t.prototype.setData=function(t,e){this._data[t.toLowerCase()]=e},t.prototype.setDragImage=function(t,e,s){var o=i._instance;o._imgCustom=t,o._imgOffset={x:e,y:s}},t}();t.DataTransfer=e;var i=function(){function t(){if(this._lastClick=0,t._instance)throw"DragDropTouch instance already created.";var e=!1;if(document.addEventListener("test",function(){},{get passive(){return e=!0,!0}}),navigator.maxTouchPoints){var i=document,s=this._touchstart.bind(this),o=this._touchmove.bind(this),n=this._touchend.bind(this),r=!!e&&{passive:!1,capture:!1};i.addEventListener("touchstart",s,r),i.addEventListener("touchmove",o,r),i.addEventListener("touchend",n),i.addEventListener("touchcancel",n)}}return t.getInstance=function(){return t._instance},t.prototype._touchstart=function(e){var i=this;if(this._shouldHandle(e)){if(Date.now()-this._lastClick<t._DBLCLICK&&this._dispatchEvent(e,"dblclick",e.target))return e.preventDefault(),void this._reset();this._reset();var s=this._closestDraggable(e.target);s&&(this._dispatchEvent(e,"mousemove",e.target)||this._dispatchEvent(e,"mousedown",e.target)||(this._dragSource=s,this._ptDown=this._getPoint(e),this._lastTouch=e,e.preventDefault(),setTimeout(function(){i._dragSource==s&&null==i._img&&i._dispatchEvent(e,"contextmenu",s)&&i._reset()},t._CTXMENU),t._ISPRESSHOLDMODE&&(this._pressHoldInterval=setTimeout(function(){i._isDragEnabled=!0,i._touchmove(e)},t._PRESSHOLDAWAIT))))}},t.prototype._touchmove=function(t){if(this._shouldCancelPressHoldMove(t))this._reset();else if(this._shouldHandleMove(t)||this._shouldHandlePressHoldMove(t)){var e=this._getTarget(t);if(this._dispatchEvent(t,"mousemove",e))return this._lastTouch=t,void t.preventDefault();this._dragSource&&!this._img&&this._shouldStartDragging(t)&&(this._dispatchEvent(t,"dragstart",this._dragSource),this._createImage(t),this._dispatchEvent(t,"dragenter",e)),this._img&&(this._lastTouch=t,t.preventDefault(),this._dispatchEvent(t,"drag",this._dragSource),e!=this._lastTarget&&(this._dispatchEvent(this._lastTouch,"dragleave",this._lastTarget),this._dispatchEvent(t,"dragenter",e),this._lastTarget=e),this._moveImage(t),this._isDropZone=this._dispatchEvent(t,"dragover",e))}},t.prototype._touchend=function(t){if(this._shouldHandle(t)){if(this._dispatchEvent(this._lastTouch,"mouseup",t.target))return void t.preventDefault();this._img||(this._dragSource=null,this._dispatchEvent(this._lastTouch,"click",t.target),this._lastClick=Date.now()),this._destroyImage(),this._dragSource&&(t.type.indexOf("cancel")<0&&this._isDropZone&&this._dispatchEvent(this._lastTouch,"drop",this._lastTarget),this._dispatchEvent(this._lastTouch,"dragend",this._dragSource),this._reset())}},t.prototype._shouldHandle=function(t){return t&&!t.defaultPrevented&&t.touches&&t.touches.length<2},t.prototype._shouldHandleMove=function(e){return!t._ISPRESSHOLDMODE&&this._shouldHandle(e)},t.prototype._shouldHandlePressHoldMove=function(e){return t._ISPRESSHOLDMODE&&this._isDragEnabled&&e&&e.touches&&e.touches.length},t.prototype._shouldCancelPressHoldMove=function(e){return t._ISPRESSHOLDMODE&&!this._isDragEnabled&&this._getDelta(e)>t._PRESSHOLDMARGIN},t.prototype._shouldStartDragging=function(e){var i=this._getDelta(e);return i>t._THRESHOLD||t._ISPRESSHOLDMODE&&i>=t._PRESSHOLDTHRESHOLD},t.prototype._reset=function(){this._destroyImage(),this._dragSource=null,this._lastTouch=null,this._lastTarget=null,this._ptDown=null,this._isDragEnabled=!1,this._isDropZone=!1,this._dataTransfer=new e,clearInterval(this._pressHoldInterval)},t.prototype._getPoint=function(t,e){return t&&t.touches&&(t=t.touches[0]),{x:e?t.pageX:t.clientX,y:e?t.pageY:t.clientY}},t.prototype._getDelta=function(e){if(t._ISPRESSHOLDMODE&&!this._ptDown)return 0;var i=this._getPoint(e);return Math.abs(i.x-this._ptDown.x)+Math.abs(i.y-this._ptDown.y)},t.prototype._getTarget=function(t){for(var e=this._getPoint(t),i=document.elementFromPoint(e.x,e.y);i&&"none"==getComputedStyle(i).pointerEvents;)i=i.parentElement;return i},t.prototype._createImage=function(e){this._img&&this._destroyImage();var i=this._imgCustom||this._dragSource;if(this._img=i.cloneNode(!0),this._copyStyle(i,this._img),this._img.style.top=this._img.style.left="-9999px",!this._imgCustom){var s=i.getBoundingClientRect(),o=this._getPoint(e);this._imgOffset={x:o.x-s.left,y:o.y-s.top},this._img.style.opacity=t._OPACITY.toString()}this._moveImage(e),document.body.appendChild(this._img)},t.prototype._destroyImage=function(){this._img&&this._img.parentElement&&this._img.parentElement.removeChild(this._img),this._img=null,this._imgCustom=null},t.prototype._moveImage=function(t){var e=this;requestAnimationFrame(function(){if(e._img){var i=e._getPoint(t,!0),s=e._img.style;s.position="absolute",s.pointerEvents="none",s.zIndex="999999",s.left=Math.round(i.x-e._imgOffset.x)+"px",s.top=Math.round(i.y-e._imgOffset.y)+"px"}})},t.prototype._copyProps=function(t,e,i){for(var s=0;s<i.length;s++){var o=i[s];t[o]=e[o]}},t.prototype._copyStyle=function(e,i){if(t._rmvAtts.forEach(function(t){i.removeAttribute(t)}),e instanceof HTMLCanvasElement){var s=e,o=i;o.width=s.width,o.height=s.height,o.getContext("2d").drawImage(s,0,0)}for(var n=getComputedStyle(e),r=0;r<n.length;r++){var a=n[r];a.indexOf("transition")<0&&(i.style[a]=n[a])}i.style.pointerEvents="none";for(r=0;r<e.children.length;r++)this._copyStyle(e.children[r],i.children[r])},t.prototype._dispatchEvent=function(e,i,s){if(e&&s){var o=document.createEvent("Event"),n=e.touches?e.touches[0]:e;return o.initEvent(i,!0,!0),o.button=0,o.which=o.buttons=1,this._copyProps(o,e,t._kbdProps),this._copyProps(o,n,t._ptProps),o.dataTransfer=this._dataTransfer,s.dispatchEvent(o),o.defaultPrevented}return!1},t.prototype._closestDraggable=function(t){for(;t;t=t.parentElement)if(t.hasAttribute("draggable")&&t.draggable)return t;return null},t}();i._instance=new i,i._THRESHOLD=5,i._OPACITY=.5,i._DBLCLICK=500,i._CTXMENU=900,i._ISPRESSHOLDMODE=!1,i._PRESSHOLDAWAIT=400,i._PRESSHOLDMARGIN=25,i._PRESSHOLDTHRESHOLD=0,i._rmvAtts="id,class,style,draggable".split(","),i._kbdProps="altKey,ctrlKey,metaKey,shiftKey".split(","),i._ptProps="pageX,pageY,clientX,clientY,screenX,screenY,offsetX,offsetY".split(","),t.DragDropTouch=i}(DragDropTouch||(DragDropTouch={}));
\ No newline at end of file