File size: 1,815 Bytes
258b2cc 05d1a10 13c110b 05d1a10 25aafa1 05d1a10 25aafa1 05d1a10 13c110b 05d1a10 258b2cc 13c110b 258b2cc 13c110b 258b2cc a9f1847 1b6268d 13c110b 25aafa1 05d1a10 258b2cc 13c110b 05d1a10 91bbfc3 258b2cc 13c110b 258b2cc 13c110b 258b2cc 25aafa1 13c110b 9cd7849 25aafa1 a9f1847 13c110b 9cd7849 25aafa1 13c110b 4fbca64 a9f1847 13c110b a9f1847 13c110b a9f1847 258b2cc 13c110b 05d1a10 91bbfc3 05d1a10 258b2cc 91bbfc3 4fbca64 a9f1847 13c110b 91bbfc3 05d1a10 258b2cc 25aafa1 258b2cc 05d1a10 4fbca64 05d1a10 25aafa1 05d1a10 258b2cc 25aafa1 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 |
/* Reset styles */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: linear-gradient(135deg, #f7f8fa, #e7ebf0);
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
color: #333;
}
.container {
background: #ffffff;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
padding: 40px;
width: 100%;
max-width: 400px;
text-align: center;
}
header h1 {
font-size: 24px;
color: #333;
margin-bottom: 20px;
}
label {
display: block;
font-weight: bold;
margin-bottom: 5px;
color: #555;
}
input {
padding: 12px;
margin-bottom: 15px;
width: 100%;
font-size: 16px;
border-radius: 8px;
border: 1px solid #ccc;
text-align: center;
font-weight: bold;
}
.currency-selectors {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
margin-bottom: 15px;
}
.currency-group {
width: 45%;
}
#swapButton {
background-color: #ffffff;
color: #333;
border: 1px solid #ccc;
border-radius: 50%;
padding: 10px;
cursor: pointer;
font-size: 16px;
}
#swapButton:hover {
background-color: #f1f1f1;
}
select {
padding: 12px;
font-size: 14px;
border-radius: 8px;
border: 1px solid #ccc;
width: 100%;
}
button[type="submit"] {
padding: 12px;
background-color: #007BFF;
color: white;
border: none;
border-radius: 8px;
font-size: 16px;
cursor: pointer;
}
button[type="submit"]:hover {
background-color: #0056b3;
}
#result {
margin-top: 20px;
font-size: 18px;
font-weight: bold;
color: #333;
background-color: #f8f8f8;
padding: 15px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
footer {
margin-top: 20px;
font-size: 14px;
color: #666;
}
|