.character{background-color:var(--background-card);border-radius:20px;box-shadow:0 0 10px 1px var(--background-body);overflow:hidden;cursor:pointer;transition:transform .2s ease-in-out;height:100%}.character:hover{transform:scale(1.05)}.character:hover h3{color:var(--text-orange)}.character span{color:var(--text-gray)}.character h3{margin-bottom:.5rem}.character__info{padding:1.5rem}.character__info .status{display:flex;align-items:center;margin-bottom:.5rem}.character__info .status span{color:var(--text-gray)}.character__info .status span:first-child{width:10px;height:10px;border-radius:50%;margin-right:.5rem}.character__info .status .alive{background-color:green}.character__info .status .dead{background-color:red}.character__info .status .default{background-color:#fff}.character__info .origin{margin-bottom:.5rem}.characters{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:3rem;margin:3rem 0}.filter{width:400px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);border-radius:10px;overflow:hidden}.filter .item{padding:1rem .5rem;background-color:var(--background-card);text-align:center;cursor:pointer}.filter .item:hover{color:var(--text-orange)}.search{width:400px;margin:3rem auto 0}.search input{height:53px;width:400px;border:none;border-radius:10px;padding:0 .5rem}:root{--background-body:#24282f;--background-card:#3c3e44;--text-white:#fff;--text-gray:silver;--text-orange:#ff9800}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background-body);color:var(--text-white);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}h1{margin-bottom:3rem;text-align:center}.container{width:980px;max-width:90%;margin:5rem auto}img{width:100%}