#query { align-items: center; appearance: none; background-image: radial-gradient(100% 100% at 100% 0, #37a1e7 0, #1b7ccc 100%); border: 0; border-radius: 6px; box-shadow: rgba(45, 35, 66, .4) 0 2px 4px,rgba(45, 35, 66, .3) 0 7px 13px -3px,rgba(58, 65, 111, .5) 0 -3px 0 inset; box-sizing: border-box; color: #fff; cursor: pointer; display: inline-flex; font-family: "JetBrains Mono",monospace; height: 48px; justify-content: center; line-height: 1; list-style: none; overflow: hidden; padding-left: 16px; padding-right: 16px; position: relative; text-align: left; text-decoration: none; transition: box-shadow .15s,transform .15s; user-select: none; -webkit-user-select: none; touch-action: manipulation; white-space: nowrap; will-change: box-shadow,transform; font-size: 18px; } #query:focus { box-shadow: #1b7ccc 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #1b7ccc 0 -3px 0 inset; } #query:hover { box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #1b7ccc 0 -3px 0 inset; transform: translateY(-2px); } #query:active { box-shadow: #1b7ccc 0 3px 7px inset; transform: translateY(2px); } #text { border-color:#1b7ccc; border-width: 4px; box-shadow: 2px 2px 2px 2px rgb(59, 59, 59); } #info { align-items: center; appearance: none; background-image: radial-gradient(100% 100% at 100% 0, #37a1e7 0, #1b7ccc 100%); border: 0; border-radius: 6px; box-shadow: rgba(45, 35, 66, .4) 0 2px 4px,rgba(45, 35, 66, .3) 0 7px 13px -3px,rgba(58, 65, 111, .5) 0 -3px 0 inset; box-sizing: border-box; color: #fff; cursor: pointer; display: inline-flex; font-family: "JetBrains Mono",monospace; height: 48px; justify-content: center; line-height: 1; list-style: none; overflow: hidden; padding-left: 16px; padding-right: 16px; position: relative; text-align: left; text-decoration: none; transition: box-shadow .15s,transform .15s; user-select: none; -webkit-user-select: none; touch-action: manipulation; white-space: nowrap; will-change: box-shadow,transform; font-size: 18px; } #info:focus { box-shadow: #1b7ccc 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #1b7ccc 0 -3px 0 inset; } #info:hover { box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #1b7ccc 0 -3px 0 inset; transform: translateY(-2px); } #info:active { box-shadow: #1b7ccc 0 3px 7px inset; transform: translateY(2px); } #side { background-color:#37a1e7 } #download { align-items: center; appearance: none; background-image: radial-gradient(100% 100% at 100% 0, #37a1e7 0, #1b7ccc 100%); border: 0; border-radius: 6px; box-shadow: rgba(45, 35, 66, .4) 0 2px 4px,rgba(45, 35, 66, .3) 0 7px 13px -3px,rgba(58, 65, 111, .5) 0 -3px 0 inset; box-sizing: border-box; color: #fff; cursor: pointer; display: inline-flex; font-family: "JetBrains Mono",monospace; height: 48px; justify-content: center; line-height: 1; list-style: none; overflow: hidden; padding-left: 16px; padding-right: 16px; position: relative; text-align: left; text-decoration: none; transition: box-shadow .15s,transform .15s; user-select: none; -webkit-user-select: none; touch-action: manipulation; white-space: nowrap; will-change: box-shadow,transform; font-size: 18px; } #download:focus { box-shadow: #1b7ccc 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #1b7ccc 0 -3px 0 inset; } #download:hover { box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #1b7ccc 0 -3px 0 inset; transform: translateY(-2px); } #download:active { box-shadow: #1b7ccc 0 3px 7px inset; transform: translateY(2px); } #download { color: black; margin-left:-10px; }