/* general */
body * { transition:0.5s; text-align:center; }
nav { height:5vh; line-height:5vh; font-size:3vh; }
video { object-fit:fill; width:100%; height:calc(100% - 5vh); }
@media(orientation:portrait) { nav { position:fixed; bottom:0vh; } }

/* gridstack */
.grid-stack { margin:1vh; }
.grid-stack *, body { overflow:hidden!important; }
.grid-stack-item-content, .placeholder-content { background:#666; border-radius:1vw; } .placeholder-content { opacity:25%; }
.handle { cursor:move; color:#FFF; border-bottom:solid 1px #555; height:5vh; font-size:2vh; padding:1vh; opacity:50%; } .handle:hover { opacity:100%; }
.ui-resizable-se, .ui-resizable-sw { bottom:4px!important; background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><path fill="%23FFF" d="M9 3h2L8 0 5 3h2v10H5l3 3 3-3H9"/></svg>')!important; }