@import"https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap";*{font-family:Montserrat}body{font-family:Arial,sans-serif;background:linear-gradient(to right,#7a00cf,#35d9a1);display:flex;justify-content:center;align-items:center;height:100vh;margin:0}h1{font-size:32px;text-align:center;color:#fff;font-weight:500}.container{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:15px;padding:40px 30px;box-shadow:0 6px 18px #0000001f;width:450px;min-height:450px;display:flex;flex-direction:column;justify-content:center;gap:12px}.row{width:48%;display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:25px;gap:15px;flex-direction:column}.row label{color:#fff;font-size:18px;flex:.3}.row input[type=number]{flex:1;padding:12px;border:1px solid #ccc;border-radius:5px;outline:none;font-size:16px;width:88%;background:transparent;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff}.row select{flex:1;padding:12px;border:1px solid #ccc;border-radius:5px;outline:none;font-size:16px;width:100%;background:transparent;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1em'%20height='1em'%20viewBox='0%200%2024%2024'%3e%3cpath%20fill='none'%20stroke='white'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='2'%20d='m4%209l8%208l8-8'/%3e%3c/svg%3e") no-repeat center / contain;background-size:18px;background-position:calc(100% - 10px)}button{width:100%;padding:18px;background:#008cbf;border:none;border-radius:5px;color:#fff;font-size:18px;cursor:pointer;transition:all .3s ease-in-out}button:hover{background:linear-gradient(to right,#7a00cf,#35d9a1);transition:all .3s ease-in-out}.input-area{display:flex;width:100%;gap:20px}input[type=number]::placeholder{color:#fff}#from-currency *,#to-currency *{background-color:transparent;color:#000}h4{font-size:18px;font-weight:500;color:#fff;text-align:center}@media (max-width: 500px){body{padding:0 20px}.container{width:340px;padding:20px}.row label{color:#fff;font-size:18px}h4{font-size:16px}h1{font-size:28px}.input-area{gap:10px}.row input[type=number]{padding:10px 8px;font-size:14px}.row select{font-size:14px}button{font-size:16px}}