*{padding:0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;text-rendering:optimizeLegibility}*,body{margin:0;-webkit-font-smoothing:antialiased}body{font-family:"Helvetica",sans-serif;font-size:14px;-moz-osx-font-smoothing:grayscale;background-color:#000}a{all:unset}.header{color:#fff;margin:20px;border-bottom:1px solid #333}.header h1{margin:10px auto}.cards-box{display:grid;justify-items:center;grid-template-columns:repeat(1,1fr);margin:20px auto;grid-column-gap:20px;-webkit-column-gap:20px;column-gap:20px;grid-row-gap:40px;row-gap:40px}.card,.cards-box{width:300px}.image-box{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;position:relative;display:block}.image{line-height:0;width:100%;position:relative;opacity:.8}.buttons-overlay{display:flex;position:absolute;top:0;right:0;bottom:0;left:0;justify-content:space-evenly;align-items:center}.button.other{width:30px}.button.play{width:80px}.card-title{color:#fff;padding-top:15px}.card-artists{color:#a0a0a0;padding-top:10px}.artist,.card-title,.footer-link{text-decoration:underline;text-underline-position:under}.artist:not(:last-child):after{content:"\002C\2002";text-decoration:none;display:inline-block}.artist:nth-last-child(2):after{content:"\2002\0026\2002";text-decoration:none;display:inline-block}.footer p{color:#a0a0a0;width:100%;bottom:0;left:0;right:0;border-top:1px solid #333;padding:20px 0;text-align:center}@media screen and (min-width:768px){.cards-box{grid-template-columns:repeat(2,1fr);width:620px}}@media screen and (min-width:1024px){.button,a{cursor:pointer}.cards-box{grid-template-columns:repeat(4,1fr);width:960px}.card{width:225px}.image{transition:opacity .3s ease-in-out;opacity:1}.image-box:hover>.image{opacity:.5}.buttons-overlay{display:none}.image-box:hover>.buttons-overlay{display:flex}.button{opacity:.7;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .3s ease-in-out}.button:hover{opacity:1}.button.other:hover{transform:scale(1.1)}.button.play:hover{transform:scale(1.2)}.artist,.card-title,.footer-link{text-decoration:none}.artist:hover,.card-title:hover,.footer-link:hover{text-decoration:underline;text-underline-position:under}.artist:hover,.footer-link:hover{color:#fff}}@media screen and (min-width:1300px){.cards-box{width:1260px}.card{width:300px}}
/*# sourceMappingURL=main.35d91afc.chunk.css.map */