.grid-container{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);gap:5px;width:100%;max-width:1500px;margin:0 auto;padding:10px;box-sizing:border-box}.grid-item{position:relative;width:100%;height:100%;max-width:150px;max-height:150px;border:1px solid #ddd;background-color:#f4f4f4}.grid-item img{width:100%;height:100%;object-fit:cover}.grid-item-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.089);color:#fff;font-size:24px;font-weight:700;display:flex;align-items:center;justify-content:center;pointer-events:none}.delete-btn{position:absolute;top:0;right:0;background-color:unset;color:#000;cursor:pointer;font-size:14px}.delete-btn:hover{background-color:#fff;border-radius:25%;color:#000}.modal{display:none;position:fixed;z-index:1000;padding-top:60px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(0,0,0,.9)}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.9);justify-content:center;align-items:center;overflow:hidden}.modal-content{margin:auto;display:block;max-width:80%;max-height:80%;object-fit:contain}#caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;height:150px}.close{position:absolute;top:15px;right:35px;color:#f1f1f1;font-size:40px;font-weight:700;transition:.3s}.close:hover,.close:focus{color:#bbb;text-decoration:none;cursor:pointer}@media (max-width:768px){.grid-container{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));width:100%;min-width:60px;min-height:60px}.delete-btn{width:18px;height:18px;font-size:12px;line-height:16px}}@media (max-width:480px){.grid-container{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:3px;width:100%;min-width:40px;min-height:40px}.delete-btn{width:16px;height:16px;font-size:10px;line-height:14px}}