@import"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}:root{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif;font-style:normal;font-size:10px;--button-color: #36C2CE;--black: black;--error-message: red;--box-shadow: rgba(99, 99, 99, .2) 0px 2px 8px 0px}body{width:100vw}.w-full{width:100%}.border-red{border:2px solid red}.heading{font-weight:400;font-size:20px}.drag-button{width:10%}.add-button{height:5rem;background-color:var(--button-color);cursor:pointer}.drag-text{width:90%;box-shadow:var(--box-shadow);border-radius:.5rem;padding:.5%}.drag-button{background:transparent;border:none}.grip-icon{color:gray}.grip-icon:hover{color:var(--black)}.center-col{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.center-row{width:100%;display:flex;justify-content:center;align-items:center}.input-container{display:flex;gap:1rem;align-items:center}.error-message{text-align:left;color:var(--error-message);font-size:1.2rem}.input{width:400px;height:5rem;border-radius:5px;font-size:2rem}.input::placeholder{font-size:2rem}.button{width:100px;border-radius:5px;font-size:2rem}.main{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.image-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:2rem;justify-content:center;align-items:center}.image-item{width:25%;height:50vh;padding:1%;box-shadow:var(--box-shadow)}.image-id{padding:4%;box-shadow:var(--box-shadow);border-radius:.5rem;font-size:1.5rem}.number-container{padding:2% 4%;box-shadow:var(--box-shadow);border-radius:.5rem}.image-card{width:100%;height:60%;border-radius:1rem}.image{width:100%;height:100%;border-radius:1rem}.text{color:#000;font-size:1.5rem}
