*{padding:0;margin:0;box-sizing:border-box;font-family:Poppins,sans-serif}body{background-color:#e01a38}.container{background-color:#171821;width:90%;max-width:500px;margin:0 auto;padding:3em 2em;position:absolute;transform:translate(-50%);left:50%;right:50%;top:1em;border-radius:1em}.input-container{display:grid;grid-template-columns:9fr 3fr;gap:1em}input{padding:1em .5em;background-color:#3a3939;color:#fff;border:none;border-radius:.5em;outline:none}button{outline:none;border:none;background-color:#e01a38;color:#fff;border-radius:.5em;cursor:pointer;font-family:Poppins,sans-serif;font-weight:600}.display-container{padding:1em}.container-character-image{background-color:#fff;padding:.5em;height:9.37em;width:9.37em;display:block;margin:auto;border-radius:50%}.container-character-image img{width:100%;height:100%;object-fit:cover;border-radius:50%}.character-name{padding:.5em 0 .8em;text-align:center;color:#fff;text-transform:uppercase;font-size:1.2em;font-weight:600}.character-description{text-align:justify;color:#a0a0a6;line-height:2em;font-weight:300}.list{position:absolute;width:64%;background-color:#555;color:#fff;z-index:1}.autocomplete-items{padding:.5em;cursor:pointer}.autocomplete-items:hover{background-color:#ddd;color:#171821}