@import "https://fonts.googleapis.com/css2?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";*{box-sizing:border-box;margin:0;padding:0}body{color:#fff;background-image:linear-gradient(90deg,#8338ec,#3a86ff);font-family:Poppins,sans-serif;font-size:14px}form{grid-template-columns:1fr auto auto;grid-template-areas:"text option button";gap:.5rem;margin-bottom:2rem;display:grid}form input,form select{font:inherit;border:none;border-radius:25px;padding:.5rem;box-shadow:0 2px 8px #0000001a}form input[type=text]{grid-area:text;padding-left:1rem}form select{grid-area:option;padding:0 1rem}form input[type=submit]{cursor:pointer;color:#fff;background:#3a86ff;border:2px solid #fff;grid-area:button}form input[type=submit]:hover{opacity:.7}.output-box{color:#0a0a0a;border-radius:8px}.output-box #outputListComp{opacity:.6}.output-box ul{margin-bottom:1rem;list-style:none}.output-box ul li{background:#fff;border-radius:25px;justify-content:space-between;margin-bottom:.5rem;padding:.5rem 1rem;display:flex}.output-box ul li input{cursor:pointer}h1{margin-bottom:.5rem}h2{margin-bottom:.5rem;font-weight:500}p{max-width:65ch;margin-bottom:2rem}.bg-light{background:#fff}.box-sh{box-shadow:0 2px 8px #0000001a}.container{max-width:900px;margin:0 auto;padding:1rem}#clearList{cursor:pointer;font:inherit;background:tomato;border:none;border-radius:25px;padding:.25rem .5rem}#clearList:hover{opacity:.7}@media (width<=500px){form{grid-template-columns:1fr auto;grid-template-areas:"text option""button button"}}