@import"https://use.typekit.net/tpf4vai.css";@import"https://fonts.googleapis.com/css2?family=DM+Sans&display=swap";body{font-family:Times New Roman,Times,serif!important;position:absolute;top:0;left:0;width:100vw;height:100vh;overflow:hidden;padding:0;margin:0;background-color:#011c27!important}.encapsulator{width:100vw;height:100vh}.page-container{max-height:100vh;max-width:100vw;width:100vw;height:100vh;display:flex;justify-content:space-evenly;align-items:center}.dae-container{pointer-events:none;position:absolute;z-index:10;color:#fff;font-family:rig-shaded-bold-extrude,sans-serif;font-weight:700;font-style:normal;font-size:5vw;top:50%;left:50%;transform:translate(-50%) translateY(-50%);display:flex;justify-content:center;width:75%}.page-header{pointer-events:none;font-family:rig-shaded-bold-extrude,sans-serif;font-size:72px;color:#fff;padding-left:10px}#demo{font-size:5vw}.routed-page{width:100%;height:100%}.home-body{height:100vh;width:100vw;display:flex}.navigation{width:20%;height:100%;display:flex;text-align:right;align-items:center;color:#fff}.navigation .nav-content{box-sizing:border-box;width:100%;height:90%;padding:0 30px 0 0;display:flex;justify-content:space-between;flex-direction:column}.navigation .nav-content .title-box{pointer-events:none;width:100%;font-size:52px;font-family:rig-shaded-bold-extrude,sans-serif}.navigation .nav-content .button-container{display:flex;flex-direction:column}.navigation .nav-content .button{font-family:DM Sans,sans-serif;margin:10px;text-align:right;color:#fff;background-color:none;font-size:36px;text-decoration:none;cursor:pointer;transition-duration:.2s}.navigation .nav-content .button:hover{opacity:.6}.content-body{width:80%;height:100%;display:flex;justify-content:center;align-items:center}.content-body .content{border:solid white 1px;width:95%;height:90%;position:relative;display:flex}.soundboard-wrapper{display:grid;grid-template-columns:repeat(4,150px);grid-auto-rows:150px;padding:20px;width:fit-content;height:fit-content}.square-wrapper{aspect-ratio:1/1;border:2px solid white;border-radius:5px;margin:10px}.musicSquare{-webkit-user-select:none;user-select:none;padding:1em;transition-duration:.5s;opacity:0;color:#fff;display:flex;justify-content:center;text-align:center;align-items:center;height:100%;width:100%;box-sizing:border-box}@media (min-width: 800px){.musicSquare:hover{opacity:1}}@media (max-width: 800px) and (orientation: portrait){.square-wrapper>div{animation:pulse 8s infinite}}@media (max-width: 900px) and (orientation: landscape){.square-wrapper>div{animation:pulse 8s infinite}}.grid-container{position:relative;display:flex;flex-grow:1}.grid-display{display:grid;flex-grow:1;border:1px solid white;grid-template-columns:repeat(4,25%);grid-auto-rows:25%}.grid-display .square{-webkit-user-select:none;user-select:none;background-color:#eee;padding:1em;transition-duration:.5s;opacity:0;color:#fff;display:flex;justify-content:center;text-align:center;align-items:center;cursor:pointer}.grid-display .square.untitled{cursor:default}@media (min-width: 800px){.square:hover{opacity:1}}@media (max-width: 800px) and (orientation: portrait){.square{animation:pulse 8s infinite}}@media (max-width: 900px) and (orientation: landscape){.square{animation:pulse 8s infinite}}@keyframes pulse{0%{opacity:0}40%{opacity:.5}80%{opacity:0}}.hover-text{pointer-events:none;position:absolute;z-index:10;color:#fff;font-family:rig-shaded-bold-extrude,sans-serif;font-weight:700;font-style:normal;font-size:2rem;opacity:1;transition-duration:1s;top:50%;left:50%;transform:translate(-50%) translateY(-50%)}.hover-text.hide{opacity:0}.page-enter{opacity:0;transform:scale(1.1)}.page-enter-active{opacity:1;transform:scale(1);transition:opacity .3s,transform .3s}.page-exit{opacity:1;transform:scale(1)}.page-exit-active{opacity:0;transform:scale(.9);transition:opacity .3s,transform .3s}