*{box-sizing:border-box}a{color:inherit}body{margin:0;padding:0;text-align:center;background-color:#000}html{margin:0;padding:0;background-color:#000}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:grey;border-radius:25px}::-webkit-scrollbar-thumb{background-color:#dcdcdc;border-radius:25px;box-shadow:0 5px 25px 5px rgba(0,0,0,.45)}#canvas{width:100%;height:100%;display:none;position:fixed;top:0;left:0}#tempGL{width:100%;height:100%;position:fixed;top:0;left:0}#FreqBars{display:none;width:100%;height:50%;position:fixed;top:0;left:0;z-index:5}#Synth{position:fixed;top:0;left:0;display:inline-block;width:100%;height:100%}#main{background-color:#000}.p{background-color:grey;height:1%;width:4.7615%;float:left;box-shadow:0 4px 8px 0 rgba(0,0,0,.1),0 6px 20px 0 rgba(0,0,0,.05);border-radius:0 0 5px 5px}.reds{background-color:red;background:linear-gradient(180deg,rgba(96,0,0,1) 0,red 80%)}.greens{background-color:green;background:linear-gradient(180deg,rgba(0,96,0,1) 0,green 80%)}.blues{background-color:#00f;background:linear-gradient(180deg,rgba(0,0,96,1) 0,#00f 80%)}#info{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;z-index:10;font-size:2.5vw;font-family:verdana;text-shadow:2px 2px 8px rgba(0,0,0,.25);background-color:rgba(0,0,0,.25);border-radius:25px;backdrop-filter:blur(3px);padding:1%}#title{margin:0;position:absolute;top:8%;left:50%;transform:translate(-50%,-50%);color:#fff;z-index:10;font-size:3vw;font-family:verdana;text-shadow:2px 2px 8px rgba(0,0,0,.25);font-weight:700;transition:.25s all}#subtitle{display:block;font-size:1.5vw;cursor:pointer}#subtitle:hover{color:#87ceeb}.titleBottom{top:92%!important}.buttons{margin:0;position:fixed;transform:translate(-50%,-50%);color:#fff;z-index:10;font-size:4vw;font-family:verdana;text-shadow:2px 2px 8px rgba(0,0,0,.25);cursor:pointer;opacity:.55;transition:.25s all;display:inline-block;top:92%}.buttons:hover{opacity:1!important}.buttons:hover .tip{display:inline-block}#enablesound{top:92%;right:8%}#interpretation{top:92%;left:20%}#barhide{top:92%;left:26.5%;display:none}#soundimage{top:92%;left:6%}#subjectivesound{top:92%;left:13%}#fullscreen{top:92%;right:1%}#interface{top:92%;right:15%}#qcam{top:6%;right:0;background-color:indigo;border-radius:50%;padding:.5%;font-size:3vw}#qcam:hover{font-size:4vw}#help{top:6%;left:5%;background-color:indigo;border-radius:50%;padding:.5%;font-size:3vw;width:5%}#help:hover{font-size:4vw;width:6%}.imglink{text-decoration:none}.tip{display:none;font-size:2vw;vertical-align:middle;position:absolute;top:-70%;left:50%;transform:translate(-50%,-50%);width:auto;background-color:#000;padding:20%;border-radius:25px;text-align:center}.tipbottom{top:170%!important}#buttonContainer{position:absolute;width:100%;height:15%;bottom:0;left:0;z-index:5;background-color:rgba(0,0,0,.66);box-shadow:0 4px 8px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19);transition:1s all}#buttonContainer:hover{background-color:#000;opacity:.95}#buttonContainer:hover>.buttons{opacity:1}#buttonContainer:hover+.buttons{opacity:1}.buttons:hover~#buttonContainer{opacity:.85;background-color:#000}#note{color:#a9a9a9;font-weight:700}.note{filter:brightness(0)}.saysom{background-color:rgba(0,0,0,.75);border-radius:25px;backdrop-filter:blur(2px);z-index:5;padding:1%;padding-left:2%;padding-right:2%;width:100%;white-space:pre;color:#fff}#mode{font-weight:700;cursor:pointer}#mode:hover .tip{display:inline-block}#playlist{top:92%;left:50%;font-size:32px;padding-left:1.5%}select{border:none;border-radius:25px;outline:0;color:#000;background-color:#696969;box-sizing:border-box;box-shadow:0 5px 25px 5px rgba(0,0,0,.15),-3px -4px 12px 1px rgba(255,255,255,.15);text-shadow:2px 2px 8px rgba(0,0,0,.15);-webkit-appearance:none}#newkernel{left:38%}#playbutton{left:62%}#weightcontrols{position:fixed;display:none;top:50%;left:50%;transform:translate(-50%,-50%);margin:auto;z-index:12;padding:2%;backdrop-filter:blur(4px);border-radius:25px;font-size:1.6vw;background-color:rgba(0,0,0,.6);color:#fff;font-family:Verdana,Geneva,Tahoma,sans-serif;text-align:center;width:50%}#about{padding-top:3%;backdrop-filter:blur(3px);font-size:1.6vw;color:#fff;font-family:Verdana,Geneva,Tahoma,sans-serif}#aboutcontainer{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:14;max-height:50%;width:70%;overflow:auto;padding:2%;text-align:center;background-color:rgba(0,0,0,.9);border-radius:25px}.inputcontainer{margin:auto;margin-top:3%;display:block}#random{margin-top:5%;padding:1%;padding-right:2%;border-radius:25px;cursor:pointer;display:inline-block;background-color:rgba(0,0,0,.44);padding-bottom:1.5%;box-shadow:0 5px 25px 5px rgba(0,0,0,.15),-3px -4px 12px 1px rgba(255,255,255,.15)}#random:hover{background-color:#6a5acd}#closecontrols{position:sticky;top:3%;left:3%;cursor:pointer;transition:.25s all;border-radius:50%;padding:1%;padding-bottom:1.5%;background-color:rgba(255,255,255,.2);width:6%;box-shadow:0 5px 25px 5px rgba(0,0,0,.15),-3px -4px 12px 1px rgba(255,255,255,.15);backdrop-filter:blur(3px)}#closecontrols:hover{background-color:rgba(255,255,255,.75)}#closecontrols:hover .tip{display:inline-block}input[type=number]{width:20%;padding:1.5% 3%;margin:auto;margin-top:1%;margin-bottom:1%;display:inline-block;border:none;outline:0;color:#fff;font-weight:700;font-size:133%;background-color:#87ceeb;box-sizing:border-box;border-radius:25px;box-shadow:0 5px 25px 5px rgba(0,0,0,.15),-3px -4px 12px 1px rgba(255,255,255,.15);text-shadow:2px 2px 8px rgba(0,0,0,.15);-webkit-appearance:none}#opencontrols{left:27%}#infotitle{margin-top:-2%}#contactlink:hover{color:#87ceeb}@media only screen and (max-width:1200px){#newkernel{left:35%}#playbutton{left:65%}}@media only screen and (max-width:550px){.buttons{font-size:10vw}#interpretation{left:38%;top:95%}#fullscreen{right:-5%;top:95%}#opencontrols{top:86%;left:23.5%}#enablesound{top:95%}#soundimage{left:10%;top:95%}#subjectivesound{left:24%;top:95%}#interface{right:22%;top:95%}#title{top:6%;width:100%;font-size:5.5vw;z-index:4}.titleBottom{top:88%!important}#info{top:45%;font-size:5.2vw}#playlist{top:86%;font-size:26px;left:55%}#newkernel{left:10%;top:86%}#playbutton{left:86%;top:86%}#buttonContainer{height:10%}#barhide{top:95%;left:52%}.weightcontrols{width:90%!important;top:40%;font-size:4vw!important}#qcam{font-size:5vw}#help{left:7%;font-size:5vw;width:8%}#subtitle{font-size:3.5vw}#about{font-size:3vw}#aboutcontainer{width:95%}}@media all and (display-mode:standalone){#fullscreen{display:none}#interface{right:11%}#enablesound{right:3%}@media only screen and (max-width:550px){#interface{right:18%}}}