@import url(https://fonts.googleapis.com/icon?family=Material+Icons);@import url(https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i);
/*! tailwindcss v2.1.2 | MIT License | https://tailwindcss.com */

/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */html{-moz-tab-size:4;tab-size:4;line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"}hr{height:0;color:inherit}abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],button{-webkit-appearance:button}legend{padding:0}progress{vertical-align:baseline}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}button{background-color:transparent;background-image:none}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}fieldset,ol,ul{margin:0;padding:0}ol,ul{list-style:none}html{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";line-height:1.5}body{font-family:inherit;line-height:inherit}*,:after,:before{border:0 solid #e5e7eb}hr{border-top-width:1px}img{border-style:solid}textarea{resize:vertical}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{opacity:1;color:#9ca3af}input:-ms-input-placeholder,textarea:-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button{cursor:pointer}table{border-collapse:collapse}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}button,input,optgroup,select,textarea{padding:0;line-height:inherit;color:inherit}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}.flex{display:-webkit-flex;display:flex}.table{display:table}.justify-center{-webkit-justify-content:center;justify-content:center}.flex-initial{-webkit-flex:0 1 auto;flex:0 1 auto}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-5xl{font-size:3rem;line-height:1}.m-2{margin:.5rem}.my-auto{margin-top:auto;margin-bottom:auto}.bottom-2{bottom:.5rem}*{--tw-shadow:0 0 transparent;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,0.5);--tw-ring-offset-shadow:0 0 transparent;--tw-ring-shadow:0 0 transparent}@-webkit-keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@-webkit-keyframes ping{75%,to{-webkit-transform:scale(2);transform:scale(2);opacity:0}}@keyframes ping{75%,to{-webkit-transform:scale(2);transform:scale(2);opacity:0}}@-webkit-keyframes pulse{50%{opacity:.5}}@keyframes pulse{50%{opacity:.5}}@-webkit-keyframes bounce{0%,to{-webkit-transform:translateY(-25%);transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{-webkit-transform:none;transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}@keyframes bounce{0%,to{-webkit-transform:translateY(-25%);transform:translateY(-25%);-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{-webkit-transform:none;transform:none;-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1)}}body{display:block;background:linear-gradient(90deg,#000,#410303);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#410303",GradientType=1)}.mobile{max-width:640px}.row .col:after,.row:after{clear:both;content:"";display:table}*,:after,:before{margin:0;padding:0;box-sizing:border-box}.card{line-height:1.5;font-family:"Raleway",sans-serif;padding-bottom:9rem}.card,.songs-wrapper{background-color:#000}.songs-wrapper{min-height:100vh}.songs-wrapper .song{width:100%;overflow:hidden;position:relative;background-color:transparent;transition:all .2s ease-in}.songs-wrapper .song .song-image{width:100%;padding:50% 0;display:block;background-size:cover;background-position:50%}.songs-wrapper .song .song-info{top:0;left:0;right:0;bottom:0;opacity:0;color:#fff;display:-webkit-flex;display:flex;position:absolute;-webkit-align-items:center;align-items:center;-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;padding:10px;text-shadow:0 1px 3px #000;transition:opacity .2s ease-in;background:radial-gradient(circle at center,rgba(0,0,0,.4) 0,rgba(0,0,0,.9) 100%)}.songs-wrapper .song .song-info .song-title{font-weight:700;font-size:20px;height:3rem;font-family:"Raleway",sans-serif}.songs-wrapper .song .song-info .song-title:hover{cursor:pointer}.songs-wrapper .song .song-info .song-artist{font-style:italic;font-size:15px}.songs-wrapper .song .song-info .song-artist:hover{cursor:pointer}.songs-wrapper .song:hover .song-info{opacity:1}.songs-wrapper .playing-song{border:10px solid;border-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='100' height='100' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E%3C/style%3E%3ClinearGradient id='g' x1='0%25' y1='0%25' x2='0%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%232d3561'/%3E%3Cstop offset='25%25' stop-color='%23c05c7e'/%3E%3Cstop offset='50%25' stop-color='%23f3826f'/%3E%3Cstop offset='100%25' stop-color='%23ffb961'/%3E%3C/linearGradient%3E%3Cpath d='M1.5 1.5h97v97h-97v-97' stroke-linecap='square' stroke='url(%23g)' stroke-width='3' stroke-dasharray='388' style='animation:stroke 5s infinite linear'/%3E%3C/svg%3E") 1}.row{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap}.row,.row .col{position:relative}.row .col{-webkit-flex:1 1;flex:1 1;margin-left:0;transition:all .2s ease-in}.row .col.s1{-webkit-flex-basis:8.33333%;flex-basis:8.33333%;max-width:8.33333%}.row .col.s1,.row .col.s2{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.s2{-webkit-flex-basis:16.66667%;flex-basis:16.66667%;max-width:16.66667%}.row .col.s3{-webkit-flex-basis:25%;flex-basis:25%;max-width:25%}.row .col.s3,.row .col.s4{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.s4{-webkit-flex-basis:33.33333%;flex-basis:33.33333%;max-width:33.33333%}.row .col.s5{-webkit-flex-basis:41.66667%;flex-basis:41.66667%;max-width:41.66667%}.row .col.s5,.row .col.s6{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.s6{-webkit-flex-basis:50%;flex-basis:50%;max-width:50%}.row .col.s7{-webkit-flex-basis:58.33333%;flex-basis:58.33333%;max-width:58.33333%}.row .col.s7,.row .col.s8{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.s8{-webkit-flex-basis:66.66667%;flex-basis:66.66667%;max-width:66.66667%}.row .col.s9{-webkit-flex-basis:75%;flex-basis:75%;max-width:75%}.row .col.s9,.row .col.s10{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.s10{-webkit-flex-basis:83.33333%;flex-basis:83.33333%;max-width:83.33333%}.row .col.s11{-webkit-flex-basis:91.66667%;flex-basis:91.66667%;max-width:91.66667%}.row .col.s11,.row .col.s12{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.s12{-webkit-flex-basis:100%;flex-basis:100%;max-width:100%}@media(min-width:601px){.row .col.m1{-webkit-flex-basis:8.33333%;flex-basis:8.33333%;max-width:8.33333%}.row .col.m1,.row .col.m2{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.m2{-webkit-flex-basis:16.66667%;flex-basis:16.66667%;max-width:16.66667%}.row .col.m3{-webkit-flex-basis:25%;flex-basis:25%;max-width:25%}.row .col.m3,.row .col.m4{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.m4{-webkit-flex-basis:33.33333%;flex-basis:33.33333%;max-width:33.33333%}.row .col.m5{-webkit-flex-basis:41.66667%;flex-basis:41.66667%;max-width:41.66667%}.row .col.m5,.row .col.m6{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.m6{-webkit-flex-basis:50%;flex-basis:50%;max-width:50%}.row .col.m7{-webkit-flex-basis:58.33333%;flex-basis:58.33333%;max-width:58.33333%}.row .col.m7,.row .col.m8{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.m8{-webkit-flex-basis:66.66667%;flex-basis:66.66667%;max-width:66.66667%}.row .col.m9{-webkit-flex-basis:75%;flex-basis:75%;max-width:75%}.row .col.m9,.row .col.m10{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.m10{-webkit-flex-basis:83.33333%;flex-basis:83.33333%;max-width:83.33333%}.row .col.m11{-webkit-flex-basis:91.66667%;flex-basis:91.66667%;max-width:91.66667%}.row .col.m11,.row .col.m12{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.m12{-webkit-flex-basis:100%;flex-basis:100%;max-width:100%}}@media(min-width:993px){.row .col.l1{-webkit-flex-basis:8.33333%;flex-basis:8.33333%;max-width:8.33333%}.row .col.l1,.row .col.l2{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.l2{-webkit-flex-basis:16.66667%;flex-basis:16.66667%;max-width:16.66667%}.row .col.l3{-webkit-flex-basis:25%;flex-basis:25%;max-width:25%}.row .col.l3,.row .col.l4{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.l4{-webkit-flex-basis:33.33333%;flex-basis:33.33333%;max-width:33.33333%}.row .col.l5{-webkit-flex-basis:41.66667%;flex-basis:41.66667%;max-width:41.66667%}.row .col.l5,.row .col.l6{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.l6{-webkit-flex-basis:50%;flex-basis:50%;max-width:50%}.row .col.l7{-webkit-flex-basis:58.33333%;flex-basis:58.33333%;max-width:58.33333%}.row .col.l7,.row .col.l8{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.l8{-webkit-flex-basis:66.66667%;flex-basis:66.66667%;max-width:66.66667%}.row .col.l9{-webkit-flex-basis:75%;flex-basis:75%;max-width:75%}.row .col.l9,.row .col.l10{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.l10{-webkit-flex-basis:83.33333%;flex-basis:83.33333%;max-width:83.33333%}.row .col.l11{-webkit-flex-basis:91.66667%;flex-basis:91.66667%;max-width:91.66667%}.row .col.l11,.row .col.l12{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.l12{-webkit-flex-basis:100%;flex-basis:100%;max-width:100%}}@media(min-width:1301px){.row .col.x1{-webkit-flex-basis:8.33333%;flex-basis:8.33333%;max-width:8.33333%}.row .col.x1,.row .col.x2{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.x2{-webkit-flex-basis:16.66667%;flex-basis:16.66667%;max-width:16.66667%}.row .col.x3{-webkit-flex-basis:25%;flex-basis:25%;max-width:25%}.row .col.x3,.row .col.x4{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.x4{-webkit-flex-basis:33.33333%;flex-basis:33.33333%;max-width:33.33333%}.row .col.x5{-webkit-flex-basis:41.66667%;flex-basis:41.66667%;max-width:41.66667%}.row .col.x5,.row .col.x6{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.x6{-webkit-flex-basis:50%;flex-basis:50%;max-width:50%}.row .col.x7{-webkit-flex-basis:58.33333%;flex-basis:58.33333%;max-width:58.33333%}.row .col.x7,.row .col.x8{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.x8{-webkit-flex-basis:66.66667%;flex-basis:66.66667%;max-width:66.66667%}.row .col.x9{-webkit-flex-basis:75%;flex-basis:75%;max-width:75%}.row .col.x9,.row .col.x10{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.x10{-webkit-flex-basis:83.33333%;flex-basis:83.33333%;max-width:83.33333%}.row .col.x11{-webkit-flex-basis:91.66667%;flex-basis:91.66667%;max-width:91.66667%}.row .col.x11,.row .col.x12{-webkit-flex-grow:0;flex-grow:0;-webkit-flex-shrink:0;flex-shrink:0}.row .col.x12{-webkit-flex-basis:100%;flex-basis:100%;max-width:100%}}.music-controller{background-color:rgba(41,41,41,.7);position:fixed;bottom:0;height:9rem;display:block;width:100%}.music-controller .red-line{z-index:1;position:absolute;height:8px;background-color:red}.music-controller .ranger-slider{z-index:2;position:relative;width:100%;height:8px}.music-controller .slider{-webkit-appearance:none;top:0;position:absolute;width:100%;height:8px;background:#d3d3d3;outline:none;opacity:.3;transition:opacity .2s}.music-controller .slider:hover{cursor:pointer}.music-controller .slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:8px;height:8px;background:#d3d3d3;opacity:0;cursor:pointer}.music-controller .slider::-moz-range-thumb{width:8px;height:8px;background:#d3d3d3;opacity:0;cursor:pointer}.music-controller .timer{position:relative;color:#fff}.music-controller .timer .timer-current{position:absolute;top:10px;left:10px}.music-controller .timer .timer-length{position:absolute;top:10px;right:10px}.music-controller .timer .current-song{position:absolute;top:10px}.music-controller .play-controller{z-index:1;height:100%;width:100%;position:relative}.music-controller .play-controller .play-btn{margin-top:2.25rem;-webkit-align-items:center;align-items:center;color:#c9c9c9;opacity:.9;border-radius:40px}.music-controller .play-controller .play-btn:hover{opacity:1;color:#ccc;cursor:pointer}.music-controller .play-controller .play-btn:active{-webkit-transform:scale(.9);transform:scale(.9)}.music-controller .play-controller .skip-btn{color:#c9c9c9;margin-top:2.25rem}.music-controller .play-controller .skip-btn:hover{opacity:1;color:#ccc;cursor:pointer}.music-controller .play-controller .skip-btn:active{-webkit-transform:scale(.9);transform:scale(.9)}.music-controller .other-btn{z-index:2;position:absolute;height:2rem;width:100%;bottom:1rem}.music-controller .other-btn .random-btn{color:#c9c9c9;position:relative}.music-controller .other-btn .random-btn:hover{opacity:1;color:#ccc;cursor:pointer}.music-controller .other-btn .random-btn:active{-webkit-transform:scale(.9);transform:scale(.9)}.music-controller .other-btn .repeat-btn{color:#c9c9c9;position:relative}.music-controller .other-btn .repeat-btn:hover{opacity:1;color:#ccc;cursor:pointer}.music-controller .other-btn .repeat-btn:active{-webkit-transform:scale(.9);transform:scale(.9)}
/*# sourceMappingURL=main.ffa1802c.chunk.css.map */