scrimba
Note at 3:28
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Note at 3:28
AboutCommentsNotes
Note at 3:28
Expand for more info
index.css
run
preview
console
html, * {
margin: 0;
padding: 0;
box-sizing:border-box;
}
*{
margin:20px;
}

body {
padding:10px;
height:100vh;
text-align: center;
font-family: sans-serif;
background:linear-gradient(to bottom,rgba(0,0,0,0.4),rgba(0,0,0,0.4)),url('https://i2.wp.com/asiatimes.com/wp-content/uploads/2017/11/iStock-610771930-e1511951512286.jpg?fit=1200%2C800&ssl=1');
background-size:cover;
background-repeat:no-repeat;
color:#fff;
font-size:20px;
overflow-x:hidden;
}
h1{
font-size:40px;
font-weight:100;
margin-top:-2px;
}
button,input,select{
outline:none;
border:none;
}

input {
border-radius:15px;
width: 150px;
height: 30px;
font-size: 18px;
margin: 5px auto;
width:300px;
padding:15px;
}

button {
background:#ff577f;
color:#fff;
width: 300px;
height: 40px;
font-size: 20px;
margin:20px;
cursor:pointer;
border-radius:20px;
}

div.choose{
margin:0 auto;
width:60%;
display:flex;
justify-content:center;
}

select{
font-size:15px;
padding:7px 10px;
border-radius:15px;
}
button:hover{
filter:brightness(95%);
}
input#exchange-rate{
color:#fff;
text-align:center;
}
@keyframes grow{
0%{transform:scale(1);}
50%{transform:scale(1.2);}
100%{transform:scale(1);}
}
Console
/index.html
LIVE