@import url(https://fonts.googleapis.com/css2?family=Khmer&family=Nanum+Gothic&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{background:#232323}.navBar{align-items:center;box-sizing:border-box;display:flex;flex-direction:row;justify-content:space-between;padding:1rem;width:100%}.navBar,.navBar>.logo{max-height:7.5vh}.auth-button{background:#232323;border:2px solid #afafaf;border-radius:.5rem;color:#afafaf;font-family:Raleway,sans-serif;font-size:1rem;padding:.5rem}.sign-out:hover{border:2px solid #f25d5a;color:#f25d5a;cursor:pointer}.sign-in:hover{border:2px solid #a9ebfa;color:#a9ebfa;cursor:pointer}.logo:hover{cursor:pointer}.login-content{height:92.5vh;max-height:100vh;width:100%}.login-content,.login-content>.login-box{align-items:center;display:flex;flex-direction:column;justify-content:center}.login-content>.login-box{background:#302f2f;border-radius:2rem;font-family:Raleway,sans-serif;gap:1rem;height:30%;padding:.5rem;width:50%}@media only screen and (max-width:700px){.login-content>.login-box{height:60%;width:80%}}.login-content>.login-box>.login-header{color:#fff;font-size:2rem;text-align:center}.login-content>.login-box>.login-text{color:#afafaf;font-size:1rem;margin-bottom:1.5rem}.login-content>.login-box>.auth-container{align-items:center;border:1px solid #f25d5a;border-radius:1rem;display:flex;flex-direction:row;gap:2rem;justify-content:center;padding:.5rem;width:40%}.login-content>.login-box>.auth-container>.auth-text{color:#afafaf;font-size:1rem}@media only screen and (max-width:540px){.login-content>.login-box>.auth-container>.auth-text{display:none}}.login-content>.login-box>.auth-container .auth-image{border:1px solid #afafaf;border-radius:100%;width:42px}@media only screen and (max-width:540px){.login-content>.login-box>.auth-container .auth-image{border:0}}@media only screen and (min-width:541px){.login-content>.login-box>.auth-container:hover{border:1px solid #a9ebfa;cursor:pointer}.login-content>.login-box>.auth-container:hover .auth-image{border:1px solid #a9ebfa}.login-content>.login-box>.auth-container:hover .auth-text{color:#a9ebfa}}.username-overlay-container{background-color:#00000080;height:100%;position:absolute;width:100vw;z-index:999}.username-overlay-container,.username-overlay-container>.username-box{align-items:center;display:flex;flex-direction:column;justify-content:center}.username-overlay-container>.username-box{background-color:#232323;border-radius:1rem;font-family:Raleway,sans-serif;gap:1.5rem;height:75%;padding:1rem;width:75%}.username-overlay-container>.username-box>.username-box-header{color:#fff;font-size:3rem;text-align:center}.username-overlay-container>.username-box>.username-box-text{color:#afafaf;font-size:1.5rem;margin-bottom:.5rem;text-align:center}.username-overlay-container>.username-box>#username-form{max-width:500px;width:75%}.username-overlay-container>.username-box>#username-form>.username-input{background:#232323;border:2px solid #afafaf;border-radius:1rem;color:#afafaf;font-family:Raleway,sans-serif;height:2rem;padding:.5rem;width:100%}.username-overlay-container>.username-box>#username-form>.username-input:focus{border-color:#a9ebfa;color:#fff;outline:none}.featured-main-wrapper{flex-direction:column}.featured-container,.featured-main-wrapper{align-items:center;display:flex;justify-content:center;width:100%}.featured-container{flex-direction:row}.featured-container>.featured-arrow:hover{cursor:pointer}.featured-container>.featured-box{align-items:center;background:#302f2f;border-radius:1.5rem;display:flex;flex-direction:row;gap:15%;height:100%;justify-content:center;padding:1rem 1.5rem;width:70%}@media only screen and (max-width:450px){.featured-container>.featured-box{gap:2rem;width:75%}}.featured-container>.featured-box>.featured-column{display:flex;flex-direction:column;gap:1rem;justify-content:center;max-width:50%}.featured-container>.featured-box>.featured-column>.featured-title{color:#fff;font-family:Raleway,sans-serif;font-size:2rem}@media only screen and (max-width:450px){.featured-container>.featured-box>.featured-column>.featured-title{font-size:1.2rem}}.featured-container>.featured-box>.featured-column>.info-row{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;transform:translateY(-.5rem);width:100%}.featured-container>.featured-box>.featured-column>.info-row>.featured-artist{align-items:center;color:#afafaf;display:inline-flex;font-family:Raleway,sans-serif;font-size:1rem;justify-content:center;margin-bottom:1rem;max-width:200px}@media only screen and (max-width:450px){.featured-container>.featured-box>.featured-column>.info-row>.featured-artist{font-size:.75rem}}.featured-container>.featured-box>.featured-column>.info-row>.info-container{align-items:center;display:flex;flex-direction:row;gap:.5rem;justify-content:center;margin-bottom:1rem}.featured-container>.featured-box>.featured-column>.info-row>.info-container>.type{border-radius:1rem;color:#fff;font-size:.75rem;height:15px;padding:.25rem .5rem}@media only screen and (max-width:450px){.featured-container>.featured-box>.featured-column>.info-row>.info-container>.type{font-size:.5rem;height:10px}}.featured-container>.featured-box>.featured-column>.info-row>.info-container>.genre-container{align-items:center;color:#afafaf;display:flex;flex-direction:row;font-family:Raleway,sans-serif;gap:.25rem}@media only screen and (max-width:450px){.featured-container>.featured-box>.featured-column>.info-row>.info-container>.genre-container{font-size:.75rem}}.featured-container>.featured-box>.featured-column>.info-row>.info-container>.Album{background:#cea452}.featured-container>.featured-box>.featured-column>.info-row>.info-container>.Track{background:#f25d5a}.featured-container>.featured-box>.featured-column>.album-cover{height:auto;max-width:100%;width:350px}@media only screen and (max-width:500px){.featured-container>.featured-box>.featured-column>.album-cover{width:150px}}.featured-container>.featured-box>.right-column{align-items:space-between;display:flex;flex-direction:column;gap:1rem;height:100%;justify-content:space-between;max-width:350px}@media only screen and (max-width:500px){.featured-container>.featured-box>.right-column{max-width:150px}}.featured-container>.featured-box>.right-column>.right-image-container{align-items:center;border:1px solid #afafaf;border-radius:.75rem;box-sizing:border-box;display:flex;flex-direction:column;gap:.5rem;height:50%;justify-content:center;padding:2rem;width:100%}.featured-container>.featured-box>.right-column>.right-image-container:hover{border:1px solid #a9ebfa;cursor:pointer}.featured-container>.featured-box>.right-column>.right-image-container>.right-image-label{color:#fff;font-family:Raleway,sans-serif;font-size:1rem;text-align:center}.featured-container>.featured-box>.right-column>.right-image-container>.spotify-image{max-width:100%;min-width:70px;width:auto}.featured-container>.featured-box>.right-column>.right-image-container>.spotify-image:hover{cursor:pointer}.featured-container>.featured-box>.right-column>.right-image-container>.soundoff-image{max-height:150px;max-width:100%;width:auto}.featured-container>.featured-box>.right-column>.right-image-container>.soundoff-image:hover{cursor:pointer}.dots-container{display:flex;justify-content:center;margin-top:2rem}.dots-container>.dot:hover{cursor:pointer}.room-view-container{align-items:center;display:flex;flex-direction:row;gap:3rem;justify-content:center;justify-content:flex-start;max-width:100%;overflow-x:auto;padding-left:2rem;width:100%}.room-card{align-items:flex-start;background:#302f2f;border-radius:1.5rem;display:flex;flex-direction:column;gap:1rem;justify-content:center;max-width:250px;min-width:250px;padding:1.5rem;width:250px}.room-card:hover{cursor:pointer}.room-card>.room-name{color:#fff;font-family:Raleway,sans-serif;font-size:1.5rem}.room-card>.room-info-row{align-items:center;display:flex;flex-direction:row;gap:2rem}.room-card>.room-info-row>.room-type{background:#404040;border-radius:.5rem;color:#fff;font-family:Raleway,sans-serif;font-size:1rem;padding:.25rem .5rem}.room-card>.room-info-row>.Tracks{background:#f25d5a}.room-card>.room-info-row>.Artists{background:#5ba7b9}.room-card>.room-info-row>.Album{background:#cea452}.room-card>.room-info-row>.room-duration,.room-card>.room-info-row>.room-size{align-items:center;color:#fff;display:flex;flex-direction:row;font-family:Raleway,sans-serif;font-size:1rem;gap:.25rem;justify-content:center}.dashboard-content{align-items:center;display:flex;flex-direction:column;gap:7rem;height:90.5vh;margin-top:2rem;max-height:100vh;width:100%}.dashboard-content .section-wrapper{align-items:center;display:flex;flex-direction:column;justify-content:center;width:95%}.dashboard-content .section-wrapper>.section-label{color:#fff;font-family:Raleway,sans-serif;font-size:2rem;margin-bottom:3rem;padding-left:2rem;width:100%}.search-page{justify-content:center}.results,.search-page{align-items:center;display:flex;flex-direction:column;gap:1rem;width:100%}.results{justify-content:flex-start}.search-form{font-family:Raleway,sans-serif;margin-bottom:1rem;margin-top:2rem;width:77.5%}.search-form .search-input{background:#232323;border:2px solid #afafaf;border-radius:1rem;color:#afafaf;font-family:Raleway,sans-serif;height:3rem;padding:.5rem;width:100%}.search-form .search-input:focus{border-color:#a9ebfa;color:#fff;outline:none}.search-result{align-items:center;background:#302f2f;border-radius:.75rem;box-sizing:border-box;display:flex;flex-direction:row;gap:1rem;height:7.5rem;justify-content:flex-start;max-width:100%;padding:1rem;width:80%}.search-result:hover{cursor:pointer}.search-result>.album-cover{max-height:100%;width:auto}.search-result>.album-info{display:flex;flex-direction:column;font-family:Raleway,sans-serif;gap:.5rem}.search-result>.album-info>.album-name{color:#fff;font-size:1.5rem}.search-result>.album-info>.info-row{align-items:center;display:flex;flex-direction:row;gap:1rem}.search-result>.album-info>.info-row>.type-label{border-radius:1rem;color:#fff;font-size:.75rem;padding:.25rem .5rem}.search-result>.album-info>.info-row>.album{background:#cea452}.search-result>.album-info>.info-row>.artists{color:#afafaf}.create-overlay{background-color:#00000080;height:100%;justify-content:center;position:fixed;width:100vw;z-index:999}.create-overlay,.create-overlay>.create-form-box{align-items:center;display:flex;flex-direction:column}.create-overlay>.create-form-box{background-color:#232323;border-radius:1rem;font-family:Raleway,sans-serif;gap:1.5rem;height:75%;justify-content:flex-start;padding:1rem;width:75%}.create-overlay>.create-form-box>.back-container{width:100%}.create-overlay>.create-form-box>.back-container>.back-button{color:#fff;font-size:3rem}.create-overlay>.create-form-box>.back-container>.back-button:hover{color:#f25d5a;cursor:pointer}.create-overlay>.create-form-box>.create-form-header{color:#fff;font-size:3rem;text-align:center}@media only screen and (max-width:600px){.create-overlay>.create-form-box>.create-form-header{font-size:2rem}}.create-overlay>.create-form-box>.create-form-desc{color:#afafaf;font-size:1rem;margin-bottom:.5rem;text-align:center}@media only screen and (max-width:600px){.create-overlay>.create-form-box>.create-form-desc{font-size:.75rem}}.create-overlay>.create-form-box>.create-form{align-items:center;display:flex;flex-direction:column;gap:3rem;height:50%;justify-content:center;width:100%}.create-overlay>.create-form-box>.create-form>.room-name-input{background:#232323;border:2px solid #afafaf;border-radius:1rem;color:#afafaf;font-family:Raleway,sans-serif;height:2rem;padding:.5rem;width:75%}.create-overlay>.create-form-box>.create-form>.room-name-input:focus{border-color:#a9ebfa;color:#fff;outline:none}.create-overlay>.create-form-box>.create-form>.room-duration-input{-webkit-appearance:none;appearance:none;background:#232323;background-image:url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"><path fill="%23AFAFAF" d="M0 0L2 2 4 0z"/></svg>');background-position:97.5% 1.25rem;background-repeat:no-repeat;background-size:.65rem;border:2px solid #afafaf;border-radius:1rem;box-sizing:initial;color:#afafaf;font-family:Raleway,sans-serif;height:2rem;padding:.5rem;width:75%}.create-overlay>.create-form-box>.create-form>.room-duration-input:hover{cursor:pointer}.create-overlay>.create-form-box>.create-form>.room-duration-input:focus{border-color:#a9ebfa;color:#fff;outline:none}.create-overlay>.create-form-box>.create-form>.create-button{background:#232323;border:2px solid #afafaf;border-radius:1rem;box-sizing:initial;color:#afafaf;font-family:Raleway,sans-serif;height:1.5rem;padding:.5rem}.create-overlay>.create-form-box>.create-form>.create-button:hover{border:2px solid #a9ebfa;color:#a9ebfa;cursor:pointer}@keyframes artist-bob{0%{transform:translateY(0)}50%{transform:translateY(.5rem)}to{transform:translateY(0)}}@keyframes mic-shudder{0%{transform:translate(0)}25%{transform:translate(-2.5px,-2.5px)}75%{transform:translate(2.5px,2.5px)}to{transform:translate(0)}}@keyframes album-spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.create-content{align-items:center;display:flex;flex-direction:column;font-family:Raleway,sans-serif;height:100%;width:100%}.create-content>.create-label{box-sizing:border-box;color:#fff;font-size:2rem;margin-bottom:5rem;margin-top:2rem;max-width:100vw;padding-left:2rem;width:100%}.create-content>.create-cards-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:3rem;height:100%;justify-content:center;width:100%}.create-card{align-items:center;background:#302f2f;border:1px solid #afafaf;border-radius:.75rem;display:flex;flex-direction:column;font-family:Raleway,sans-serif;gap:2rem;justify-content:center;margin:1rem;padding:3rem}.create-card>.create-card-icon{color:#fff;font-size:12rem}.create-card:hover{border:1px solid #a9ebfa;cursor:pointer}.create-card:hover>.create-card-icon,.create-card:hover>.create-card-label{color:#a9ebfa}.create-card:hover>.Artists{animation:artist-bob .5s}.create-card:hover>.Tracks{animation:mic-shudder .3s}.create-card:hover>.Album{animation:album-spin .5s}.create-card>.create-card-label{color:#fff;font-size:2rem}.join-container{align-items:center;display:flex;flex-direction:column;gap:1rem;height:100%;justify-content:center;width:100%}.join-container>.join-label{box-sizing:border-box;color:#fff;font-family:Raleway,sans-serif;font-size:2rem;padding:2rem;width:100%}
/*# sourceMappingURL=main.36ef9b0b.css.map*/