65 lines
741 B
CSS
65 lines
741 B
CSS
|
* {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
box-sizing: border-box;
|
||
|
|
}
|
||
|
|
|
||
|
|
body {
|
||
|
|
font-family: "Poppins", sans-serif;
|
||
|
|
}
|
||
|
|
|
||
|
|
.app {
|
||
|
|
min-height: 100vh;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
header h1 {
|
||
|
|
margin: 50px 0px 20px 0px;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 40px;
|
||
|
|
}
|
||
|
|
header p {
|
||
|
|
font-size: 25px;
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pads {
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.kick {
|
||
|
|
background: #60d394;
|
||
|
|
}
|
||
|
|
._808 {
|
||
|
|
background: #d36060;
|
||
|
|
}
|
||
|
|
.snare {
|
||
|
|
background: #c060d3;
|
||
|
|
}
|
||
|
|
.hat {
|
||
|
|
background: #d3d160;
|
||
|
|
}
|
||
|
|
.synth1 {
|
||
|
|
background: #606bd3;
|
||
|
|
}
|
||
|
|
.synth2 {
|
||
|
|
background: #60c2d3;
|
||
|
|
}
|
||
|
|
|
||
|
|
.line {
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
|
||
|
|
.line > div {
|
||
|
|
padding: 3rem;
|
||
|
|
margin: 1rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
h3 {
|
||
|
|
text-align: center;
|
||
|
|
color: white;
|
||
|
|
}
|