#search_input{ width: 100%; box-sizing: border-box; max-width: 500px; padding: 15px; border: 1px SOLID #ece1a5; color: #ece1a5; background-color: rgb(16 13 7 / 100%); } body{ background: url('../images/background.webp'); background-size: cover; height: 100vh; background-position: top; margin: 0; text-align: center; font-family: 'Merriweather', serif; } .container{ max-width: 1000px; padding: 15px; display: inline-block; width: 100%; border-radius: 5px; color: #ece1a5; margin-top: 15px; } div{ box-sizing: border-box; } @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { .container { -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background-color: rgb(16 13 7 / 50%); } } html, body { height: 100%; width: 100%; } input:focus, select:focus, textarea:focus, button:focus { outline: none; } .results{ border-radius: 5px; max-width: 500px; width: 100%; display: inline-block; vertical-align: text-top; text-align: left; } .results .main{ background: linear-gradient(to right, rgb(125 40 40), rgba(0, 0, 0, 0)); color: #fff; padding: 5px; padding-left: 15px; font-weight: bold; font-size: 0.9rem; } .results .sub{ background: linear-gradient(to right, rgb(40 73 125), rgba(0, 0, 0, 0)); color: #fff; padding-left: 30px; font-size: 0.8rem; } .desc{ max-width: 1000px; display: inline-block; margin-top: 50px; } .desc p{ font-size: 0.7rem; }