|
|
@ -1,9 +1,19 @@ |
|
|
|
body { |
|
|
|
body { |
|
|
|
background-color: rgb(143, 188, 143); |
|
|
|
background-color: rgb(143, 188, 143); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
#song{ |
|
|
|
|
|
|
|
width: 400px; |
|
|
|
|
|
|
|
height: 300px; |
|
|
|
|
|
|
|
margin: auto; |
|
|
|
|
|
|
|
justify-content : center; |
|
|
|
|
|
|
|
background-color: rgba(0, 0, 0, 0.75); |
|
|
|
|
|
|
|
border-radius: 10px; |
|
|
|
|
|
|
|
color: #fff; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.btn { |
|
|
|
.btn { |
|
|
|
width: 100px; |
|
|
|
width: 100px; |
|
|
|
height: 60px; |
|
|
|
height: 60px; |
|
|
|
border-radius: 5px; |
|
|
|
border-radius: 5px; |
|
|
|
border: #f54e4e; |
|
|
|
border: #f54e4e; |
|
|
@ -14,12 +24,12 @@ body { |
|
|
|
cursor: pointer; |
|
|
|
cursor: pointer; |
|
|
|
text-align: center; |
|
|
|
text-align: center; |
|
|
|
margin: auto; |
|
|
|
margin: auto; |
|
|
|
justify-content : center |
|
|
|
justify-content : center; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.btn:hover { |
|
|
|
.btn:hover { |
|
|
|
color: #f54e4e; |
|
|
|
color: #f54e4e; |
|
|
|
background-color: #fff; |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
@ -33,14 +43,10 @@ body { |
|
|
|
display: flex; |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
h1 { |
|
|
|
h1 { |
|
|
|
text-align: center |
|
|
|
text-align: center |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
DIV { |
|
|
|
DIV { |
|
|
|
text-align: center |
|
|
|
text-align: center |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|