:root{color-scheme:dark;--primary-color: #1456a1;--secondary-color: #1e1e1e;--border-color: #1456a1;--shadow-color: rgba(0, 0, 0, .5);--highlight-shadow-color: rgba(20, 86, 161, .7);--text-color: #ffffff;--container-bg-color: #2a2a2a}body{font-family:Arial,sans-serif;background-color:#121212;color:var(--text-color);margin:0;padding:0}.searchbar{display:flex;flex-flow:column;align-items:center;justify-content:center;margin-top:2rem}.form{position:relative;margin:2rem;width:100%;max-width:600px}.form input{border-radius:45px;background-color:var(--primary-color);height:4rem;width:100%;border:none;box-shadow:inset 0 2px 5px #fff;padding-left:4rem;font-size:x-large;color:var(--text-color)}.form input:focus{outline:none;box-shadow:0 0 10px var(--primary-color)}.form button{width:50px;height:50px;position:absolute;left:10px;top:50%;transform:translateY(-50%);background:green;border:none;cursor:pointer;padding:0;font-size:1.5rem;color:#fff;border-radius:50%;box-shadow:0 0 10px green}.components{display:flex;flex-wrap:wrap;justify-content:center;padding:1rem}.container{margin:10px;padding:20px;border:1px solid var(--border-color);border-radius:10px;box-shadow:2px 2px 10px var(--shadow-color),0 0 15px var(--highlight-shadow-color);background-color:var(--container-bg-color);width:calc(33.333% - 20px);box-sizing:border-box;color:var(--text-color);transition:transform .2s}.container:hover{transform:scale(1.05)}.container img{width:100%;border-radius:10px;margin-bottom:10px}.container h3{margin:0;font-size:1.5rem}.container div{margin-top:5px;font-size:1rem}@media (max-width: 768px){.components{flex-direction:column;align-items:center}.container{width:100%;margin:10px 0}}